/* tokens/fonts.css */
@import url("https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;500;600;700;800;900&display=swap");
@font-face{font-family:"IBM Plex Mono";src:url("./assets/fonts/IBMPlexMono-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("./assets/fonts/IBMPlexMono-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("./assets/fonts/IBMPlexMono-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("./assets/fonts/IBMPlexMono-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}

/* tokens/colors.css */
:root{
/* — base: charcoal (тёплый чёрный, не синий) ————————— */
--k7-ink-1000:#0D0A09;
--k7-ink-900:#14100E;
--k7-ink-800:#1C1715;
--k7-ink-700:#26201C;
--k7-ink-600:#332B26;
--k7-ink-500:#493E37;
--k7-ink-400:#63564D;

/* — base: petrol (стены, обивка) ————————————————— */
--k7-petrol-900:#132B2F;
--k7-petrol-800:#1C3A3F;
--k7-petrol-700:#234A50;
--k7-petrol-600:#2C5A61;
--k7-petrol-500:#3A7078;

/* — base: deep blue (диваны, ночные сцены) ————————— */
--k7-blue-900:#151F2E;
--k7-blue-800:#1E2E44;
--k7-blue-700:#2A3E58;

/* — base: burnt brick (плашки, обложки) ———————————— */
--k7-brick-700:#6E2C1A;
--k7-brick-600:#8E3B23;
--k7-brick-500:#A9503C;

/* — base: raw wood (столы, стойка) ————————————————— */
--k7-wood-600:#6E4526;
--k7-wood-500:#8C5A32;
--k7-wood-400:#A97444;

/* — base: mustard / bulb amber (свет и действие) ———— */
--k7-mustard-600:#A87D1F;
--k7-mustard-500:#C99A2E;
--k7-mustard-400:#D9AC44;
--k7-amber-300:#E0A657;
--k7-amber-200:#EDC78E;

/* — base: old paper (никогда чистый белый) ————————— */
--k7-sand-50:#EDE6D8;
--k7-sand-100:#E3DACA;
--k7-sand-200:#D3C8B5;
--k7-sand-300:#B9AC97;
--k7-sand-400:#9C8E79;
--k7-sand-500:#7C6F5D;

/* — base: signals ——————————————————————————————— */
--k7-green-500:#8FB0A6;
--k7-red-500:#B4553A;

/* ============ SEMANTIC: тёмная тема (по умолчанию) ============ */
--surface-page:var(--k7-ink-900);
--surface-raised:var(--k7-ink-800);
--surface-card:var(--k7-ink-800);
--surface-sunken:var(--k7-ink-1000);
--surface-petrol:var(--k7-petrol-800);
--surface-blue:var(--k7-blue-800);
--surface-brick:var(--k7-brick-600);
--surface-inverse:var(--k7-sand-50);
--surface-accent:var(--k7-mustard-500);
--surface-overlay:rgba(13,10,9,.8);

--text-primary:var(--k7-sand-50);
--text-secondary:rgba(237,230,216,.78);
--text-muted:rgba(237,230,216,.55);
--text-accent:var(--k7-amber-300);
--text-inverse:var(--k7-ink-900);
--text-on-accent:var(--k7-ink-900);
--text-meta:rgba(237,230,216,.5);

--border-hairline:rgba(237,230,216,.14);
--border-strong:rgba(237,230,216,.32);
--border-accent:var(--k7-mustard-500);
--border-inverse:rgba(20,16,14,.16);

--action-primary-bg:var(--k7-mustard-500);
--action-primary-bg-hover:var(--k7-mustard-400);
--action-primary-bg-active:var(--k7-mustard-600);
--action-primary-fg:var(--k7-ink-900);
--action-secondary-fg:var(--k7-sand-50);
--action-secondary-border:rgba(237,230,216,.32);
--action-secondary-bg-hover:rgba(237,230,216,.07);
--action-ghost-fg:rgba(237,230,216,.7);

--status-open:var(--k7-green-500);
--status-closed:var(--k7-red-500);
--status-soon:var(--k7-mustard-500);
--status-needsdata:var(--k7-brick-500);

--focus-ring:var(--k7-amber-300);
--photo-placeholder:var(--k7-ink-700);
}

/* ============ SEMANTIC: светлая тема (бумага, меню, печать) ============ */
[data-theme="light"]{
--surface-page:var(--k7-sand-50);
--surface-raised:#F5F0E5;
--surface-card:var(--k7-sand-100);
--surface-sunken:var(--k7-sand-200);
--surface-inverse:var(--k7-ink-900);

--text-primary:var(--k7-ink-900);
--text-secondary:rgba(20,16,14,.76);
--text-muted:rgba(20,16,14,.52);
--text-accent:var(--k7-mustard-600);
--text-inverse:var(--k7-sand-50);
--text-meta:rgba(20,16,14,.5);

--border-hairline:rgba(20,16,14,.14);
--border-strong:rgba(20,16,14,.34);
--action-secondary-fg:var(--k7-ink-900);
--action-secondary-border:rgba(20,16,14,.34);
--action-secondary-bg-hover:rgba(20,16,14,.05);
--action-ghost-fg:rgba(20,16,14,.66);
--photo-placeholder:var(--k7-sand-200);
}

/* tokens/typography.css */
:root{
--font-display:"Golos Text","Helvetica Neue",Arial,sans-serif;
--font-body:"Golos Text","Helvetica Neue",Arial,sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,monospace;

--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */
--fw-black:800; /* @kind font */

/* display — Golos Text, tight, negative tracking */
--size-display-1:96px;
--size-display-2:64px;
--size-display-3:44px;
--lh-display:0.98; /* @kind font */
--ls-display:-0.03em; /* @kind font */

/* headings */
--size-h1:34px;
--size-h2:26px;
--size-h3:20px;
--lh-heading:1.12; /* @kind font */
--ls-heading:-0.015em; /* @kind font */

/* body */
--size-body-lg:19px;
--size-body:16px;
--size-body-sm:14px;
--lh-body:1.5; /* @kind font */
--lh-body-loose:1.62; /* @kind font */
--ls-body:0em; /* @kind font */

/* mono / metadata — always uppercase, positive tracking */
--size-mono:15px;
--size-mono-sm:12px;
--size-mono-lg:19px;
--lh-mono:1.3; /* @kind font */
--ls-mono:0.08em; /* @kind font */
--ls-mono-wide:0.16em; /* @kind font */

/* semantic type roles */
--text-style-meta:var(--fw-medium) var(--size-mono)/var(--lh-mono) var(--font-mono);
--text-style-body:var(--fw-regular) var(--size-body)/var(--lh-body) var(--font-body);
}

/* tokens/spacing.css */
:root{
--space-0:0px;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-24:96px;
--space-32:128px;
--space-40:160px;

/* layout */
--layout-max:1280px;
--content-max:1440px;
--content-wide:1760px;
--layout-narrow:720px;
--layout-gutter:var(--space-6);
--layout-gutter-lg:var(--space-10);
--layout-columns:12; /* @kind other */
--layout-section-y:var(--space-24);
--layout-section-y-sm:var(--space-16);
}

/* tokens/borders.css */
:root{
/* K7 is square. Radius is the exception, never the style. */
--radius-0:0px;
--radius-1:2px;
--radius-2:4px;
--radius-pill:999px;

--border-width-hairline:1px;
--border-width-strong:2px;
--border-hairline-rule:var(--border-width-hairline) solid var(--border-hairline);
--border-strong-rule:var(--border-width-strong) solid var(--border-strong);
}

/* tokens/effects.css */
:root{
/* Shadows are almost absent — depth comes from hairlines and value steps.
   The one exception is bulb glow: warm light spilling in a dark room. */
--shadow-none:none;
--shadow-lift:0 1px 0 rgba(13,10,9,.4);
--shadow-panel:0 24px 48px -24px rgba(13,10,9,.7);
--glow-bulb:0 0 0 1px rgba(201,154,46,.35),0 0 32px -6px rgba(201,154,46,.45);
--glow-bulb-soft:0 0 40px -4px rgba(224,166,87,.25);

/* protection: only for text over real photography */
--scrim-bottom:linear-gradient(to top,rgba(13,10,9,.94) 0%,rgba(13,10,9,.58) 38%,rgba(13,10,9,0) 78%); /* @kind other */
--scrim-flat:rgba(13,10,9,.58);

/* motion — short, linear-ish, no bounce */
--dur-fast:120ms; /* @kind other */
--dur:180ms; /* @kind other */
--dur-slow:320ms; /* @kind other */
--ease:cubic-bezier(.2,0,.2,1); /* @kind other */
--ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
--transition-default:var(--dur) var(--ease); /* @kind other */

/* photography treatment */
--photo-filter:saturate(.92) contrast(1.06); /* @kind other */
--photo-filter-dim:saturate(.9) contrast(1.04) brightness(.72); /* @kind other */
}

/* tokens/base.css */
.k7-body{background:var(--surface-page);color:var(--text-primary);font:var(--text-style-body);-webkit-font-smoothing:antialiased;margin:0}
.k7-meta{font:var(--text-style-meta);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-meta)}
.k7-display{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--size-display-2);line-height:var(--lh-display);letter-spacing:var(--ls-display)}
.k7-container{max-width:var(--layout-max);margin:0 auto;padding-inline:var(--layout-gutter)}
.k7-rule{height:1px;background:var(--border-hairline);border:0;margin:0}
a{color:var(--text-accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--transition-default),color var(--transition-default)}
a:hover{color:var(--k7-amber-200);border-bottom-color:currentColor}
*:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
::selection{background:var(--k7-brick-600);color:var(--k7-sand-50)}

