diff --git a/apps/web/src/index.css b/apps/web/src/index.css
index a58c3e2bd..4b9fa9a09 100644
--- a/apps/web/src/index.css
+++ b/apps/web/src/index.css
@@ -106,95 +106,19 @@
   --sumi-vermillion-hover: #b05060;
   --sumi-vermillion-subtle: rgba(160,64,80, 0.10);
 
-  /* ═══ PATINA ═══ */
+  /* PATINA — runtime state, mutated by ThemeProvider per account age.
+     grain-opacity is theme-dependent (overridden in [data-theme="light"] below). */
   --sumi-patina-warmth:    0deg;
   --sumi-grain-opacity:    0.04;
 
-  /* ═══ 墨の六色 — Six Tones of Ink ═══ */
-  --sumi-ink-kuro:     #0A0A0C;  /* 黒 pure black */
-  --sumi-ink-sumi:     #1A1A1E;  /* 墨 ink */
-  --sumi-ink-usuzumi:  #3D3A35;  /* 薄墨 light ink */
-  --sumi-ink-hai:      #6B6660;  /* 灰 ash */
-  --sumi-ink-gin:      #9A958D;  /* 銀 silver */
-  --sumi-ink-kasumi:   #B5B0A8;  /* 霞 mist */
-
-  /* ═══ CIRCADIAN ═══ */
-  --sumi-circadian-warmth:     0deg;
-  --sumi-circadian-brightness: 1;
-
-  /* ═══ SEMANTIC ═══ */
-  --sumi-success:        var(--sumi-sage);
-  --sumi-success-subtle: var(--sumi-sage-subtle);
-  --sumi-warning:        var(--sumi-gold);
-  --sumi-warning-subtle: var(--sumi-gold-subtle);
-  --sumi-error-semantic: var(--sumi-error);
-  --sumi-error-semantic-subtle: var(--sumi-error-subtle);
-  --sumi-info:           var(--sumi-accent);
-  --sumi-live:           rgba(180,80,70, 0.55);
-  --sumi-online:         var(--sumi-sage);
-
-  /* ═══ TYPOGRAPHY ═══ */
-  --sumi-font-body:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-  --sumi-font-heading:  'Space Grotesk', system-ui, sans-serif;
-  --sumi-font-mono:     'JetBrains Mono', 'SF Mono', 'Consolas', monospace;
-  --sumi-font-serif:    'Space Grotesk', system-ui, sans-serif;
-
-  --sumi-text-4xl: 2.25rem;
-  --sumi-text-3xl: 1.875rem;
-  --sumi-text-2xl: 1.5rem;
-  --sumi-text-xl:  1.25rem;
-  --sumi-text-lg:  1.125rem;
-  --sumi-text-md:  1rem;
-  --sumi-text-base: 0.875rem;
-  --sumi-text-sm:  0.8125rem;
-  --sumi-text-xs:  0.75rem;
-  --sumi-font-size-base: 16px;
-
-  --sumi-leading-none:    1;
-  --sumi-leading-tight:   1.25;
-  --sumi-leading-snug:    1.375;
-  --sumi-leading-normal:  1.5;
-  --sumi-leading-relaxed: 1.625;
-  --sumi-leading-loose:   1.75;
-
-  --sumi-tracking-tighter: -0.03em;
-  --sumi-tracking-tight:   -0.015em;
-  --sumi-tracking-normal:  0;
-  --sumi-tracking-wide:    0.025em;
-  --sumi-tracking-wider:   0.05em;
-  --sumi-tracking-widest:  0.2em;
-
-  --sumi-weight-extralight: 200;
-  --sumi-weight-light:     300;
-  --sumi-weight-regular:   400;
-  --sumi-weight-medium:    500;
-  --sumi-weight-semibold:  600;
-  --sumi-weight-bold:      700;
-
-  /* ═══ SPACING ═══ */
-  --sumi-space-0-5: 2px;
-  --sumi-space-1:   4px;
-  --sumi-space-1-5: 6px;
-  --sumi-space-2:   8px;
-  --sumi-space-2-5: 10px;
-  --sumi-space-3:   12px;
-  --sumi-space-4:   16px;
-  --sumi-space-5:   20px;
-  --sumi-space-6:   24px;
-  --sumi-space-8:   32px;
-  --sumi-space-10:  40px;
-  --sumi-space-12:  48px;
-  --sumi-space-16:  64px;
-  --sumi-space-20:  80px;
-
-  /* ═══ RADIUS ═══ */
-  --sumi-radius-xs:   2px;
-  --sumi-radius-sm:   4px;
-  --sumi-radius-md:   8px;
-  --sumi-radius-lg:   12px;
-  --sumi-radius-xl:   16px;
-  --sumi-radius-2xl:  20px;
-  --sumi-radius-full: 9999px;
+  /* Tokenized in @veza/design-system/tokens.css (theme-independent):
+       - 墨の六色 ink tones (--sumi-ink-{kuro,sumi,usuzumi,hai,gin,kasumi})
+       - 和紙 washi tones (--sumi-washi-*)
+       - mizu/ai/vermillion aliases
+       - circadian state (--sumi-circadian-warmth/brightness)
+       - semantic aliases (--sumi-{success,warning,info,live,online,error-semantic}*)
+       - typography (--sumi-font-*, --sumi-text-{xs..4xl}, --sumi-{leading,tracking,weight}-*)
+       - spacing + radius (--sumi-space-*, --sumi-radius-*) */
 
   /* ═══ SHADOWS — Ink diffusion (滲み) — omnidirectional ═══ */
   --sumi-shadow-xs:    0 0 4px rgba(26,26,30, 0.03);
@@ -217,66 +141,17 @@
   --sumi-scrollbar-thumb: rgba(232,227,219, 0.06);
   --sumi-scrollbar-hover: rgba(232,227,219, 0.12);
 
-  /* ═══ MOTION — Weight of water (水の重さ) ═══ */
-  --sumi-motion-goutte:  100ms;  /* 滴 drop — tooltips, badges */
-  --sumi-motion-trait:   150ms;  /* 筆 stroke — buttons, icons, links */
-  --sumi-motion-lavis:   250ms;  /* 墨 wash — cards, dropdowns */
-  --sumi-motion-vague:   350ms;  /* 波 wave — modals, sidebar, panels */
-  --sumi-motion-maree:   450ms;  /* 潮 tide — navigation, player */
+  /* Tokenized in @veza/design-system/tokens.css (theme-independent):
+       - motion (--sumi-motion-{goutte,trait,lavis,vague,maree})
+       - duration aliases (--sumi-duration-{instant,fast,normal,slow,slower})
+       - easings (--sumi-ease-{goutte,trait,lavis,vague,maree,rebond,default,out,in,in-out,bounce,spring})
+       - transition shorthands (--sumi-transition-{colors,opacity,transform,shadow})
+       - z-index scale (--sumi-z-*)
+       - layout primitives (--sumi-{max-width,max-width-content,max-width-narrow,max-width-prose,sidebar-width,sidebar-collapsed,header-height,player-height}) */
 
-  /* Legacy aliases (backwards compat) */
-  --sumi-duration-instant: var(--sumi-motion-goutte);
-  --sumi-duration-fast:    var(--sumi-motion-trait);
-  --sumi-duration-normal:  var(--sumi-motion-lavis);
-  --sumi-duration-slow:    var(--sumi-motion-vague);
-  --sumi-duration-slower:  var(--sumi-motion-maree);
-  --duration-fast:         var(--sumi-motion-trait);
-  --duration-normal:       var(--sumi-motion-lavis);
-
-  /* Easings — organic water curves, NEVER linear */
-  --sumi-ease-goutte:  cubic-bezier(0.25, 0.1, 0.25, 1);
-  --sumi-ease-trait:   cubic-bezier(0.33, 1, 0.68, 1);
-  --sumi-ease-lavis:   cubic-bezier(0.25, 0.8, 0.25, 1);
-  --sumi-ease-vague:   cubic-bezier(0.16, 1, 0.3, 1);
-  --sumi-ease-maree:   cubic-bezier(0.33, 1, 0.68, 1);
-  --sumi-ease-rebond:  cubic-bezier(0.34, 1.56, 0.64, 1);
-
-  /* Legacy aliases */
-  --sumi-ease-default: var(--sumi-ease-goutte);
-  --sumi-ease-out:     var(--sumi-ease-trait);
-  --sumi-ease-in:      cubic-bezier(0.32, 0, 0.67, 0);
-  --sumi-ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);
-  --sumi-ease-bounce:  var(--sumi-ease-rebond);
-  --sumi-ease-spring:  cubic-bezier(0.175, 0.885, 0.32, 1.1);
-
-  --sumi-transition-colors:    color var(--sumi-motion-trait) var(--sumi-ease-goutte),
-                               background-color var(--sumi-motion-trait) var(--sumi-ease-goutte),
-                               border-color var(--sumi-motion-trait) var(--sumi-ease-goutte);
-  --sumi-transition-opacity:   opacity var(--sumi-motion-trait) var(--sumi-ease-goutte);
-  --sumi-transition-transform: transform var(--sumi-motion-lavis) var(--sumi-ease-trait);
-  --sumi-transition-shadow:    box-shadow var(--sumi-motion-trait) var(--sumi-ease-goutte);
-
-  /* ═══ Z-INDEX ═══ */
-  --sumi-z-base:     0;
-  --sumi-z-raised:   10;
-  --sumi-z-dropdown: 100;
-  --sumi-z-sticky:   200;
-  --sumi-z-overlay:  300;
-  --sumi-z-modal:    400;
-  --sumi-z-popover:  500;
-  --sumi-z-toast:    600;
-  --sumi-z-tooltip:  700;
-  --sumi-z-max:      999;
-
-  /* ═══ LAYOUT ═══ */
-  --sumi-max-width:         1400px;
-  --sumi-max-width-content: 1200px;
-  --sumi-max-width-narrow:  800px;
-  --sumi-max-width-prose:   65ch;
-  --sumi-sidebar-width:     240px;
-  --sumi-sidebar-collapsed: 64px;
-  --sumi-header-height:     56px;
-  --sumi-player-height:     80px;
+  /* Non-prefixed legacy aliases (Tailwind utilities still reference these — KEEP) */
+  --duration-fast:   var(--sumi-motion-trait);
+  --duration-normal: var(--sumi-motion-lavis);
 
   /* ═══ CONTEXTUAL ACCENTS (feature-specific) ═══ */
   --graffiti-magenta: #a04050;
@@ -448,7 +323,7 @@
   --sumi-scrollbar-thumb: rgba(26,26,30, 0.08);
   --sumi-scrollbar-hover: rgba(26,26,30, 0.16);
 
-  --sumi-grain-opacity:    0.06;
+  /* --sumi-grain-opacity overridden via tokens-light.css (see semantic/light.json) */
 
   --primary-foreground: #F2EDE6;
 }
diff --git a/packages/design-system/tokens/primitive/color.json b/packages/design-system/tokens/primitive/color.json
index f000e6e80..3f0f571ab 100644
--- a/packages/design-system/tokens/primitive/color.json
+++ b/packages/design-system/tokens/primitive/color.json
@@ -40,6 +40,22 @@
       "hover":  { "$value": "#c8960b", "$type": "color" },
       "subtle": { "$value": "rgba(184,134,11, 0.08)", "$type": "color" }
     },
+    "vermillion-ink": {
+      "_comment": "Vermillion ink (NOT viz vermillion #d4634a). Used for live indicators, hanko-like seals.",
+      "base":    { "$value": "#a04050", "$type": "color", "$description": "朱 — vermillion ink" },
+      "hover":   { "$value": "#b05060", "$type": "color" },
+      "subtle":  { "$value": "rgba(160,64,80, 0.10)", "$type": "color" }
+    },
+    "ai": {
+      "base": { "$value": "#2a4e68", "$type": "color", "$description": "藍 — indigo (deep)" }
+    },
+    "contextual": {
+      "_comment": "Feature-specific accents (NOT brand UI accent — cyan reigns supreme per charte §4.4 rule 3)",
+      "graffiti-magenta": { "$value": "#a04050", "$type": "color" },
+      "gaming-gold":      { "$value": "#b8860b", "$type": "color" },
+      "terminal-green":   { "$value": "#4f6840", "$type": "color" },
+      "sakura":           { "$value": "#d4a0b0", "$type": "color" }
+    },
     "viz": {
       "_comment": "Data viz palette ONLY (charts, waveforms, analytics). Forbidden in standard UI per CHARTE_GRAPHIQUE_TALAS §4.5",
       "indigo":     { "$value": "#7c9dd6", "$type": "color", "$description": "Data viz pigment — indigo" },
@@ -68,6 +84,7 @@
       "ink-20":  { "$value": "rgba(26,26,30, 0.20)",  "$type": "color" },
       "ivory-03":{ "$value": "rgba(232,227,219, 0.03)", "$type": "color", "$description": "Ivory border — faint" },
       "ivory-06":{ "$value": "rgba(232,227,219, 0.06)", "$type": "color" },
+      "ivory-08":{ "$value": "rgba(232,227,219, 0.08)", "$type": "color" },
       "ivory-10":{ "$value": "rgba(232,227,219, 0.10)", "$type": "color" }
     }
   }
diff --git a/packages/design-system/tokens/semantic/dark.json b/packages/design-system/tokens/semantic/dark.json
index 967f2ca78..d883af636 100644
--- a/packages/design-system/tokens/semantic/dark.json
+++ b/packages/design-system/tokens/semantic/dark.json
@@ -1,6 +1,7 @@
 {
   "sumi": {
-    "_comment": "Semantic tokens — dark theme (default :root). Tous les refs pointent vers tokens/primitive/.",
+    "_comment": "Semantic tokens — dark theme (default :root). Comprehensive coverage of all --sumi-* vars formerly hardcoded in apps/web/src/index.css.",
+
     "bg": {
       "void":    { "$value": "{color.void.base}",    "$type": "color" },
       "base":    { "$value": "{color.void.base}",    "$type": "color" },
@@ -23,47 +24,209 @@
       "focus":   { "$value": "{color.mizu.focus}",     "$type": "color" },
       "accent":  { "$value": "{color.mizu.border}",    "$type": "color" }
     },
-    "text": {
-      "primary":   { "$value": "{color.washi.kinari}", "$type": "color" },
-      "secondary": { "$value": "{color.ink.gin}",      "$type": "color" },
-      "tertiary":  { "$value": "{color.ink.hai}",      "$type": "color" },
-      "disabled":  { "$value": "{color.ink.usuzumi}",  "$type": "color" },
-      "inverse":   { "$value": "{color.washi.shiro}",  "$type": "color" },
-      "link":      { "$value": "{color.mizu.base}",    "$type": "color" }
-    },
-    "accent": {
-      "default":  { "$value": "{color.mizu.base}",   "$type": "color" },
-      "hover":    { "$value": "{color.mizu.hover}",  "$type": "color" },
-      "active":   { "$value": "{color.mizu.active}", "$type": "color" },
-      "muted":    { "$value": "{color.mizu.muted}",  "$type": "color" },
-      "subtle":   { "$value": "{color.mizu.subtle}", "$type": "color" },
-      "emphasis": { "$value": "{color.mizu.deep}",   "$type": "color", "$description": "Pour texte normal AA" }
-    },
     "viz": {
-      "_comment": "Data viz uniquement (charts, waveforms, analytics)",
+      "_comment": "Data viz uniquement (charts, waveforms, analytics) — charte §4.5",
       "indigo":     { "$value": "{color.viz.indigo}",     "$type": "color" },
       "vermillion": { "$value": "{color.viz.vermillion}", "$type": "color" },
       "sage":       { "$value": "{color.viz.sage}",       "$type": "color" },
       "gold":       { "$value": "{color.viz.gold}",       "$type": "color" },
       "neutral":    { "$value": "{color.viz.neutral}",    "$type": "color" }
     },
-    "feedback": {
-      "success":         { "$value": "{color.functional.sage-diluted}",  "$type": "color" },
-      "success-hover":   { "$value": "{color.functional.sage-hover}",    "$type": "color" },
-      "success-subtle":  { "$value": "{color.functional.sage-subtle}",   "$type": "color" },
-      "error":           { "$value": "{color.functional.brick-diluted}", "$type": "color" },
-      "error-hover":     { "$value": "{color.functional.brick-hover}",   "$type": "color" },
-      "error-subtle":    { "$value": "{color.functional.brick-subtle}",  "$type": "color" },
-      "warning":         { "$value": "{color.functional.amber-diluted}", "$type": "color" },
-      "warning-hover":   { "$value": "{color.functional.amber-hover}",   "$type": "color" },
-      "warning-subtle":  { "$value": "{color.functional.amber-subtle}",  "$type": "color" },
-      "info":            { "$value": "{color.mizu.base}",                "$type": "color" }
+    "ink": {
+      "_comment": "墨の六色 — Six tones of ink (theme-independent backward-compat aliases)",
+      "kuro":    { "$value": "{color.ink.kuro}",    "$type": "color" },
+      "sumi":    { "$value": "{color.ink.sumi}",    "$type": "color" },
+      "usuzumi": { "$value": "{color.ink.usuzumi}", "$type": "color" },
+      "hai":     { "$value": "{color.ink.hai}",     "$type": "color" },
+      "gin":     { "$value": "{color.ink.gin}",     "$type": "color" },
+      "kasumi":  { "$value": "{color.ink.kasumi}",  "$type": "color" }
     },
-    "kin": {
-      "base":   { "$value": "{color.kin.base}",   "$type": "color" },
-      "hover":  { "$value": "{color.kin.hover}",  "$type": "color" },
-      "subtle": { "$value": "{color.kin.subtle}", "$type": "color" },
-      "glow":   { "$value": "{shadow.kin}",       "$type": "shadow" }
-    }
+    "washi": {
+      "shiro":    { "$value": "{color.washi.shiro}",    "$type": "color" },
+      "kinari":   { "$value": "{color.washi.kinari}",   "$type": "color" },
+      "kinu":     { "$value": "{color.washi.kinu}",     "$type": "color" },
+      "torinoko": { "$value": "{color.washi.torinoko}", "$type": "color" },
+      "cha":      { "$value": "{color.washi.cha}",      "$type": "color" }
+    },
+
+    "text-primary":   { "$value": "{color.washi.kinari}", "$type": "color" },
+    "text-secondary": { "$value": "{color.ink.gin}",      "$type": "color" },
+    "text-tertiary":  { "$value": "{color.ink.hai}",      "$type": "color" },
+    "text-disabled":  { "$value": "{color.ink.usuzumi}",  "$type": "color" },
+    "text-inverse":   { "$value": "{color.washi.shiro}",  "$type": "color" },
+    "text-link":      { "$value": "{color.mizu.base}",    "$type": "color" },
+
+    "accent":          { "$value": "{color.mizu.base}",   "$type": "color" },
+    "accent-hover":    { "$value": "{color.mizu.hover}",  "$type": "color" },
+    "accent-active":   { "$value": "{color.mizu.active}", "$type": "color" },
+    "accent-muted":    { "$value": "{color.mizu.muted}",  "$type": "color" },
+    "accent-subtle":   { "$value": "{color.mizu.subtle}", "$type": "color" },
+    "accent-emphasis": { "$value": "{color.mizu.deep}",   "$type": "color", "$description": "Cyan profond — pour texte normal AA" },
+
+    "mizu": { "$value": "{color.mizu.base}", "$type": "color", "$description": "Backward-compat alias — 水" },
+    "ai":   { "$value": "{color.ai.base}",   "$type": "color", "$description": "藍 — indigo deep" },
+
+    "kin":         { "$value": "{color.kin.base}",   "$type": "color" },
+    "kin-hover":   { "$value": "{color.kin.hover}",  "$type": "color" },
+    "kin-subtle":  { "$value": "{color.kin.subtle}", "$type": "color" },
+
+    "vermillion":         { "$value": "{color.vermillion-ink.base}",   "$type": "color" },
+    "vermillion-hover":   { "$value": "{color.vermillion-ink.hover}",  "$type": "color" },
+    "vermillion-subtle":  { "$value": "{color.vermillion-ink.subtle}", "$type": "color" },
+
+    "sage":         { "$value": "{color.functional.sage-diluted}", "$type": "color" },
+    "sage-hover":   { "$value": "{color.functional.sage-hover}",   "$type": "color" },
+    "sage-subtle":  { "$value": "{color.functional.sage-subtle}",  "$type": "color" },
+
+    "gold":         { "$value": "{color.functional.amber-diluted}", "$type": "color" },
+    "gold-hover":   { "$value": "{color.functional.amber-hover}",   "$type": "color" },
+    "gold-subtle":  { "$value": "{color.functional.amber-subtle}",  "$type": "color" },
+
+    "error":         { "$value": "{color.functional.brick-diluted}", "$type": "color" },
+    "error-hover":   { "$value": "{color.functional.brick-hover}",   "$type": "color" },
+    "error-subtle":  { "$value": "{color.functional.brick-subtle}",  "$type": "color" },
+
+    "success":         { "$value": "{color.functional.sage-diluted}", "$type": "color" },
+    "success-subtle":  { "$value": "{color.functional.sage-subtle}",  "$type": "color" },
+    "warning":         { "$value": "{color.functional.amber-diluted}", "$type": "color" },
+    "warning-subtle":  { "$value": "{color.functional.amber-subtle}",  "$type": "color" },
+    "error-semantic":         { "$value": "{color.functional.brick-diluted}", "$type": "color" },
+    "error-semantic-subtle":  { "$value": "{color.functional.brick-subtle}",  "$type": "color" },
+    "info":            { "$value": "{color.mizu.base}",  "$type": "color" },
+    "live":            { "$value": "{color.functional.brick-diluted}", "$type": "color" },
+    "online":          { "$value": "{color.functional.sage-diluted}",  "$type": "color" },
+
+    "glass-bg":     { "$value": "rgba(13,13,15, 0.80)",       "$type": "color", "$description": "Shoji screen — dark theme" },
+    "glass-border": { "$value": "{color.alpha.ivory-06}",     "$type": "color" },
+    "glass-blur":   { "$value": "12px",                       "$type": "dimension" },
+
+    "scrollbar-track": { "$value": "transparent",              "$type": "color" },
+    "scrollbar-thumb": { "$value": "{color.alpha.ivory-06}",   "$type": "color" },
+    "scrollbar-hover": { "$value": "{color.alpha.ivory-10}",   "$type": "color" },
+
+    "shadow-xs":      { "$value": "0 0 4px rgba(26,26,30, 0.03)",                             "$type": "shadow" },
+    "shadow-sm":      { "$value": "0 0 8px rgba(26,26,30, 0.05)",                             "$type": "shadow" },
+    "shadow-md":      { "$value": "0 0 16px rgba(26,26,30, 0.08)",                            "$type": "shadow" },
+    "shadow-lg":      { "$value": "0 0 24px rgba(26,26,30, 0.10)",                            "$type": "shadow" },
+    "shadow-xl":      { "$value": "0 0 32px rgba(26,26,30, 0.15)",                            "$type": "shadow" },
+    "shadow-2xl":     { "$value": "0 0 48px rgba(26,26,30, 0.20)",                            "$type": "shadow" },
+    "shadow-glow":    { "$value": "0 0 0 3px rgba(0,152,181, 0.25)",                          "$type": "shadow" },
+    "shadow-glow-lg": { "$value": "0 0 20px rgba(0,152,181, 0.12)",                           "$type": "shadow" },
+    "shadow-kin":     { "$value": "0 0 16px rgba(184,134,11, 0.15)",                          "$type": "shadow" },
+
+    "font-body":    { "$value": "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif", "$type": "fontFamily" },
+    "font-heading": { "$value": "'Space Grotesk', system-ui, sans-serif",                             "$type": "fontFamily" },
+    "font-mono":    { "$value": "'JetBrains Mono', 'SF Mono', 'Consolas', monospace",                 "$type": "fontFamily" },
+    "font-serif":   { "$value": "'Space Grotesk', system-ui, sans-serif",                             "$type": "fontFamily" },
+
+    "text-4xl":  { "$value": "2.25rem",   "$type": "dimension" },
+    "text-3xl":  { "$value": "1.875rem",  "$type": "dimension" },
+    "text-2xl":  { "$value": "1.5rem",    "$type": "dimension" },
+    "text-xl":   { "$value": "1.25rem",   "$type": "dimension" },
+    "text-lg":   { "$value": "1.125rem",  "$type": "dimension" },
+    "text-md":   { "$value": "1rem",      "$type": "dimension" },
+    "text-base": { "$value": "0.875rem",  "$type": "dimension" },
+    "text-sm":   { "$value": "0.8125rem", "$type": "dimension" },
+    "text-xs":   { "$value": "0.75rem",   "$type": "dimension" },
+    "font-size-base": { "$value": "16px", "$type": "dimension" },
+
+    "leading-none":    { "$value": "1",     "$type": "number" },
+    "leading-tight":   { "$value": "1.25",  "$type": "number" },
+    "leading-snug":    { "$value": "1.375", "$type": "number" },
+    "leading-normal":  { "$value": "1.5",   "$type": "number" },
+    "leading-relaxed": { "$value": "1.625", "$type": "number" },
+    "leading-loose":   { "$value": "1.75",  "$type": "number" },
+
+    "tracking-tighter": { "$value": "-0.03em",  "$type": "dimension" },
+    "tracking-tight":   { "$value": "-0.015em", "$type": "dimension" },
+    "tracking-normal":  { "$value": "0",        "$type": "dimension" },
+    "tracking-wide":    { "$value": "0.025em",  "$type": "dimension" },
+    "tracking-wider":   { "$value": "0.05em",   "$type": "dimension" },
+    "tracking-widest":  { "$value": "0.2em",    "$type": "dimension" },
+
+    "weight-extralight": { "$value": "200", "$type": "fontWeight" },
+    "weight-light":      { "$value": "300", "$type": "fontWeight" },
+    "weight-regular":    { "$value": "400", "$type": "fontWeight" },
+    "weight-medium":     { "$value": "500", "$type": "fontWeight" },
+    "weight-semibold":   { "$value": "600", "$type": "fontWeight" },
+    "weight-bold":       { "$value": "700", "$type": "fontWeight" },
+
+    "space-0-5": { "$value": "2px",  "$type": "dimension" },
+    "space-1":   { "$value": "4px",  "$type": "dimension" },
+    "space-1-5": { "$value": "6px",  "$type": "dimension" },
+    "space-2":   { "$value": "8px",  "$type": "dimension" },
+    "space-2-5": { "$value": "10px", "$type": "dimension" },
+    "space-3":   { "$value": "12px", "$type": "dimension" },
+    "space-4":   { "$value": "16px", "$type": "dimension" },
+    "space-5":   { "$value": "20px", "$type": "dimension" },
+    "space-6":   { "$value": "24px", "$type": "dimension" },
+    "space-8":   { "$value": "32px", "$type": "dimension" },
+    "space-10":  { "$value": "40px", "$type": "dimension" },
+    "space-12":  { "$value": "48px", "$type": "dimension" },
+    "space-16":  { "$value": "64px", "$type": "dimension" },
+    "space-20":  { "$value": "80px", "$type": "dimension" },
+
+    "radius-xs":   { "$value": "2px",    "$type": "dimension" },
+    "radius-sm":   { "$value": "4px",    "$type": "dimension" },
+    "radius-md":   { "$value": "8px",    "$type": "dimension" },
+    "radius-lg":   { "$value": "12px",   "$type": "dimension" },
+    "radius-xl":   { "$value": "16px",   "$type": "dimension" },
+    "radius-2xl":  { "$value": "20px",   "$type": "dimension" },
+    "radius-full": { "$value": "9999px", "$type": "dimension" },
+
+    "z-base":     { "$value": "0",   "$type": "number" },
+    "z-raised":   { "$value": "10",  "$type": "number" },
+    "z-dropdown": { "$value": "100", "$type": "number" },
+    "z-sticky":   { "$value": "200", "$type": "number" },
+    "z-overlay":  { "$value": "300", "$type": "number" },
+    "z-modal":    { "$value": "400", "$type": "number" },
+    "z-popover":  { "$value": "500", "$type": "number" },
+    "z-toast":    { "$value": "600", "$type": "number" },
+    "z-tooltip":  { "$value": "700", "$type": "number" },
+    "z-max":      { "$value": "999", "$type": "number" },
+
+    "motion-goutte": { "$value": "100ms", "$type": "duration", "$description": "滴 — drop" },
+    "motion-trait":  { "$value": "150ms", "$type": "duration", "$description": "筆 — stroke" },
+    "motion-lavis":  { "$value": "250ms", "$type": "duration", "$description": "墨 — wash" },
+    "motion-vague":  { "$value": "350ms", "$type": "duration", "$description": "波 — wave" },
+    "motion-maree":  { "$value": "450ms", "$type": "duration", "$description": "潮 — tide" },
+
+    "duration-instant": { "$value": "100ms", "$type": "duration" },
+    "duration-fast":    { "$value": "150ms", "$type": "duration" },
+    "duration-normal":  { "$value": "250ms", "$type": "duration" },
+    "duration-slow":    { "$value": "350ms", "$type": "duration" },
+    "duration-slower":  { "$value": "450ms", "$type": "duration" },
+
+    "ease-goutte":  { "$value": "cubic-bezier(0.25, 0.1, 0.25, 1)",   "$type": "cubicBezier" },
+    "ease-trait":   { "$value": "cubic-bezier(0.33, 1, 0.68, 1)",     "$type": "cubicBezier" },
+    "ease-lavis":   { "$value": "cubic-bezier(0.25, 0.8, 0.25, 1)",   "$type": "cubicBezier" },
+    "ease-vague":   { "$value": "cubic-bezier(0.16, 1, 0.3, 1)",      "$type": "cubicBezier" },
+    "ease-maree":   { "$value": "cubic-bezier(0.33, 1, 0.68, 1)",     "$type": "cubicBezier" },
+    "ease-rebond":  { "$value": "cubic-bezier(0.34, 1.56, 0.64, 1)",  "$type": "cubicBezier" },
+    "ease-default": { "$value": "cubic-bezier(0.25, 0.1, 0.25, 1)",   "$type": "cubicBezier" },
+    "ease-out":     { "$value": "cubic-bezier(0.33, 1, 0.68, 1)",     "$type": "cubicBezier" },
+    "ease-in":      { "$value": "cubic-bezier(0.32, 0, 0.67, 0)",     "$type": "cubicBezier" },
+    "ease-in-out":  { "$value": "cubic-bezier(0.65, 0, 0.35, 1)",     "$type": "cubicBezier" },
+    "ease-bounce":  { "$value": "cubic-bezier(0.34, 1.56, 0.64, 1)",  "$type": "cubicBezier" },
+    "ease-spring":  { "$value": "cubic-bezier(0.175, 0.885, 0.32, 1.1)", "$type": "cubicBezier" },
+
+    "transition-colors":    { "$value": "color 150ms cubic-bezier(0.25, 0.1, 0.25, 1), background-color 150ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 150ms cubic-bezier(0.25, 0.1, 0.25, 1)", "$type": "transition" },
+    "transition-opacity":   { "$value": "opacity 150ms cubic-bezier(0.25, 0.1, 0.25, 1)",                                                                                                            "$type": "transition" },
+    "transition-transform": { "$value": "transform 250ms cubic-bezier(0.33, 1, 0.68, 1)",                                                                                                             "$type": "transition" },
+    "transition-shadow":    { "$value": "box-shadow 150ms cubic-bezier(0.25, 0.1, 0.25, 1)",                                                                                                          "$type": "transition" },
+
+    "max-width":         { "$value": "1400px", "$type": "dimension" },
+    "max-width-content": { "$value": "1200px", "$type": "dimension" },
+    "max-width-narrow":  { "$value": "800px",  "$type": "dimension" },
+    "max-width-prose":   { "$value": "65ch",   "$type": "dimension" },
+    "sidebar-width":     { "$value": "240px",  "$type": "dimension" },
+    "sidebar-collapsed": { "$value": "64px",   "$type": "dimension" },
+    "header-height":     { "$value": "56px",   "$type": "dimension" },
+    "player-height":     { "$value": "80px",   "$type": "dimension" },
+
+    "patina-warmth":         { "$value": "0deg", "$type": "other", "$description": "Runtime state — overridden by ThemeProvider based on account age" },
+    "grain-opacity":         { "$value": "0.04", "$type": "number" },
+    "circadian-warmth":      { "$value": "0deg", "$type": "other", "$description": "Runtime state — overridden by ThemeProvider based on time of day" },
+    "circadian-brightness":  { "$value": "1",    "$type": "number" }
   }
 }
diff --git a/packages/design-system/tokens/semantic/light.json b/packages/design-system/tokens/semantic/light.json
index 5e70c8e15..949ec8fd4 100644
--- a/packages/design-system/tokens/semantic/light.json
+++ b/packages/design-system/tokens/semantic/light.json
@@ -1,6 +1,7 @@
 {
   "sumi": {
-    "_comment": "Semantic tokens — light theme ([data-theme=\"light\"]). Washi paper aesthetic.",
+    "_comment": "Light theme overrides — washi paper aesthetic ([data-theme=\"light\"]). Only theme-DEPENDENT tokens; the rest inherits from dark.json :root selector.",
+
     "bg": {
       "void":    { "$value": "{color.washi.shiro}",    "$type": "color" },
       "base":    { "$value": "{color.washi.shiro}",    "$type": "color" },
@@ -23,46 +24,27 @@
       "focus":   { "$value": "{color.mizu.focus}",   "$type": "color" },
       "accent":  { "$value": "{color.mizu.border}",  "$type": "color" }
     },
-    "text": {
-      "primary":   { "$value": "{color.ink.sumi}",     "$type": "color" },
-      "secondary": { "$value": "{color.ink.gin}",      "$type": "color" },
-      "tertiary":  { "$value": "{color.ink.hai}",      "$type": "color" },
-      "disabled":  { "$value": "{color.ink.kasumi}",   "$type": "color" },
-      "inverse":   { "$value": "{color.washi.kinari}", "$type": "color" },
-      "link":      { "$value": "{color.mizu.deep}",    "$type": "color", "$description": "Cyan profond pour AA en mode jour" }
-    },
-    "accent": {
-      "default":  { "$value": "{color.mizu.base}",   "$type": "color" },
-      "hover":    { "$value": "{color.mizu.active}", "$type": "color" },
-      "active":   { "$value": "{color.mizu.deep}",   "$type": "color" },
-      "muted":    { "$value": "{color.mizu.muted}",  "$type": "color" },
-      "subtle":   { "$value": "{color.mizu.subtle}", "$type": "color" },
-      "emphasis": { "$value": "{color.mizu.deep}",   "$type": "color" }
-    },
-    "viz": {
-      "indigo":     { "$value": "{color.viz.indigo}",     "$type": "color" },
-      "vermillion": { "$value": "{color.viz.vermillion}", "$type": "color" },
-      "sage":       { "$value": "{color.viz.sage}",       "$type": "color" },
-      "gold":       { "$value": "{color.viz.gold}",       "$type": "color" },
-      "neutral":    { "$value": "{color.viz.neutral}",    "$type": "color" }
-    },
-    "feedback": {
-      "success":        { "$value": "{color.functional.sage-diluted}",  "$type": "color" },
-      "success-hover":  { "$value": "{color.functional.sage-hover}",    "$type": "color" },
-      "success-subtle": { "$value": "{color.functional.sage-subtle}",   "$type": "color" },
-      "error":          { "$value": "{color.functional.brick-diluted}", "$type": "color" },
-      "error-hover":    { "$value": "{color.functional.brick-hover}",   "$type": "color" },
-      "error-subtle":   { "$value": "{color.functional.brick-subtle}",  "$type": "color" },
-      "warning":        { "$value": "{color.functional.amber-diluted}", "$type": "color" },
-      "warning-hover":  { "$value": "{color.functional.amber-hover}",   "$type": "color" },
-      "warning-subtle": { "$value": "{color.functional.amber-subtle}",  "$type": "color" },
-      "info":           { "$value": "{color.mizu.base}",                "$type": "color" }
-    },
-    "kin": {
-      "base":   { "$value": "{color.kin.base}",   "$type": "color" },
-      "hover":  { "$value": "{color.kin.hover}",  "$type": "color" },
-      "subtle": { "$value": "{color.kin.subtle}", "$type": "color" },
-      "glow":   { "$value": "{shadow.kin}",       "$type": "shadow" }
-    }
+
+    "text-primary":   { "$value": "{color.ink.sumi}",     "$type": "color" },
+    "text-secondary": { "$value": "{color.ink.gin}",      "$type": "color" },
+    "text-tertiary":  { "$value": "{color.ink.hai}",      "$type": "color" },
+    "text-disabled":  { "$value": "{color.ink.kasumi}",   "$type": "color" },
+    "text-inverse":   { "$value": "{color.washi.kinari}", "$type": "color" },
+    "text-link":      { "$value": "{color.mizu.deep}",    "$type": "color", "$description": "Cyan profond pour AA en mode jour" },
+
+    "accent":          { "$value": "{color.mizu.base}",   "$type": "color" },
+    "accent-hover":    { "$value": "{color.mizu.active}", "$type": "color" },
+    "accent-active":   { "$value": "{color.mizu.deep}",   "$type": "color" },
+    "accent-muted":    { "$value": "{color.mizu.muted}",  "$type": "color" },
+    "accent-subtle":   { "$value": "{color.mizu.subtle}", "$type": "color" },
+    "accent-emphasis": { "$value": "{color.mizu.deep}",   "$type": "color" },
+
+    "glass-bg":     { "$value": "rgba(242,237,230, 0.85)", "$type": "color", "$description": "Shoji screen — light theme washi" },
+    "glass-border": { "$value": "{color.alpha.ink-04}",    "$type": "color" },
+
+    "scrollbar-thumb": { "$value": "{color.alpha.ink-08}", "$type": "color" },
+    "scrollbar-hover": { "$value": "{color.alpha.ink-12}", "$type": "color" },
+
+    "grain-opacity": { "$value": "0.06", "$type": "number", "$description": "Grain plus prononcé sur papier washi" }
   }
 }