/* Warm Graphite & Aged Bronze. All material values and future asset slots live here. */
:root {
  --mg-graphite-deep: #1B1816;
  --mg-graphite: #24221F;
  --mg-slate: #2E2924;
  --mg-umber: #3A2D24;
  --mg-walnut-dark: #443120;
  --mg-walnut: #684B30;
  --mg-walnut-secondary: #4A3523;
  --mg-bronze: #A7804C;
  --mg-brass: #B8925A;
  --mg-amber: #D3A262;
  --mg-parchment: #E2D3AE;
  --mg-parchment-dim: #D6C39A;
  --mg-ink: #2A2118;
  --mg-success: #68734A;
  --mg-warning: #9A7A46;
  --mg-danger: #8A4238;
  --mg-info: #60717A;
  --mg-text-main: #E2D3AE;
  --mg-text-muted: #B8AA8D;
  --mg-text-dark: #2A2118;
  --mg-shadow-soft: rgba(0,0,0,.30);
  --mg-shadow-deep: rgba(0,0,0,.50);
  --mg-glow-amber: rgba(211,162,98,.50);
  --mg-border-muted: rgba(167,128,76,.25);
  --mg-ink-muted: rgba(42,33,24,.70);
  /* Solid tint over handbook textures: lower values reveal more material. */
  --mg-journal-material-tint: 55%;
  --mg-slot-empty: color-mix(in srgb, var(--mg-graphite-deep) 80%, black);
  --mg-slot-border-empty: color-mix(in srgb, var(--mg-bronze) 18%, var(--mg-slot-empty));
  --mg-slot-border-filled: color-mix(in srgb, var(--mg-bronze) 45%, var(--mg-graphite-deep));
  --mg-surface-window: linear-gradient(color-mix(in srgb,var(--mg-slate) 55%,transparent),color-mix(in srgb,var(--mg-slate) 55%,transparent)), var(--mg-image-slate) repeat var(--mg-slate);
  --mg-surface-chrome: linear-gradient(color-mix(in srgb,var(--mg-graphite) 55%,transparent),color-mix(in srgb,var(--mg-graphite) 55%,transparent)), var(--mg-image-graphite) repeat var(--mg-graphite);
  --mg-surface-panel: linear-gradient(color-mix(in srgb,var(--mg-graphite) 72%,transparent),color-mix(in srgb,var(--mg-graphite) 72%,transparent)), var(--mg-image-graphite) repeat var(--mg-graphite);
  --mg-surface-recessed: linear-gradient(color-mix(in srgb,var(--mg-graphite-deep) 75%,transparent),color-mix(in srgb,var(--mg-graphite-deep) 75%,transparent)), var(--mg-image-recessed) repeat var(--mg-graphite-deep);
  --mg-surface-document: linear-gradient(color-mix(in srgb,var(--mg-parchment) 78%,transparent),color-mix(in srgb,var(--mg-parchment) 78%,transparent)), var(--mg-image-parchment) repeat var(--mg-parchment);
  --mg-image-graphite: url('/assets/ui/backgrounds/ui_bg_graphite_tile.png');
  --mg-image-slate: url('/assets/ui/backgrounds/ui_bg_slate_tile.png');
  --mg-image-recessed: url('/assets/ui/backgrounds/ui_bg_recessed_tile.png');
  --mg-image-parchment: url('/assets/ui/parchment/ui_parchment_tile.png');
  --mg-image-primary: url('/assets/ui/buttons/ui_button_primary.png');
  --mg-image-secondary: url('/assets/ui/buttons/ui_button_secondary.png');
  --mg-image-selection-hover: url('/assets/ui/selection/ui_selection_hover.png');
  --mg-image-selection-selected: url('/assets/ui/selection/ui_selection_selected.png');
  --mg-image-divider-bronze: url('/assets/ui/dividers/ui_divider_bronze.png');
  --mg-image-divider-subtle: url('/assets/ui/dividers/ui_divider_subtle.png');
  --mg-image-checkbox-empty: url('/assets/ui/controls/ui_checkbox_empty.png');
  --mg-image-checkbox-checked: url('/assets/ui/controls/ui_checkbox_checked.png');
  --mg-image-slider-track: url('/assets/ui/controls/ui_slider_track.png');
  --mg-image-slider-thumb: url('/assets/ui/controls/ui_slider_thumb.png');
  --mg-image-slot: url('/assets/ui/slots/ui_slot_dark.png');
  --mg-image-frame-corner: url('/assets/ui/frames/ui_frame_bronze_corner.png');
  --mg-image-frame-strip: url('/assets/ui/frames/ui_frame_bronze_strip.png');
  --ui-bg-main: var(--mg-graphite-deep);
  --ui-bg-panel: var(--mg-slate);
  --ui-bg-soft: var(--mg-border-muted);
  --ui-border: var(--mg-border-muted);
  --ui-border-strong: var(--mg-bronze);
  --ui-text: var(--mg-text-main);
  --ui-text-muted: var(--mg-text-muted);
  --ui-accent: var(--mg-amber);
  --ui-accent-soft: var(--mg-parchment-dim);
  --ui-shadow: 0 4px 12px var(--mg-shadow-soft);
  /* Compatibility aliases retain existing menu markup and geometry. */
  --material-wood: var(--mg-surface-chrome);
  --material-wood-horizontal: var(--material-wood);
  --material-wood-deep: var(--mg-surface-recessed);
  --material-stone: var(--mg-surface-window);
  --material-parchment: var(--mg-surface-document);
  --material-leather: linear-gradient(var(--mg-walnut),var(--mg-walnut-dark));
  --material-leather-hover: linear-gradient(var(--mg-walnut),var(--mg-walnut-dark));
  --material-brass: linear-gradient(var(--mg-brass),var(--mg-bronze));
  --material-ink: var(--mg-ink);
  --material-brass-color: var(--mg-bronze);
  --material-brass-bright: var(--mg-amber);
  --material-shadow: 0 6px 18px var(--mg-shadow-deep);
  --material-shadow-soft: 0 4px 12px var(--mg-shadow-soft);
}
