/* ===== PDL features: Pokémon theme, header + modes dropdown, landing hero, Home Run Derby, Updates =====
   Loaded after style.css; only adds/overrides. Remove this file + the marked index.html blocks to revert. */
@font-face{font-family:'Press Start 2P';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/press-start-2p-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--pk-red:#e3350d;--pk-red2:#a8220a;--pk-ink:#16171d;--pk-ink2:#22242d;--pk-white:#f7f6f0;--pk-gold:#ffcb05;
 --t-normal:#a8a77a;--t-fire:#ee8130;--t-water:#6390f0;--t-grass:#7ac74c;--t-electric:#f7d02c;--t-ice:#96d9d6;--t-fighting:#c22e28;--t-poison:#a33ea1;--t-ground:#e2bf65;--t-flying:#a98ff3;--t-psychic:#f95587;--t-bug:#a6b91a;--t-rock:#b6a136;--t-ghost:#735797;--t-dragon:#6f35fc;--t-dark:#705746;--t-steel:#b7b7ce;--t-fairy:#d685ad;
 --pxf:'Press Start 2P',ui-monospace,monospace;
 --pb-pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.045' stroke-width='3'%3E%3Ccircle cx='18' cy='18' r='12'/%3E%3Cpath d='M6 18h24'/%3E%3Ccircle cx='18' cy='18' r='4'/%3E%3Ccircle cx='54' cy='54' r='12'/%3E%3Cpath d='M42 54h24'/%3E%3Ccircle cx='54' cy='54' r='4'/%3E%3C/g%3E%3C/svg%3E")}
body{background:var(--pk-ink) var(--pb-pat)}
.px{font-family:var(--pxf);font-weight:400;letter-spacing:0;line-height:1.45}
/* ---------- header ---------- */
.board.pdl-head{position:relative;background:linear-gradient(180deg,#f0461f 0%,var(--pk-red) 55%,#c62a0b 100%);border-bottom:0;padding:14px 10px 0;box-shadow:0 6px 0 #0d0d10}
.pdl-head::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:#0d0d10}
.ph-row{display:flex;align-items:center;justify-content:center;gap:14px}
.pdl-head h1{font-family:var(--pxf);font-weight:400;font-size:clamp(15px,2.3vw,26px);letter-spacing:1px;color:#fff;text-shadow:3px 3px 0 #0d0d10;line-height:1.3}
.pdl-head h1 span{color:var(--pk-gold)}
.pball{flex:none;width:34px;height:34px;border-radius:50%;border:3px solid #0d0d10;background:linear-gradient(#e3350d 0 44%,#0d0d10 44% 56%,#fff 56%);position:relative;box-shadow:2px 2px 0 #0d0d10}
.pball::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;background:#fff;border:3px solid #0d0d10;transform:translate(-50%,-50%)}
.pdl-head .tagline{color:#fff;opacity:.92;margin:6px 0 10px;font-weight:600;text-shadow:1px 1px 0 #0006}
.ph-nav{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap;padding-bottom:12px}
.ph-nav button{background:#fff;color:#16171d;border:3px solid #0d0d10;border-radius:999px;font-weight:700;box-shadow:0 3px 0 #0d0d10;padding:6px 14px;margin:0}
.ph-nav button:hover{border-color:#0d0d10;background:#fff6d1}.ph-nav button:active{transform:translateY(2px);box-shadow:0 1px 0 #0d0d10}
.ph-nav button:focus-visible,.mode-menu button:focus-visible,.hero button:focus-visible,.dby button:focus-visible,.upd button:focus-visible{outline:3px solid var(--pk-gold);outline-offset:2px}
.ph-nav .artT{margin-top:0;font-size:13px}.ph-nav .saveT{margin-left:0}
.typebar{height:6px;margin:0 -10px;background:linear-gradient(90deg,var(--t-normal) 0 5.55%,var(--t-fire) 0 11.1%,var(--t-water) 0 16.65%,var(--t-grass) 0 22.2%,var(--t-electric) 0 27.75%,var(--t-ice) 0 33.3%,var(--t-fighting) 0 38.85%,var(--t-poison) 0 44.4%,var(--t-ground) 0 49.95%,var(--t-flying) 0 55.5%,var(--t-psychic) 0 61.05%,var(--t-bug) 0 66.6%,var(--t-rock) 0 72.15%,var(--t-ghost) 0 77.7%,var(--t-dragon) 0 83.25%,var(--t-dark) 0 88.8%,var(--t-steel) 0 94.35%,var(--t-fairy) 0)}
/* modes dropdown */
.modes{position:relative}
.mode-btn{display:inline-flex;align-items:center;gap:6px;min-width:220px;justify-content:space-between}
.mode-btn .mb-k{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#a8220a;font-weight:800}
.mode-btn .mb-car{width:0;height:0;border:6px solid transparent;border-top:7px solid #16171d;margin-top:6px;transition:transform .15s}
.modes.open .mb-car{transform:rotate(180deg);margin-top:-6px}
nav.mode-menu{position:absolute;z-index:40;top:calc(100% + 8px);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;min-width:290px;background:#fff;color:#16171d;border:3px solid #0d0d10;border-radius:14px;box-shadow:0 6px 0 #0d0d10,0 14px 30px #0008;padding:6px;overflow:visible;text-align:left}
nav.mode-menu[hidden]{display:none}
nav.mode-menu::before{content:"";position:absolute;top:-9px;left:50%;width:14px;height:14px;background:#fff;border-left:3px solid #0d0d10;border-top:3px solid #0d0d10;transform:translateX(-50%) rotate(45deg)}
nav.mode-menu button{display:flex;align-items:center;gap:10px;width:100%;flex:none;text-align:left;background:transparent;color:#16171d;border:2px solid transparent;border-radius:10px;padding:8px 10px;min-height:48px;font-weight:400}
nav.mode-menu button b{display:block;font-size:15px}nav.mode-menu button small{display:block;font-size:12px;opacity:.7}
nav.mode-menu button:hover,nav.mode-menu button:focus{background:#fff3c4;border-color:#0d0d10;outline:none}
nav.mode-menu button.on,nav.mode-menu button[aria-checked=true]{background:#ffe9a8;color:#16171d;border-color:#e0a800}
nav.mode-menu button[aria-checked=true]::after{content:"✓";margin-left:auto;font-weight:900;color:#a8220a}
nav.mode-menu .mi-derby{margin-top:6px;border-top:2px dashed #0002;border-radius:0 0 10px 10px}
.mi-ic{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#f3f3f3;border:2px solid #0d0d10;flex:none;font-size:15px}
.upd-t[aria-current=page]{background:var(--pk-gold)}
/* ---------- landing hero (Builder home only, hidden while any view is open) ---------- */
.hero{display:none;position:relative;overflow:hidden;background:radial-gradient(120% 90% at 85% 10%,#2b3a8a55,transparent 60%),linear-gradient(160deg,#1c1e27,#121318) ;border-bottom:4px solid #0d0d10}
body[data-mode=build] .hero{display:block}body:has(#view:not(.hidden)) .hero{display:none}
.hero::before{content:"";position:absolute;inset:0;background:var(--pb-pat);opacity:1.6;pointer-events:none}
.hero-in{position:relative;max-width:1150px;margin:auto;padding:26px 16px 22px;display:grid;grid-template-columns:1.05fr .95fr;gap:20px;align-items:center}
.hero-k{margin:0 0 10px;display:inline-block;background:var(--pk-gold);color:#16171d;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:1px;padding:4px 10px;border-radius:999px;border:2px solid #0d0d10}
.hero h2{margin:0 0 12px;font-size:clamp(17px,2.4vw,27px);color:#fff;text-shadow:3px 3px 0 #a8220a}
.hero-sub{margin:0 0 16px;max-width:46ch;opacity:.9;line-height:1.5}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.hero-cta button{border:3px solid #0d0d10;border-radius:12px;font-weight:800;padding:10px 16px;box-shadow:0 4px 0 #0d0d10;min-height:48px}
.hero-cta button:active{transform:translateY(2px);box-shadow:0 2px 0 #0d0d10}
.cta-pri{background:var(--pk-red);color:#fff}.cta-pri:hover{background:#f0461f;border-color:#0d0d10}
.cta-sec{background:#fff;color:#16171d}.cta-sec:hover{background:#fff6d1;border-color:#0d0d10}
.cta-ghost{background:transparent;color:#fff;border-color:#fff8!important;box-shadow:none!important}
.hero-feat{display:inline-flex;align-items:center;gap:10px;background:#0d0d10cc;border:2px solid var(--pk-gold);border-radius:12px;padding:6px 14px 6px 6px;color:#fff;text-align:left}
.hero-feat img{width:48px;height:48px;image-rendering:pixelated;background:radial-gradient(circle,#6390f055,transparent 70%);border-radius:50%}
.hero-feat small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--pk-gold)}.hero-feat b{display:block;font-size:15px}.hero-feat em{display:block;font-style:normal;font-size:12px;opacity:.8}
.hero-art{position:relative;aspect-ratio:4/3;max-width:460px;width:100%;justify-self:center}
.hero-dia{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 6px 0 #0d0d10)}
.hm{position:absolute;width:24%;height:auto;image-rendering:pixelated;transform:translate(-50%,-85%);filter:drop-shadow(0 4px 0 #0007);animation:hbob 2.4s ease-in-out infinite}
.hm-cf{left:50%;top:30%;width:26%;animation-delay:-.6s}.hm-p{left:50%;top:66%;width:20%;animation-delay:-1.2s}.hm-1b{left:73%;top:66%;width:20%;animation-delay:-1.8s}
.hm-ab{left:42%;top:99%;width:27%;animation:none;transform:translate(-50%,-88%) scaleX(-1)}
@keyframes hbob{50%{margin-top:-4px}}
.hero-ball{position:absolute;left:50%;top:60%;width:14px;height:14px;border-radius:50%;border:2px solid #0d0d10;background:linear-gradient(#e3350d 0 45%,#0d0d10 45% 55%,#fff 55%);animation:hpitch 2.6s cubic-bezier(.4,0,.8,1) infinite}
@keyframes hpitch{0%,20%{top:60%;left:50%;transform:translate(-50%,-50%) scale(.6);opacity:0}25%{opacity:1}68%{top:88%;left:48%;transform:translate(-50%,-50%) scale(1.3);opacity:1}70%,100%{top:88%;left:48%;opacity:0}}
@media (prefers-reduced-motion:reduce){.hm,.hero-ball{animation:none}.hero-ball{display:none}}
/* ---------- type chips ---------- */
.type.t-normal{background:var(--t-normal)}.type.t-fire{background:var(--t-fire)}.type.t-water{background:var(--t-water)}.type.t-grass{background:var(--t-grass);color:#122}.type.t-electric{background:var(--t-electric);color:#221}.type.t-ice{background:var(--t-ice);color:#122}.type.t-fighting{background:var(--t-fighting)}.type.t-poison{background:var(--t-poison)}.type.t-ground{background:var(--t-ground);color:#221}.type.t-flying{background:var(--t-flying)}.type.t-psychic{background:var(--t-psychic)}.type.t-bug{background:var(--t-bug)}.type.t-rock{background:var(--t-rock)}.type.t-ghost{background:var(--t-ghost)}.type.t-dragon{background:var(--t-dragon)}.type.t-dark{background:var(--t-dark)}.type.t-steel{background:var(--t-steel);color:#122}.type.t-fairy{background:var(--t-fairy)}
/* ---------- shared page chrome (Derby + Updates) ---------- */
.dby,.upd{max-width:1000px;margin:0 auto}
.dby-top,.upd-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:4px 0 14px}
.dby-top h2,.upd-top h2{margin:0;text-align:center;font-size:clamp(15px,2.4vw,22px);color:#fff;text-shadow:3px 3px 0 #a8220a}
.dby-back,.upd-back{background:#fff;color:#16171d;border:3px solid #0d0d10;border-radius:999px;font-weight:800;box-shadow:0 3px 0 #0d0d10;min-height:44px}
.dby-back:hover,.upd-back:hover{border-color:#0d0d10;background:#fff6d1}
.dby-card,.upd-card{position:relative;background:linear-gradient(#22242d,#1a1b22);border:3px solid #0d0d10;border-top:8px solid var(--pk-red);border-radius:14px;box-shadow:0 5px 0 #0d0d10;padding:16px}
/* ---------- Home Run Derby ---------- */
.dby-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.dby-feat{display:flex;gap:14px;align-items:center}
.dby-spot{flex:none;width:132px;height:132px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 60%,#ffffff22,#6390f033 55%,transparent 70%),linear-gradient(#e3350d 0 47%,#0d0d10 47% 53%,#f7f6f0 53%);border:4px solid #0d0d10;box-shadow:0 4px 0 #0d0d10}
.dby-spot img{width:120px;height:120px;image-rendering:pixelated;filter:drop-shadow(0 3px 0 #0008)}
.dby-k{display:inline-block;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--pk-gold);font-weight:800}
.dby-fi h3{margin:4px 0 6px;font-size:18px;color:#fff}.dby-types{margin-bottom:6px}.dby-types .type{font-size:11px;padding:1px 8px}
.dby-rt{display:flex;gap:12px;font-family:"Courier New",monospace}.dby-rt b{color:var(--pk-gold)}
.dby-next{margin:8px 0 0;font-size:14px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.dby-next img{width:32px;height:32px;image-rendering:pixelated}.dby-next b{color:var(--pk-gold)}
.dby-rules{margin:14px 0 10px;padding:0;list-style:none;display:grid;gap:6px;font-size:14px}.dby-rules li{display:block;padding:0}
.dby-pb{margin:6px 0 10px;font-size:14px}.dby-pb b{color:var(--pk-gold)}
.dby-go{background:var(--pk-red);color:#fff;border:3px solid #0d0d10;border-radius:12px;font-weight:800;box-shadow:0 4px 0 #0d0d10;min-height:48px;padding:8px 18px;font-size:16px}
.dby-go:hover{background:#f0461f;border-color:#0d0d10}.dby-go:disabled{opacity:.6}
#dbStart{width:100%}
.dby-lbh{margin:0 0 10px;font-size:14px;color:#fff;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}.dby-lbh small{font-family:system-ui,sans-serif;font-size:12px;opacity:.75}
.dby-lbw{overflow-x:auto}
table.dby-lb{width:100%;border-collapse:collapse;font-size:14px}
.dby-lb th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--pk-gold);border-bottom:2px solid #0d0d10;padding:6px}
.dby-lb td{padding:7px 6px;border-bottom:1px solid #ffffff12;white-space:nowrap}.dby-lb td:nth-child(2){white-space:normal;word-break:break-all}
.dby-lb td:first-child{width:2.5em;font-family:"Courier New",monospace;font-weight:800}
.dby-lb tr.top1 td:first-child{color:#ffcb05}.dby-lb tr.top2 td:first-child{color:#d7d7e0}.dby-lb tr.top3 td:first-child{color:#e0965a}
.dby-lb tr.me td{background:#ffcb0526}.dby-lb tr.me td:nth-child(2)::after{content:" (you)";opacity:.7;font-size:12px}
.dby-empty,.dby-off{opacity:.8;font-size:14px;margin:6px 0}
.dby-res{text-align:center}.dby-res>img{width:96px;height:96px;image-rendering:pixelated}
.dby-big{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 14px}.dby-big div{background:#0d0d1088;border:2px solid #0d0d10;border-radius:10px;padding:8px 4px}
.dby-big b{display:block;font-family:var(--pxf);font-size:18px;color:var(--pk-gold);margin-bottom:6px}.dby-big span{font-size:12px;opacity:.8}
.dby-form{text-align:left}.dby-form label{display:block;font-weight:700;margin-bottom:6px;font-size:14px}
.dby-row{display:flex;gap:8px}.dby-row input{flex:1;min-width:0;font-size:16px;padding:10px;border-radius:10px;border:3px solid #0d0d10;min-height:48px}
.dby-row input[aria-invalid=true]{border-color:#ff5a3c}.dby-form.sent .dby-row{opacity:.6}
.dby-msg{min-height:1.3em;margin:6px 0 0;font-size:14px}.dby-msg.err{color:#ff8a80}.dby-msg.ok{color:#9be37a}
.dby-btns{display:flex;gap:8px;justify-content:center;margin-top:12px;flex-wrap:wrap}.dby-btns button{min-height:44px}
/* in-run */
.dby-run #pbDiff,.dby-run #pbAggr{display:none!important}
.dby-hud{position:absolute;top:1.2cqw;left:1.2cqw;z-index:9;display:flex;align-items:center;gap:12px;background:#0d0d10e6;border:2px solid var(--pk-gold);border-radius:12px;padding:6px 12px 6px 6px;color:#fff;font-family:"Courier New",monospace}
.dby-hud img{width:40px;height:40px;image-rendering:pixelated}
.dh-c{display:flex;flex-direction:column;line-height:1.1}.dh-l{font-size:10px;letter-spacing:1px;color:var(--pk-gold);font-weight:800}.dh-c b{font-size:20px}.dh-c b small{font-size:11px}
.dh-pips{display:flex;gap:3px;margin-top:4px}.dh-pips i{width:9px;height:9px;border-radius:50%;background:#ffffff33;border:1px solid #fff6}.dh-pips i.x{background:var(--pk-red);border-color:#fff}
.pop.hr{color:var(--pk-gold)}.pop.out{color:#fff;font-size:5cqw}
.dby-ctrl{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.dby-vs{opacity:.8;font-size:14px}
#lp #dbX{font-weight:900}
.park.m3d #batr{display:none}
/* ---------- Updates ---------- */
.upd-intro{text-align:center;opacity:.85;margin:-6px 0 16px}
.upd-cards{display:grid;gap:18px}
.upd-card{padding:18px 18px 16px}
.upd-card.latest{border-top-color:var(--pk-gold)}
.upd-date{position:absolute;top:-8px;right:-3px;background:#0d0d10;color:var(--pk-gold);font-weight:800;font-size:12px;padding:8px 12px;border-radius:0 12px 0 12px;letter-spacing:.5px}
.upd-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-right:110px}
.upd-v{font-family:var(--pxf);font-size:12px;background:var(--pk-red);color:#fff;border:2px solid #0d0d10;border-radius:8px;padding:5px 8px}
.upd-new{font-size:11px;font-weight:900;letter-spacing:1px;background:var(--pk-gold);color:#16171d;border-radius:999px;padding:2px 8px;border:2px solid #0d0d10}
.upd-h h3{flex-basis:100%;margin:6px 0 0;font-family:var(--pxf);font-weight:400;font-size:16px;color:#fff}
.upd-note{flex-basis:100%;margin:2px 0 0;font-size:13px;opacity:.75}
.upd-mons{position:absolute;right:14px;top:40px;display:flex}.upd-mons img{width:56px;height:56px;image-rendering:pixelated;margin-left:-14px;filter:drop-shadow(0 2px 0 #0008)}
.upd-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.upd-list li{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;background:#0d0d1066;border-radius:10px;border:1px solid #ffffff10}
.upd-list li span:last-child{flex:1}.upd-list small{display:block;opacity:.75;margin-top:2px;font-size:13px}.upd-ic{flex:none;width:24px;text-align:center}
.upd-unrel{margin-bottom:18px;border:3px dashed var(--pk-gold);border-radius:14px;padding:14px;background:#ffcb050d}.upd-unrel h3{margin:0;font-size:13px;color:var(--pk-gold)}.upd-unrel h3 small{font-family:system-ui,sans-serif;font-size:12px;opacity:.8}
.upd-unrel[hidden]{display:none}
/* ---------- responsive ---------- */
@media (max-width:860px){.dby-grid{grid-template-columns:1fr}}
@media (max-width:760px){.hero-in{grid-template-columns:1fr;padding:16px 12px 14px;gap:8px}.hero-art{order:-1;max-width:300px;aspect-ratio:2/1.1;margin-top:-4px}.hero-copy{text-align:center}.hero-sub{margin-left:auto;margin-right:auto}.hero-cta{justify-content:center}}
@media (max-width:700px){
 .board.pdl-head{padding:10px 8px 0}
 .pdl-head h1{font-size:13px!important;letter-spacing:0!important;line-height:1.5}
 .pball{width:26px;height:26px;border-width:3px}.pball::after{width:7px;height:7px;border-width:2px}
 .ph-row{gap:8px}
 .ph-nav{gap:6px;padding:10px 0 10px}
 .ph-nav button{min-height:44px;font-size:14px;padding:4px 12px}
 .modes{flex:1 1 100%;display:flex}.mode-btn{flex:1;min-width:0}
 .ph-nav .upd-t,.ph-nav .artT,.ph-nav .saveT{flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;padding:4px 6px}
 nav.mode-menu{position:fixed;left:8px;right:8px;top:auto;transform:none;min-width:0;margin-top:8px}
 nav.mode-menu::before{display:none}
 .hero h2{font-size:15px;line-height:1.6}.hero-sub{font-size:14px;margin-bottom:12px}.hero-k{font-size:11px;margin-bottom:8px}
 .hero-cta{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hero-cta .cta-pri{grid-column:1/3}.hero-cta button{padding:8px 6px;font-size:14px}
 .hero-feat{width:100%}
 .dby-feat{gap:10px}.dby-spot{width:104px;height:104px}.dby-spot img{width:96px;height:96px}.dby-fi h3{font-size:15px}
 .dby-card,.upd-card{padding:14px 12px}
 .dby-big b{font-size:15px}
 .dby-hud{top:60px;left:calc(8px + env(safe-area-inset-left));/* below the icon row on phones */gap:8px;padding:4px 8px 4px 4px}.dby-hud img{width:32px;height:32px}.dh-c b{font-size:16px}.dh-pips i{width:7px;height:7px}
 .upd-h{padding-right:0;padding-top:18px}.upd-mons{position:static;margin-top:8px;justify-content:flex-start;padding-left:14px}.upd-mons img{width:48px;height:48px}
 .upd-date{font-size:11px;padding:7px 10px}
 .dby-ctrl{margin-top:4px}
}
/* ---------- fixes over global li / nav-button rules ---------- */
.dby-rules li,.upd-list li{min-height:0}.dby-rules li b,.upd-list li b{min-width:0}
.upd-list li span,.dby-rules li span{white-space:normal;overflow:visible;text-overflow:clip}
.ph-nav nav.mode-menu button{box-shadow:none;margin:0}.ph-nav nav.mode-menu button:active{transform:none}
@media (max-width:700px){
 nav.mode-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);width:auto}
 .modes{flex:1 1 60%}.ph-nav .upd-t{flex:0 0 auto;overflow:visible}
 .ph-nav .artT:not(.saveT){flex:1.7 1 0}
}
.dby-row input:disabled{background:#e9e9e4;color:#333;opacity:1}
/* mobile header: row 1 = Mode + Updates, row 2 = Sprites / Save / Load (grid so nothing gets squeezed) */
@media (max-width:700px){
 .ph-nav{display:grid;grid-template-columns:3fr 2fr 2fr;grid-template-areas:"m m u" "a s l";gap:6px}
 .ph-nav>.modes{grid-area:m;min-width:0}.ph-nav>#updT{grid-area:u}.ph-nav>#artT{grid-area:a;font-size:12px}.ph-nav>#saveT{grid-area:s}.ph-nav>#loadT{grid-area:l}
 .ph-nav>button{width:100%;min-width:0}
}
@media (max-width:700px){.typebar{margin:0 -8px}}