/* REMO primitives — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */
:root {
  --neutral-0: #ffffff;
  --neutral-25: #fcfbfa;
  --neutral-50: #f5f3ef;
  --neutral-100: #efece8;
  --neutral-150: #e6e2dd;
  --neutral-200: #d9d4ce;
  --neutral-300: #bfb9b1;
  --neutral-400: #8c867e;
  --neutral-500: #6f6963;
  --neutral-600: #58534e;
  --neutral-700: #433f3b;
  --neutral-800: #312e2b;
  --neutral-850: #272523;
  --neutral-900: #1d1b1a;
  --neutral-950: #131211;
  --accent-50: #e3f8f4;
  --accent-100: #bdeee5;
  --accent-300: #3fd0b8;
  --accent-500: #00a88f;
  --accent-600: #00806d;
  --accent-700: #00655a;
  --danger-50: #fff0eb;
  --danger-100: #ffd6c9;
  --danger-300: #ff8f6b;
  --danger-500: #f04a1c;
  --danger-600: #cc3a12;
  --danger-700: #a12c0b;
  --success-50: #e9f8ec;
  --success-100: #c6eecf;
  --success-300: #6fd38a;
  --success-500: #1fa34a;
  --success-600: #17853b;
  --success-700: #11662d;
  --warning-50: #fff6dc;
  --warning-100: #ffe9a8;
  --warning-300: #ffcb3d;
  --warning-500: #e6a100;
  --warning-600: #b07a00;
  --warning-700: #845b00;
  --orange-100: #ffcd9e;
  --orange-300: #ff8a57;
  --orange-600: #c93e0a;
  --violet-100: #d9c9ff;
  --violet-300: #c69bff;
  --violet-600: #8a35d6;
  --violet-50: #f3e8ff;
  --blue-100: #b5dcff;
  --blue-300: #78b4ff;
  --blue-600: #1a6ad8;
  --pink-100: #ffc6d9;
  --pink-300: #ff8fbd;
  --pink-600: #cc2470;
  --green-100: #b9ecac;
  --green-300: #85d965;
  --green-600: #2b7f17;
  --yellow-100: #ffe07a;
  --ochre-300: #f2b94a;
  --ochre-600: #9a5800;
  --alpha-white-55: rgba(255,255,255,0.55);
  --alpha-white-72: rgba(255,255,255,0.72);
  --alpha-umber-7: rgba(120,80,20,0.07);
  --alpha-ink-32: rgba(19,18,17,0.32);
  --alpha-black-56: rgba(0,0,0,0.56);
  --alpha-accent-8: rgba(0,168,143,0.08);
  --alpha-accent-light-8: rgba(63,208,184,0.08);
  --alpha-accent-light-18: rgba(63,208,184,0.18);
  --alpha-danger-light-18: rgba(255,143,107,0.18);
  --alpha-success-light-18: rgba(111,211,138,0.18);
  --alpha-warning-light-18: rgba(255,203,61,0.18);
  --alpha-violet-18: rgba(198,155,255,0.18);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --elev-pop-light: 0 8px 24px rgba(19,18,17,0.12), 0 1px 3px rgba(19,18,17,0.08);
  --elev-pop-dark: 0 8px 24px rgba(0,0,0,0.48), 0 1px 3px rgba(0,0,0,0.4);
  --elev-bar-light: 0 2px 8px rgba(19,18,17,0.10), 0 0 1px rgba(19,18,17,0.16);
  --elev-bar-dark: 0 2px 8px rgba(0,0,0,0.4), 0 0 1px rgba(0,0,0,0.6);
  --elev-sticker-light: 0 1px 1px rgba(90,60,20,0.06), 0 3px 6px -1px rgba(90,60,20,0.10), 0 10px 16px -8px rgba(90,60,20,0.22);
  --elev-sticker-dark: 0 1px 1px rgba(0,0,0,0.3), 0 3px 6px -1px rgba(0,0,0,0.35), 0 10px 18px -8px rgba(0,0,0,0.6);
  --elev-sticker-hover-light: 0 2px 2px rgba(90,60,20,0.07), 0 6px 12px -2px rgba(90,60,20,0.14), 0 18px 24px -10px rgba(90,60,20,0.28);
  --elev-sticker-hover-dark: 0 2px 2px rgba(0,0,0,0.35), 0 6px 12px -2px rgba(0,0,0,0.45), 0 18px 26px -10px rgba(0,0,0,0.7);
  --elev-hover-light: 0 2px 6px rgba(19,18,17,0.10);
  --elev-hover-dark: 0 2px 6px rgba(0,0,0,0.4);
  --z-canvas-overlay: 10;
  --z-bar: 100;
  --z-popover: 200;
  --z-dialog: 300;
  --z-toast: 400;
  --dur-1: 120ms;
  --dur-2: 180ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* REMO semantic roles that do not depend on the theme — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */
:root {
  --sticker-neutral: var(--neutral-100);
  --sticker-yellow: var(--yellow-100);
  --sticker-green: var(--green-100);
  --sticker-blue: var(--blue-100);
  --sticker-pink: var(--pink-100);
  --sticker-violet: var(--violet-100);
  --sticker-orange: var(--orange-100);
  --sticker-chip: var(--alpha-white-72);
  --sticker-sheen: var(--alpha-white-55);
  --sticker-shade: var(--alpha-umber-7);
  --sticker-ink: var(--neutral-900);
  --type-display: 600 24px/32px var(--font-sans);
  --type-title: 600 18px/26px var(--font-sans);
  --type-subtitle: 500 15px/22px var(--font-sans);
  --type-body: 400 14px/20px var(--font-sans);
  --type-label: 500 13px/18px var(--font-sans);
  --type-caption: 400 12px/16px var(--font-sans);
  --type-kbd: 500 11px/16px var(--font-mono);
}

/* REMO component tokens and density — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */
:root {
  --control-compact: 28px;
  --control-default: 32px;
  --control-padding-x: var(--space-3);
  --dialog-padding: var(--space-5);
  --panel-gutter: var(--space-4);
  --topbar-height: 52px;
  --toolbar-width: 48px;
  --inspector-width: 276px;
  --dialog-sm: 420px;
  --dialog-md: 560px;
  --dialog-lg: 720px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --label-max: 240px;
  --handle: 8px;
  --handle-hit: 12px;
  --pin: 24px;
  --grid-step: 20px;
  --control-h: var(--control-default);
}
[data-density="compact"] {
  --control-h: var(--control-compact);
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms;
    --dur-2: 0ms;
  }
}

/* REMO theme “light” — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */
:root, [data-theme="light"] {
  --bg-canvas: var(--neutral-50);
  --bg-app: var(--neutral-25);
  --bg-panel: var(--neutral-0);
  --bg-raised: var(--neutral-0);
  --bg-hover: var(--neutral-100);
  --bg-active: var(--neutral-200);
  --bg-overlay: var(--alpha-ink-32);
  --bg-inverse: var(--neutral-900);
  --text-primary: var(--neutral-900);
  --text-secondary: var(--neutral-600);
  --text-muted: var(--neutral-500);
  --text-inverse: var(--neutral-0);
  --text-accent: var(--accent-700);
  --text-danger: var(--danger-700);
  --text-agent: var(--violet-600);
  --border-subtle: var(--neutral-150);
  --border-strong: var(--neutral-400);
  --border-focus: var(--accent-600);
  --accent: var(--accent-600);
  --accent-hover: var(--accent-700);
  --accent-soft: var(--accent-50);
  --text-on-accent: var(--neutral-0);
  --danger: var(--danger-600);
  --danger-hover: var(--danger-700);
  --danger-soft: var(--danger-50);
  --agent-soft: var(--violet-50);
  --text-on-danger: var(--neutral-0);
  --state-success: var(--success-700);
  --success-soft: var(--success-50);
  --state-warning: var(--warning-700);
  --warning-soft: var(--warning-50);
  --state-info: var(--neutral-600);
  --selection-fill: var(--alpha-accent-8);
  --selection-stroke: var(--accent-600);
  --presence-1: var(--orange-600);
  --presence-2: var(--violet-600);
  --presence-3: var(--blue-600);
  --presence-4: var(--pink-600);
  --presence-5: var(--green-600);
  --presence-6: var(--ochre-600);
  --text-on-presence: var(--neutral-0);
  --shadow-pop: var(--elev-pop-light);
  --shadow-bar: var(--elev-bar-light);
  --shadow-sticker: var(--elev-sticker-light);
  --shadow-sticker-hover: var(--elev-sticker-hover-light);
  --shadow-hover: var(--elev-hover-light);
}
:root { color-scheme: light; }

/* REMO theme “dark” — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */
[data-theme="dark"] {
  --bg-canvas: var(--neutral-900);
  --bg-app: var(--neutral-950);
  --bg-panel: var(--neutral-850);
  --bg-raised: var(--neutral-800);
  --bg-hover: var(--neutral-800);
  --bg-active: var(--neutral-700);
  --bg-overlay: var(--alpha-black-56);
  --bg-inverse: var(--neutral-50);
  --text-primary: var(--neutral-50);
  --text-secondary: var(--neutral-200);
  --text-muted: var(--neutral-300);
  --text-inverse: var(--neutral-950);
  --text-accent: var(--accent-300);
  --text-danger: var(--danger-300);
  --text-agent: var(--violet-300);
  --border-subtle: var(--neutral-800);
  --border-strong: var(--neutral-400);
  --border-focus: var(--accent-300);
  --accent: var(--accent-300);
  --accent-hover: var(--accent-100);
  --accent-soft: var(--alpha-accent-light-18);
  --text-on-accent: var(--neutral-950);
  --danger: var(--danger-300);
  --danger-hover: var(--danger-100);
  --danger-soft: var(--alpha-danger-light-18);
  --agent-soft: var(--alpha-violet-18);
  --text-on-danger: var(--neutral-950);
  --state-success: var(--success-300);
  --success-soft: var(--alpha-success-light-18);
  --state-warning: var(--warning-300);
  --warning-soft: var(--alpha-warning-light-18);
  --state-info: var(--neutral-300);
  --selection-fill: var(--alpha-accent-light-8);
  --selection-stroke: var(--accent-300);
  --presence-1: var(--orange-300);
  --presence-2: var(--violet-300);
  --presence-3: var(--blue-300);
  --presence-4: var(--pink-300);
  --presence-5: var(--green-300);
  --presence-6: var(--ochre-300);
  --text-on-presence: var(--neutral-950);
  --shadow-pop: var(--elev-pop-dark);
  --shadow-bar: var(--elev-bar-dark);
  --shadow-sticker: var(--elev-sticker-dark);
  --shadow-sticker-hover: var(--elev-sticker-hover-dark);
  --shadow-hover: var(--elev-hover-dark);
}
[data-theme="dark"] { color-scheme: dark; }