/* ===== Aufzug.net – Pixel-Plaza ===== */
:root{--amber:#ffb627;--ink:#0d0b1a;--panel:#15122b;--muted:#a79dcc}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#07060f;color:#f4efe6;font-family:'Pixelify Sans',ui-monospace,monospace;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}
button{font:inherit}
button:focus-visible,a:focus-visible{outline:3px dashed var(--amber);outline-offset:3px}

/* Pixel-Ecken */
.px{clip-path:polygon(0 6px,6px 6px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 6px),0 calc(100% - 6px))}
.pxc{clip-path:polygon(28.57% 0,71.43% 0,71.43% 14.29%,85.71% 14.29%,85.71% 28.57%,100% 28.57%,100% 71.43%,85.71% 71.43%,85.71% 85.71%,71.43% 85.71%,71.43% 100%,28.57% 100%,28.57% 85.71%,14.29% 85.71%,14.29% 71.43%,0 71.43%,0 28.57%,14.29% 28.57%,14.29% 14.29%,28.57% 14.29%)}

/* Gemeinsame Bedienelemente */
.chip{height:44px;display:inline-flex;align-items:center;gap:8px;padding:0 14px;background:var(--ink);color:#fff;font-family:'Silkscreen',monospace;font-size:13px;border:0;cursor:pointer;text-decoration:none;white-space:nowrap}
.iconbtn{width:44px;padding:0;justify-content:center;color:var(--amber)}
.iconbtn svg{width:20px;height:20px}
.iconbtn.off{opacity:.45}
.btn-amber{min-height:48px;padding:0 20px;border:0;background:var(--amber);color:var(--ink);font-family:'Silkscreen',monospace;font-weight:700;font-size:14px;cursor:pointer;box-shadow:inset -4px -4px 0 rgba(0,0,0,.2),inset 3px 3px 0 rgba(255,255,255,.35)}
.btn-amber:hover{filter:brightness(1.08)}
.btn-ghost{min-height:48px;padding:0 18px;border:0;background:#2a2550;color:#f4efe6;font-family:'Silkscreen',monospace;font-size:13px;cursor:pointer}
.btn-ghost:hover{background:#352f66}
.coin{width:20px;height:20px;background:var(--amber);display:inline-flex;align-items:center;justify-content:center;flex:none}
.coin i{display:block;width:4px;height:10px;background:#a86b00}
.blink{animation:blink 1.4s steps(1) infinite}
@keyframes blink{50%{opacity:.15}}

.ledtxt{display:block;font-family:'Silkscreen',monospace;color:var(--amber);text-shadow:0 0 10px rgba(255,182,39,.6)}

/* ===== Rush Hour ===== */
.rh{position:fixed;inset:0;display:flex;flex-direction:column;background:#0f0c24;user-select:none;-webkit-user-select:none}
.rh-hud{flex:none;display:flex;align-items:center;gap:16px;padding:10px 16px;background:#07060f;box-shadow:inset 0 -4px 0 #000;flex-wrap:wrap}
.rh-stat{display:flex;flex-direction:column;gap:3px;color:#fff;font-family:'Silkscreen',monospace;font-size:18px;line-height:1}
.rh-stat b{font-weight:400;font-size:10px;color:var(--muted);text-transform:uppercase}
.rh-wave{flex:1;min-width:120px}
.rh-wave b span{color:var(--amber)}
.rh-bar{display:block;height:10px;background:#221d42;margin-top:4px}
.rh-bar i{display:block;height:100%;background:var(--amber)}
.rh-hearts{display:flex;gap:4px;padding-top:2px}
.rh-hearts i{display:block;width:16px;height:16px;background:#2a2550;box-shadow:inset 0 0 0 2px #3a3558}
.rh-hearts i.bad{background:#ff4d5e;box-shadow:none}
.rh-btns{display:flex;gap:8px}
.rh-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative;padding:8px}
.rh-stage canvas{display:block;image-rendering:pixelated;touch-action:none;cursor:pointer}
.rh-stage.shake{animation:shake2 .1s steps(2) infinite}
@keyframes shake2{50%{transform:translateX(3px)}}
.rh-tip{flex:none;padding:10px 16px;text-align:center;font-size:14px;line-height:1.35;color:#cfc6e8;background:#07060f;transition:opacity .6s}
.rh-tip.fade{opacity:0}
.rh-combo{position:absolute;top:18px;left:50%;transform:translateX(-50%);font-family:'Silkscreen',monospace;font-weight:700;font-size:24px;color:var(--amber);text-shadow:3px 3px 0 var(--ink);opacity:0;pointer-events:none;white-space:nowrap}
.rh-combo.pop{animation:pop 1s steps(6) forwards}
@keyframes pop{0%{opacity:1;transform:translate(-50%,8px)}70%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-6px)}}
@media (max-width:600px){
  .rh-hud{gap:10px;padding:8px 10px}
  .rh-hud .chip{height:40px;padding:0 10px}
  .rh-hud .iconbtn{width:40px;padding:0}
  .rh-stat{font-size:15px}
  .rh-wave{order:5;flex-basis:100%}
  .rh-tip{font-size:13px}
}

/* ===== Modals & Toast ===== */
.modal-back{position:fixed;inset:0;background:rgba(7,6,15,.75);display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}
.modal{background:var(--panel);box-shadow:inset 0 0 0 4px #0a0816,inset 0 8px 0 0 #221d42;padding:28px 26px 22px;max-width:500px;width:100%;color:#ece7f7;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto}
.m-title{font-family:'Silkscreen',monospace;font-size:22px;line-height:1.2;color:var(--amber);margin:0 0 14px}
.m-text{font-size:16px;line-height:1.45;margin:0}
.m-sub{margin:0 0 14px;color:#cfc6e8;font-size:15px}
.m-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.howlist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.howlist li{display:flex;gap:12px;font-size:15px;line-height:1.4}
.howlist b{flex:none;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--amber);color:var(--ink);font-family:'Silkscreen',monospace}
.upgrades{display:grid;gap:10px}
.upg{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:14px 16px;border:0;background:#221d42;color:#ece7f7;cursor:pointer}
.upg b{font-family:'Silkscreen',monospace;font-size:15px;color:var(--amber)}
.upg span{font-size:14px}
.upg:hover,.upg:focus-visible{background:#2f2860;outline:2px solid var(--amber);outline-offset:-2px}
.over-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.over-stats div{background:#08070f;padding:12px;display:flex;flex-direction:column;gap:6px}
.over-stats b{font-family:'Silkscreen',monospace;font-weight:400;font-size:10px;color:var(--muted);text-transform:uppercase}
.over-stats span{font-family:'Silkscreen',monospace;font-size:22px;color:var(--amber)}
.newbest{font-family:'Silkscreen',monospace;color:#6fd36a;margin:16px 0 0}
.toast{position:fixed;left:50%;bottom:64px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 16px;font-size:15px;z-index:60;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:calc(100% - 32px);box-shadow:inset 0 0 0 2px var(--amber)}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
.cbonus{margin:14px 0 0;padding:10px 12px;background:#0d0b1a;font-size:14px;line-height:1.4;color:#cfc6e8}
.cbonus.ok{color:#9cf58c;box-shadow:inset 0 0 0 2px #9cf58c}
