/* Föhnflitzer – Oberfläche */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;background:#0b1630;overscroll-behavior:none}
body{position:fixed;inset:0;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
  font-family:"Trebuchet MS","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;color:#fff}
#game{position:absolute;inset:0;overflow:hidden}
#cv{position:absolute;left:0;top:0;display:block;touch-action:none}
.hidden{display:none!important}
button{font-family:inherit;cursor:pointer;border:0;touch-action:manipulation}

/* HUD */
#hud{position:absolute;inset:0;pointer-events:none;
  padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
#hud button{pointer-events:auto}
.hud-tl,.hud-tc,.hud-tr,.hud-bl,.hud-br{position:absolute}
.hud-tl{left:max(12px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top))}
.hud-tc{left:50%;transform:translateX(-50%);top:max(10px,env(safe-area-inset-top));text-align:center}
.hud-tr{right:max(12px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));display:flex;gap:8px}
.hud-bl{left:max(14px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom))}
.hud-br{right:max(14px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));display:flex;align-items:flex-end;gap:10px}
.lbl{font-size:12px;letter-spacing:.15em;text-transform:uppercase;opacity:.85;font-weight:700}
.txt-shadow,#score,#mult,#stage,#speed,.lbl,.unit,#meterLbl,#meterKey{text-shadow:0 2px 0 rgba(10,20,60,.55),0 0 10px rgba(10,20,60,.35)}
.scoreRow{display:flex;align-items:baseline;gap:8px}
#score{font-size:clamp(24px,4.4vmin,40px);font-weight:900;font-variant-numeric:tabular-nums}
#mult{display:inline-block;font-size:clamp(14px,2.6vmin,22px);font-weight:900;color:#cfe3ff;opacity:.7}
#mult.hot{color:#ffd23a;opacity:1;animation:pulse .6s ease-in-out infinite alternate}
#hearts{display:flex;gap:4px;justify-content:center}
.heart{width:clamp(22px,4vmin,32px);height:clamp(22px,4vmin,32px);filter:drop-shadow(0 2px 2px rgba(0,0,0,.35));transition:transform .2s,opacity .2s}
.heart.lost{opacity:.25;filter:grayscale(1);transform:scale(.8)}
#stage{font-size:clamp(12px,2.2vmin,16px);font-weight:800;margin-top:2px;letter-spacing:.06em}
#speed{font-size:clamp(26px,5vmin,44px);font-weight:900;font-variant-numeric:tabular-nums}
.unit{font-size:14px;font-weight:800;margin-left:4px;opacity:.85}
.icon-btn{width:44px;height:44px;border-radius:14px;background:rgba(15,30,70,.45);backdrop-filter:blur(4px);display:grid;place-items:center;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.icon-btn svg{width:24px;height:24px;fill:#fff;stroke:#fff}
.icon-btn:active{transform:scale(.92)}
.mute-btn .cross{display:none}
.mute-btn.muted .cross{display:inline}
.mute-btn.muted .wave{display:none}
#meterWrap{text-align:right}
#meterLbl{font-size:13px;font-weight:900;letter-spacing:.2em}
#meter{width:clamp(110px,22vmin,180px);height:14px;border-radius:8px;background:rgba(10,20,50,.5);box-shadow:inset 0 0 0 2px rgba(255,255,255,.4);overflow:hidden;margin-top:3px}
#meterFill{height:100%;width:0;background:linear-gradient(90deg,#7ff4ff,#ff7ad9);border-radius:8px;transition:width .15s}
#meterKey{font-size:11px;opacity:0;margin-top:3px;font-weight:800}
#meterWrap.full #meterKey{opacity:1;animation:pulse .5s infinite alternate}
#meterWrap.full #meter{box-shadow:inset 0 0 0 2px #fff,0 0 14px #ff7ad9}
#btnBoost{display:none;width:68px;height:68px;border-radius:50%;font-size:30px;background:rgba(15,30,70,.5);color:#fff;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.35);opacity:.6}
#btnBoost.ready{opacity:1;background:linear-gradient(135deg,#ff7ad9,#7f5cff);box-shadow:0 0 18px #ff7ad9,inset 0 0 0 3px #fff;animation:pulse .5s infinite alternate}
body.touch #btnBoost{display:block}
body.touch #meterKey{display:none}
#hint{position:absolute;left:50%;bottom:max(90px,12vh);transform:translateX(-50%);background:rgba(10,20,50,.55);padding:8px 14px;border-radius:12px;
  font-size:clamp(12px,2.2vmin,16px);font-weight:700;white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis;animation:fadein .5s}
body.portrait #hint{white-space:normal;text-align:center;width:86vw}

/* Banner */
#banner{position:absolute;left:0;right:0;top:24%;text-align:center;pointer-events:none;opacity:0}
#banner.show{animation:banner 2.2s ease-out forwards}
#banner .b1{font-size:clamp(40px,10vmin,90px);font-weight:900;letter-spacing:.02em;
  background:linear-gradient(#fff,#ffe07a);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 0 rgba(20,30,80,.6))}
#banner .b2{font-size:clamp(16px,3.4vmin,26px);font-weight:800;text-shadow:0 2px 0 rgba(20,30,80,.6)}

/* Screens */
.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at center,rgba(10,20,60,.15),rgba(10,20,60,.55));padding:16px;overflow:auto;animation:fadein .35s}
.panel{position:relative;width:min(520px,94vw);background:rgba(12,28,70,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-radius:26px;padding:clamp(18px,4vmin,34px);text-align:center;box-shadow:0 20px 60px rgba(0,0,30,.4),inset 0 0 0 2px rgba(255,255,255,.18);margin:auto}
.panel.small{width:min(360px,90vw)}
.logo{font-size:clamp(46px,11vmin,84px);line-height:.95;font-weight:900;letter-spacing:-.01em;filter:drop-shadow(0 5px 0 rgba(10,20,60,.55))}
.logo span:first-child{background:linear-gradient(#ffffff,#9fe8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo span:last-child{background:linear-gradient(#ffe98a,#ff5a7a);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{font-weight:800;letter-spacing:.3em;text-transform:uppercase;font-size:clamp(11px,2.2vmin,15px);margin-top:6px;color:#cfe8ff}
.tag{margin:14px auto 18px;max-width:420px;font-size:clamp(13px,2.4vmin,16px);line-height:1.45;opacity:.95}
h2{font-size:clamp(34px,8vmin,56px);font-weight:900;margin-bottom:8px;filter:drop-shadow(0 4px 0 rgba(10,20,60,.5))}
.big-btn{display:block;width:100%;max-width:320px;margin:10px auto;padding:16px 20px;border-radius:18px;font-size:clamp(20px,4vmin,26px);font-weight:900;color:#2a1600;
  background:linear-gradient(#ffe36a,#ffad1f);box-shadow:0 6px 0 #c4740a,0 10px 24px rgba(0,0,0,.3);letter-spacing:.03em;animation:bob 1.6s ease-in-out infinite}
.big-btn:active{transform:translateY(4px);box-shadow:0 2px 0 #c4740a}
.big-btn:focus-visible,.mid-btn:focus-visible,.icon-btn:focus-visible{outline:3px solid #7ff4ff;outline-offset:3px}
.mid-btn{display:block;width:100%;max-width:320px;margin:10px auto;padding:12px 18px;border-radius:16px;font-size:18px;font-weight:800;color:#fff;
  background:linear-gradient(#4fb6ff,#2a6fe0);box-shadow:0 5px 0 #1b4aa0}
.mid-btn.ghost{background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.mid-btn:active{transform:translateY(3px)}
.best{font-weight:800;margin:8px 0 12px;font-size:17px}
.best b{color:#ffd23a}
.controls{font-size:13px;line-height:1.9;opacity:.9}
kbd{display:inline-block;min-width:24px;padding:0 6px;margin:0 2px;border-radius:6px;background:rgba(255,255,255,.18);box-shadow:inset 0 -2px 0 rgba(0,0,0,.25);font-family:inherit;font-weight:800;font-size:12px}
.touchc{display:none}
body.touch .touchc{display:block}
body.touch .desk{display:none}
@media (hover:hover) and (pointer:fine){ body.touch .desk{display:block} body.touch .touchc{display:none} }
.corner{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:2}
.badge{display:inline-block;background:linear-gradient(90deg,#ff5a7a,#ffb21c);padding:6px 14px;border-radius:999px;font-weight:900;margin-bottom:8px;animation:pulse .5s infinite alternate}
.bigscore{font-size:clamp(44px,10vmin,72px);font-weight:900;color:#ffd23a;line-height:1;margin:2px 0 12px;filter:drop-shadow(0 4px 0 rgba(10,20,60,.5))}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px auto 14px;max-width:380px}
.stats div{background:rgba(255,255,255,.1);border-radius:12px;padding:8px}
.stats span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.stats b{font-size:20px}
#rotate{display:none;position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:12px;opacity:.85;background:rgba(10,20,50,.5);padding:6px 12px;border-radius:10px;white-space:nowrap;pointer-events:none}
body.portrait.touch #title:not(.hidden) ~ #rotate{display:block}
.noscript{position:absolute;inset:0;display:grid;place-items:center;font-size:20px}

/* kompakte Höhen (Handy quer) */
@media (max-height:480px){
  .panel{padding:14px 18px;border-radius:18px}
  .logo{font-size:40px}
  .tag{display:none}
  .big-btn{padding:10px;margin:6px auto;font-size:20px}
  .mid-btn{padding:8px;margin:6px auto;font-size:16px}
  .controls{line-height:1.5;font-size:12px}
  .stats{grid-template-columns:repeat(4,1fr);margin:4px auto 8px;max-width:100%}
  .stats b{font-size:16px}
  .bigscore{font-size:40px;margin-bottom:6px}
  h2{font-size:30px;margin-bottom:2px}
  #btnBoost{width:58px;height:58px}
}
@keyframes pulse{from{transform:scale(1)}to{transform:scale(1.08)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes banner{0%{opacity:0;transform:scale(.6)}12%{opacity:1;transform:scale(1.08)}20%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(-20px)}}
@media (prefers-reduced-motion:reduce){.big-btn,#mult.hot,.badge{animation:none}}

/* ---------- v2: Bestenliste, Teilen, iframe ---------- */
body{touch-action:manipulation}
body:not(.embedded){overscroll-behavior:none}
body.embedded,html:has(body.embedded){overscroll-behavior:auto}
#cv{outline:none}
.icon-btn.fs-btn svg{fill:none;stroke:#fff}
.fs-btn .fs-off{display:none}
body.is-fs .fs-btn .fs-on{display:none}
body.is-fs .fs-btn .fs-off{display:inline}
.corner{display:flex;gap:8px}
.mid-btn.slim{padding:9px 16px;font-size:16px;margin-top:4px}
.panel.wide{width:min(900px,96vw)}
.over-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.over-grid>*{min-width:0}
@media (min-width:760px){ .over-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .over-board{border-left:1px solid rgba(255,255,255,.15);padding-left:18px}
  .over-board .board{max-height:max(180px,calc(100vh - 250px));overflow:auto;overscroll-behavior:contain} }
@media (max-height:480px) and (min-width:600px){ .over-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px} .over-board{max-height:78vh;overflow:auto} }
.btn-row{display:flex;gap:10px;max-width:320px;margin:0 auto}
.btn-row .mid-btn{margin:4px 0;flex:1;padding:11px 8px;font-size:16px}
.mid-btn.share{background:linear-gradient(#5be0a0,#22a86a);box-shadow:0 5px 0 #157a4b}
.msg{min-height:1.4em;font-size:14px;font-weight:700;margin:6px 0;color:#e6f0ff}
.msg:empty{min-height:0;margin:0}
.msg.ok{color:#8dffb5}
.msg.err{color:#ffb3bd}
.msg.warn{color:#ffe08a}
.news-link{display:inline-block;margin-top:8px;color:#bfe3ff;font-weight:800;font-size:14px;text-decoration:underline;text-underline-offset:3px}
.news-link:hover{color:#fff}
h3{font-size:18px;font-weight:900;margin:0 0 8px;letter-spacing:.02em}
.submit-form{margin:4px 0 8px;text-align:left}
.submit-form label{display:block;font-size:13px;font-weight:800;margin-bottom:5px;opacity:.9}
.submit-form .row{display:flex;gap:8px}
.submit-form input{flex:1;min-width:0;font:inherit;font-size:16px;font-weight:700;padding:10px 12px;border-radius:12px;border:0;color:#14204a;background:#fff;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.08);user-select:text;-webkit-user-select:text;touch-action:manipulation}
.submit-form input:focus{outline:3px solid #7ff4ff;outline-offset:1px}
.submit-form .mid-btn{width:auto;flex:none;white-space:nowrap;margin:0;padding:10px 14px;font-size:16px}
.submit-form .mid-btn:disabled{opacity:.6}
.fine{font-size:11px;opacity:.7;margin-top:5px}
.board{list-style:none;text-align:left;margin:6px 0 4px;padding:0;font-size:14px;counter-reset:none}
.board li{display:grid;grid-template-columns:2.2em 1fr auto auto;gap:8px;align-items:center;padding:5px 8px;border-radius:9px}
.board li:nth-child(odd){background:rgba(255,255,255,.07)}
.board li.me{background:linear-gradient(90deg,rgba(255,210,58,.45),rgba(255,122,217,.3));box-shadow:inset 0 0 0 2px #ffd23a}
.board li.empty{display:block;text-align:center;opacity:.8;background:none}
.board .rk{font-weight:900;opacity:.85}
.board .nm{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board .dt{font-size:11px;opacity:.65}
.board .sc{min-width:4.2em;font-weight:900;color:#ffd23a;font-variant-numeric:tabular-nums;text-align:right}
.board li:nth-child(1) .rk{color:#ffd23a}.board li:nth-child(2) .rk{color:#dfe8f5}.board li:nth-child(3) .rk{color:#f0a868}
#boardScreen .board{max-height:min(56vh,520px);overflow:auto}
.offscreen{position:fixed;left:-9999px;top:0;opacity:0}
@media (max-width:420px){ .board .dt{display:none} .board li{grid-template-columns:2em 1fr auto} }

/* ---------- v3: Map-Auswahl, Tages-Challenge, Erfolge, Shop, Statistik, Toasts ---------- */
#title .panel{padding:clamp(14px,3.2vmin,30px)}
.title-meta{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;font-weight:800;font-size:15px;margin:10px 0 6px}
.title-meta b{color:#ffd23a}
.taler-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,210,58,.16);box-shadow:inset 0 0 0 1.5px rgba(255,210,58,.55);padding:4px 12px 4px 6px;border-radius:999px;font-weight:800}
.taler-pill b{color:#ffd23a}
.coin-ico{display:inline-block;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 38% 34%,#fff6b8 0,#ffcf3a 45%,#c98a10 100%);box-shadow:inset 0 0 0 2px #a86e08}
.map-sel{display:flex;align-items:center;justify-content:center;gap:10px;margin:6px auto 4px;max-width:340px}
.map-sel .icon-btn{font-size:28px;font-weight:900;color:#fff;line-height:1;flex:none}
.map-mid{flex:1;min-width:0;background:rgba(255,255,255,.08);border-radius:14px;padding:6px 8px}
.map-lbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.7;font-weight:800}
#mapName{font-size:20px;font-weight:900}
.map-lock{font-size:12px;font-weight:700;opacity:.8;min-height:1.2em}
.map-sel.locked .map-lock{color:#ffe08a;opacity:1}
.map-dots{font-size:9px;letter-spacing:2px;opacity:.7}
.map-sel.locked #mapName{opacity:.75}
.daily{margin:8px auto 10px;max-width:360px;text-align:left;background:rgba(255,255,255,.09);border-radius:14px;padding:9px 12px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18)}
.daily.done{box-shadow:inset 0 0 0 2px #8dffb5;background:rgba(80,220,140,.14)}
.daily .dl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:900;color:#ffe08a}
.daily .dt2{font-size:16px;font-weight:900;margin:2px 0 6px}
.bar{height:8px;border-radius:99px;background:rgba(0,0,0,.3);overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#ffd23a,#ff7ad9)}
.daily.done .bar i{background:#8dffb5}
.daily .fine{margin-top:5px;font-size:12px;opacity:.85}
.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:360px;margin:6px auto 10px}
.menu-grid .mid-btn{margin:0;max-width:none;padding:10px 6px;font-size:15px}
.menu-grid small{font-size:11px;opacity:.75;font-weight:700}
.over-daily{font-size:14px;font-weight:800;margin:2px auto 6px;max-width:380px;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.08)}
.over-daily.ok{background:rgba(80,220,140,.18);color:#c8ffd8}
.over-earn{font-size:13px;font-weight:700;color:#ffe08a;margin:0 auto 6px;max-width:400px}
/* Erfolge */
.ach-list{list-style:none;text-align:left;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:12px 0;max-height:min(60vh,560px);overflow:auto;overscroll-behavior:contain;padding-right:4px}
@media (min-width:760px){ .ach-list{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
.ach{display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.06);border-radius:12px;padding:9px 10px;opacity:.82}
.ach.on{background:linear-gradient(90deg,rgba(255,210,58,.22),rgba(255,122,217,.12));box-shadow:inset 0 0 0 1.5px rgba(255,210,58,.6);opacity:1}
.ach .ai{font-size:26px;line-height:1;flex:none;width:34px;text-align:center;filter:grayscale(1)}
.ach.on .ai{filter:none}
.ach .at{min-width:0;flex:1}
.ach b{display:block;font-size:15px}
.ach .ad{display:block;font-size:12.5px;opacity:.85;margin:2px 0 4px}
.ach .as{display:block;font-size:11.5px;opacity:.8;margin-top:3px}
.ach.on .as{color:#c8ffd8;opacity:1}
/* Shop */
.shop-head{display:flex;flex-direction:column;align-items:center;gap:4px;margin:4px 0 8px}
.tabs{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-bottom:6px}
.tabs button{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font-weight:800;font-size:14px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3)}
.tabs button.on{background:#fff;color:#14204a}
.tabs button:focus-visible{outline:3px solid #7ff4ff;outline-offset:2px}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;max-height:min(56vh,520px);overflow:auto;overscroll-behavior:contain;padding:2px 4px 2px 2px;text-align:center}
.card{background:rgba(255,255,255,.08);border-radius:14px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:3px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.15)}
.card.eq{box-shadow:inset 0 0 0 2.5px #8dffb5;background:rgba(80,220,140,.12)}
.card .pv{width:100%;max-width:150px;aspect-ratio:260/220;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35))}
.card .pv.map{aspect-ratio:16/9;object-fit:cover;border-radius:10px}
.card.locked .pv{opacity:.9}
.card .cn{font-size:15px}
.card .cd{font-size:12px;opacity:.8;line-height:1.3;min-height:2.6em}
.card .ca{font-size:11px;color:#ffe08a;font-weight:700}
.card .cb{margin:4px 0 0;padding:8px 6px;font-size:14px;max-width:none;width:100%}
.card .cb.poor{background:linear-gradient(#8a93b8,#5a6488);box-shadow:0 4px 0 #3a4268}
.card .cb:disabled{background:rgba(141,255,181,.25);box-shadow:none;color:#c8ffd8;cursor:default}
/* Statistik */
.stats-list{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;text-align:left;margin:12px 0 6px}
@media (min-width:560px){ .stats-list{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:14px} }
.stats-list .st{display:flex;justify-content:space-between;gap:10px;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.07);font-size:14px}
.stats-list .st b{color:#ffd23a;white-space:nowrap}
.danger-ghost{color:#ffb3bd;box-shadow:inset 0 0 0 2px rgba(255,120,140,.55)}
.mid-btn.danger{background:linear-gradient(#ff6a7a,#d8203a);box-shadow:0 5px 0 #8a1020}
/* Dialog */
.screen.modal{z-index:20;background:rgba(5,10,30,.6)}
.confirm-text{font-size:15px;line-height:1.45;margin:8px 0 10px;opacity:.95}
/* Toasts */
.toasts{position:absolute;left:50%;transform:translateX(-50%);top:max(70px,calc(env(safe-area-inset-top) + 64px));z-index:30;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none;width:min(420px,92vw)}
.toast{display:flex;align-items:center;gap:10px;background:rgba(12,28,70,.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:14px;padding:8px 14px;box-shadow:0 8px 24px rgba(0,0,30,.35),inset 0 0 0 1.5px rgba(255,210,58,.6);animation:toastIn .35s ease-out;transition:opacity .45s,transform .45s;max-width:100%}
.toast.out{opacity:0;transform:translateY(-10px)}
.toast .ti{font-size:24px;line-height:1}
.toast .tt{display:flex;flex-direction:column;text-align:left;min-width:0}
.toast b{font-size:14px}
.toast span{font-size:12px;opacity:.9}
.toasts.low{top:auto;bottom:max(14px,env(safe-area-inset-bottom))}
@media (max-height:560px) and (max-width:599px){ #title{padding-top:58px} #title .corner .icon-btn{width:38px;height:38px} #title .sub{display:none} #title .logo{font-size:36px} .daily{margin:6px auto} .menu-grid .mid-btn{padding:8px 4px;font-size:14px} }
@keyframes toastIn{from{opacity:0;transform:translateY(-14px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .toast{animation:none} }
/* kleine Höhen / Handy */
@media (max-height:760px){ #title .tag{display:none} #title .controls{display:none} #title .logo{font-size:clamp(40px,9vmin,64px)} }
@media (max-width:420px){ #title .panel{width:96vw} .daily .dt2{font-size:15px} }
@media (max-height:480px) and (min-width:600px){
  #title .panel{width:min(760px,96vw);display:grid;grid-template-columns:1fr 1fr;column-gap:16px;align-items:center}
  #title .logo{grid-column:1;grid-row:1} #title .sub{grid-column:1;grid-row:2} #title .title-meta{grid-column:1;grid-row:3}
  #title .map-sel{grid-column:1;grid-row:4} #title #btnStart{grid-column:1;grid-row:5}
  #title .daily{grid-column:2;grid-row:1/4;align-self:end} #title .menu-grid{grid-column:2;grid-row:4/6;align-self:start}
  #title .logo{font-size:34px} .daily{margin:4px 0} .menu-grid{margin:4px 0}
  .shop-grid,.ach-list{max-height:52vh} .card .pv{max-width:96px} .card .cd{min-height:0}
}
