/* Lohn-Snake · Lohnmeister.ai (27.10.2026) — Styles für assets/lohn-snake.js.
   Arcade-Look: dunkles Spielfeld mit dezentem Raster und Glow, flach, keine Glanz-Badges. Bleibt in Hell- und Dunkelmodus gleich dunkel.
   Layout über Container-Queries: schmal = HUD oben, Feld, Fähigkeit + Steuerkreuz darunter · breit (≥ 820 px) = Feld links, Seitenleiste rechts.
   Knöpfe ≥ 48 px, Steuerkreuz 56 px, kein Querscrollen bei 375 px. */
.ls,.ls-ov{--ls-bg:#0a1520;--ls-bg2:#0e1c29;--ls-card:#132637;--ls-card2:#19314a;--ls-line:rgba(150,200,235,.12);--ls-line2:rgba(150,200,235,.24);
  --ls-ink:#eaf3fa;--ls-mute:#9db2c2;--ls-blue:var(--blue-600,#1190ce);--ls-blue2:#46bdf4;--ls-gold:#f6bd25;--ls-gold2:#ffd257;--ls-ok:#2fbf7a;--ls-bad:#e86452;
  --ls-fd:var(--font-display,"Space Grotesk",system-ui,sans-serif);--ls-fb:var(--font-body,"IBM Plex Sans",system-ui,sans-serif);--hc:#1aa4e6}
html[data-theme=dark] .ls,html[data-theme=dark] .ls-ov{--ls-blue:#1aa4e6}
.ls{container-type:inline-size;position:relative;background:var(--ls-bg2);color:var(--ls-ink);border:1px solid #1d3346;border-radius:24px;padding:clamp(10px,2vw,22px);
  font:15px/1.5 var(--ls-fb);text-align:left;min-width:0;overflow-wrap:break-word;scroll-margin-top:76px;color-scheme:dark}
.ls *,.ls *::before,.ls *::after,.ls-ov *,.ls-ov *::before,.ls-ov *::after{box-sizing:border-box}
.ls h2,.ls h3,.ls-ov h3{font-family:var(--ls-fd);color:var(--ls-ink);margin:0;letter-spacing:-.01em;line-height:1.15;font-weight:600}
:where(.ls,.ls-ov) p{margin:0}
:where(.ls,.ls-ov) button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
.ls :focus-visible,.ls-ov :focus-visible{outline:3px solid var(--ls-gold);outline-offset:2px}
.ls-ic{width:20px;height:20px;flex:none}
.ls-eye{font:600 12px/1.3 var(--ls-fd);letter-spacing:.14em;text-transform:uppercase;color:var(--ls-blue2);margin:0 0 6px}
.ls-mute{color:var(--ls-mute);font-size:14px;line-height:1.5}
html.ls-noscroll body{overflow:hidden}
html.ls-noscroll .lm-mob{visibility:hidden!important}

/* Knöpfe */
.ls-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.ls-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:11px 20px;border-radius:12px;border:1.5px solid var(--ls-line2);
  background:var(--ls-card);color:var(--ls-ink);font:600 15px/1.2 var(--ls-fd);cursor:pointer;text-align:center;transition:background .15s,border-color .15s}
.ls-btn:hover{border-color:var(--ls-blue2);background:var(--ls-card2)}
.ls-btn-go{background:var(--ls-gold);border-color:var(--ls-gold);color:#2a1d00}
.ls-btn-go:hover{background:var(--ls-gold2);border-color:var(--ls-gold2)}
.ls-btn .ls-ic{width:18px;height:18px}
.ls-ib{display:inline-grid;place-items:center;width:48px;min-height:48px;flex:none;border-radius:12px;border:1.5px solid var(--ls-line2);background:var(--ls-card);color:var(--ls-ink);cursor:pointer}
.ls-ib:hover{border-color:var(--ls-blue2)}

/* Figuren: Bild, sonst Kreis mit Initiale */
.ls-fig{position:relative;display:inline-flex;align-items:flex-end;justify-content:center;flex:none}
.ls-fig img{display:block;height:100%;width:auto;max-width:100%;object-fit:contain}
.ls-ini{display:none;place-items:center;width:100%;aspect-ratio:1;max-height:100%;border-radius:50%;background:var(--hc);color:#fff;font:700 clamp(16px,3vw,30px)/1 var(--ls-fd)}
.ls-fig.ls-fail .ls-ini{display:grid}
.ls-ab-fig,.ls-res-fig,.ls-ill-fig{border-radius:50%;overflow:hidden;background:var(--hc);box-shadow:0 0 0 2px var(--hc)}
.ls-ab-fig img,.ls-res-fig img,.ls-ill-fig img{width:100%;height:100%;object-fit:cover}

/* ---------- Startbildschirm ---------- */
.ls-mh{margin:2px 2px 16px}
.ls-mh h2{font-size:clamp(22px,3.4vw,30px)}
.ls-sub{color:var(--ls-mute);margin-top:6px;font-size:14.5px;max-width:62ch}
.ls-eye2{margin:20px 2px 8px}
.ls-heroes{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.ls-hero{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;min-height:96px;padding:10px 40px 10px 10px;border-radius:16px;
  border:2px solid var(--ls-line2);background:var(--ls-card);text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
.ls-hero:hover{border-color:var(--hc)}
.ls-hero.on{border-color:var(--hc);background:var(--ls-card2)}
.ls-hero-fig{height:84px;width:72px}
.ls-hero-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.ls-hero-n{font:700 18px/1.15 var(--ls-fd);color:var(--ls-ink)}
.ls-hero-who{font-size:12.5px;color:var(--ls-mute)}
.ls-hero-ab{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font:600 13.5px/1.2 var(--ls-fd);color:var(--hc)}
.ls-hero-ab .ls-ic{width:17px;height:17px}
.ls-hero-d{font-size:13px;line-height:1.4;color:#c7d6e2}
.ls-chk{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:2px solid var(--ls-line2);color:transparent}
.ls-hero.on .ls-chk{background:var(--hc);border-color:var(--hc);color:#fff}
.ls-chk .ls-ic{width:16px;height:16px}
.ls-lvls{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.ls-lvl{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;align-items:baseline;min-height:52px;padding:9px 14px;border-radius:14px;border:2px solid var(--ls-line2);background:var(--ls-card);text-align:left;cursor:pointer}
.ls-lvl b{font:700 16px/1.2 var(--ls-fd);grid-row:span 2;align-self:center;min-width:64px}
.ls-lvl span{font-size:13px;color:#c7d6e2;line-height:1.35}
.ls-lvl small{font-size:12px;color:var(--ls-mute)}
.ls-lvl:hover{border-color:var(--ls-blue2)}
.ls-lvl.on{border-color:var(--ls-gold);background:var(--ls-card2)}
.ls-lvl.on b{color:var(--ls-gold)}
@container (min-width:560px){
  .ls-lvls{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ls-lvl{grid-template-columns:minmax(0,1fr);row-gap:3px}
  .ls-lvl b{grid-row:auto}
}
@container (min-width:700px){
  .ls-heroes{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .ls-hero{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;padding:14px 14px 16px;align-items:start;justify-items:center;text-align:center}
  .ls-hero-fig{height:150px;width:100%}
  .ls-hero-tx{align-items:center}
  .ls-hero-n{font-size:20px}
}

/* ---------- Spiel ---------- */
.ls-game{display:grid;gap:10px;grid-template-columns:minmax(0,1fr);grid-template-areas:"hud" "stage" "ctrl"}
.ls-hud{grid-area:hud;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 48px;gap:8px}
.ls-stat{background:var(--ls-card);border:1px solid var(--ls-line);border-radius:12px;padding:5px 10px;min-width:0}
.ls-stat span{display:block;font:600 10.5px/1.2 var(--ls-fd);letter-spacing:.1em;text-transform:uppercase;color:var(--ls-mute)}
.ls-stat b{display:block;font:700 20px/1.25 var(--ls-fd);font-variant-numeric:tabular-nums;color:var(--ls-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ls-stat:first-child b{color:var(--ls-gold2)}
.ls-stage{grid-area:stage;position:relative;width:100%;aspect-ratio:1/1;margin-inline:auto;border-radius:12px;overflow:hidden;background:#0a1520;
  box-shadow:0 0 0 1px rgba(26,164,230,.35),0 0 26px rgba(17,144,206,.22);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ls-cv{display:block;width:100%;height:100%}
.ls-ctrl{grid-area:ctrl;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ab pad" "side side";gap:10px;align-items:stretch}
.ls-ab{grid-area:ab;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:64px;padding:10px;border-radius:16px;
  border:2px solid var(--ls-line2);background:var(--ls-card);text-align:center;cursor:pointer;touch-action:manipulation}
.ls-ab:hover{border-color:var(--hc)}
.ls-ab-fig{width:56px;height:56px}
.ls-ab-tx{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;min-width:0}
.ls-ab-tx b{display:inline-flex;align-items:center;gap:6px;font:700 14.5px/1.2 var(--ls-fd);color:var(--ls-ink)}
.ls-ab-tx b .ls-ic{width:17px;height:17px;color:var(--hc)}
.ls-bar{display:block;width:100%;max-width:200px;height:8px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden}
.ls-bar i{display:block;height:100%;width:100%;background:var(--hc);border-radius:4px;transition:width .25s}
.ls-ab small{display:block;min-height:2.6em;font-size:12.5px;line-height:1.3;color:var(--ls-mute)}
.ls-ab-tx b .ls-ic{display:none}
.ls-ib-tx{display:none}
.ls-ab.ready{border-color:var(--hc);background:var(--ls-card2)}
.ls-ab.ready small{color:var(--ls-ink);font-weight:600}
.ls-ab.ready::after{content:"";position:absolute;inset:-5px;border-radius:20px;border:2px solid var(--hc);opacity:0;animation:ls-pulse 1.6s ease-out infinite;pointer-events:none}
.ls-ab.act{border-color:#5fe1ff;background:var(--ls-card2)}
.ls-ab.act .ls-bar i{background:#5fe1ff}
.ls-ab.act small{color:#bff3ff;font-weight:600}
.ls-ab.no{animation:ls-no .32s ease}
.ls-pad{grid-area:pad;display:grid;grid-template-columns:repeat(3,56px);grid-template-rows:repeat(3,56px);gap:6px;align-self:center}
.ls-pd{display:grid;place-items:center;border-radius:14px;border:1.5px solid var(--ls-line2);background:var(--ls-card2);color:var(--ls-ink);cursor:pointer;touch-action:none;
  -webkit-user-select:none;user-select:none;transition:background .1s,transform .1s}
.ls-pd .ls-ic{width:28px;height:28px}
.ls-pd:hover{border-color:var(--ls-blue2)}
.ls-pd.hit{background:var(--ls-blue);border-color:var(--ls-blue2);transform:scale(.95)}
.ls-pd-u{grid-area:1/2}.ls-pd-l{grid-area:2/1}.ls-pd-r{grid-area:2/3}.ls-pd-d{grid-area:3/2}
.ls-side{grid-area:side;display:flex;flex-direction:column;gap:8px;min-width:0}
.ls-keys{font-size:13px;line-height:1.9;color:var(--ls-mute)}
.ls-keys kbd{display:inline-block;min-width:24px;padding:1px 6px;border-radius:6px;border:1px solid var(--ls-line2);border-bottom-width:2px;background:var(--ls-card);
  color:var(--ls-ink);font:600 12px/1.4 var(--ls-fd);text-align:center}
.ls-lvlinfo{font-size:13px;color:var(--ls-mute)}
.ls-lvlinfo b{color:var(--ls-gold)}
.ls-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:#c7d6e2}
.ls-legend span{display:inline-flex;align-items:center;gap:6px}
.lg-coin,.lg-q,.lg-i,.lg-akte{display:inline-grid;place-items:center;width:20px;height:20px;flex:none;font:700 13px/1 var(--ls-fd);font-style:normal}
.lg-coin{border-radius:50%;background:radial-gradient(circle at 50% 46%,#ffd257 0 58%,#e09f14 60% 66%,#f2b51d 68%);box-shadow:0 2px 0 #9a6508}
.lg-coin::after{content:"€";color:#a86f08;font:700 11px/1 var(--ls-fd)}
.lg-q{border-radius:6px;background:#f6bd25;color:#5a3a02;box-shadow:0 2px 0 #a8740a}
.lg-i{border-radius:6px;background:#1aa4e6;color:#fff;box-shadow:0 2px 0 #0a5c88}
.lg-akte{border-radius:4px;background:linear-gradient(#e07a2e 0 30%,#0e1c29 30% 36%,#1190ce 36% 64%,#0e1c29 64% 70%,#d9c49a 70%)}
.ls-lvlinfo{display:none}
@media (pointer:coarse){.ls-keys{display:none}}

/* breit: Feld links, Seitenleiste rechts */
@container (min-width:820px){
  .ls-game{grid-template-columns:minmax(0,600px) 290px;grid-template-areas:"stage hud" "stage ctrl";grid-template-rows:auto 1fr;justify-content:center;column-gap:18px;row-gap:12px;align-items:start}
  .ls-stage{width:min(100%,calc(100vh - 150px));min-width:360px;margin:0}
  .ls-hud{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto}
  .ls-hud .ls-stat:nth-child(3){grid-column:1}
  .ls-hud .ls-ib{grid-column:2;grid-row:2;width:100%}
  .ls-ctrl{grid-template-columns:minmax(0,1fr);grid-template-areas:"ab" "pad" "side";align-content:start}
  .ls-ab{flex-direction:row;justify-content:flex-start;text-align:left;padding:12px}
  .ls-ab-tx{align-items:flex-start}
  .ls-ab-tx b .ls-ic{display:inline}
  .ls-ab small{min-height:0}
  .ls-hud .ls-ib{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px/1 var(--ls-fd)}
  .ls-ib-tx{display:inline}
  .ls-pad{justify-self:center}
  .ls-lvlinfo{display:block}
  .ls-side{gap:12px;padding-top:4px}
}
@media (hover:hover) and (pointer:fine){
  @container (min-width:820px){ .ls-pad{display:none} }
}

/* ---------- Overlays ---------- */
.ls-ov{position:fixed;inset:0;z-index:2147483100;display:flex;padding:16px;overflow:auto;overscroll-behavior:contain;background:rgba(4,10,16,.78);color:var(--ls-ink);
  font:15px/1.5 var(--ls-fb);animation:ls-fade .16s ease-out;color-scheme:dark}
.ls-pan{position:relative;width:min(640px,100%);margin:auto;background:var(--ls-bg2);border:1px solid var(--ls-line2);border-radius:20px;padding:clamp(16px,3.2vw,28px);
  box-shadow:0 30px 80px rgba(0,0,0,.5);animation:ls-pop .2s ease-out;text-align:left}
.ls-pan h3{font-size:clamp(20px,2.6vw,25px)}

/* Fragen */
.ls-qz-top{display:flex;align-items:center;gap:10px;margin-bottom:12px;min-width:0}
.ls-tag{display:inline-grid;place-items:center;width:34px;height:34px;flex:none;border-radius:9px;font:700 21px/1 var(--ls-fd)}
.ls-tag-q{background:#f6bd25;color:#5a3a02;box-shadow:0 3px 0 #a8740a}
.ls-tag-i{background:#1aa4e6;color:#fff;box-shadow:0 3px 0 #0a5c88}
.ls-qz-what{flex:1;min-width:0;font:600 13.5px/1.3 var(--ls-fd);color:var(--ls-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ls-dots{display:inline-flex;gap:6px;flex:none}
.ls-dots i{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.14);border:2px solid transparent}
.ls-dots i.cur{border-color:var(--ls-gold);background:transparent}
.ls-dots i.ok{background:var(--ls-ok)}
.ls-dots i.bad{background:var(--ls-bad)}
.ls-qz-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;font-size:12.5px;color:var(--ls-mute)}
.ls-time{display:block;width:92px;height:6px;flex:none;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.ls-time i{display:block;height:100%;width:100%;background:var(--ls-gold);transform-origin:left center;animation:ls-time 12s linear forwards}
.ls-time.stop i{animation-play-state:paused}
.ls-qz-q{font-size:clamp(17.5px,2.4vw,21px)!important;line-height:1.3!important;margin-bottom:14px!important}
.ls-opts{display:grid;gap:8px}
.ls-opt{display:flex;align-items:flex-start;gap:10px;width:100%;min-height:52px;padding:11px 13px;border-radius:12px;border:1.5px solid var(--ls-line2);background:var(--ls-card);
  color:var(--ls-ink);font:500 15.5px/1.38 var(--ls-fb);text-align:left;cursor:pointer;transition:border-color .12s,background .12s}
.ls-opt:hover:not(:disabled){border-color:var(--ls-blue2);background:var(--ls-card2)}
.ls-opt-k{display:inline-grid;place-items:center;width:26px;height:26px;flex:none;border-radius:7px;background:rgba(255,255,255,.08);font:700 13px/1 var(--ls-fd);color:var(--ls-mute)}
.ls-opt-t{flex:1;min-width:0;padding-top:1px}
.ls-opt:disabled{cursor:default}
.ls-opt:disabled:not(.is-ok):not(.is-bad){opacity:.55}
.ls-opt.is-ok{border-color:var(--ls-ok);background:rgba(47,191,122,.16);opacity:1}
.ls-opt.is-ok .ls-opt-k{background:var(--ls-ok);color:#fff}
.ls-opt.is-bad{border-color:var(--ls-bad);background:rgba(232,100,82,.16)}
.ls-opt.is-bad .ls-opt-k{background:var(--ls-bad);color:#fff}
.ls-opt.is-off{opacity:.32!important;text-decoration:line-through}
.ls-tip{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13.5px;color:#f7b9d8}
.ls-tip .ls-ic{width:17px;height:17px;color:#e0559b}
.ls-res{display:none;margin-top:14px;padding:14px;border-radius:14px;border:1.5px solid var(--ls-line2);background:var(--ls-card)}
.ls-res.show{display:block;animation:ls-pop .18s ease-out}
.ls-res.is-ok{border-color:rgba(47,191,122,.6)}
.ls-res.is-bad{border-color:rgba(232,100,82,.6)}
.ls-res-h{display:flex;gap:12px;align-items:flex-start}
.ls-res-fig{width:46px;height:46px}
.ls-res-h>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.ls-res-h b{font:700 17px/1.25 var(--ls-fd)}
.ls-res.is-ok .ls-res-h b{color:#6fe0a6}
.ls-res.is-bad .ls-res-h b{color:#ff9e8f}
.ls-res-len{font-size:13.5px;font-weight:600;color:var(--ls-ink)}
.ls-res-det{font-size:12.5px;color:var(--ls-mute)}
.ls-say{font-size:13.5px;color:#c7d6e2;font-style:italic}
.ls-ex{margin-top:10px!important;font-size:14px;line-height:1.5;color:#dbe7f0}
.ls-ex b{color:#6fe0a6}
.ls-ex2{color:var(--ls-mute)}
.ls-sum{margin-top:12px!important;padding:9px 12px;border-radius:10px;background:rgba(246,189,37,.12);color:var(--ls-gold2);font:600 14px/1.4 var(--ls-fd)}
.ls-sum.is-bad{background:rgba(232,100,82,.14);color:#ff9e8f}
.ls-res .ls-row{margin-top:14px}
.ls-kurz{color:#c7d6e2;font-size:14.5px;margin:-6px 0 12px!important}
.ls-fact{position:relative;padding:14px 16px;border-radius:14px;background:rgba(26,164,230,.1);border:1.5px solid rgba(70,189,244,.4);margin-bottom:12px}
.ls-fact-l{display:inline-block;margin-bottom:6px;font:700 11.5px/1 var(--ls-fd);letter-spacing:.12em;text-transform:uppercase;color:var(--ls-blue2)}
.ls-fact-q{font-size:14.5px;color:#c7d6e2}
.ls-fact-a{margin-top:4px!important;font:700 17px/1.35 var(--ls-fd);color:#fff}
.ls-fact-ex{margin-top:6px!important;font-size:13.5px;color:var(--ls-mute)}

/* Anleitung */
.ls-help-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ls-help-top .ls-eye{margin:0}
.ls-skip{min-height:44px;padding:8px 12px;border:0;background:none;color:var(--ls-mute);font:600 14px/1 var(--ls-fd);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.ls-skip:hover{color:var(--ls-ink)}
.ls-ill{display:flex;align-items:center;justify-content:center;gap:10px;min-height:110px;margin:10px 0 16px;border-radius:16px;
  background:radial-gradient(circle at 50% 50%,rgba(17,144,206,.22),transparent 70%),#0a1520;border:1px solid var(--ls-line)}
.ls-tile{display:inline-grid;place-items:center;width:52px;height:52px;flex:none;border-radius:12px;font:700 28px/1 var(--ls-fd)}
.ls-tile.lg-coin{width:40px;height:40px;border-radius:50%}
.ls-tile.lg-coin::after{font-size:20px}
.ls-tile.lg-q,.ls-tile.lg-i{width:58px;height:58px;font-size:34px;border-radius:14px}
.ls-tile-head{width:58px;height:58px;border-radius:50%}
.ls-ill-fig{width:58px;height:58px}
.ls-tile-ok{background:rgba(47,191,122,.2);color:#6fe0a6;border:2px solid var(--ls-ok);font-size:22px}
.ls-tile-bad{background:rgba(232,100,82,.2);color:#ff9e8f;border:2px solid var(--ls-bad);font-size:22px}
.ls-tile-ab{border:2px solid var(--hc);color:var(--hc);background:rgba(255,255,255,.04)}
.ls-tile-ab .ls-ic{width:28px;height:28px}
.ls-help-d{margin-top:8px!important;color:#c7d6e2;line-height:1.55}
.ls-hdots{display:flex;gap:7px;margin-top:16px}
.ls-hdots i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.ls-hdots i.on{background:var(--ls-gold);width:22px;border-radius:5px}

/* Pause */
.ls-pan-pause{width:min(460px,100%)}
.ls-pan-pause h3{margin-bottom:6px}

/* Ende */
.ls-pan-end{width:min(760px,100%);display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.ls-end-fig{display:flex;justify-content:center;align-items:flex-end;height:170px;border-radius:16px;background:radial-gradient(circle at 50% 70%,rgba(246,189,37,.22),transparent 65%),#0a1520;border:1px solid var(--ls-line);overflow:hidden}
.ls-end-fig.bad{background:radial-gradient(circle at 50% 70%,rgba(26,164,230,.18),transparent 65%),#0a1520}
.ls-endfig{height:94%;max-width:90%}
.ls-endfig .ls-ini{width:110px;height:110px;align-self:center}
.ls-end-tx h3{font-size:clamp(22px,3.2vw,30px)!important;margin:2px 0 4px}
.ls-say-end{margin-top:8px!important;font-size:14.5px}
.ls-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0 0}
.ls-stats div{padding:8px 12px;border-radius:12px;background:var(--ls-card);border:1px solid var(--ls-line);min-width:0}
.ls-stats dt{font:600 10.5px/1.2 var(--ls-fd);letter-spacing:.1em;text-transform:uppercase;color:var(--ls-mute)}
.ls-stats dd{margin:2px 0 0;font:700 19px/1.2 var(--ls-fd);font-variant-numeric:tabular-nums;color:var(--ls-ink)}
.ls-stats .big dd{font-size:24px;color:var(--ls-gold2)}
@media (min-width:640px){
  .ls-pan-end{grid-template-columns:220px minmax(0,1fr);gap:22px;align-items:start}
  .ls-end-fig{height:300px}
  .ls-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ls-stats .big,.ls-stats div:nth-child(7),.ls-stats div:nth-child(8){grid-column:span 2}
}

/* Animationen */
@keyframes ls-fade{from{opacity:0}to{opacity:1}}
@keyframes ls-pop{from{opacity:0;transform:translateY(6px) scale(.985)}to{opacity:1;transform:none}}
@keyframes ls-pulse{0%{opacity:.85;transform:scale(.985)}100%{opacity:0;transform:scale(1.05)}}
@keyframes ls-no{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@keyframes ls-time{to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){
  .ls-ov,.ls-pan,.ls-res.show,.ls-ab.no{animation:none!important}
  .ls-ab.ready::after{animation:none;opacity:.6;transform:none}
  .ls-btn,.ls-opt,.ls-pd,.ls-bar i{transition:none}
}

/* sehr schmal */
@container (max-width:360px){
  .ls-pad{grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,52px);gap:5px}
  .ls-stat{padding:5px 8px}
  .ls-stat b{font-size:18px}
  .ls-hud{gap:6px}
}
@media (max-width:420px){
  .ls-ov{padding:10px}
  .ls-pan{padding:16px 14px;border-radius:16px}
  .ls-opt{font-size:15px;padding:10px 11px}
}