/* HEL Core UI Style Pool v1
   Shared palette, mode and background visibility tokens for PEM, MBP, DIT and later HEL apps. */

.shell.mode-dark,
.shell.mode-light {
  --glow-accent: 0 0 13px var(--c-accent-glow);
  --shadow-panel: 0 0 34px rgba(0, 0, 0, .38);
  --shadow-tile: 0 0 21px rgba(0, 0, 0, .28);
}

.shell {
  --f-step-8: var(--f-mono, "IBM Plex Sans", sans-serif);
  --f-step-13: var(--f-body, "Space Grotesk", sans-serif);
  --f-step-21: var(--f-body, "Space Grotesk", sans-serif);
  --f-step-34: var(--f-display, "Wallpoet", sans-serif);
  --font-step-8: var(--font-mono-8, 8px);
  --font-step-13: var(--font-body-13, 13px);
  --font-step-21: var(--font-body-21, 21px);
  --font-step-34: var(--font-display-34, 34px);
  --font-step-8-height: var(--font-mono-8-height, 8px);
  --font-step-13-height: var(--font-body-13-height, 13px);
  --font-step-21-height: var(--font-body-21-height, 21px);
  --font-step-34-height: var(--font-display-34-height, 34px);
  --font-micro: var(--font-step-8);
  --font-ui: var(--font-step-13);
  --font-title: var(--font-step-21);
}

.shell.mode-dark { color-scheme: dark; }
.shell.mode-light { color-scheme: light; }

.shell.bg-opacity-0 { --bg-alpha: 0; --bg-layer-active: var(--bg-layer); }
.shell.bg-opacity-20 { --bg-alpha: .20; --bg-layer-active: var(--bg-layer); }
.shell.bg-opacity-40 { --bg-alpha: .40; --bg-layer-active: var(--bg-layer); }
.shell.bg-opacity-60 { --bg-alpha: .60; --bg-layer-active: var(--bg-layer); }
.shell.bg-opacity-80 { --bg-alpha: .80; --bg-layer-active: var(--bg-layer); }
.shell.bg-opacity-100 { --bg-alpha: 1; --bg-layer-active: var(--bg-layer); }

.shell.frame-opacity-0 { --frame-mix: 0%; }
.shell.frame-opacity-20 { --frame-mix: 20%; }
.shell.frame-opacity-40 { --frame-mix: 40%; }
.shell.frame-opacity-60 { --frame-mix: 60%; }
.shell.frame-opacity-80 { --frame-mix: 80%; }
.shell.frame-opacity-100 { --frame-mix: 100%; }

.shell.content-opacity-0 { --content-mix: 0%; }
.shell.content-opacity-20 { --content-mix: 20%; }
.shell.content-opacity-40 { --content-mix: 40%; }
.shell.content-opacity-60 { --content-mix: 60%; }
.shell.content-opacity-80 { --content-mix: 80%; }
.shell.content-opacity-100 { --content-mix: 100%; }

.shell.grid-opacity-0 { --grid-alpha: 0; }
.shell.grid-opacity-20 { --grid-alpha: .20; }
.shell.grid-opacity-40 { --grid-alpha: .40; }
.shell.grid-opacity-60 { --grid-alpha: .60; }
.shell.grid-opacity-80 { --grid-alpha: .80; }
.shell.grid-opacity-100 { --grid-alpha: 1; }

.shell.effect-opacity-0 { --effect-alpha: 0; }
.shell.effect-opacity-20 { --effect-alpha: .20; }
.shell.effect-opacity-40 { --effect-alpha: .40; }
.shell.effect-opacity-60 { --effect-alpha: .60; }
.shell.effect-opacity-80 { --effect-alpha: .80; }
.shell.effect-opacity-100 { --effect-alpha: 1; }

.shell.palette-field-ops.mode-dark { --c-bg:#05080D; --c-app:rgba(7,12,18,.90); --c-panel:rgba(10,17,25,.86); --c-surface:rgba(18,30,44,.78); --c-border:rgba(82,124,172,.30); --c-border-hi:rgba(100,166,238,.78); --c-text:#E3EAF0; --c-muted:#A5B8C8; --c-accent:#4C93F0; --c-accent-dim:rgba(76,147,240,.24); --c-accent-glow:rgba(76,147,240,.38); --c-ready:#5BA46B; --c-warn:#E0A23A; --c-danger:#C94B3F; --c-icon:#9FC7F2; --c-grid:rgba(82,124,172,.12); --c-overlay:rgba(3,6,10,.54); }
.shell.palette-field-ops.mode-light { --c-bg:#D5DEE7; --c-app:rgba(221,231,239,.94); --c-panel:rgba(199,215,229,.84); --c-surface:rgba(179,201,219,.70); --c-border:rgba(53,85,115,.26); --c-border-hi:rgba(44,111,177,.60); --c-text:#14202B; --c-muted:#52697C; --c-accent:#2D6FB1; --c-accent-dim:rgba(45,111,177,.18); --c-accent-glow:rgba(45,111,177,.22); --c-ready:#3F7C50; --c-warn:#A46C18; --c-danger:#A13C34; --c-icon:#285C8E; --c-grid:rgba(53,85,115,.12); --c-overlay:rgba(230,238,245,.18); }

.shell.palette-flecktarn.mode-dark { --c-bg:#050805; --c-app:rgba(5,9,5,.88); --c-panel:rgba(10,18,8,.86); --c-surface:rgba(19,32,12,.78); --c-border:rgba(126,158,64,.30); --c-border-hi:rgba(190,224,86,.78); --c-text:#E5E9C8; --c-muted:#AAB783; --c-accent:#B8D65A; --c-accent-dim:rgba(184,214,90,.26); --c-accent-glow:rgba(184,214,90,.38); --c-ready:#84A85D; --c-warn:#D69A35; --c-danger:#C9503E; --c-icon:#C6C78A; --c-grid:rgba(126,158,64,.13); --c-overlay:rgba(4,8,4,.52); }
.shell.palette-flecktarn.mode-light { --c-bg:#C9D0A8; --c-app:rgba(217,224,186,.92); --c-panel:rgba(192,203,151,.82); --c-surface:rgba(164,181,112,.64); --c-border:rgba(67,87,38,.24); --c-border-hi:rgba(93,126,44,.58); --c-text:#1C2614; --c-muted:#56663D; --c-accent:#5D7E2C; --c-accent-dim:rgba(93,126,44,.18); --c-accent-glow:rgba(93,126,44,.22); --c-ready:#557B3E; --c-warn:#996519; --c-danger:#96392F; --c-icon:#465F28; --c-grid:rgba(67,87,38,.11); --c-overlay:rgba(225,232,190,.18); }

.shell.palette-ddr-stripe.mode-dark { --c-bg:#070806; --c-app:rgba(8,10,8,.88); --c-panel:rgba(15,18,13,.86); --c-surface:rgba(26,29,20,.78); --c-border:rgba(134,143,110,.28); --c-border-hi:rgba(185,193,150,.72); --c-text:#E1DFC9; --c-muted:#ADB094; --c-accent:#B5C179; --c-accent-dim:rgba(181,193,121,.24); --c-accent-glow:rgba(181,193,121,.32); --c-ready:#7A9B5E; --c-warn:#D2A24A; --c-danger:#B94A36; --c-icon:#C3C79A; --c-grid:rgba(134,143,110,.11); --c-overlay:rgba(4,5,4,.48); }
.shell.palette-ddr-stripe.mode-light { --c-bg:#C9C9AE; --c-app:rgba(216,216,194,.92); --c-panel:rgba(189,192,160,.82); --c-surface:rgba(156,163,124,.62); --c-border:rgba(72,77,52,.24); --c-border-hi:rgba(105,115,67,.58); --c-text:#202316; --c-muted:#5A5F43; --c-accent:#687543; --c-accent-dim:rgba(104,117,67,.18); --c-accent-glow:rgba(104,117,67,.22); --c-ready:#5E7E45; --c-warn:#946A24; --c-danger:#913A30; --c-icon:#535D36; --c-grid:rgba(72,77,52,.11); --c-overlay:rgba(220,220,196,.16); }

.shell.palette-ukraine.mode-dark { --c-bg:#05080D; --c-app:rgba(7,12,18,.90); --c-panel:rgba(13,18,26,.86); --c-surface:rgba(20,28,42,.78); --c-border:rgba(82,114,160,.28); --c-border-hi:rgba(255,213,74,.74); --c-text:#E3E6EA; --c-muted:#A5AEC2; --c-accent:#FFD54A; --c-accent-dim:rgba(255,213,74,.24); --c-accent-glow:rgba(255,213,74,.36); --c-ready:#5BA46B; --c-warn:#E5B74A; --c-danger:#D64545; --c-icon:#C7D2E6; --c-grid:rgba(82,114,160,.11); --c-overlay:rgba(5,8,13,.50); }
.shell.palette-ukraine.mode-light { --c-bg:#D8DFE6; --c-app:rgba(228,234,240,.92); --c-panel:rgba(205,217,229,.82); --c-surface:rgba(184,202,220,.64); --c-border:rgba(45,71,106,.24); --c-border-hi:rgba(166,127,16,.62); --c-text:#162131; --c-muted:#526277; --c-accent:#A67F10; --c-accent-dim:rgba(166,127,16,.18); --c-accent-glow:rgba(166,127,16,.22); --c-ready:#467D51; --c-warn:#B07D18; --c-danger:#A23636; --c-icon:#2F5E96; --c-grid:rgba(45,71,106,.11); --c-overlay:rgba(230,237,244,.16); }

.shell.palette-arid.mode-dark { --c-bg:#130E08; --c-app:rgba(17,12,7,.86); --c-panel:rgba(34,24,13,.84); --c-surface:rgba(55,39,20,.74); --c-border:rgba(214,169,93,.30); --c-border-hi:rgba(242,199,116,.80); --c-text:#F0E1BE; --c-muted:#C9AD7B; --c-accent:#E0B45F; --c-accent-dim:rgba(224,180,95,.26); --c-accent-glow:rgba(224,180,95,.36); --c-ready:#9BA764; --c-warn:#E29A35; --c-danger:#B94A36; --c-icon:#D8C18A; --c-grid:rgba(214,169,93,.12); --c-overlay:rgba(20,12,5,.42); }
.shell.palette-arid.mode-light { --c-bg:#D4C1A0; --c-app:rgba(226,211,186,.92); --c-panel:rgba(202,181,145,.82); --c-surface:rgba(175,146,101,.58); --c-border:rgba(93,65,33,.24); --c-border-hi:rgba(128,82,32,.58); --c-text:#2A1E12; --c-muted:#67513A; --c-accent:#805220; --c-accent-dim:rgba(128,82,32,.18); --c-accent-glow:rgba(128,82,32,.22); --c-ready:#637A42; --c-warn:#A0631E; --c-danger:#8E3A2E; --c-icon:#5C3E1F; --c-grid:rgba(93,65,33,.10); --c-overlay:rgba(236,222,196,.14); }

.shell.palette-tigerstripe.mode-dark { --c-bg:#040604; --c-app:rgba(5,8,5,.90); --c-panel:rgba(9,14,7,.86); --c-surface:rgba(23,29,13,.78); --c-border:rgba(150,142,86,.30); --c-border-hi:rgba(232,203,88,.82); --c-text:#E8E1BE; --c-muted:#B7AD7A; --c-accent:#E0C85A; --c-accent-dim:rgba(224,200,90,.25); --c-accent-glow:rgba(224,200,90,.40); --c-ready:#7F9D58; --c-warn:#D48A32; --c-danger:#C34838; --c-icon:#D4C782; --c-grid:rgba(150,142,86,.12); --c-overlay:rgba(3,5,3,.54); }
.shell.palette-tigerstripe.mode-light { --c-bg:#CCC39A; --c-app:rgba(220,213,180,.92); --c-panel:rgba(192,181,133,.82); --c-surface:rgba(156,141,87,.62); --c-border:rgba(76,69,39,.24); --c-border-hi:rgba(122,96,24,.62); --c-text:#211E13; --c-muted:#605739; --c-accent:#7A6018; --c-accent-dim:rgba(122,96,24,.18); --c-accent-glow:rgba(122,96,24,.22); --c-ready:#5A783F; --c-warn:#9D5F1B; --c-danger:#94362D; --c-icon:#5C4B1D; --c-grid:rgba(76,69,39,.11); --c-overlay:rgba(226,219,188,.14); }

.shell.palette-cryptic.mode-dark { --c-bg:#060706; --c-app:rgba(7,8,6,.88); --c-panel:rgba(16,17,12,.86); --c-surface:rgba(27,29,18,.78); --c-border:rgba(172,154,91,.30); --c-border-hi:rgba(224,194,106,.78); --c-text:#E8E0C2; --c-muted:#B9AA78; --c-accent:#D8BC65; --c-accent-dim:rgba(216,188,101,.26); --c-accent-glow:rgba(216,188,101,.38); --c-ready:#7F9D58; --c-warn:#D99535; --c-danger:#B94A36; --c-icon:#CDBD82; --c-grid:rgba(172,154,91,.12); --c-overlay:rgba(4,5,4,.50); }
.shell.palette-cryptic.mode-light { --c-bg:#CEC3A3; --c-app:rgba(222,214,190,.92); --c-panel:rgba(198,185,146,.82); --c-surface:rgba(160,142,95,.58); --c-border:rgba(83,70,37,.24); --c-border-hi:rgba(132,101,35,.60); --c-text:#241E12; --c-muted:#65563A; --c-accent:#846523; --c-accent-dim:rgba(132,101,35,.18); --c-accent-glow:rgba(132,101,35,.22); --c-ready:#5D7C42; --c-warn:#A4661D; --c-danger:#913A30; --c-icon:#6A5425; --c-grid:rgba(83,70,37,.10); --c-overlay:rgba(232,224,202,.14); }

.shell.palette-woodland.mode-dark { --c-bg:#050604; --c-app:rgba(6,8,5,.88); --c-panel:rgba(13,17,9,.86); --c-surface:rgba(24,31,15,.78); --c-border:rgba(145,132,82,.30); --c-border-hi:rgba(206,188,105,.76); --c-text:#E7E1C2; --c-muted:#B5AA78; --c-accent:#CEBC69; --c-accent-dim:rgba(206,188,105,.25); --c-accent-glow:rgba(206,188,105,.36); --c-ready:#7F9D58; --c-warn:#D79534; --c-danger:#B94A36; --c-icon:#C7BA82; --c-grid:rgba(145,132,82,.12); --c-overlay:rgba(4,5,3,.52); }
.shell.palette-woodland.mode-light { --c-bg:#C7C09C; --c-app:rgba(218,213,185,.92); --c-panel:rgba(190,181,137,.82); --c-surface:rgba(154,140,90,.60); --c-border:rgba(70,61,36,.24); --c-border-hi:rgba(113,89,34,.58); --c-text:#211D12; --c-muted:#5D5438; --c-accent:#715922; --c-accent-dim:rgba(113,89,34,.18); --c-accent-glow:rgba(113,89,34,.22); --c-ready:#55783F; --c-warn:#9B6420; --c-danger:#8F382E; --c-icon:#59471E; --c-grid:rgba(70,61,36,.10); --c-overlay:rgba(226,221,193,.14); }

.shell.palette-atacs.mode-dark { --c-bg:#050706; --c-app:rgba(6,8,6,.88); --c-panel:rgba(13,16,11,.86); --c-surface:rgba(25,29,19,.78); --c-border:rgba(143,151,103,.28); --c-border-hi:rgba(190,197,134,.72); --c-text:#E1E0C8; --c-muted:#AEB191; --c-accent:#BFC784; --c-accent-dim:rgba(191,199,132,.24); --c-accent-glow:rgba(191,199,132,.34); --c-ready:#7F9D62; --c-warn:#D19A43; --c-danger:#B94A36; --c-icon:#C5C69A; --c-grid:rgba(143,151,103,.11); --c-overlay:rgba(4,6,4,.44); }
.shell.palette-atacs.mode-light { --c-bg:#C8CCB1; --c-app:rgba(219,223,202,.92); --c-panel:rgba(193,199,166,.82); --c-surface:rgba(157,168,128,.60); --c-border:rgba(65,74,52,.24); --c-border-hi:rgba(91,105,67,.58); --c-text:#1D2218; --c-muted:#56604A; --c-accent:#5B6943; --c-accent-dim:rgba(91,105,67,.18); --c-accent-glow:rgba(91,105,67,.22); --c-ready:#5C7E4A; --c-warn:#986C25; --c-danger:#913B31; --c-icon:#4F5D3B; --c-grid:rgba(65,74,52,.10); --c-overlay:rgba(226,230,210,.14); }

.shell.palette-urban-digital.mode-dark { --c-bg:#050709; --c-app:rgba(6,9,11,.90); --c-panel:rgba(11,16,19,.86); --c-surface:rgba(21,30,36,.78); --c-border:rgba(103,137,158,.28); --c-border-hi:rgba(142,188,218,.76); --c-text:#E0E8EA; --c-muted:#A4BAC4; --c-accent:#8ABCD8; --c-accent-dim:rgba(138,188,216,.24); --c-accent-glow:rgba(138,188,216,.36); --c-ready:#6FA36C; --c-warn:#D8A43A; --c-danger:#C24C44; --c-icon:#B7D2DE; --c-grid:rgba(103,137,158,.11); --c-overlay:rgba(3,6,8,.50); }
.shell.palette-urban-digital.mode-light { --c-bg:#CFD8DC; --c-app:rgba(224,232,236,.92); --c-panel:rgba(199,213,220,.82); --c-surface:rgba(172,193,204,.62); --c-border:rgba(55,78,92,.24); --c-border-hi:rgba(70,121,150,.60); --c-text:#172229; --c-muted:#546975; --c-accent:#467996; --c-accent-dim:rgba(70,121,150,.18); --c-accent-glow:rgba(70,121,150,.22); --c-ready:#4E7F54; --c-warn:#A36F1F; --c-danger:#993C37; --c-icon:#3E6D86; --c-grid:rgba(55,78,92,.10); --c-overlay:rgba(230,238,242,.14); }

.shell.palette-snow.mode-dark { --c-bg:#07090A; --c-app:rgba(7,9,10,.88); --c-panel:rgba(14,17,18,.86); --c-surface:rgba(28,34,36,.76); --c-border:rgba(158,176,184,.28); --c-border-hi:rgba(218,232,236,.72); --c-text:#EDF2F2; --c-muted:#B8C7CA; --c-accent:#D8E6EA; --c-accent-dim:rgba(216,230,234,.20); --c-accent-glow:rgba(216,230,234,.30); --c-ready:#7FA86E; --c-warn:#D6A23A; --c-danger:#C34C43; --c-icon:#D6E2E5; --c-grid:rgba(158,176,184,.10); --c-overlay:rgba(5,7,8,.36); }
.shell.palette-snow.mode-light { --c-bg:#E0E4E3; --c-app:rgba(236,240,239,.94); --c-panel:rgba(214,222,222,.84); --c-surface:rgba(190,204,205,.64); --c-border:rgba(75,91,96,.22); --c-border-hi:rgba(89,121,130,.54); --c-text:#182024; --c-muted:#5B6A70; --c-accent:#597982; --c-accent-dim:rgba(89,121,130,.16); --c-accent-glow:rgba(89,121,130,.20); --c-ready:#527C50; --c-warn:#9E711F; --c-danger:#963B35; --c-icon:#4B6A72; --c-grid:rgba(75,91,96,.09); --c-overlay:rgba(245,248,248,.14); }

.shell.palette-black-ops.mode-dark { --c-bg:#030303; --c-app:rgba(5,5,5,.92); --c-panel:rgba(11,11,10,.88); --c-surface:rgba(22,21,17,.78); --c-border:rgba(132,118,74,.28); --c-border-hi:rgba(230,199,94,.80); --c-text:#E8E4D3; --c-muted:#AAA18A; --c-accent:#E6C75E; --c-accent-dim:rgba(230,199,94,.24); --c-accent-glow:rgba(230,199,94,.38); --c-ready:#74A866; --c-warn:#D89632; --c-danger:#C54B3F; --c-icon:#D8C98B; --c-grid:rgba(132,118,74,.10); --c-overlay:rgba(0,0,0,.56); }
.shell.palette-black-ops.mode-light { --c-bg:#BDB9AA; --c-app:rgba(210,207,195,.92); --c-panel:rgba(184,179,160,.82); --c-surface:rgba(145,137,112,.60); --c-border:rgba(49,45,35,.24); --c-border-hi:rgba(114,86,24,.62); --c-text:#15130E; --c-muted:#514B3D; --c-accent:#725618; --c-accent-dim:rgba(114,86,24,.18); --c-accent-glow:rgba(114,86,24,.22); --c-ready:#4F7947; --c-warn:#98651B; --c-danger:#94372F; --c-icon:#4B3B17; --c-grid:rgba(49,45,35,.10); --c-overlay:rgba(216,213,202,.14); }

.shell.palette-tropic.mode-dark { --c-bg:#030704; --c-app:rgba(4,9,5,.90); --c-panel:rgba(8,18,10,.86); --c-surface:rgba(15,34,18,.78); --c-border:rgba(78,135,70,.30); --c-border-hi:rgba(126,204,107,.76); --c-text:#DCE8C8; --c-muted:#9BB584; --c-accent:#7ECC6B; --c-accent-dim:rgba(126,204,107,.24); --c-accent-glow:rgba(126,204,107,.34); --c-ready:#83C16C; --c-warn:#D2A043; --c-danger:#C14A3C; --c-icon:#B4D99D; --c-grid:rgba(78,135,70,.12); --c-overlay:rgba(3,7,4,.48); }
.shell.palette-tropic.mode-light { --c-bg:#BFD0AA; --c-app:rgba(211,225,196,.92); --c-panel:rgba(181,205,158,.82); --c-surface:rgba(137,176,114,.60); --c-border:rgba(45,83,39,.24); --c-border-hi:rgba(61,124,50,.58); --c-text:#122313; --c-muted:#4D6844; --c-accent:#3D7C32; --c-accent-dim:rgba(61,124,50,.18); --c-accent-glow:rgba(61,124,50,.22); --c-ready:#4C833E; --c-warn:#936D21; --c-danger:#94382F; --c-icon:#376D2F; --c-grid:rgba(45,83,39,.10); --c-overlay:rgba(220,234,206,.14); }

.shell.palette-multicam.mode-dark { --c-bg:#070806; --c-app:rgba(8,9,7,.88); --c-panel:rgba(18,19,13,.86); --c-surface:rgba(34,35,22,.78); --c-border:rgba(160,150,102,.28); --c-border-hi:rgba(220,204,129,.74); --c-text:#E7E0C2; --c-muted:#B8AD82; --c-accent:#DCCA81; --c-accent-dim:rgba(220,202,129,.24); --c-accent-glow:rgba(220,202,129,.34); --c-ready:#86A263; --c-warn:#D7983A; --c-danger:#B94A36; --c-icon:#D0C690; --c-grid:rgba(160,150,102,.11); --c-overlay:rgba(5,6,4,.46); }
.shell.palette-multicam.mode-light { --c-bg:#CEC7A9; --c-app:rgba(222,217,195,.92); --c-panel:rgba(197,190,154,.82); --c-surface:rgba(158,150,106,.60); --c-border:rgba(75,69,45,.24); --c-border-hi:rgba(111,97,45,.58); --c-text:#211F14; --c-muted:#5D563C; --c-accent:#6F612D; --c-accent-dim:rgba(111,97,45,.18); --c-accent-glow:rgba(111,97,45,.22); --c-ready:#5C7848; --c-warn:#9B6520; --c-danger:#903A30; --c-icon:#5C5129; --c-grid:rgba(75,69,45,.10); --c-overlay:rgba(228,223,201,.14); }

.shell.palette-hunter-autumn.mode-dark { --c-bg:#080604; --c-app:rgba(10,7,4,.90); --c-panel:rgba(20,13,7,.86); --c-surface:rgba(38,25,12,.78); --c-border:rgba(159,111,61,.28); --c-border-hi:rgba(218,143,62,.76); --c-text:#E8D8BA; --c-muted:#B99A70; --c-accent:#D08A3A; --c-accent-dim:rgba(208,138,58,.24); --c-accent-glow:rgba(208,138,58,.34); --c-ready:#778B4E; --c-warn:#D08A3A; --c-danger:#A94432; --c-icon:#D1AD77; --c-grid:rgba(159,111,61,.10); --c-overlay:rgba(6,4,2,.46); }
.shell.palette-hunter-autumn.mode-light { --c-bg:#D0B98F; --c-app:rgba(224,204,170,.92); --c-panel:rgba(198,165,118,.82); --c-surface:rgba(159,115,68,.56); --c-border:rgba(82,52,25,.24); --c-border-hi:rgba(130,72,25,.60); --c-text:#26180D; --c-muted:#63452B; --c-accent:#824819; --c-accent-dim:rgba(130,72,25,.18); --c-accent-glow:rgba(130,72,25,.22); --c-ready:#5E7040; --c-warn:#9D5D1D; --c-danger:#8E352B; --c-icon:#65411C; --c-grid:rgba(82,52,25,.10); --c-overlay:rgba(232,212,181,.14); }

.shell.palette-command-neutral.mode-dark { --c-bg:#050605; --c-app:rgba(7,8,7,.92); --c-panel:rgba(13,15,13,.88); --c-surface:rgba(25,28,24,.78); --c-border:rgba(126,132,112,.24); --c-border-hi:rgba(184,190,158,.66); --c-text:#E2E2D3; --c-muted:#A9AD96; --c-accent:#B8BE9E; --c-accent-dim:rgba(184,190,158,.20); --c-accent-glow:rgba(184,190,158,.28); --c-ready:#6F9360; --c-warn:#C88D31; --c-danger:#B04438; --c-icon:#C1C4A8; --c-grid:rgba(126,132,112,.09); --c-overlay:rgba(0,0,0,.42); }
.shell.palette-command-neutral.mode-light { --c-bg:#D2D2C4; --c-app:rgba(230,230,218,.92); --c-panel:rgba(204,205,190,.82); --c-surface:rgba(172,174,154,.58); --c-border:rgba(62,66,54,.22); --c-border-hi:rgba(93,100,76,.56); --c-text:#1C1E18; --c-muted:#5A5F50; --c-accent:#5D644C; --c-accent-dim:rgba(93,100,76,.16); --c-accent-glow:rgba(93,100,76,.20); --c-ready:#517745; --c-warn:#956821; --c-danger:#8F382F; --c-icon:#505844; --c-grid:rgba(62,66,54,.09); --c-overlay:rgba(235,235,224,.12); }

/* HEL layer model v1.
   Structure is not content: frames position areas but do not cover the
   background. Only real controls, cards and widgets create color surfaces. */
.shell {
  --bg-alpha: .60;
  --frame-mix: 80%;
  --content-mix: 60%;
  --grid-alpha: .40;
  --effect-alpha: 0;
  --solid-layer: radial-gradient(circle at 20% 10%, var(--c-accent-dim), transparent 34rem), linear-gradient(135deg, var(--c-bg), var(--c-panel) 55%, var(--c-app));
  --bg-layer: var(--solid-layer);
  --bg-layer-active: var(--bg-layer);
  isolation: isolate;
  background: var(--c-bg) !important;
}

.shell::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--bg-layer-active);
  background-size: var(--bg-size, cover);
  background-position: var(--bg-position, center);
  background-repeat: no-repeat;
  opacity: var(--bg-alpha);
}

.shell > * {
  position: relative;
  z-index: 1;
}

.shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--c-grid, rgba(82, 124, 172, .12)) 1px, transparent 1px),
    linear-gradient(90deg, var(--c-grid, rgba(82, 124, 172, .12)) 1px, transparent 1px);
  background-size: 13px 13px;
  background-position: 0 0;
  background-repeat: repeat;
  opacity: var(--grid-alpha, .40) !important;
}

.shell.bg-solid,
.shell.bg-flecktarn,
.shell.bg-ddr-stripe,
.shell.bg-ukraine,
.shell.bg-desert,
.shell.bg-tigerstripe,
.shell.bg-cryptic,
.shell.bg-woodland,
.shell.bg-atacs,
.shell.bg-urban-digital,
.shell.bg-snow,
.shell.bg-hunter-autumn,
.shell.bg-dawn,
.shell.bg-day,
.shell.bg-dusk,
.shell.bg-night {
  background: var(--c-bg) !important;
  background-image: none !important;
}

.shell.bg-solid { --bg-layer: var(--solid-layer); }
.shell.bg-flecktarn { --bg-layer: url('/static/core-ui/images/27iqdetcrhqjl5w24f/landscape_987.webp'); --solid-layer: radial-gradient(circle at 18% 12%, rgba(184,214,90,.13), transparent 34rem), linear-gradient(135deg, #050805, #11190A 55%, #030503); }
.shell.bg-ddr-stripe { --bg-layer: url('/static/core-ui/images/23ckhzilben6htmwic/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(181,193,121,.12), transparent 34rem), linear-gradient(135deg, #070806, #171A10 55%, #050604); }
.shell.bg-ukraine { --bg-layer: url('/static/core-ui/images/27hpwvsp9pd5qubanj/landscape_987.webp'); --solid-layer: radial-gradient(circle at 78% 12%, rgba(255,213,74,.16), transparent 34rem), linear-gradient(135deg, #05080D, #0B1724 50%, #141009); }
.shell.bg-desert { --bg-layer: url('/static/core-ui/images/284673s2hfqoddbk2q/landscape_987.webp'); --solid-layer: radial-gradient(circle at 22% 10%, rgba(224,180,95,.18), transparent 34rem), linear-gradient(135deg, #130E08, #2A1D0E 55%, #0A0704); }
.shell.bg-tigerstripe { --bg-layer: url('/static/core-ui/images/277zyfptlvytguj354/landscape_987.webp'); --solid-layer: radial-gradient(circle at 24% 12%, rgba(224,200,90,.14), transparent 34rem), linear-gradient(135deg, #040604, #17190C 48%, #090703); }
.shell.bg-cryptic { --bg-layer: url('/static/core-ui/images/27nblfsrknbevacwb3/landscape_987.webp'); --solid-layer: radial-gradient(circle at 80% 8%, rgba(216,188,101,.14), transparent 34rem), linear-gradient(135deg, #060706, #16170E 55%, #050504); }
.shell.bg-woodland { --bg-layer: url('/static/core-ui/images/27qaqx23xuj33wgdwp/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 12%, rgba(206,188,105,.12), transparent 34rem), linear-gradient(135deg, #050604, #171B0E 50%, #090704); }
.shell.bg-atacs { --bg-layer: url('/static/core-ui/images/26trikbnvk8xgpbaga/landscape_987.webp'); --solid-layer: radial-gradient(circle at 18% 10%, rgba(191,199,132,.13), transparent 34rem), linear-gradient(135deg, #050706, #161A12 55%, #050504); }
.shell.bg-urban-digital { --bg-layer: url('/static/core-ui/images/26hnistzrsubhemnza/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(138,188,216,.15), transparent 34rem), linear-gradient(135deg, #050709, #0E1820 55%, #030405); }
.shell.bg-snow { --bg-layer: url('/static/core-ui/images/25tqjye5cmpi3be7af/landscape_987.webp'); --solid-layer: radial-gradient(circle at 18% 10%, rgba(216,230,234,.16), transparent 34rem), linear-gradient(135deg, #07090A, #151B1D 55%, #040506); }
.shell.bg-hunter-autumn { --bg-layer: url('/static/core-ui/images/23vvx6y6evxlyngdxd/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(208,138,58,.15), transparent 34rem), linear-gradient(135deg, #080604, #26190C 55%, #030201); }
.shell.bg-dawn { --bg-layer: url('/static/core-ui/images/226ptswamx7vgmmgft/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(208,138,58,.15), transparent 34rem), linear-gradient(135deg, #06090A, #172018 55%, #030404); }
.shell.bg-day { --bg-layer: url('/static/core-ui/images/276h3mgdtb5z2lyofu/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(138,188,216,.15), transparent 34rem), linear-gradient(135deg, #071017, #18242A 55%, #040607); }
.shell.bg-dusk { --bg-layer: url('/static/core-ui/images/27ha2fwwrvvghopej3/landscape_987.webp'); --solid-layer: radial-gradient(circle at 20% 10%, rgba(208,138,58,.16), transparent 34rem), linear-gradient(135deg, #0A0705, #26190C 55%, #030201); }
.shell.bg-night { --bg-layer: url('/static/core-ui/images/27ngyqdwju6btrut4t/landscape_987.webp'); --solid-layer: radial-gradient(circle at 78% 10%, rgba(138,188,216,.12), transparent 34rem), linear-gradient(135deg, #030508, #0C1218 55%, #000000); }

.shell.mode-dark {
  --c-ui-app-base: color-mix(in srgb, var(--c-bg) 92%, #000 8%);
  --c-ui-panel-base: color-mix(in srgb, var(--c-bg) 76%, var(--c-accent) 24%);
  --c-ui-surface-base: color-mix(in srgb, var(--c-bg) 66%, var(--c-accent) 34%);
  --c-content-base: color-mix(in srgb, var(--c-bg) 88%, #000 12%);
  --c-content-card-base: color-mix(in srgb, var(--c-bg) 80%, #000 20%);
}

.shell.mode-light {
  --c-ui-app-base: color-mix(in srgb, var(--c-bg) 88%, #fff 12%);
  --c-ui-panel-base: color-mix(in srgb, var(--c-bg) 76%, var(--c-accent) 24%);
  --c-ui-surface-base: color-mix(in srgb, var(--c-bg) 66%, var(--c-accent) 34%);
  --c-content-base: color-mix(in srgb, var(--c-bg) 88%, #fff 12%);
  --c-content-card-base: color-mix(in srgb, var(--c-bg) 80%, #fff 20%);
}

.shell.mode-dark,
.shell.mode-light {
  --surface-layer-1-mix: var(--content-mix);
  --surface-layer-2-mix: min(100%, calc(var(--content-mix) * 2));
  --c-surface-layer-1: color-mix(in srgb, var(--c-content-card-base) var(--surface-layer-1-mix), transparent);
  --c-surface-layer-2: color-mix(in srgb, var(--c-content-card-base) var(--surface-layer-2-mix), transparent);
  --c-control: color-mix(in srgb, var(--c-ui-panel-base) var(--frame-mix), transparent);
  --c-control-surface: color-mix(in srgb, var(--c-ui-surface-base) var(--frame-mix), transparent);
}

.shell .topbar,
.shell .sidebar,
.shell .rail,
.shell .footer,
.shell .main,
.shell .topbar-logo,
.shell .topbar-quick,
.shell .topbar-input-row,
.shell .topbar-nav-row,
.shell .rotator,
.shell .tiles,
.shell .sidebar-free {
  background: transparent !important;
}

.shell .theme-tile-btn,
.shell .btn-icon,
.shell .btn-send,
.shell .nav-item,
.shell .tile,
.shell .rail-btn,
.shell .style-save,
.shell .style-reset,
.shell .style-choice:not(.image-tile),
.shell .style-mode-toggle,
.shell .style-mode-btn,
.shell .style-opacity-btn,
.shell .font-role-btn,
.shell .font-choice {
  background:
    linear-gradient(var(--c-control, transparent), var(--c-control, transparent)),
    var(--c-surface-layer-1, rgba(0, 0, 0, .22)) !important;
}

.shell .image-tile {
  background-color: var(--c-control, rgba(0, 0, 0, .22));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.shell .image-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 8%, rgba(0, 0, 0, .58));
  z-index: 0;
}

.shell .image-tile > * {
  position: relative;
  z-index: 1;
}

.shell .brand-box,
.shell .logo-icon,
.shell .rotator,
.shell .main-context,
.shell .style-panel,
.shell .font-preview,
.shell .cmd-input,
.shell .style-language-select,
.shell .surface-box,
.shell .shape-layer-1 {
  background: var(--c-surface-layer-1, rgba(0, 0, 0, .22)) !important;
}

.shell .main-placeholder-icon,
.shell .shape-layer-2 {
  background: var(--c-surface-layer-2, rgba(0, 0, 0, .34)) !important;
}

.shell .main::before {
  display: none !important;
  opacity: 0 !important;
}

.shell .ui-text-micro,
.shell .nav-item,
.shell .tile-label,
.shell .tile-badge,
.shell .rail-label,
.shell .rail-cycle-label,
.shell .rotator-badge,
.shell .rotator-sub,
.shell .rotator-countdown,
.shell .theme-tile-btn,
.shell .main-path,
.shell .main-placeholder-sub,
.shell .style-eyebrow,
.shell .style-section-title,
.shell .style-save,
.shell .style-reset,
.shell .style-language-select,
.shell .style-mode-btn,
.shell .style-layer-label,
.shell .style-opacity-btn,
.shell .style-choice-label,
.shell .font-role-btn,
.shell .font-choice-label,
.shell .font-preview-step,
.shell .font-preview-meta,
.shell .style-status {
  font-family: var(--f-step-8) !important;
  font-size: var(--font-step-8) !important;
  line-height: 1.05;
}

.shell .ui-text-ui,
.shell .cmd-input,
.shell .cmd-input::placeholder,
.shell .main-placeholder-detail,
.shell .rotate-phone-copy,
.shell .font-preview-body,
.shell .font-preview-mono,
.shell .tactical-symbol-meta,
.shell .role-icon-copy,
.shell .role-icon-label {
  font-family: var(--f-step-13) !important;
  font-size: var(--font-step-13) !important;
}

.shell .ui-text-title,
.shell .logo-title,
.shell .rotator-value,
.shell .main-placeholder-title,
.shell .style-title,
.shell .role-icon-title,
.shell .rotate-phone-title {
  font-family: var(--f-step-21) !important;
  font-size: var(--font-step-21) !important;
  line-height: 1;
}

.shell .ui-text-display,
.shell .shape-text-display {
  font-family: var(--f-step-34) !important;
  font-size: var(--font-step-34) !important;
  line-height: 1;
}