/* Window Washers — layers on top of /styles.css */
@font-face{font-family:"Kenney Future";src:url(/games/rainbow-dash/assets/fonts/KenneyFuture.ttf) format("truetype");font-display:swap}
body::after{display:none}
html,body{overflow:hidden;touch-action:none;overscroll-behavior:none}
[hidden]{display:none !important}
#game{position:fixed;inset:0;display:block;width:100%;height:100%}

.hud{position:fixed;top:max(10px,env(safe-area-inset-top));left:10px;display:flex;gap:8px;flex-wrap:wrap;pointer-events:none;z-index:3}
.score-box{background:var(--cream);color:var(--navy);border-radius:20px;padding:.15em .75em;text-align:center;
  box-shadow:0 5px 0 rgba(16,26,61,.25);min-width:4.6em}
.score-box .label{display:block;font-size:.8rem;font-weight:800;opacity:.65}
.score-box b{display:block;font-size:clamp(1.2rem,3vw,1.9rem);line-height:1.05;font-family:"Kenney Future","Baloo 2",system-ui,sans-serif}
.score-box.sun{background:var(--sun)}
.score-box.low{background:var(--peach)}
.score-box.water{min-width:7em}
.meter{display:block;height:12px;margin:4px 0 3px;border-radius:8px;background:var(--ice);overflow:hidden;border:2px solid var(--navy)}
.meter i{display:block;height:100%;width:100%;background:var(--sky);transition:width .2s}
.dots{display:flex;gap:4px;justify-content:center}
.dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--navy)}

.corner-btns{position:fixed;top:max(10px,env(safe-area-inset-top));right:10px;display:flex;gap:10px;z-index:7}
.btn.tiny{display:grid;place-items:center;width:1.7em;font-size:clamp(1.2rem,3.5vw,1.7rem);padding:.2em 0;line-height:1;border-radius:20px;text-decoration:none}
.btn.big{font-size:1.2rem}
.btn.green{background:var(--grass)}
.btn.sun{background:var(--sun)}

.overlay{position:fixed;inset:0;display:grid;place-items:center;padding:16px;overflow:auto;background:rgba(16,26,61,.3);z-index:6}
.overlay.solid{background:linear-gradient(180deg,rgba(199,232,251,.92),rgba(132,195,239,.92))}
.card-panel{max-width:680px;width:100%;text-align:center;color:var(--navy);background:var(--cream);border-radius:30px;
  padding:clamp(14px,3vw,26px);box-shadow:0 10px 0 rgba(16,26,61,.18),0 18px 36px rgba(16,26,61,.25)}
.card-panel h1{margin:.1em 0 .2em}
.card-panel h2{margin:.1em 0 .4em;font-size:clamp(1.6rem,5vw,2.4rem)}
.card-panel .sub{margin:0 0 .8em}
.over-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:.6em 0 0}

.seats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:.4em 0 .6em}
@media (max-width:560px){.seats{grid-template-columns:1fr}}
.seat{--seat:var(--sky);background:var(--ice);border-radius:20px;padding:.6em .4em;display:grid;gap:4px;justify-items:center;
  border:4px dashed rgba(16,26,61,.22);transition:transform .15s}
.seat b{font-size:1.1rem}
.seat-role{font-size:.78rem;opacity:.75}
.seat-state{font-weight:800;font-size:.95rem;opacity:.7}
.seat.joined{background:var(--seat);border-style:solid;border-color:var(--navy);transform:translateY(-3px)}
.seat.joined .seat-state{opacity:1}
.start-hint{font-weight:800;margin:.2em 0 .6em;min-height:1.4em}

.diffs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:.4em 0 .8em}
@media (max-width:560px){.diffs{grid-template-columns:1fr}}
.diff{display:grid;gap:4px;border-radius:22px;background:var(--ice);border:4px solid transparent}
.diff b{font-family:"Kenney Future","Baloo 2",system-ui,sans-serif;font-size:1.4rem}
.diff.current{background:var(--sun);border-color:var(--navy);transform:translateY(-3px)}

.how{margin:0 auto .4em;border-collapse:collapse;font-size:clamp(.8rem,2.4vw,1rem);text-align:left}
.how td{padding:.08em .55em}
.how td:first-child{font-weight:800}
.big-score{font-family:"Kenney Future","Baloo 2",system-ui,sans-serif;font-size:clamp(2.4rem,9vw,4rem);margin:0 0 .2em;color:var(--orange)}

.remap-pick{display:grid;gap:10px;justify-content:center;margin:.6em 0}
.remap-progress{margin:.2em 0 0;font-weight:800;opacity:.65;font-size:.95rem}
.remap-prompt{margin:.1em 0 .2em;font-weight:800;font-size:clamp(1.1rem,3.4vw,1.5rem)}
.remap-captured{margin:0 0 .4em;min-height:1.4em;font-weight:800;color:#3c7a12}
.remap-list{list-style:none;margin:.2em auto .6em;padding:0;max-width:28em;text-align:left}
.remap-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline;background:var(--ice);border-radius:16px;padding:.25em .8em;margin-bottom:5px;border:3px solid transparent}
.remap-row.current{background:var(--sun);border-color:var(--navy)}
.remap-foot{margin:.6em 0 0;font-size:.85rem;opacity:.7}
.btn[disabled]{opacity:.45;pointer-events:none}

.pad-status{font-size:.8rem;opacity:.75;margin:.2em 0 .6em}
.pad-status.none{color:var(--sun)}
