/* Tokyo Lighting Design — design tokens * Imported by index.html before kit.css. All colors, type stacks, motion, * and glow are exposed as CSS variables so they can be re-themed by * setting `data-theme="light"` (or another value) on any ancestor. */ @import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+JP:wght@400;500;700&display=swap'); :root { /* Surfaces — theatrical dark */ --tld-ink: #0a0a0b; --tld-ink-2: #131316; --tld-ink-3: #1c1c20; /* Foreground */ --tld-fg: #d9d6cf; --tld-bone: #ebe6dc; --tld-fog-1: #6b6862; --tld-fog-2: #9a958c; /* Lines */ --tld-line: #2a2a2e; --tld-line-2: #3a3a3f; /* Accent — amber stage glow */ --tld-amber: #e8a54a; --tld-amber-hot: #f0b35a; --tld-amber-deep: #b67d2e; /* Type stacks * Google Fonts substitutes for the studio's actual stack. Replace with * licensed files when finalizing production. */ --tld-font-display: 'Barlow Condensed', 'Noto Sans JP', system-ui, sans-serif; --tld-font-sans: 'Noto Sans JP', system-ui, sans-serif; /* 旧 Mincho 系を廃止 → 全て Gothic に統一 */ --tld-font-serif: 'Noto Sans JP', system-ui, sans-serif; --tld-font-mono: 'JetBrains Mono', ui-monospace, monospace; /* Motion */ --tld-ease: cubic-bezier(0.4, 0, 0.2, 1); --tld-dur-theatre: 1200ms; /* Glow */ --tld-glow-amber-soft: 0 0 24px rgba(232, 165, 74, 0.18); } /* Light theme (opt-in: ) */ [data-theme="light"] { --tld-ink: #f7f5f0; --tld-ink-2: #efece5; --tld-ink-3: #e6e3da; --tld-fg: #1a1a1c; --tld-bone: #0a0a0b; --tld-fog-1: #807d75; --tld-fog-2: #555248; --tld-line: #d4d0c6; --tld-line-2: #b8b3a8; }