:root {
  color-scheme: dark;

  /* === Backgrounds (self-introduction 準拠: 上質なチャコールグレー) === */
  --color-bg:        #2A2A2E;
  --color-surface:   #34343A;
  --color-surface-2: #3E3E46;
  --color-surface-3: #484852;

  /* エイリアス */
  --bg-primary:       var(--color-bg);
  --bg-secondary:     var(--color-surface);
  --bg-card:          var(--color-surface);
  --bg-card-hover:    var(--color-surface-2);
  --bg-card-elevated: var(--color-surface-2);
  --bg-input:         #232327;
  --bg-modal-overlay: rgba(26, 26, 30, 0.82);

  /* === Text (ニアホワイト & クールミュート) === */
  --color-text:       #F5F5F7;
  --color-text-muted: #A0A0A8;

  --text-primary:     var(--color-text);
  --text-secondary:   #D1D1D8;
  --text-muted:       var(--color-text-muted);

  /* === Sage / Matcha Green Accent (self-introduction シグネチャー) === */
  --color-matcha:       #7AB87A;
  --color-matcha-light: #94CC94;
  --color-matcha-deep:  #5A945A;
  --color-matcha-subtle: rgba(122, 184, 122, 0.16);

  --matcha:        var(--color-matcha);
  --matcha-hover:  var(--color-matcha-light);
  --matcha-subtle: var(--color-matcha-subtle);

  /* === Primary Accents === */
  --accent-primary:        var(--color-matcha);
  --accent-primary-hover:  var(--color-matcha-light);
  --accent-primary-subtle: var(--color-matcha-subtle);

  /* === Borders === */
  --color-line:        #4A4A52;
  --color-line-strong: #5A5A64;

  --border-color:   var(--color-line);
  --border-subtle:  #3E3E46;
  --border-hover:   var(--color-line-strong);
  --border-focus:   var(--color-matcha);

  /* === Status Colors (洗練されたトーン) === */
  --danger:         #F45B69;
  --danger-hover:   #FF7582;
  --danger-bg:      rgba(244, 91, 105, 0.14);
  --danger-border:  rgba(244, 91, 105, 0.35);

  --warning:        #E5A93C;
  --warning-hover:  #F5BD55;
  --warning-bg:     rgba(229, 169, 60, 0.14);
  --warning-border: rgba(229, 169, 60, 0.35);

  --success:        #7AB87A;
  --success-hover:  #94CC94;
  --success-bg:     rgba(122, 184, 122, 0.14);
  --success-border: rgba(122, 184, 122, 0.35);

  --info:           #64B5F6;
  --info-bg:        rgba(100, 181, 246, 0.14);
  --info-border:    rgba(100, 181, 246, 0.35);

  /* === Japanese Motion Easing === */
  --ease-wa:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-wa-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  --transition-fast:   0.15s var(--ease-wa);
  --transition-normal: 0.25s var(--ease-wa);
  --transition-bounce: 0.35s var(--ease-wa-bounce);

  /* === Typography === */
  --font-display: "Zen Kaku Gothic New", sans-serif;
  --font-body:    "Noto Sans JP", sans-serif;
  --font-mono:    "JetBrains Mono", monospace;
  --font-sans:    "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;

  /* === Radius === */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-pill: 9999px;
  --radius:      8px;

  /* === Shadows & Lighting (のっぺり感を解消する奥行きライティング) === */
  --shadow-sm:     0 2px 6px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --shadow-md:     0 6px 18px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  --shadow-lg:     0 14px 36px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --shadow-card:   0 4px 16px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --shadow-focus:  0 0 0 3px rgba(122, 184, 122, 0.35);
  --glow-matcha:   0 0 20px rgba(122, 184, 122, 0.25);
}