/* samurai-blues design system — tokens/colors, typography, spacing, effects, base (verbatim from _handoff/tokens). Fonts: assets/fonts/fonts.css (self-hosted, linked from HTML). */
/* ---- tokens/colors.css ---- */
:root{
/* Ai — aizome indigo, the core brand hue */
--ai-50:#F2F5FD;--ai-100:#E3E9FA;--ai-200:#BCCBF2;--ai-300:#86A2E6;--ai-400:#4C74D6;--ai-500:#2B54B8;--ai-600:#22408F;--ai-700:#1A2E6E;--ai-800:#12204F;--ai-900:#0B1433;--ai-950:#070B1F;
/* Neon — night-city electric accents */
--neon-blue:#2F7BFF;--neon-cyan:#4FD8FF;--neon-blue-soft:rgba(47,123,255,.16);
/* Washi — paper neutrals */
--washi-0:#FFFFFF;--washi-50:#F7F5F0;--washi-100:#EFECE4;--washi-200:#E0DCD1;--washi-300:#CBC6B8;
/* Sumi — ink neutrals */
--sumi-300:#B9BBC2;--sumi-400:#8A8D96;--sumi-500:#5B5E68;--sumi-700:#2A2C33;--sumi-900:#0E0F13;
/* Spot accents — used sparingly */
--shu-500:#E2412B;--shu-100:#FCE6E2;--kin-500:#C9A24A;--kin-100:#F6EEDA;
/* Semantic status */
--success-500:#1F9D6B;--success-100:#DDF3EA;--warning-500:#D99A00;--warning-100:#FBF0D2;--danger-500:var(--shu-500);--danger-100:var(--shu-100);--info-500:var(--neon-blue);--info-100:var(--ai-100);

/* Semantic aliases — light (paper) surfaces */
--surface-page:var(--washi-50);--surface-card:var(--washi-0);--surface-sunken:var(--washi-100);--surface-brand:var(--ai-700);--surface-night:var(--ai-950);--surface-night-raised:var(--ai-900);
--text-strong:var(--sumi-900);--text-body:var(--sumi-700);--text-muted:var(--sumi-500);--text-faint:var(--sumi-400);--text-brand:var(--ai-700);--text-link:var(--ai-500);--text-on-brand:var(--washi-0);--text-on-night:#E8ECF8;--text-on-night-muted:#8E9AC4;
--border-subtle:var(--washi-200);--border-strong:var(--sumi-900);--border-brand:var(--ai-700);--border-night:rgba(134,162,230,.22);
--action-primary:var(--ai-700);--action-primary-hover:var(--ai-600);--action-primary-press:var(--ai-800);--action-accent:var(--neon-blue);--focus-ring:var(--neon-blue);
}

/* ---- tokens/typography.css ---- */
:root{
--font-display:"Saira Condensed","Arial Narrow",sans-serif;
--font-mincho:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
--font-sans:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,monospace;

--fs-mega:clamp(72px,11vw,168px);/* @kind font */--fs-d1:96px;--fs-d2:64px;--fs-h1:44px;--fs-h2:32px;--fs-h3:24px;--fs-h4:19px;--fs-body-lg:17px;--fs-body:15px;--fs-small:13px;--fs-micro:11px;
--lh-tight:.92;/* @kind font */--lh-heading:1.3;/* @kind font */--lh-body:1.85;/* @kind font */--lh-ui:1.4;/* @kind font */
--ls-display:-.005em;/* @kind font */--ls-label:.18em;/* @kind font */--ls-jp:.08em;/* @kind font */
--fw-regular:400;/* @kind font */--fw-medium:500;/* @kind font */--fw-bold:700;/* @kind font */--fw-black:800;/* @kind font */

/* semantic text styles */
--type-display:800 var(--fs-d1)/var(--lh-tight) var(--font-display);
--type-heading-jp:700 var(--fs-h2)/var(--lh-heading) var(--font-mincho);
--type-body:400 var(--fs-body)/var(--lh-body) var(--font-sans);
--type-label:500 var(--fs-micro)/1 var(--font-mono);
}

/* ---- tokens/spacing.css ---- */
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:144px;
--container:1200px;/* @kind spacing */--container-narrow:760px;/* @kind spacing */--gutter:clamp(20px,5vw,64px);/* @kind spacing */--section-y:clamp(72px,10vw,144px);/* @kind spacing */
--radius-0:0;--radius-1:2px;--radius-2:4px;--radius-3:8px;--radius-pill:999px;
--border-hair:1px;/* @kind spacing */--border-ink:2px;/* @kind spacing */
--slant:6vw;/* @kind spacing */ /* vertical drop of the signature diagonal cut */
}

/* ---- tokens/effects.css ---- */
:root{
--shadow-1:0 1px 2px rgba(11,20,51,.08),0 1px 1px rgba(11,20,51,.04);
--shadow-2:0 8px 24px -8px rgba(11,20,51,.18);
--shadow-3:0 24px 48px -16px rgba(11,20,51,.32);
--glow-neon:0 0 0 1px rgba(79,216,255,.5),0 0 24px rgba(47,123,255,.45);
--glow-text:0 0 18px rgba(79,216,255,.55);
--scrim-night:linear-gradient(180deg,rgba(7,11,31,0) 0%,rgba(7,11,31,.85) 100%);/* @kind other */
--tint-ai:linear-gradient(0deg,rgba(26,46,110,.72),rgba(26,46,110,.72));/* @kind other */
--blur-glass:saturate(140%) blur(14px);/* @kind other */
--ease-cut:cubic-bezier(.7,0,.2,1);/* @kind other */--ease-out:cubic-bezier(.2,.8,.2,1);/* @kind other */
--dur-fast:120ms;/* @kind other */--dur-base:220ms;/* @kind other */--dur-slow:600ms;/* @kind other */
}

/* ---- tokens/base.css ---- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
a{color:var(--text-link);text-decoration:none}a:hover{color:var(--action-primary-hover);text-decoration:underline;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.sb-outline-word{font-family:var(--font-display);font-weight:800;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px currentColor;line-height:.85;letter-spacing:-.01em}
.sb-vertical{writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:var(--ls-jp)}
.sb-label{font:var(--type-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.sb-slant-bottom{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--slant)),0 100%)}
.sb-slant-top{clip-path:polygon(0 var(--slant),100% 0,100% 100%,0 100%)}

