/* Generated from tokens/tokens.json by scripts/build-tokens.mjs. */
.screen {
  --font: "Inter", "Noto Sans KR", sans-serif;
  --font-display: "Inter", "Noto Sans KR", sans-serif;
  --font-small: "Inter", "Noto Sans KR", sans-serif;
  --blur: blur(30px) saturate(125%);
}

.theme-light {
  --text-1: rgb(0 0 0 / 89.6%);
  --text-3: rgb(0 0 0 / 44.6%);
  --accent: #005fb8;
  --text-on-accent: #fff;
  --accent-dis: rgb(0 0 0 / 21.7%);
  --mica: #f3f3f3;
  --layer-alt: #fff;
  --card: rgb(255 255 255 / 70%);
  --card-stroke: rgb(0 0 0 / 5.78%);
  --divider: rgb(0 0 0 / 8.03%);
  --ctl: rgb(255 255 255 / 70%);
  --ctl-dis: rgb(249 249 249 / 30%);
  --ctl-stroke: rgb(0 0 0 / 5.78%);
  --subtle-hover: rgb(0 0 0 / 3.73%);
  --acrylic: rgb(252 252 252 / 85%);
  --taskbar-bg: rgb(238 238 238 / 82%);
  --tb-hover: rgb(255 255 255 / 66%);
  --smoke: rgb(0 0 0 / 30%);
  --dialog-foot: #f3f3f3;
  --critical: #c42b1c;
  --success: #0f7b0f;
  --info-bg: rgb(246 246 246 / 50%);
  --caution-bg: #fff4ce;
  --track: rgb(0 0 0 / 44.6%);
  --shadow-win: 0 32px 64px rgb(0 0 0 / 18.76%), 0 2px 21px rgb(0 0 0 / 14.74%);
  --shadow-flyout: 0 8px 16px rgb(0 0 0 / 14%);
  --floor: rgb(255 255 255 / 52%);
  --grid-line: rgb(0 0 0 / 7%);
  --text-2: rgb(0 0 0 / 62%);
  --text-dis: rgb(0 0 0 / 36%);
  --accent-text: #003e92;
  --text-on-accent-dis: #fff;
  --layer: rgb(255 255 255 / 50%);
  --card-2: rgb(246 246 246 / 50%);
  --ctl-hover: rgb(249 249 249 / 50%);
  --ctl-stroke-2: rgb(0 0 0 / 16.3%);
  --subtle-press: rgb(0 0 0 / 2.41%);
  --surface-stroke: rgb(117 117 117 / 40%);
  --taskbar-stroke: rgb(0 0 0 / 8%);
  --tb-run: #868686;
  --dialog: #fff;
  --text-on-critical: #fff;
  --caution: #9d5d00;
  --success-bg: #dff6dd;
  --critical-bg: #fde7e9;
  --floor-stroke: rgb(0 0 0 / 8%);
}

.theme-dark {
  --text-1: #fff;
  --text-3: rgb(255 255 255 / 54.4%);
  --accent: #60cdff;
  --text-on-accent: #000;
  --accent-dis: rgb(255 255 255 / 15.8%);
  --mica: #202020;
  --layer-alt: rgb(255 255 255 / 5.38%);
  --card: rgb(255 255 255 / 5.12%);
  --card-stroke: rgb(0 0 0 / 10%);
  --divider: rgb(255 255 255 / 8.37%);
  --ctl: rgb(255 255 255 / 6.05%);
  --ctl-dis: rgb(255 255 255 / 4.19%);
  --ctl-stroke: rgb(255 255 255 / 6.98%);
  --subtle-hover: rgb(255 255 255 / 6.05%);
  --acrylic: rgb(44 44 44 / 88%);
  --taskbar-bg: rgb(28 28 28 / 85%);
  --tb-hover: rgb(255 255 255 / 7%);
  --smoke: rgb(0 0 0 / 30%);
  --dialog-foot: #202020;
  --critical: #ff99a4;
  --success: #6ccb5f;
  --info-bg: rgb(255 255 255 / 3.26%);
  --caution-bg: #433519;
  --track: rgb(255 255 255 / 54.4%);
  --shadow-win: 0 32px 64px rgb(0 0 0 / 37%), 0 2px 21px rgb(0 0 0 / 37%);
  --shadow-flyout: 0 8px 16px rgb(0 0 0 / 26%);
  --floor: rgb(28 28 30 / 50%);
  --grid-line: rgb(255 255 255 / 6%);
  --text-2: rgb(255 255 255 / 78.6%);
  --text-dis: rgb(255 255 255 / 36.3%);
  --accent-text: #99ebff;
  --text-on-accent-dis: rgb(255 255 255 / 53%);
  --layer: rgb(58 58 58 / 30%);
  --card-2: rgb(255 255 255 / 3.26%);
  --ctl-hover: rgb(255 255 255 / 8.37%);
  --ctl-stroke-2: rgb(255 255 255 / 4.65%);
  --subtle-press: rgb(255 255 255 / 4.19%);
  --surface-stroke: rgb(117 117 117 / 40%);
  --taskbar-stroke: rgb(255 255 255 / 8%);
  --tb-run: #9a9a9a;
  --dialog: #2b2b2b;
  --text-on-critical: #000;
  --caution: #fce100;
  --success-bg: #393d1b;
  --critical-bg: #442726;
  --floor-stroke: rgb(255 255 255 / 8%);
}

:root {
  --dc-rail: #1e1f22;
  --dc-chat: #313338;
  --dc-float: #111214;
  --dc-hover: rgb(78 80 88 / 30%);
  --dc-input: #383a40;
  --dc-ink: #dbdee1;
  --dc-soft: #b5bac1;
  --dc-faint: #6d6f78;
  --dc-accent: #6c6cf0;
  --dc-accent-text: #a5a6ff;
  --dc-alert: #d93a40;
  --dc-online: #23a55a;
  --dc-gray: #4e5058;
  --dc-font: "Noto Sans KR", sans-serif;
  --dc-display: "IBM Plex Sans KR", "Noto Sans KR", sans-serif;
  --dc-shadow: 0 8px 16px rgb(0 0 0 / 24%);
  --dc-elev: 0 1px 0 rgb(4 4 5 / 20%), 0 1.5px 0 rgb(6 6 7 / 5%), 0 2px 0 rgb(4 4 5 / 5%);
  --dc-side: #2b2d31;
  --dc-panel: #232428;
  --dc-active: rgb(78 80 88 / 60%);
  --dc-line: rgb(255 255 255 / 6%);
  --dc-bright: #f2f3f5;
  --dc-muted: #949ba4;
  --dc-accent-hover: #5a5ad8;
  --dc-danger: #da373c;
  --dc-idle: #f0b232;
}

:root {
  --world-wall-peach: #f6d8c6;
  --world-wall-mint: #c9e6df;
  --world-wall-slate: #b9c4da;
  --world-wall-base: #eef0f6;
  --world-wallpaper: radial-gradient(60% 70% at 12% 18%, var(--world-wall-peach) 0%, transparent 62%),
    radial-gradient(55% 65% at 88% 22%, var(--world-wall-mint) 0%, transparent 60%),
    radial-gradient(70% 60% at 62% 100%, var(--world-wall-slate) 0%, transparent 65%),
    conic-gradient(from 210deg at 40% 60%, #eef0f6, #f5ece6, #e6f0ee, #eef0f6);
  --world-grid-line: rgb(43 45 49 / 9%);
  --world-grid-step: 58px;
  --world-tile: #d5d8de;
  --world-device: #2c2e4a;
  --world-ink: #2b2d31;
  --world-tag-bg: rgb(255 255 255 / 55%);
  --os-ink: #1b1b1f;
  --os-muted: #5b6068;
  --os-glyph: #3b3f45;
  --os-mica: rgb(243 243 243 / 90%);
  --os-mica-solid: #edeef1;
  --os-acrylic: rgb(241 242 245 / 82%);
  --os-acrylic-solid: #e7eaf0;
  --os-flyout: rgb(43 45 49 / 92%);
  --os-flyout-solid: #3a3c40;
  --os-accent: #2f6f8f;
  --os-running: #7a7f87;
  --os-win-line: rgb(0 0 0 / 10%);
  --os-win-line-dark: rgb(0 0 0 / 35%);
  --os-fly-line: rgb(255 255 255 / 10%);
  --os-shadow-window: 0 2px 4px rgb(20 24 32 / 10%), 0 12px 28px rgb(20 24 32 / 18%);
  --os-shadow-flyout: 0 3px 5px rgb(20 24 32 / 18%), 0 13px 32px rgb(20 24 32 / 28%);
  --os-blur-acrylic: blur(30px) saturate(1.4);
  --os-blur-flyout: blur(30px) saturate(1.2);
  --app-rail: #191a2e;
  --app-side: #23253e;
  --app-chat: #2c2e4a;
  --app-hover: #353854;
  --app-input: #3e4260;
  --app-ink: #e6e8f4;
  --app-bright: #ffffff;
  --app-muted: #a5aac1;
  --app-soft: #c1c6dc;
  --app-locked: #a9afb7;
  --app-accent: #8985ff;
  --app-accent-text: #c2bfff;
  --app-accent-wash: rgb(137 133 255 / 22%);
  --app-alert: #d93a40;
  --app-online: #23a55a;
  --app-embed-ok: var(--app-online);
  --font-os: "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  --font-app-display: "Space Grotesk", "IBM Plex Sans KR", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --font-app-body: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  --font-emoji: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
  --fs-os-title: 14px;
  --fs-os-body: 14px;
  --fs-os-caption: 12.5px;
  --fs-app-server: 17px;
  --fs-app-goal: 17px;
  --fs-app-channel: 17px;
  --fs-app-body: 15px;
  --fs-app-dock-title: 19px;
  --fs-app-dock-hint: 16px;
  --fs-app-caption: 13px;
  --fs-app-badge: 13px;
  --lh-body: 1.45;
  --r-window: 12px;
  --r-control: 6px;
  --r-chip: 12px;
  --r-input: 16px;
  --r-icon-active: 14px;
  --r-tile: 8px;
  --r-pill: 999px;
  --line-hairline: 1px;
  --size-viewport-w: 1152px;
  --size-viewport-h: 648px;
  --size-taskbar-h: 48px;
  --size-taskbar-icon: 40px;
  --size-server-win-w: 340px;
  --size-win-gap: 8px;
  --size-titlebar-h: 34px;
  --size-caption-btn-w: 45px;
  --size-rail-w: 70px;
  --size-server-icon: 48px;
  --size-badge-h: 18px;
  --size-channel-row: 25px;
  --size-input-h: 32px;
  --size-avatar: 29px;
  --size-device-tile: 79px;
  --size-hub-tile: 90px;
  --size-belt-tile: 58px;
  --size-dock-w: 504px;
  --size-dock-key-w: 79px;
  --size-dock-key-h: 68px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-panel: 250ms;
  --motion-snap: 300ms;
  --ease-standard: cubic-bezier(.2, 0, 0, 1);
  --ease-exit: cubic-bezier(.4, 0, 1, 1);
  --focus-width: 2px;
  --focus-offset: 2px;
  --focus-os: var(--os-accent);
  --focus-app: var(--app-bright);
  --os-btn-hover: rgb(0 0 0 / 6%);
  --app-btn-hover: rgb(255 255 255 / 8%);
  --app-tab-panel: rgb(25 26 46 / 85%);
  --fs-app-tag: 11px;
  --size-rail-avatar: 36px;
  --size-titlebar-icon: 20px;
  --size-server-name-h: 31px;
  --size-chat-head-h: 29px;
  --size-chip: 47px;
  --size-tab-w: 36px;
  --size-tab-h: 31px;
  --size-server-win-collapsed: 72px;
  --size-flyout-h: 170px;
  --motion-flyout-offset: 8px;
}

.screen {
  --accent: #a5a6ff;
  --dc-link: #00a8fc;
  --accent-text: #c2bfff;
}

.screen {
  --text-scale: 1;
  --taskbar-h: calc(48px * var(--text-scale));
}

:root {
  --f-cell: var(--world-grid-step);
  --f-floor: rgb(221 225 235 / 96%);
  --f-floor-line: rgb(43 45 49 / 13%);
  --f-wall-h: 20px;
  --f-wall-face-top: #b1b9ca;
  --f-wall-face-bottom: #858fa6;
  --f-rim: rgb(255 255 255 / 80%);
}

.v-c {
  --hl-top-a: 41;
  --hl-on-a: 41;
  --sh-y: 4px;
  --sh-spread: 3px;
  --front-h: 10px;
  --side-a: 25;
  --emoji: 26px;
  --edge-w: 1px;
  --sticker-w: 2px;
  --sticker-sh-x: 0px;
  --sticker-sh-blur: 2px;
  --sticker-sh-c: #191a2e;
  --emoji-sh-x: 0px;
  --emoji-sh-blur: 0px;
  --emoji-sh-c: #000000;
  --item-sh-x: 0px;
  --item-sh-blur: 0px;
  --item-sh-c: #2b2d31;
  --dev-top-1: #53587e;
  --dev-front-1: #23253e;
  --port-top-1: #f4f6fa;
  --port-front-1: #aab2c4;
  --lit: rgb(255 255 255 / calc(var(--hl-top-a) * 1%));
  --shade: linear-gradient(90deg, transparent calc(100% - var(--side-w)), rgb(0 0 0 / calc(var(--side-a) * 1%)) 0);
  --floor-sh: 0 var(--sh-y) var(--sh-blur) var(--sh-spread) rgb(20 24 32 / calc(var(--sh-a) * 1%));
  --f-edge-c: rgb(25 26 46 / calc(var(--edge-a) * 1%));
  --f-edge: drop-shadow(var(--edge-w) 0 0 var(--f-edge-c)) drop-shadow(calc(-1 * var(--edge-w)) 0 0 var(--f-edge-c))
    drop-shadow(0 var(--edge-w) 0 var(--f-edge-c)) drop-shadow(0 calc(-1 * var(--edge-w)) 0 var(--f-edge-c));
  --f-sticker-line: url(#f-sticker);
  --f-sticker-sh: drop-shadow(var(--sticker-sh-x) var(--sticker-sh-y) var(--sticker-sh-blur) color-mix(in srgb, var(--sticker-sh-c) calc(var(--sticker-sh-a) * 1%), transparent));
  --f-sticker: var(--f-sticker-line) var(--f-sticker-sh);
  --emoji-sh: drop-shadow(var(--emoji-sh-x) var(--emoji-sh-y) var(--emoji-sh-blur) color-mix(in srgb, var(--emoji-sh-c) calc(var(--emoji-sh-a) * 1%), transparent));
  --item-sh: drop-shadow(var(--item-sh-x) var(--item-sh-y) var(--item-sh-blur) color-mix(in srgb, var(--item-sh-c) calc(var(--item-sh-a) * 1%), transparent));
  --hl-top-w: 2px;
  --hl-edge-a: 13;
  --sh-blur: 4px;
  --sh-a: 65;
  --side-w: 3px;
  --radius: 3px;
  --edge-a: 85;
  --sticker-sh-y: 2px;
  --sticker-sh-a: 60;
  --emoji-sh-y: 2px;
  --emoji-sh-a: 30;
  --item-sh-y: 2px;
  --item-sh-a: 35;
  --dev-top-2: #41456a;
  --dev-front-2: #191a2e;
  --port-top-2: #d5dae5;
  --port-front-2: #848da4;
}

.v-c {
  --warn: #f0b232;
}

.v-c {
  --b-rub: #25273f;
  --b-rib: #3c3f5e;
  --b-pit: #0e0f1d;
  --b-hi: #e6e9f2;
  --b-lo: #80869f;
  --b-frame: var(--b-hi) 0 2px, var(--app-soft) 0 6px, transparent 0 38px, var(--app-muted) 0 42px, var(--b-lo) 0;
  --b-ribs: var(--b-rub) 0 6px, var(--b-rib) 0 8px;
}

:root {
  --ds-action: #a5a6ff;
  --ds-working: #23a55a;
  --ds-waiting: #5d6283;
  --ds-attention: #f0b232;
  --ds-error: #da373c;
  --ds-focus: #ffffff;
  --ds-grid-base: 58px;
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 24px;
  --ds-motion-fast: 120ms;
  --ds-motion-base: 200ms;
}