/* oCompress design tokens + Inter (SPEC 3.2). Shared contract with the tool (build/tools-src): the tool uses only
   the --oc-* tokens of the first block; the --oc-site-* / category tokens are for the site.
   Theme: light by default, dark from prefers-color-scheme until the visitor chooses; the choice is stored in
   localStorage "oc_theme" (dark|light) and applied as html[data-theme] before the first paint.
   --oc-accent is the colour of links, focus rings and primary buttons; --oc-accent-text is the text ON --oc-accent
   (contrast >= 4.5:1 both ways in both themes). Inter: SIL Open Font License 1.1 (fonts/OFL-Inter.txt). */

@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url(fonts/inter-latin-wght-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url(fonts/inter-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url(fonts/inter-cyrillic-wght-normal.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url(fonts/inter-greek-wght-normal.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: 'Inter Variable'; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url(fonts/inter-vietnamese-wght-normal.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }

:root {
  color-scheme: light;
  /* shared with the tool */
  --oc-bg: #fbfcfc;
  --oc-surface: #ffffff;
  --oc-surface-2: #f1f6f6;
  --oc-border: #dfe8e9;
  --oc-text: #0f1d20;
  --oc-text-muted: #51656a;
  --oc-accent: #0c7680;
  --oc-accent-text: #ffffff;
  --oc-accent-soft: #e2f4f5;
  --oc-warn: #a15c07;
  --oc-danger: #c3292e;
  --oc-success: #1d7a46;
  --oc-radius: 16px;
  --oc-radius-sm: 10px;
  --oc-shadow: 0 1px 2px rgba(15, 40, 44, .05), 0 8px 24px -6px rgba(15, 40, 44, .10);
  --oc-font: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* site only */
  --oc-brand: #64c9cf;            /* brand teal (decorative: never text on white) */
  --oc-warm: #f08a3c;             /* warm secondary (decorative) */
  --oc-warm-soft: #fff1e4;
  --oc-accent-hover: #09636c;
  --oc-border-strong: #c7d5d7;
  --oc-header-bg: rgba(255, 255, 255, .86);
  --oc-shadow-lg: 0 2px 4px rgba(15, 40, 44, .04), 0 24px 48px -12px rgba(15, 40, 44, .18);
  --oc-logo-tile: #0e7c86;
  --oc-logo-o: #0e7c86;
  --oc-hero-glow: radial-gradient(60% 120% at 50% 0%, rgba(100, 201, 207, .18), rgba(100, 201, 207, 0) 70%);
  /* category colours: [text/icon, soft background] */
  --oc-c-image: #0b6d76; --oc-c-image-bg: #e2f4f5;
  --oc-c-video: #6a4bd6; --oc-c-video-bg: #eeeafd;
  --oc-c-audio: #b8460e; --oc-c-audio-bg: #fdede3;
  --oc-c-document: #2459c9; --oc-c-document-bg: #e6eefc;
}

/* dark: system preference (until chosen) or explicit choice */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --oc-bg: #0c1517;
    --oc-surface: #121e21;
    --oc-surface-2: #182729;
    --oc-border: #253739;
    --oc-text: #e7f1f2;
    --oc-text-muted: #9db1b4;
    --oc-accent: #64c9cf;
    --oc-accent-text: #062326;
    --oc-accent-soft: rgba(100, 201, 207, .13);
    --oc-warn: #f2b45a;
    --oc-danger: #ff8a8a;
    --oc-success: #5fd38d;
    --oc-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px -6px rgba(0, 0, 0, .45);
    --oc-accent-hover: #8adade;
    --oc-border-strong: #33494c;
    --oc-header-bg: rgba(12, 21, 23, .82);
    --oc-shadow-lg: 0 2px 4px rgba(0, 0, 0, .3), 0 24px 48px -12px rgba(0, 0, 0, .6);
    --oc-warm-soft: rgba(240, 138, 60, .14);
    --oc-logo-tile: #12909a;
    --oc-logo-o: #64c9cf;
    --oc-hero-glow: radial-gradient(60% 120% at 50% 0%, rgba(100, 201, 207, .10), rgba(100, 201, 207, 0) 70%);
    --oc-c-image: #6fd3d9; --oc-c-image-bg: rgba(100, 201, 207, .13);
    --oc-c-video: #b5a2ff; --oc-c-video-bg: rgba(150, 125, 255, .14);
    --oc-c-audio: #ffab7a; --oc-c-audio-bg: rgba(255, 140, 80, .13);
    --oc-c-document: #8fb2ff; --oc-c-document-bg: rgba(110, 150, 255, .14);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --oc-bg: #0c1517;
  --oc-surface: #121e21;
  --oc-surface-2: #182729;
  --oc-border: #253739;
  --oc-text: #e7f1f2;
  --oc-text-muted: #9db1b4;
  --oc-accent: #64c9cf;
  --oc-accent-text: #062326;
  --oc-accent-soft: rgba(100, 201, 207, .13);
  --oc-warn: #f2b45a;
  --oc-danger: #ff8a8a;
  --oc-success: #5fd38d;
  --oc-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px -6px rgba(0, 0, 0, .45);
  --oc-accent-hover: #8adade;
  --oc-border-strong: #33494c;
  --oc-header-bg: rgba(12, 21, 23, .82);
  --oc-shadow-lg: 0 2px 4px rgba(0, 0, 0, .3), 0 24px 48px -12px rgba(0, 0, 0, .6);
  --oc-warm-soft: rgba(240, 138, 60, .14);
  --oc-logo-tile: #12909a;
  --oc-logo-o: #64c9cf;
  --oc-hero-glow: radial-gradient(60% 120% at 50% 0%, rgba(100, 201, 207, .10), rgba(100, 201, 207, 0) 70%);
  --oc-c-image: #6fd3d9; --oc-c-image-bg: rgba(100, 201, 207, .13);
  --oc-c-video: #b5a2ff; --oc-c-video-bg: rgba(150, 125, 255, .14);
  --oc-c-audio: #ffab7a; --oc-c-audio-bg: rgba(255, 140, 80, .13);
  --oc-c-document: #8fb2ff; --oc-c-document-bg: rgba(110, 150, 255, .14);
}

/* Thai, Japanese, Korean, Chinese: system fonts (Inter has no glyphs for them) */
:root:lang(th) { --oc-font: system-ui, -apple-system, 'Segoe UI', 'Leelawadee UI', Tahoma, 'Noto Sans Thai', sans-serif; }
:root:lang(ja) { --oc-font: system-ui, -apple-system, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic UI', Meiryo, 'Noto Sans JP', sans-serif; }
:root:lang(ko) { --oc-font: system-ui, -apple-system, 'Apple SD Gothic Neo', 'Malgun Gothic', 'Noto Sans KR', sans-serif; }
:root:lang(zh-Hans) { --oc-font: system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei UI', 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }