[data-skin] {
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Jost', system-ui, sans-serif;

  --t-display: clamp(38px, 6vw, 64px);
  --t-title: clamp(26px, 3.4vw, 36px);
  --t-lead: 19px;
  --t-body: 16px;
  --t-small: 14px;
  --t-micro: 11px;

  --s1: 6px; --s2: 12px; --s3: 20px; --s4: 32px; --s5: 52px; --s6: 84px;

  --tap: 48px;
  --stage-max: 760px;
  --frame-max: 1180px;
}

[data-skin="workshop"][data-theme="light"] {
  --ground: #e5e3df; --ground-sunk: #dad7d1; --panel: #f6f5f3; --panel-raised: #FFFFFF;
  --ink: #2a2826; --ink-soft: #4b4844; --ink-faint: #5f5b57;
  --line: #d6d3ce; --line-strong: #2a2826;
  --slot-line: #b3afa9;
  --accent: #D93A14; --accent-soft: #FADCD1; --accent-ink: #FFF8F4;
  --sticker-accent: #C9330F;
  --mark: #1E39A8; --mark-soft: #DDE2F8;
  --good: #3C7548; --warn: #A87508; --stop: #AE2C1D;
  --good-soft: #EDEEE3; --warn-soft: #F5EEDE; --stop-soft: #F5E8E0;
  --change-mark: #ECECE8;
  --gold: #F3D67A; --gold-ink: #5C3E00;
  --focus: #1E39A8;
  --border-w: 2px; --border-w-heavy: 3px;
  --radius: 3px; --radius-lg: 6px; --radius-pill: 999px;
  --shadow: 4px 4px 0 var(--line-strong);
  --shadow-lift: 7px 7px 0 var(--line-strong);
  --press: translate(3px, 3px);
  --label-case: uppercase; --label-track: 0.16em; --label-weight: 500;
  --pattern: radial-gradient(rgba(50,45,40,0.20) 1.2px, transparent 1.2px);
  --pattern-size: 22px 22px;
  --display-style: normal;
}

[data-skin="workshop"][data-theme="dark"] {
  --ground: #141513; --ground-sunk: #0E0F0E; --panel: #1C1E1C; --panel-raised: #242724;
  --ink: #F2F0E9; --ink-soft: #B3B4AC; --ink-faint: #858781;
  --line: #2E312E; --line-strong: #4C514B;
  --accent: #FF6B3D; --accent-soft: #33201A; --accent-ink: #15100C;
  --mark: #8DA1FF; --mark-soft: #1D2138;
  --good: #79B183; --warn: #DDA83C; --stop: #E2664F;
  --good-soft: #1F2320; --warn-soft: #23231D; --stop-soft: #23211E;
  --change-mark: #000000;
  --gold: #4A3B12; --gold-ink: #F3D67A;
  --focus: #8DA1FF;
  --border-w: 2px; --border-w-heavy: 3px;
  --radius: 3px; --radius-lg: 6px; --radius-pill: 999px;
  --shadow: 4px 4px 0 #070806;
  --shadow-lift: 7px 7px 0 #070806;
  --press: translate(3px, 3px);
  --label-case: uppercase; --label-track: 0.16em; --label-weight: 500;
  --pattern: radial-gradient(#262925 1.2px, transparent 1.2px);
  --pattern-size: 22px 22px;
  --display-style: normal;
}

[data-skin="office"][data-theme="light"] {
  --ground: #F0F1EF; --ground-sunk: #E5E8E5; --panel: #FFFFFF; --panel-raised: #FFFFFF;
  --ink: #181B1A; --ink-soft: #4E5553; --ink-faint: #616766;
  --line: #DBDFDD; --line-strong: #C2C8C6;
  --accent: #9C3A1C; --accent-soft: #F4E5DF; --accent-ink: #FFFFFF;
  --mark: #2F3E6B; --mark-soft: #E4E8F2;
  --good: #386B47; --warn: #8A6712; --stop: #94301F;
  --good-soft: #E7EDE9; --warn-soft: #F1EDE3; --stop-soft: #F2E6E4;
  --change-mark: #ECECE8;
  --gold: #F0DFA0; --gold-ink: #6B4F00;
  --focus: #2F3E6B;
  --border-w: 1px; --border-w-heavy: 1px;
  --radius: 2px; --radius-lg: 3px; --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(20,25,24,.05), 0 10px 28px rgba(20,25,24,.05);
  --shadow-lift: 0 2px 4px rgba(20,25,24,.06), 0 18px 44px rgba(20,25,24,.08);
  --press: none;
  --label-case: uppercase; --label-track: 0.1em; --label-weight: 500;
  --pattern: none;
  --pattern-size: auto;
  --display-style: normal;
}

[data-skin="office"][data-theme="dark"] {
  --ground: #121415; --ground-sunk: #0D0F10; --panel: #1A1D1E; --panel-raised: #212526;
  --ink: #ECEFEE; --ink-soft: #A7AFAD; --ink-faint: #808785;
  --line: #292E2F; --line-strong: #39403F;
  --accent: #D9805F; --accent-soft: #32211A; --accent-ink: #16100C;
  --mark: #97A6CE; --mark-soft: #1E2434;
  --good: #6FA57C; --warn: #C79B3F; --stop: #D07358;
  --good-soft: #1E2423; --warn-soft: #232420; --stop-soft: #232121;
  --change-mark: #000000;
  --gold: #3A2F12; --gold-ink: #E8CB74;
  --focus: #97A6CE;
  --border-w: 1px; --border-w-heavy: 1px;
  --radius: 2px; --radius-lg: 3px; --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.30);
  --shadow-lift: 0 2px 4px rgba(0,0,0,.4), 0 18px 44px rgba(0,0,0,.38);
  --press: none;
  --label-case: uppercase; --label-track: 0.1em; --label-weight: 500;
  --pattern: none;
  --pattern-size: auto;
  --display-style: normal;
}

[data-skin="none"] {
  --ground: #fff; --ground-sunk: #fff; --panel: #fff; --panel-raised: #fff;
  --ink: #000; --ink-soft: #000; --ink-faint: #000;
  --line: #000; --line-strong: #000;
  --accent: #000; --accent-soft: #fff; --accent-ink: #fff;
  --mark: #000; --mark-soft: #fff;
  --good: #000; --warn: #000; --stop: #000;
  --good-soft: #fff; --warn-soft: #fff; --stop-soft: #fff;
  --change-mark: #000;
  --gold: #fff; --gold-ink: #000;
  --focus: #000;
  --border-w: 1px; --border-w-heavy: 1px;
  --radius: 0; --radius-lg: 0; --radius-pill: 0;
  --shadow: none; --shadow-lift: none; --press: none;
  --label-case: none; --label-track: 0; --label-weight: 400;
  --pattern: none; --pattern-size: auto;
}