/* ===========================================================
   URETILMIS DOSYA — ELLE DUZENLEME
   Kaynak: tema.css + cosmos.css (ozet: dfc91910b5e40303)
   Ureten: scripts/col-derisi.mjs
   Ne yapar: COL modunun (uzay/col ikilisinden ikincisi) arayuz
   paletini kurar. cosmos.css'teki her soguk renk HSL uzerinden
   col karsiligina eslenir; aciklik korunur, sicak renkler
   (altin, mercan, yesil) dokunulmadan gecer.
   Elle yazilan karsiligi: col.css (palet jetonlari).
   Yeniden uretmek: node scripts/col-derisi.mjs
   =========================================================== */

body.cosmos-ui.harita-kagit {
  --bg: #1a1108;
  --panel: #22180b;
  --ink: #0B0B0B;
  --paper: #E9E4D6;
  --white: #FFFDF4;
  --mint: #ecc767;
  --mint-deep: #d9a118;
  --red: #FF4E70;
  --gold: #FFD84A;
  --glow-m: rgba(236, 199, 103, 0.42);
  --glow-r: rgba(255, 78, 112, 0.45);
  --glow-g: rgba(255, 216, 74, 0.42);
  --ivory: #F7E7BD;
  --honey: #F3BF55;
  --lavender: #cf8f73;
  --olive: #7AB65B;
  --graphite: #272921;
  --aqua: #edbe6e;
  --coral: #FF596D;
  --violet: #f0aa8a;
  --world: #F3BF55;
  --world-soft: #F7E7BD;
  --world-deep: #a87962;
  --display: ui-rounded, "Arial Rounded MT Bold", "Trebuchet MS", sans-serif;
  --mono: "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pop: cubic-bezier(0.18, 0.85, 0.25, 1.18);
}

body.cosmos-ui.harita-kagit {
  background: radial-gradient(900px 560px at 50% -170px, rgba(237, 190, 110, 0.14), transparent 66%),
      radial-gradient(760px 520px at 15% 90%, rgba(240, 170, 138, 0.12), transparent 70%),
      var(--bg);
}

body.cosmos-ui.harita-kagit #intro::before {
  background: radial-gradient(circle, rgba(243,191,85,0.36), rgba(239, 163, 124, 0.16) 46%, transparent 72%);
}

body.cosmos-ui.harita-kagit .introHero {
  box-shadow: 0 28px 74px rgba(0,0,0,0.48), 0 0 42px rgba(234, 185, 85, 0.12);
}

body.cosmos-ui.harita-kagit .introHero::after {
  background: linear-gradient(180deg, rgba(18,15,13,0.04) 30%, rgba(18,15,13,0.22) 65%, rgba(18, 15, 12, 0.88) 100%);
}

body.cosmos-ui.harita-kagit .gameLockup::before {
  background: radial-gradient(circle, rgba(247,231,189,0.2), rgba(234, 185, 85, 0.08) 46%, transparent 72%);
}

body.cosmos-ui.harita-kagit .boaCrop img {
  filter: saturate(1.06) contrast(1.01) drop-shadow(0 15px 15px rgba(22,16,11,0.34)) drop-shadow(0 0 8px rgba(234, 185, 85, 0.2));
}

body.cosmos-ui.harita-kagit .introEyebrow {
  text-shadow: 0 0 14px rgba(234, 185, 85, 0.34);
}

body.cosmos-ui.harita-kagit .lvlWrap {
  background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--world) 20%, transparent) 0 2px, transparent 3px),
      radial-gradient(circle at 84% 28%, rgba(255,255,255,.24) 0 1px, transparent 2px),
      radial-gradient(circle at 72% 78%, color-mix(in srgb, var(--world-soft) 22%, transparent) 0 1.5px, transparent 2.5px),
      linear-gradient(145deg, rgba(26, 19, 13, 0.96), color-mix(in srgb, var(--world-deep) 19%, #13110d));
}

body.cosmos-ui.harita-kagit .planetGlyph {
  box-shadow: inset -10px -12px 18px rgba(31, 20, 16, 0.27), 0 0 24px color-mix(in srgb, var(--world) 42%, transparent);
}

body.cosmos-ui.harita-kagit .planetGlyph::after {
  background: rgba(51, 41, 37, 0.18);
  box-shadow: 25px 23px 0 3px rgba(51, 41, 37, 0.12), 5px 36px 0 1px rgba(255,255,255,.18);
}

body.cosmos-ui.harita-kagit .mementoWrap {
  border: 1px solid rgba(237, 190, 110, 0.32);
  background: radial-gradient(circle at 8% 0%, rgba(236, 199, 103, 0.13), transparent 32%),
      radial-gradient(circle at 94% 100%, rgba(240, 170, 138, 0.15), transparent 38%),
      linear-gradient(145deg, rgba(34, 24, 11, 0.98), rgba(31, 19, 12, 0.97));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 22px 54px rgba(0,0,0,.3), 0 0 30px rgba(237, 190, 110, 0.07);
}

body.cosmos-ui.harita-kagit .mementoVitrin {
  scrollbar-color: rgba(237, 190, 110, 0.45) transparent;
}

body.cosmos-ui.harita-kagit .mementoSlot {
  border: 1px solid rgba(237, 190, 110, 0.25);
  color: rgba(241, 232, 214, 0.52);
  background: linear-gradient(145deg, rgba(236, 199, 103, 0.055), rgba(240, 170, 138, 0.07)),
      rgba(26, 17, 8, 0.84);
}

body.cosmos-ui.harita-kagit .mementoSlot::after {
  border: 1px dashed rgba(236, 229, 215, 0.2);
}

body.cosmos-ui.harita-kagit .mementoSlot:hover,
body.cosmos-ui.harita-kagit .mementoSlot:focus-visible {
  box-shadow: 0 0 18px rgba(237, 190, 110, 0.16);
}

body.cosmos-ui.harita-kagit .mementoSlot.filled,
body.cosmos-ui.harita-kagit .mementoSlot.dolu {
  background: radial-gradient(circle at 50% 38%, rgba(255,216,74,.16), transparent 58%), rgba(31, 22, 11, 0.94);
}

body.cosmos-ui.harita-kagit .mementoDetail {
  border: 1px solid rgba(240, 170, 138, 0.32);
  background: linear-gradient(90deg, rgba(240, 170, 138, 0.1), rgba(237, 190, 110, 0.045));
}

body.cosmos-ui.harita-kagit .mementoDetail p {
  color: rgba(240, 237, 230, 0.6);
}

body.cosmos-ui.harita-kagit .modeCard {
  border: 1px solid rgba(234, 185, 85, 0.7);
}

body.cosmos-ui.harita-kagit .modeCard:hover {
  box-shadow: 0 24px 46px rgba(0,0,0,0.4), 0 0 24px rgba(234, 185, 85, 0.12);
}

body.cosmos-ui.harita-kagit .modeCard.vs {
  border-color: rgba(239, 163, 124, 0.58);
}

body.cosmos-ui.harita-kagit .modeCard.boa .mTitle {
  color: #745d28;
}

body.cosmos-ui.harita-kagit .modeCard.vs .mTitle {
  color: #9a6b53;
}

body.cosmos-ui.harita-kagit .resultWash::before {
  background: radial-gradient(circle, rgba(255,247,216,0.92) 0 20%, rgba(245,198,91,0.58) 38%, rgba(228, 188, 93, 0.18) 62%, transparent 73%);
}

body.cosmos-ui.harita-kagit .resultWash::after {
  box-shadow: 0 0 0 9px rgba(228, 188, 93, 0.13), inset 0 0 34px rgba(255,240,180,0.5);
}

body.cosmos-ui.harita-kagit .resultWash.fail::before {
  background: radial-gradient(circle, rgba(247,232,211,0.86) 0 19%, rgba(240,100,73,0.48) 39%, rgba(239, 163, 124, 0.25) 64%, transparent 74%);
}

body.cosmos-ui.harita-kagit .resultWash.fail::after {
  box-shadow: 0 0 0 9px rgba(239, 163, 124, 0.14), inset 0 0 34px rgba(240,100,73,0.32);
}

body.cosmos-ui.harita-kagit .resultWash i:nth-of-type(2n) {
  background: #e4bc5d;
}

body.cosmos-ui.harita-kagit .resultWash.fail i {
  background: #efa37c;
}

body.cosmos-ui.harita-kagit .chapterObject {
  background: rgba(28, 19, 18, 0.86);
}

body.cosmos-ui.harita-kagit .veil {
  background: rgba(20, 13, 7, 0.8);
}

body.cosmos-ui.harita-kagit.storybook .frame {
  background: #3e302b;
  border-color: rgba(234, 185, 85, 0.88);
  box-shadow: 0 20px 48px rgba(0,0,0,0.48), 0 0 28px rgba(234, 185, 85, 0.2), 0 0 0 1px rgba(247,231,189,0.5);
}

body.cosmos-ui.harita-kagit.storybook .vCard {
  background: radial-gradient(circle at 18% 12%, rgba(255,255,255,0.78), transparent 30%),
      radial-gradient(circle at 92% 88%, rgba(239, 163, 124, 0.14), transparent 38%),
      linear-gradient(145deg, #FFF1C9, #EDC980);
}

body.cosmos-ui.harita-kagit.storybook #overCard.win {
  border-color: rgba(125, 102, 52, 0.75);
}

body.cosmos-ui.harita-kagit.storybook #overCard.fail {
  background: radial-gradient(circle at 84% 12%, rgba(255,255,255,0.7), transparent 28%), linear-gradient(145deg, #F7DEC5, #d8c7c4);
}

body.cosmos-ui.harita-kagit.storybook .vBtns .btn:first-child {
  color: #362c18;
  background: linear-gradient(135deg, #B8EF82, #e4bc5d);
  border-color: #7d6634;
  box-shadow: 0 8px 22px rgba(125, 102, 52, 0.24), 0 0 18px rgba(234, 185, 85, 0.2);
}

body.cosmos-ui.harita-kagit.storybook .frameLab {
  border-color: #3e302b;
}

body.cosmos-ui.harita-kagit.storybook #lvlChip,
body.cosmos-ui.harita-kagit.storybook #scoreChip {
  box-shadow: 0 0 12px rgba(234, 185, 85, 0.18);
}

body.cosmos-ui.harita-kagit.storybook #goalChip {
  background: linear-gradient(135deg, #B8EF82, #e4bc5d);
  border-color: #e4bc5d;
}

body.cosmos-ui.harita-kagit.storybook #powerChip.on {
  color: #fbe7dd;
  box-shadow: 0 0 16px rgba(239, 163, 124, 0.28);
}

body.cosmos-ui.harita-kagit.game-active.storybook .frame {
  border-color: rgba(236, 193, 101, 0.92);
  box-shadow: 0 22px 64px rgba(0,0,0,0.62), 0 0 38px rgba(234, 185, 85, 0.28);
}

@media (max-width: 1024px), (any-pointer: coarse) {
  body.cosmos-ui.harita-kagit.game-active.storybook {
    background: #100f0b;
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .hud .chip {
    background: rgba(19, 17, 12, 0.78);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook #comBar {
    background: rgba(20, 18, 13, 0.62);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .underActions .chip {
    background: rgba(19, 17, 12, 0.76);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .padBtn {
    background: rgba(21, 18, 11, 0.7);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .veil {
    background: linear-gradient(180deg, rgba(18, 16, 12, 0.25), rgba(18, 16, 12, 0.78));
  }

}
body.cosmos-ui.harita-kagit.storybook.webgl3d .frame::before {
  background: linear-gradient(165deg, rgba(230, 165, 54, 0.26), rgba(224, 134, 84, 0.18) 54%, rgba(236, 199, 103, 0.2));
}

body.cosmos-ui.harita-kagit #comBar.bilgi {
  color: #f9e9cf;
  background: linear-gradient(90deg, rgba(237, 190, 110, 0.045), rgba(237, 190, 110, 0.12), rgba(237, 190, 110, 0.045));
  border-block: 1px solid rgba(237, 190, 110, 0.2);
  text-shadow: 0 0 12px rgba(237, 190, 110, 0.24);
}

body.cosmos-ui.harita-kagit #comBar.basari {
  background: linear-gradient(90deg, rgba(236, 199, 103, 0.05), rgba(236, 199, 103, 0.22), rgba(255,216,74,.08));
  border-block: 1px solid rgba(236, 199, 103, 0.42);
  text-shadow: 0 0 13px rgba(236, 199, 103, 0.3);
}

body.cosmos-ui.harita-kagit #ogretimKarti {
  background: linear-gradient(105deg, rgba(34, 22, 8, 0.94), rgba(39, 23, 14, 0.92));
  border-color: rgba(237, 190, 110, 0.54);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 34px rgba(0,0,0,.4), 0 0 24px rgba(237, 190, 110, 0.12);
}

@media (max-width: 1024px), (any-pointer: coarse) {
  body.cosmos-ui.harita-kagit.game-active.storybook #comBar.bilgi {
    background: linear-gradient(90deg, rgba(48, 35, 18, 0.98), rgba(64, 46, 20, 0.98));
    border-bottom-color: rgba(237, 190, 110, 0.32);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook #comBar.basari {
    background: linear-gradient(90deg, rgba(49, 38, 17, 0.98), rgba(35,54,37,.98));
    border-bottom-color: rgba(236, 199, 103, 0.5);
  }

}
body.cosmos-ui.harita-kagit {
  --derin-bosluk: #160e07;
  --derin-taban: #26190d;
  --derin-samanyolu: #503c2b;
  --derin-cekirdek: #4A4238;
  --derin-halfa: #5C2135;
  --derin-yansima: #623f1d;
  --cosmos-night: #160e07;
  --cosmos-deep: #4a2708;
  --cosmos-blue: #925012;
  --cosmos-aqua: #ebb35c;
  --cosmos-mint: #ebc05f;
  --cosmos-violet: #f0a683;
  --cosmos-coral: #ff6485;
  --cosmos-gold: #ffd55b;
  --cosmos-ivory: #fff7dc;
  --cosmos-glass: rgba(54, 31, 12, 0.82);
  --cosmos-aqua-rgb: 235, 179, 92;
  --cosmos-mint-rgb: 235, 192, 95;
  --cosmos-violet-rgb: 240, 166, 131;
  --cosmos-coral-rgb: 255, 100, 133;
  --cosmos-gold-rgb: 255, 213, 91;
  --cosmos-ivory-rgb: 255, 247, 220;
  --cosmos-edge-rgb: 238, 188, 115;
  --cosmos-night-rgb: 22, 14, 7;
  --cosmos-edge: rgba(var(--cosmos-edge-rgb), .45);
  --bg: var(--cosmos-night);
  --panel: #38200c;
  --white: var(--cosmos-ivory);
  --mint: var(--cosmos-mint);
  --mint-deep: #cb9524;
  --aqua: var(--cosmos-aqua);
  --violet: var(--cosmos-violet);
  --coral: var(--cosmos-coral);
  --red: var(--cosmos-coral);
  --gold: var(--cosmos-gold);
  --graphite: #332112;
  --glow-m: rgba(var(--cosmos-mint-rgb), .38);
  --glow-r: rgba(var(--cosmos-coral-rgb), .4);
  --glow-g: rgba(var(--cosmos-gold-rgb), .42);
}

body.cosmos-ui.harita-kagit {
  background: linear-gradient(197deg,
      transparent 22%,
      rgba(74, 66, 56, .10) 40%,
      rgba(68, 62, 58, 0.15) 50%,
      rgba(80, 60, 43, 0.09) 61%,
      transparent 78%),
    radial-gradient(56% 32% at 86% 14%, rgba(92, 33, 53, .17), transparent 72%),
    radial-gradient(52% 30% at 10% 68%, rgba(98, 63, 29, 0.2), transparent 74%),
    radial-gradient(130% 78% at 50% 6%, var(--derin-taban), var(--derin-bosluk) 76%);
}

body.cosmos-ui.harita-kagit::before {
  background-image: radial-gradient(1.7px 1.7px at 18% 24%, rgba(255, 242, 226, .95), transparent 100%),
    radial-gradient(1.4px 1.4px at 63% 71%, rgba(249, 228, 209, 0.82), transparent 100%),
    radial-gradient(1.2px 1.2px at 41% 11%, rgba(255, 213, 166, .78), transparent 100%),
    radial-gradient(1px 1px at 82% 44%, rgba(254, 250, 247, 0.7), transparent 100%),
    radial-gradient(.9px .9px at 7% 57%, rgba(245, 206, 172, 0.6), transparent 100%),
    radial-gradient(.8px .8px at 55% 33%, rgba(255, 242, 226, .5), transparent 100%),
    radial-gradient(.7px .7px at 29% 82%, rgba(255, 184, 119, .46), transparent 100%);
}

body.cosmos-ui.harita-kagit #intro::before {
  background: radial-gradient(circle at 50% 8%, rgba(80, 60, 43, 0.34), transparent 34%),
    linear-gradient(180deg, rgba(var(--cosmos-night-rgb), .06), rgba(var(--cosmos-night-rgb), .62));
}

body.cosmos-ui.harita-kagit #intro::after {
  color: rgba(250, 235, 212, 0.78);
  background: rgba(34, 19, 7, 0.72);
}

body.cosmos-ui.harita-kagit .introHero {
  border: 1px solid rgba(239, 192, 125, 0.58);
  background: #371f0a;
}

body.cosmos-ui.harita-kagit .introHero::after {
  background: linear-gradient(180deg, rgba(39, 20, 5, 0.08) 28%, transparent 52%, rgba(36, 20, 6, 0.93) 100%),
    radial-gradient(circle at 50% 48%, transparent 35%, rgba(37, 20, 6, 0.26) 100%);
}

body.cosmos-ui.harita-kagit .introHeroCopy h2 {
  text-shadow: 0 3px 0 rgba(33, 19, 8, 0.48), 0 0 28px rgba(236, 181, 102, 0.22);
}

body.cosmos-ui.harita-kagit .introSub {
  color: rgba(253, 247, 241, 0.82);
}

body.cosmos-ui.harita-kagit .modeCard {
  color: #fefcf9;
  border: 1px solid rgba(237, 186, 111, 0.44);
  background: radial-gradient(circle at 18% 0%, rgba(var(--cosmos-aqua-rgb), .19), transparent 42%),
    linear-gradient(145deg, rgba(88, 48, 12, 0.96), rgba(66, 31, 12, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 18px 42px rgba(36, 18, 4, 0.42);
}

body.cosmos-ui.harita-kagit .modeCard:hover,
body.cosmos-ui.harita-kagit .modeCard:focus-visible {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 22px 50px rgba(36, 18, 4, 0.5), 0 0 26px rgba(var(--cosmos-aqua-rgb), .16);
}

body.cosmos-ui.harita-kagit .modeCard .mLine {
  color: rgba(252, 241, 229, 0.68);
}

body.cosmos-ui.harita-kagit .planetMapHead {
  background: rgba(46, 26, 10, 0.72);
}

body.cosmos-ui.harita-kagit .planetGlyph {
  background: radial-gradient(circle at 36% 32%, rgba(255, 255, 255, .72) 0 4%, transparent 5%),
    radial-gradient(circle at 38% 36%, #ecbf68, #d27d2a 42%, #9f4d2c 74%, #4e2c16 100%);
  box-shadow: inset -12px -13px 18px rgba(42, 22, 6, 0.36), 0 0 0 2px rgba(var(--cosmos-gold-rgb), .62), 0 0 24px rgba(var(--cosmos-aqua-rgb), .38);
}

body.cosmos-ui.harita-kagit .planetMapCopy p {
  color: rgba(252, 241, 229, 0.72);
}

body.cosmos-ui.harita-kagit .lvlRow {
  background: rgba(44, 24, 7, 0.24);
}

body.cosmos-ui.harita-kagit .lvlDot {
  border: 1px solid rgba(245, 206, 173, 0.48);
  color: rgba(252, 240, 229, 0.64);
  background: radial-gradient(circle at 35% 28%, rgba(255, 255, 255, .16), transparent 24%),
    linear-gradient(145deg, rgba(132, 86, 48, 0.94), rgba(73, 38, 18, 0.96));
}

body.cosmos-ui.harita-kagit .lvlDot::after {
  border-color: rgba(239, 192, 125, 0.27);
}

body.cosmos-ui.harita-kagit .lvlDot.cur {
  color: #321c0a;
  box-shadow: 0 0 0 5px rgba(45, 25, 9, 0.88), 0 0 30px color-mix(in srgb, var(--dot, var(--cosmos-aqua)) 70%, transparent);
}

body.cosmos-ui.harita-kagit .lvlDot:is(:nth-child(1),
body.cosmos-ui.harita-kagit :nth-child(7),
body.cosmos-ui.harita-kagit :nth-child(8),
body.cosmos-ui.harita-kagit :nth-child(9),
body.cosmos-ui.harita-kagit :nth-child(12),
body.cosmos-ui.harita-kagit :nth-child(16),
body.cosmos-ui.harita-kagit :nth-child(20),
body.cosmos-ui.harita-kagit :nth-child(21),
body.cosmos-ui.harita-kagit :nth-child(28),
body.cosmos-ui.harita-kagit :nth-child(40)) {
  background: radial-gradient(circle at 34% 25%, rgba(255, 255, 255, .34) 0 6%, transparent 7%),
    radial-gradient(circle at 42% 38%, color-mix(in srgb, var(--dot, var(--cosmos-aqua)) 86%, #fff 8%), color-mix(in srgb, var(--dot, var(--cosmos-violet)) 44%, #462811) 58%, #3d2411 100%);
  box-shadow: inset -9px -10px 15px rgba(38, 20, 6, 0.34), 0 0 0 3px rgba(45, 25, 9, 0.65), 0 0 24px color-mix(in srgb, var(--dot, var(--cosmos-aqua)) 38%, transparent);
}

body.cosmos-ui.harita-kagit .mementoWrap {
  background: radial-gradient(circle at 10% 0%, rgba(var(--cosmos-aqua-rgb), .15), transparent 34%),
    radial-gradient(circle at 94% 100%, rgba(var(--cosmos-violet-rgb), .19), transparent 38%),
    linear-gradient(145deg, rgba(59, 33, 11, 0.98), rgba(50, 24, 11, 0.98));
}

body.cosmos-ui.harita-kagit .mementoSlot {
  border-color: rgba(238, 190, 119, 0.27);
  background: linear-gradient(145deg, rgba(var(--cosmos-aqua-rgb), .08), rgba(var(--cosmos-violet-rgb), .1)), rgba(36, 20, 6, 0.82);
}

body.cosmos-ui.harita-kagit.game-active {
  background: #211307;
}

body.cosmos-ui.harita-kagit.game-active.storybook .frame {
  background: #3a210a;
}

body.cosmos-ui.harita-kagit.game-active.storybook .hud {
  background: radial-gradient(circle at 15% -20%, rgba(var(--cosmos-aqua-rgb), .18), transparent 45%),
    linear-gradient(180deg, rgba(74, 40, 11, 0.97), rgba(49, 27, 10, 0.96));
}

body.cosmos-ui.harita-kagit.game-active.storybook .hud .chip,
body.cosmos-ui.harita-kagit.game-active.storybook .hud .chip.mint,
body.cosmos-ui.harita-kagit.game-active.storybook .hud .chip.gold,
body.cosmos-ui.harita-kagit.game-active.storybook .hud .chip.dim {
  color: rgba(253, 245, 237, 0.9);
}

body.cosmos-ui.harita-kagit.game-active.storybook #comBar,
body.cosmos-ui.harita-kagit.game-active.storybook #comBar.bilgi {
  color: rgba(251, 239, 222, 0.92);
  background: linear-gradient(180deg, rgba(52, 29, 11, 0.96), rgba(41, 23, 9, 0.96));
}

body.cosmos-ui.harita-kagit.game-active.storybook #comBar.uyari {
  background: linear-gradient(180deg, rgba(76, 25, 18, 0.97), rgba(47, 20, 14, 0.97));
}

body.cosmos-ui.harita-kagit.game-active.storybook #comBar.basari {
  background: linear-gradient(180deg, rgba(75, 50, 11, 0.97), rgba(65, 38, 8, 0.97));
}

body.cosmos-ui.harita-kagit.game-active.storybook .underActions .chip {
  background: linear-gradient(145deg, rgba(111, 65, 37, 0.92), rgba(56, 33, 14, 0.96));
}

body.cosmos-ui.harita-kagit.game-active.storybook #powerChip {
  background: radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .24), transparent 25%),
    linear-gradient(145deg, rgba(227, 173, 76, 0.9), rgba(199, 116, 66, 0.96));
}

body.cosmos-ui.harita-kagit.game-active.storybook .padBtn {
  background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, .13), transparent 25%),
    linear-gradient(145deg, rgba(127, 89, 30, 0.92), rgba(88, 51, 22, 0.96));
}

body.cosmos-ui.harita-kagit.game-active.storybook #ogretimKarti {
  color: #fdf8f0;
  background: linear-gradient(105deg, rgba(51, 28, 9, 0.96), rgba(72, 33, 13, 0.94));
}

body.cosmos-ui.harita-kagit.storybook .veil {
  background: linear-gradient(180deg, rgba(40, 22, 8, 0.34), rgba(35, 19, 6, 0.86));
}

body.cosmos-ui.harita-kagit.storybook .vCard {
  color: #fdf7f0;
  background: radial-gradient(circle at 15% 0%, rgba(var(--cosmos-aqua-rgb), .18), transparent 38%),
    linear-gradient(150deg, rgba(83, 45, 11, 0.97), rgba(66, 29, 12, 0.98));
}

body.cosmos-ui.harita-kagit.storybook .vCard p {
  color: rgba(252, 241, 230, 0.8);
}

body.cosmos-ui.harita-kagit.storybook .vCard .chip {
  background: rgba(36, 20, 7, 0.76);
  color: #fdf5eb;
}

body.cosmos-ui.harita-kagit.storybook .vBtns .btn:first-child {
  color: #311d0b;
  background: linear-gradient(180deg, #fff09a, #e6b756);
}

body.cosmos-ui.harita-kagit.storybook .btn.ghost {
  color: #fcf4ea;
  border-color: rgba(244, 208, 163, 0.48);
}

body.cosmos-ui.harita-kagit.game-active.storybook .vBtns {
  background: linear-gradient(180deg, rgba(69, 37, 10, 0), rgba(65, 36, 12, 0.96) 34%);
}

@media (max-width: 1024px), (any-pointer: coarse) {
  body.cosmos-ui.harita-kagit.game-active.storybook #game {
    background: #211307;
  }

}
body.cosmos-ui.harita-kagit.game-active.storybook {
  --hud-navy: #522c14;
  --hud-navy-deep: #321c0b;
  --hud-teal: #d18d18;
  background: radial-gradient(circle at 52% 36%, rgba(255, 155, 0, 0.26), transparent 30%),
    radial-gradient(circle at 13% 62%, rgba(212, 123, 58, 0.34), transparent 27%),
    radial-gradient(circle at 84% 71%, rgba(231, 112, 73, 0.27), transparent 28%),
    linear-gradient(180deg, #351c09, #683407 48%, #723a04);
}

body.cosmos-ui.harita-kagit.game-active.storybook .planetMedallion {
  background: radial-gradient(circle at 42% 34%, #dca342 0 13%, #dea26b 28%, #7f5031 46%, #452613 69%),
    #452613;
  box-shadow: inset 0 0 0 3px #7e4d36,
    inset -10px -13px 16px rgba(39, 20, 6, 0.55),
    0 0 0 2px rgba(125, 66, 43, 0.86),
    0 10px 25px rgba(32, 15, 3, 0.55),
    0 0 24px rgba(232, 167, 66, 0.2);
}

body.cosmos-ui.harita-kagit.game-active.storybook .planetMedallion::before {
  box-shadow: 0 0 10px rgba(231, 165, 59, 0.42);
}

body.cosmos-ui.harita-kagit.game-active.storybook .planetMedallion::after {
  background: radial-gradient(circle at 35% 30%, #fbf0dd, #d59d42 36%, #b87d5b 74%);
  box-shadow: inset -6px -5px 8px rgba(78, 38, 10, 0.48), 0 0 12px rgba(233, 172, 73, 0.65);
}

body.cosmos-ui.harita-kagit.game-active.storybook .planetMedallion #planetChip {
  text-shadow: 0 2px 2px #442310, 0 0 8px rgba(255, 219, 99, .3);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudPanel {
  background: linear-gradient(180deg, rgba(134, 84, 54, 0.96), rgba(79, 43, 20, 0.98)),
    var(--hud-navy);
  box-shadow: inset 0 0 0 2px rgba(112, 65, 46, 0.94),
    inset 0 1px 0 rgba(255, 246, 185, .3),
    0 9px 23px rgba(34, 16, 3, 0.5);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudCell {
  box-shadow: inset -1px 0 0 rgba(44, 23, 7, 0.48);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudCell .chip,
body.cosmos-ui.harita-kagit.game-active.storybook .hudCell .chip.mint,
body.cosmos-ui.harita-kagit.game-active.storybook .hudCell .chip.dim {
  text-shadow: 0 2px 2px #2d180a;
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudScore #recChip {
  color: rgba(251, 235, 221, 0.58);
}

body.cosmos-ui.harita-kagit.game-active.storybook .levelTrack {
  border: 1px solid #96705f;
  background: #331c0b;
}

body.cosmos-ui.harita-kagit.game-active.storybook .levelTrack i {
  background: linear-gradient(90deg, #f09614, #e7a93f);
  box-shadow: 0 0 9px rgba(232, 169, 67, 0.72);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudTop > .underActions .chip {
  background: radial-gradient(circle at 34% 25%, #9c6e55, #643a21 62%, #3d200d);
  box-shadow: inset 0 0 0 2px #774c3d, inset 0 1px 0 rgba(255, 245, 182, .3), 0 8px 18px rgba(31, 14, 3, 0.48);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudTop > .underActions .chip::before {
  text-shadow: 0 2px 2px #3f2110;
}

body.cosmos-ui.harita-kagit.game-active.storybook .journeyAvatar {
  background: #78541b;
  box-shadow: inset 0 0 0 2px #8c672e, 0 7px 17px rgba(32, 15, 3, 0.45);
}

body.cosmos-ui.harita-kagit.game-active.storybook .journeyLine {
  background: linear-gradient(180deg, rgba(103, 62, 36, 0.96), rgba(67, 38, 18, 0.97));
  box-shadow: inset 0 0 0 2px rgba(109, 67, 51, 0.9), 0 7px 16px rgba(32, 15, 3, 0.34);
}

@media (max-width: 1024px), (any-pointer: coarse) {
  body.cosmos-ui.harita-kagit.game-active.storybook .hud {
    background: linear-gradient(180deg, rgba(43, 23, 7, 0.44), transparent);
  }

  body.cosmos-ui.harita-kagit.game-active.vs-mod .underRow .hint {
    color: rgba(245, 210, 170, 0.58);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook #pad {
    filter: drop-shadow(0 10px 20px rgba(36, 17, 3, 0.48));
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .padBtn {
    background: radial-gradient(circle at 35% 24%, #835e21, #654107 58%, #462c07);
    box-shadow: inset 0 0 0 3px #6a4616, inset 0 1px 0 rgba(255, 249, 197, .25), 0 9px 20px rgba(36, 17, 3, 0.48), 0 0 12px rgba(219, 151, 30, 0.15);
    text-shadow: 0 2px 2px #4a2d06;
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .padBtn:active {
    box-shadow: inset 0 0 0 3px #76511a, 0 4px 12px rgba(36, 17, 3, 0.45), 0 0 18px rgba(232, 163, 36, 0.34);
  }

  body.cosmos-ui.harita-kagit.game-active.storybook #powerChip,
  body.cosmos-ui.harita-kagit.game-active.storybook #powerChip.on {
    box-shadow: inset 0 0 0 3px rgba(155, 76, 43, 0.92), inset 0 1px 0 rgba(255, 244, 190, .32), 0 10px 24px rgba(38, 17, 3, 0.58), 0 0 20px rgba(238, 152, 119, 0.38);
    text-shadow: 0 2px 2px #5e2b13;
  }

  body.cosmos-ui.harita-kagit.game-active.storybook .veil {
    background: linear-gradient(180deg, rgba(50, 28, 10, 0.32), rgba(43, 23, 9, 0.83));
  }

}
body.cosmos-ui.harita-kagit.storybook #overCard.win {
  background: radial-gradient(circle at 18% 8%, rgba(var(--cosmos-mint-rgb), .2), transparent 42%),
    linear-gradient(150deg, rgba(59, 40, 12, 0.97), rgba(76, 43, 14, 0.98));
}

body.cosmos-ui.harita-kagit.storybook #overCard.fail {
  background: radial-gradient(circle at 82% 8%, rgba(var(--cosmos-coral-rgb), .18), transparent 40%),
    linear-gradient(150deg, rgba(58, 20, 14, 0.97), rgba(62, 29, 12, 0.98));
}

body.cosmos-ui.harita-kagit.game-active.storybook .hud {
  background: linear-gradient(180deg, rgba(43, 23, 7, 0.52), rgba(43, 23, 7, 0.16) 68%, transparent);
}

body.cosmos-ui.harita-kagit .hudBar {
  background: rgba(36, 21, 9, 0.74);
  box-shadow: 0 6px 18px rgba(31, 14, 3, 0.34), inset 0 1px 0 rgba(247, 222, 188, 0.08);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudBar .planetMedallion i {
  background: radial-gradient(circle at 34% 30%, #fbf0dd, #d59d42 38%, #b87d5b 76%);
  box-shadow: inset -4px -4px 7px rgba(78, 38, 10, 0.5), 0 0 10px rgba(233, 172, 73, 0.45);
}

body.cosmos-ui.harita-kagit.game-active.storybook .hudBar .planetMedallion #planetChip {
  text-shadow: 0 1px 2px #3e2210, 0 0 6px rgba(57, 32, 13, 0.9);
}

body.cosmos-ui.harita-kagit .hudNum + .hudNum::before {
  background: rgba(245, 210, 170, 0.22);
}

body.cosmos-ui.harita-kagit .hudBtn {
  border: 1px solid rgba(243, 205, 162, 0.24);
  background: rgba(68, 40, 16, 0.72);
}

body.cosmos-ui.harita-kagit .hudBtn:hover,
body.cosmos-ui.harita-kagit .hudBtn:focus-visible {
  background: rgba(96, 57, 24, 0.86);
}

body.cosmos-ui.harita-kagit .hudRail {
  background: rgba(245, 210, 170, 0.12);
}

body.cosmos-ui.harita-kagit #story #stStats .rol-guc {
  background: rgba(62, 45, 16, 0.38);
  box-shadow: 0 0 16px rgba(var(--cosmos-mint-rgb), .12), inset 0 1px 0 rgba(247, 228, 188, 0.1);
  color: #f0cf84;
}

body.cosmos-ui.harita-kagit #story #stStats .rol-yer {
  color: rgba(250, 234, 219, 0.46);
}

body.cosmos-ui.harita-kagit #over #oStats .rol-sayi {
  border: 1px solid rgba(243, 205, 162, 0.2);
  background: rgba(52, 31, 14, 0.6);
}

body.cosmos-ui.harita-kagit #over #oStats .rol-guc {
  color: rgba(240, 207, 132, 0.9);
}