/* JET//Estación Silencio · estilos */
:root{--bg:#050108;--bg2:#0a0418;--card:rgba(16,9,32,.95);--line:rgba(245,240,255,.12);--ink:#f5f0ff;--dim:#b5a8d8;--cy:#00f2cf;--vi:#7700f4;--red:#ff4466;--amber:#ffb347;--mod:#9fb4ff;
--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--kb:0px;--topH:56px;--fs:1}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:Poppins,system-ui,sans-serif;overflow:hidden;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%}
html.big{--fs:1.15}
button,a,input,textarea{font:inherit;touch-action:manipulation}
input,textarea{-webkit-user-select:text;user-select:text}
#cv{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
button{color:inherit}
.kick{font:700 calc(11px*var(--fs)) 'JetBrains Mono',monospace;letter-spacing:.16em;color:var(--cy);text-transform:uppercase}
:focus-visible{outline:2px solid var(--cy);outline-offset:2px}

/* pastilla JET y botones de cabecera */
#back{position:fixed;top:calc(var(--sat) + 6px + (var(--topH) - 50px) / 2);left:calc(10px + var(--sal));z-index:40;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px 0 12px;border-radius:99px;background:rgba(10,5,18,.72);border:1px solid rgba(119,0,244,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#d9d3ee;font:600 12px 'JetBrains Mono',monospace;letter-spacing:.06em;text-decoration:none;transition:border-color .15s,box-shadow .15s}
#back i{font-style:normal;color:var(--cy)}
#back:hover,#back:focus-visible{color:#fff;border-color:var(--cy);box-shadow:0 0 14px rgba(0,242,207,.3)}
body.noback #back{display:none}
.ib{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:rgba(10,5,18,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;cursor:pointer;position:relative;padding:0;transition:transform .12s,border-color .15s,background .15s}
.ib:hover{border-color:rgba(0,242,207,.5)}.ib:active{transform:scale(.94)}
.ib svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ib .dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--cy);box-shadow:0 0 8px var(--cy);display:none}
.ib .dot.on{display:block}
.gear{position:fixed;top:calc(var(--sat) + 6px + (var(--topH) - 50px) / 2);right:calc(10px + var(--sar));z-index:40}
#top{position:fixed;top:0;left:0;right:0;z-index:30;height:calc(var(--topH) + var(--sat));padding:calc(6px + var(--sat)) calc(62px + var(--sar)) 0 calc(10px + var(--sal));display:flex;align-items:center;gap:8px;pointer-events:none}
#top>*{pointer-events:auto}
#top[hidden]{display:none}
.pill{min-height:44px;padding:0 14px;border-radius:99px;background:rgba(10,5,18,.72);border:1px solid rgba(0,242,207,.35);color:#e8fff8;font:600 12px 'JetBrains Mono',monospace;letter-spacing:.06em;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap}
.pill[hidden]{display:none}
.rtitle{flex:1;min-width:0;font:700 13px 'JetBrains Mono',monospace;letter-spacing:.14em;color:var(--mod);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;pointer-events:none!important}
.tbtns{display:flex;gap:6px;margin-left:auto}
#bRing{display:inline-flex;align-items:center;gap:6px}
#bRing svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;display:none}
@media (max-width:560px){body.ringon:not(.land) .rtitle{position:absolute;left:0;right:0;top:calc(var(--topH) + var(--sat) + 2px);font-size:11px;letter-spacing:.22em;text-shadow:0 1px 6px #000}}
@media (max-width:380px){#top{gap:4px}.tbtns{gap:4px}#bRing{width:44px;padding:0;justify-content:center}#bRing .lbl,#bRing .chev{display:none}#bRing svg{display:block}body.inhub .rtitle{visibility:hidden}}

/* placa del traje */
#plateBar{position:fixed;left:50%;transform:translateX(-50%);top:calc(var(--topH) + var(--sat) + 4px);z-index:20;display:flex;align-items:center;gap:10px;padding:6px 14px;border-radius:12px;background:rgba(12,8,26,.85);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
#plateBar[hidden]{display:none}
.pl-k{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.18em;color:var(--dim)}
#plateCv{width:180px;height:24px}
.pl-m{font:500 10px 'JetBrains Mono',monospace;color:#7a6f98}

/* lista de paneles de la sala */
#roomList{position:fixed;left:0;right:0;bottom:0;z-index:15;padding:10px calc(10px + var(--sar)) calc(10px + var(--sab)) calc(10px + var(--sal));display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;background:linear-gradient(to top,rgba(5,1,8,.98) 70%,rgba(5,1,8,0))}
#roomList[hidden]{display:none}
.pc{display:flex;align-items:center;gap:10px;min-height:52px;min-width:0;padding:8px 12px;border-radius:10px;border:1px solid #394B5E;background:#172332;cursor:pointer;text-align:left;color:var(--ink);transition:transform .12s,border-color .15s}
.pc:active{transform:scale(.97)}
.pc.ok{border-color:color-mix(in srgb,var(--mod) 55%,#394B5E)}
.pc.lock{background:#121922;color:#9EACBA}.pc.lock b,.pc.lock .nm,.pc.lock .stt{color:#9EACBA}
.pc .stt{display:flex;align-items:center;gap:6px;margin-top:2px;font:600 calc(12px*var(--fs)) 'JetBrains Mono',monospace;letter-spacing:.02em;color:#ffb3c2;line-height:1.3}
.pc.ok .stt{color:var(--mod)}
.pc .stt svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pc .dotst{width:8px;height:8px;border-radius:50%;flex:none;background:var(--red)}
.pc .tx{display:flex;flex-direction:column;min-width:0}
.pc b{font:700 calc(12px*var(--fs)) 'JetBrains Mono',monospace;letter-spacing:.08em;color:#B3C1CF}
.pc .nm{font-size:calc(14px*var(--fs));font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.pc .st .off{opacity:.25}
.pc .st{margin-left:auto;font:700 12px 'JetBrains Mono',monospace;color:#ffd34d;white-space:nowrap}
.pc.meta{grid-column:1/-1;border-color:rgba(255,255,255,.2)}
.pc .frs{display:flex;gap:4px;margin-left:auto}.pc .frs i{width:16px;height:10px;border-radius:3px;background:rgba(255,255,255,.1)}
body.land #roomList{display:flex;flex-wrap:nowrap;overflow-x:auto;padding-top:6px;background:linear-gradient(to top,rgba(5,1,8,.95) 60%,rgba(5,1,8,0))}
body.land #roomList .pc{flex:1 0 150px;min-height:46px}
@keyframes pulse{50%{opacity:.35}}

#hubBar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + var(--sab));z-index:15;display:flex;gap:8px;align-items:center;padding:6px;border-radius:10px;background:#121D2B;border:1px solid #394B5E}
#hubBar[hidden]{display:none}
.stars-n{font:700 16px 'JetBrains Mono',monospace;color:#ffd34d;padding:0 10px;white-space:nowrap}

/* botones */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:14px;font:600 calc(16px*var(--fs)) Poppins,system-ui,sans-serif;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);cursor:pointer;transition:transform .12s,background .15s,border-color .15s,box-shadow .15s;margin:0 0 10px;padding:0 16px;text-decoration:none}
.btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.22)}
.btn:active{transform:scale(.97)}
.btn.pri{background:linear-gradient(135deg,#7700f4,#00f2cf);border-color:transparent;box-shadow:0 10px 28px rgba(119,0,244,.4);color:#fff;font-weight:700}
.btn.pri:hover{box-shadow:0 12px 34px rgba(0,242,207,.35)}
.btn.big{min-height:66px;font-size:calc(19px*var(--fs));border-radius:18px;flex-direction:column;gap:2px}
.btn.big small{font:500 12px 'JetBrains Mono',monospace;color:rgba(255,255,255,.82);letter-spacing:.04em}
.btn.cy{background:linear-gradient(135deg,#00f2cf,#00b8c8);color:#04201c;border-color:transparent}
.btn.danger{border-color:rgba(255,68,102,.5);color:#ffb3c2}
.btn.danger.arm{background:var(--red);color:#fff;border-color:var(--red)}
.btn.sm{min-height:44px;width:auto;font-size:14px;margin:0;padding:0 14px}
.btn[disabled]{opacity:.45;pointer-events:none}
.row{display:flex;gap:10px}.row .btn{flex:1}
.chip{min-height:34px;padding:0 12px;border-radius:99px;border:1px solid rgba(0,242,207,.3);background:rgba(0,242,207,.06);color:#bff;font:600 12px 'JetBrains Mono',monospace;cursor:pointer;white-space:nowrap}

/* capas de pantallas */
#layer{position:fixed;inset:0;z-index:50;pointer-events:none}
.scr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;padding:calc(64px + var(--sat)) calc(16px + var(--sar)) calc(16px + var(--sab)) calc(16px + var(--sal));overflow-y:auto;pointer-events:auto;touch-action:pan-y pinch-zoom;animation:fade .25s ease}
.scr.veil{background:rgba(5,1,8,.8);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.scr.solid{background:#050108}
.scr.out{animation:fadeOut .2s ease forwards}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes fadeOut{to{opacity:0}}
.card{width:100%;max-width:460px;margin:auto;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px 20px;box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);animation:pop .3s cubic-bezier(.2,1.2,.4,1)}
.card.wide{max-width:680px}
@keyframes pop{from{transform:translateY(14px) scale(.97);opacity:.3}to{transform:none;opacity:1}}
h1,h2,h3,p{margin:0}
.head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.head h2{flex:1;font-size:calc(20px*var(--fs));font-weight:700}
.x{width:44px;height:44px;flex:none;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink);display:grid;place-items:center;cursor:pointer;font-size:22px;line-height:1}
.x:hover{border-color:rgba(0,242,207,.5)}

/* inicio */
.home{justify-content:flex-end;padding-bottom:calc(22px + var(--sab));pointer-events:none}
.home>*{pointer-events:auto} /* el inicio no tapa «‹ JET//Games» ni el engranaje */
.home .hcard{width:100%;max-width:400px;text-align:center;animation:pop .5s cubic-bezier(.2,1.2,.4,1)}
.logo{font-weight:900;font-size:clamp(34px,10vw,58px);letter-spacing:-.035em;line-height:.98;text-shadow:0 6px 40px rgba(0,0,0,.8)}
.logo i{font-style:normal;color:var(--cy)}
.logo small{display:block;font-size:.62em;font-weight:800;letter-spacing:-.02em}
.home .sub{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.22em;color:var(--dim);margin:12px 0 22px}
.home .sec{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.home .sec .btn{margin:0;font-size:14px;min-height:48px}
.home .sec .btn.wide{grid-column:1/-1}
.daily-dot{width:8px;height:8px;border-radius:50%;background:var(--cy);box-shadow:0 0 8px var(--cy);display:inline-block}
.streak{font:700 12px 'JetBrains Mono',monospace;color:#ffb347}
body.land .home{justify-content:center;align-items:flex-end;padding-right:calc(40px + var(--sar))}
body.land .home .hcard{max-width:380px}

/* ajustes */
.set{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);min-height:52px}
.set label,.set .lb{flex:1;font-size:calc(15px*var(--fs));font-weight:500}
.sect{margin:18px 0 4px;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.16em;color:var(--cy);text-transform:uppercase}
.tog{width:52px;height:30px;border-radius:99px;background:rgba(255,255,255,.14);border:0;position:relative;cursor:pointer;flex:none;transition:background .2s}
.tog::before{content:'';position:absolute;inset:-8px -4px}
.tog::after{content:'';position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s}
.tog.on{background:var(--vi)}.tog.on::after{transform:translateX(22px)}
input[type=range]{-webkit-appearance:none;appearance:none;width:110px;height:40px;background:transparent;cursor:pointer;touch-action:none}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:rgba(255,255,255,.15)}
input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:rgba(255,255,255,.15)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:var(--cy);border:0}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--cy);border:0}
.seg{display:flex;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.seg button{min-width:52px;min-height:44px;border:0;background:transparent;cursor:pointer;font:700 13px 'JetBrains Mono',monospace;color:var(--dim)}
.seg button.on{background:var(--vi);color:#fff}
.code{font:700 22px 'JetBrains Mono',monospace;letter-spacing:.2em;color:var(--cy)}
textarea.resc{width:100%;min-height:70px;border-radius:12px;border:1px solid var(--line);background:rgba(0,0,0,.35);color:var(--ink);padding:10px;font:500 12px 'JetBrains Mono',monospace;resize:vertical;margin:8px 0}
input.codein{width:100%;min-height:48px;border-radius:12px;border:1px solid var(--line);background:rgba(0,0,0,.35);color:var(--ink);padding:0 14px;font:700 18px 'JetBrains Mono',monospace;letter-spacing:.2em;text-transform:uppercase;margin:6px 0 10px}

/* inspector */
#insp{position:fixed;inset:0;z-index:35;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;background:#050108;padding:calc(6px + var(--sat)) calc(8px + var(--sar)) 0 calc(8px + var(--sal));animation:inspIn .25s cubic-bezier(.2,.8,.2,1)}
#insp[hidden]{display:none}
@keyframes inspIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.i-head{display:flex;align-items:center;gap:10px;padding:2px 54px 6px 4px;min-height:50px;min-width:0}
.i-tt{flex:1;min-width:0}
.i-tt h2{font-size:calc(18px*var(--fs));font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline-offset:2px}
.i-stage{position:relative;border-radius:16px;overflow:hidden;border:1px solid #2A3646;background:#090F18;min-height:0}
#iCv{position:absolute;inset:0;width:100%;height:100%;touch-action:none;display:block}
#iDom{position:absolute;inset:0;overflow-y:auto;padding:12px;touch-action:pan-y pinch-zoom;-webkit-user-select:text;user-select:text}
#iDom:empty{display:none}
.stamp{position:absolute;top:12px;right:12px;padding:6px 12px;border:2px solid var(--cy);border-radius:10px;color:var(--cy);font:800 14px 'JetBrains Mono',monospace;letter-spacing:.2em;transform:rotate(-6deg);background:rgba(0,30,26,.7);display:none;pointer-events:none}
.stamp.on{display:block;animation:stampIn .16s ease-out}
@keyframes stampIn{from{transform:rotate(-6deg) scale(1.04);opacity:0}}
html.reduce .stamp.on{animation:none}
.zoomtag{position:absolute;left:10px;bottom:10px;font:700 11px 'JetBrains Mono',monospace;color:var(--dim);background:rgba(0,0,0,.6);padding:4px 8px;border-radius:8px;display:none;pointer-events:none}
.zoomtag.on{display:block}
.i-side{display:flex;flex-direction:column;gap:10px;padding:8px 2px 0;min-height:0}
.amb{font-size:calc(14px*var(--fs));color:#B3C1CF;line-height:1.5;display:none}
.iq{font:600 calc(15px*var(--fs))/1.5 Poppins,system-ui,sans-serif;color:#EDF4F8}
.tools{display:flex;gap:6px;flex-wrap:wrap}
.tools:empty{display:none}
.tool{min-height:44px;min-width:44px;padding:0 14px;border-radius:8px;border:1px solid #3C485C;background:rgba(255,255,255,.05);cursor:pointer;font:600 14px Poppins,sans-serif;transition:transform .12s,background .15s}
.tool:active{transform:scale(.95)}
.tool.on{background:rgba(0,242,207,.16);border:2px solid var(--cy);padding:0 13px;color:#dffff9}
.hints:empty{display:none}
.hint{font-size:calc(14px*var(--fs));line-height:1.5;padding:8px 12px;border-radius:10px;background:rgba(255,179,71,.08);border:1px solid rgba(255,179,71,.28)}
.hint b{font:700 12px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#ffd34d;display:block;margin-bottom:2px;text-transform:uppercase}
.att{display:flex;gap:6px;flex-wrap:wrap;min-height:0}
.att:empty{display:none}
.att span{font:700 12px 'JetBrains Mono',monospace;padding:3px 8px;border-radius:8px;background:rgba(255,255,255,.05);color:#8f84ad;text-decoration:line-through}
.att span.mid{color:var(--cy);text-decoration:none;background:rgba(0,242,207,.08)}
.att span.near{color:#ffd34d;text-decoration:none}
#bar{position:relative;padding:6px 0 calc(8px + var(--sab));margin:0 -2px}
.bar-top{display:flex;align-items:center;gap:10px;margin:0 2px 5px;min-height:18px}
.alab{flex:none;font:700 calc(12px*var(--fs)) 'JetBrains Mono',monospace;letter-spacing:.12em;color:#B3C1CF;text-transform:uppercase}
.enum{display:flex;gap:3px;justify-content:flex-end;flex:1;min-width:0;min-height:16px;flex-wrap:wrap}
.amsg{margin:0 2px;font:500 calc(14px*var(--fs))/1.4 Poppins,system-ui,sans-serif;color:var(--ink)}
.amsg:not(:empty){margin-bottom:6px}
.amsg.ok{color:#5ff5dc}.amsg.warn{color:#ffd34d}.amsg.bad{color:#ff9fb2}
.enum i{width:14px;height:14px;border-radius:3px;border:1px solid rgba(181,168,216,.35);font:700 10px/12px 'JetBrains Mono',monospace;font-style:normal;text-align:center;color:#fff;transition:background .12s,border-color .12s}
.enum i.f{background:rgba(0,242,207,.22);border-color:var(--cy)}
.enum i.x{border-style:dashed;border-color:rgba(255,68,102,.5)}
.enum em{font:700 12px 'JetBrains Mono',monospace;color:var(--dim);font-style:normal;margin-left:6px;align-self:center}
.bar-row{display:flex;gap:6px;align-items:center;min-width:0}
#ans{flex:1;min-width:0;height:52px;border-radius:14px;border:1px solid rgba(181,168,216,.3);background:rgba(0,0,0,.45);color:#fff;padding:0 14px;font:700 20px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;outline:none;transition:border-color .15s,box-shadow .15s}
#ans:focus{border-color:var(--cy);box-shadow:0 0 0 3px rgba(0,242,207,.15)}
#ans::placeholder{text-transform:none;font:500 14px Poppins,sans-serif;letter-spacing:0;color:#7d72a0}
#ans:disabled{opacity:.7}
.ib.sm{width:44px;height:52px;font:800 16px 'JetBrains Mono',monospace}
.send{position:relative;height:52px;min-width:88px;border-radius:14px;border:0;background:linear-gradient(135deg,#7700f4,#00f2cf);color:#fff;font:700 15px Poppins,sans-serif;cursor:pointer;box-shadow:0 8px 22px rgba(119,0,244,.35);transition:transform .12s,opacity .2s;padding:0 16px;white-space:nowrap}
.send .s-short{display:none}
#bar{container-type:inline-size}
@container (max-width:480px){.send .s-full{display:none}.send .s-short{display:inline}}
@container (max-width:360px){.send{padding:0 11px;font-size:14px;min-width:0}#ans{padding:0 10px;font-size:18px;letter-spacing:.04em}.bar-row{gap:5px}}
#iTitle:focus,[data-dlg-title]:focus{outline:none} /* títulos que reciben el foco al abrir: no son controles */
.send:active{transform:scale(.96)}
.send:disabled{opacity:.5}
.send .ring{position:absolute;inset:-3px;border-radius:16px;pointer-events:none;background:conic-gradient(var(--cy) var(--p,0%),transparent 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);display:none}
.send.cool .ring{display:block}
.scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--cy),transparent);opacity:0;pointer-events:none}
#bar.busy .scan{opacity:1;animation:scan .5s linear infinite}
@keyframes scan{from{transform:translateX(-60%)}to{transform:translateX(60%)}}
#bar.shake .bar-row{animation:shake .18s linear}
#bar.nearly .bar-row{animation:nearly .25s ease}
#bar.mid #ans{box-shadow:0 0 0 3px rgba(0,242,207,.5)}
@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
@keyframes nearly{50%{transform:translateX(4px)}}
html.reduce #bar.shake .bar-row,html.reduce #bar.nearly .bar-row{animation:none}
html.reduce #bar.shake #ans{border-color:var(--red)}
.offer{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100px + var(--sab));z-index:3;animation:pop .3s}
.offer[hidden]{display:none}
.offer button{min-height:40px;padding:0 16px;border-radius:99px;border:1px solid rgba(255,211,77,.5);background:rgba(30,22,4,.92);color:#ffe08a;font:600 13px Poppins,sans-serif;cursor:pointer}
/* horizontal: escenario a la izquierda, columna a la derecha */
body.land #insp{grid-template-columns:minmax(0,1fr) minmax(300px,40%);grid-template-rows:auto minmax(0,max-content) auto minmax(0,1fr);column-gap:12px;padding-bottom:0}
body.land .i-head{grid-column:2;grid-row:1;padding-left:0;padding-right:54px}
body.land .i-stage{grid-column:1;grid-row:1/5;margin:0 0 calc(8px + var(--sab));margin-top:6px}
body.land .i-side{grid-column:2;grid-row:2;overflow-y:auto}
body.land #bar{grid-column:2;grid-row:3}
body.land .amb{display:block}
body.land .offer{left:auto;right:12px;transform:none}
body.short .i-head{min-height:44px;padding-bottom:2px}
body.short .amb{display:none}
body.kb #insp{padding-bottom:var(--kb)}

/* toasts */
#toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(178px + var(--sab) + var(--kb));z-index:60;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:min(92vw,420px)}
body.land #toasts{left:auto;right:calc(12px + var(--sar));transform:none;width:min(38vw,380px)}
.toast{pointer-events:none;padding:11px 16px;border-radius:14px;background:rgba(14,8,28,.96);border:1px solid var(--line);font-size:calc(14px*var(--fs));box-shadow:0 12px 30px rgba(0,0,0,.5);animation:toastIn .25s cubic-bezier(.2,1.2,.4,1);display:flex;gap:10px;align-items:center;text-align:left}
.toast.ok{border-color:var(--cy)}.toast.bad{border-color:rgba(255,68,102,.5)}.toast.warn{border-color:rgba(255,211,77,.5)}
.toast button{flex:none;pointer-events:auto}
.toast.out{animation:fadeOut .25s forwards}
@keyframes toastIn{from{transform:translateY(10px);opacity:0}}

/* hojas */
.sheet .card{max-width:520px}
.steps{display:grid;gap:10px}
.step{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-start;padding:12px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.step .n{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;font:800 13px 'JetBrains Mono',monospace;background:rgba(255,211,77,.12);color:#ffd34d}
.step .b{flex:1 1 140px;min-width:0}.step .b h3{display:block;font-size:15px;font-weight:600;margin:0}.step .b p{font-size:14px;color:var(--ink);line-height:1.5;margin-top:4px}.step .b p.cost{color:var(--dim)}
.st-done{display:block;margin-top:4px;font:600 12px 'JetBrains Mono',monospace;color:#ffd34d}
.lockd{color:#9EACBA;font-size:12px}
.step .ck{color:#ffd34d;font-weight:800}
.step.done{border-color:rgba(255,211,77,.35)}
.step .act{flex:0 1 auto;margin-left:auto;max-width:100%}
.step .act .btn{white-space:normal;text-align:center;line-height:1.25;padding:6px 14px}
.wait{height:6px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;margin-top:8px}
.wait i{display:block;height:100%;background:linear-gradient(90deg,#ffd34d,#00f2cf);width:0}

/* cuaderno y bitácora */
.tabs{display:flex;gap:6px;margin-bottom:12px}
.tabs button{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--line);background:transparent;cursor:pointer;font-weight:600;color:var(--dim)}
.tabs button.on{background:rgba(119,0,244,.25);border-color:var(--vi);color:#fff}
textarea.notes{width:100%;min-height:42vh;border-radius:14px;border:1px solid var(--line);background:rgba(0,0,0,.35);color:var(--ink);padding:14px;font:500 calc(15px*var(--fs))/1.5 Poppins,sans-serif;resize:none}
.clips{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.clip{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);aspect-ratio:1;background:#000}
.clip-open{display:block;width:100%;height:100%;min-height:44px;padding:0;border:0;background:none;color:inherit;cursor:zoom-in;position:relative}
.clip-open:focus-visible{outline-offset:-3px}
.clip img{width:100%;height:100%;object-fit:cover;display:block}
.clip-delete{position:absolute;top:4px;right:4px;width:44px;height:44px;border-radius:10px;border:0;background:rgba(0,0,0,.72);color:#fff;cursor:pointer;font-size:20px;line-height:1}
.clip small{position:absolute;left:6px;bottom:4px;font:700 12px 'JetBrains Mono',monospace;color:#fff;text-shadow:0 1px 2px #000}
.viewer{max-width:560px;padding:14px}
.viewer .head h2{font-size:calc(16px*var(--fs))}
.viewer img{width:100%;max-height:68vh;object-fit:contain;border-radius:12px;display:block;background:#000}
.empty{text-align:center;color:var(--dim);font-size:14px;line-height:1.5;padding:30px 10px}
.empty svg{width:46px;height:46px;stroke:#5c5378;fill:none;stroke-width:1.5;display:block;margin:0 auto 10px}
.recs{display:grid;gap:6px}
.recg{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.16em;color:var(--cy);margin:12px 0 4px;text-transform:uppercase}
.rec{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);cursor:pointer;text-align:left;color:var(--ink);width:100%}
.rec .m{font:600 11px 'JetBrains Mono',monospace;color:var(--dim)}
.rec b{display:block;font-size:14px}
.rec .new{margin-left:auto;font:700 10px 'JetBrains Mono',monospace;color:#04201c;background:var(--cy);padding:3px 7px;border-radius:6px}
.rec.locked{opacity:.35;cursor:default}
.player{padding:14px;border-radius:16px;border:1px solid rgba(0,242,207,.3);background:rgba(0,20,18,.5);margin-bottom:12px}
.player .meta{font:600 12px 'JetBrains Mono',monospace;color:var(--dim);margin-bottom:8px}
.player canvas{width:100%;height:46px;display:block;margin:6px 0}
.tr{font:500 calc(15px*var(--fs))/1.55 'JetBrains Mono',monospace;color:#e8fff8;min-height:3em}
.tr span{opacity:1;transition:opacity .2s}.tr.playing span{opacity:.3}.tr.playing span.on{opacity:1}
.tr:focus{outline:none}.tr:focus-visible{outline:2px solid var(--cy);outline-offset:4px}
.humbars{display:flex;gap:6px;align-items:flex-end;height:34px;margin-top:10px}
.bi{width:16px;height:16px;flex:none;fill:currentColor;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.humbars i{width:12px;border-radius:3px;background:var(--cy);opacity:.55}
.humbars em{font:700 10px 'JetBrains Mono',monospace;color:var(--dim);font-style:normal;margin-right:4px;align-self:center}

/* mapa */
.mapg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mapg button{min-height:64px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer;text-align:left;padding:10px 12px;color:var(--ink)}
.mapg button b{display:block;font-size:15px}.mapg button small{font:600 11px 'JetBrains Mono',monospace;color:var(--dim)}
.mapg button.cur{border-color:var(--cy)}
.mapg button[disabled]{opacity:.35}
.mapg .obs{grid-column:1/-1}

/* cómo jugar */
.how canvas{width:100%;aspect-ratio:16/10;border-radius:14px;background:#07040d;display:block;border:1px solid var(--line);touch-action:none}
.how h3{font-size:20px;margin:14px 0 4px}.how p{color:var(--dim);font-size:15px;line-height:1.5;min-height:3em}
.dots{display:flex;gap:6px;justify-content:center;margin:12px 0}.dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2)}.dots i.on{background:var(--cy);width:22px;border-radius:99px}
.how .vb{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px;min-height:104px;align-content:start}
.how .vb .send{background:linear-gradient(135deg,#7700f4,#00f2cf);border:0;color:#fff;font:700 15px Poppins,sans-serif;min-height:48px}
.how .vb .send:focus-visible{outline:2px solid var(--cy)}
.how .vb button{min-height:44px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer;font:600 12px Poppins,sans-serif;color:var(--ink)}

/* resultado y cinemáticas */
.big-t{font-size:calc(28px*var(--fs));font-weight:800;text-align:center;letter-spacing:-.02em}
.lines{font:500 14px 'JetBrains Mono',monospace;margin:14px 0;border-top:1px solid var(--line)}
.lines div{display:flex;justify-content:space-between;padding:10px 2px;border-bottom:1px solid var(--line)}
.lines b{color:var(--ink)}.lines span{color:var(--dim)}
.rank{text-align:center;font:800 14px 'JetBrains Mono',monospace;letter-spacing:.2em;color:var(--cy);margin-top:6px}
.cine{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px calc(24px + var(--sar)) 30px calc(24px + var(--sal));pointer-events:auto;cursor:default}
.cine .type{font:700 calc(14px*var(--fs))/1.7 'JetBrains Mono',monospace;letter-spacing:.14em;color:#cfe0ff;max-width:640px;min-height:5em;white-space:pre-wrap}
.cine .line2{font:600 calc(22px*var(--fs)) Poppins,sans-serif;margin-top:18px;opacity:0;transition:opacity 1.2s}
.cine .line2.on{opacity:1}
.skip{position:absolute;right:calc(16px + var(--sar));bottom:calc(16px + var(--sab));min-height:44px;padding:0 16px;border-radius:99px;border:1px solid var(--line);background:rgba(0,0,0,.5);color:var(--dim);font:600 13px 'JetBrains Mono',monospace;cursor:pointer;opacity:0;transition:opacity .4s}
.skip.on{opacity:1}
.credits{font:500 15px/2 Poppins,sans-serif;color:var(--dim)}
.credits b{color:var(--ink);font-weight:700;display:block;font-size:18px;margin-top:22px}
.restored .glyph{width:120px;height:120px;margin:4px auto 10px;display:block}
#fade{position:fixed;inset:0;z-index:70;background:#000;opacity:0;pointer-events:none;transition:opacity .3s}
#fade.on{opacity:1}
.door{position:fixed;inset:0;z-index:69;pointer-events:none;display:flex}
.door i{flex:1;background:linear-gradient(90deg,#1a1430,#0c0820);transition:transform .32s cubic-bezier(.6,0,.2,1)}
.door i:last-child{background:linear-gradient(270deg,#1a1430,#0c0820)}
.door.open i:first-child{transform:translateX(-100%)}.door.open i:last-child{transform:translateX(100%)}

/* archivo */
.ar-q{padding:10px 12px;border-radius:12px;background:rgba(255,210,138,.06);border:1px solid rgba(255,210,138,.25);margin-bottom:10px}
.ar-q p{font-size:calc(16px*var(--fs));font-weight:600;margin-top:4px}
.ar-q small{display:block;color:var(--dim);font-size:12.5px;margin-top:6px;line-height:1.45}
.ar-q .kick{color:#ffd28a}
.ar-form{display:flex;gap:6px;align-items:center;padding:6px;border-radius:14px;background:rgba(0,0,0,.4);border:1px solid rgba(255,210,138,.3)}
.ar-lupa{font-size:22px;color:#ffd28a;padding:0 4px}
.ar-in{flex:1;min-width:0;height:44px;border:0;background:transparent;color:#fff;font:600 16px 'JetBrains Mono',monospace;outline:none}
.ar-hist{display:flex;gap:6px;overflow-x:auto;padding:8px 0;scrollbar-width:none}
.ar-hist:empty{display:none}
.ar-count{font:700 12px 'JetBrains Mono',monospace;color:#ffd28a;letter-spacing:.08em;margin:4px 0 8px}
.ar-e{padding:12px 14px;border-radius:10px;background:#171D29;border:1px solid #3C485C;margin-bottom:12px}
.ar-e header{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font:600 12px 'JetBrains Mono',monospace;color:#B3C1CF;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #3C485C}
.ar-e header b{color:#ffd28a}
.ar-e p{font:500 calc(15px*var(--fs))/1.6 Poppins,sans-serif;color:#EDF4F8}
.ar-empty{color:var(--dim);font-size:14px;line-height:1.5;padding:14px 4px}
.shelves .sh-tags{display:flex;gap:6px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.tag{font:800 14px 'JetBrains Mono',monospace;padding:6px 10px;border-radius:8px;border:1px dashed rgba(255,255,255,.25);color:var(--dim)}
.tag.on{border-style:solid;border-color:#ffd28a;color:#ffd28a;background:rgba(255,210,138,.08)}
.sh-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}
.sh{position:relative;border-radius:10px;background:linear-gradient(#3a2814,#20160c);border:1px solid rgba(255,210,138,.18);padding:6px;min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.sh i{font:700 10px 'JetBrains Mono',monospace;font-style:normal;color:#c9a46a}
.sh b{font:800 20px 'JetBrains Mono',monospace;color:#fff1d6;background:rgba(0,0,0,.35);border-radius:6px;padding:0 8px;margin-top:2px}
.sh span{position:absolute;left:8px;right:8px;bottom:4px;height:3px;background:repeating-linear-gradient(90deg,#c96 0 5px,transparent 5px 8px);opacity:.5}
#offline{display:none}
@media (prefers-reduced-motion:reduce){.card,.scr,#insp,.toast{animation:none}}
html.reduce .card,html.reduce .scr,html.reduce #insp,html.reduce .toast{animation:none}
html.contrast .i-stage{filter:contrast(1.25) saturate(1.15)}
.fragline{display:flex;align-items:center;justify-content:center;gap:10px;margin:6px 0;font:700 12px 'JetBrains Mono',monospace;color:var(--cy);letter-spacing:.08em}
.frag{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;background:rgba(0,242,207,.08);border:1px solid rgba(0,242,207,.35);animation:stampIn .5s cubic-bezier(.2,1.6,.4,1)}
.frag svg{width:40px;height:40px}
details summary::-webkit-details-marker{display:none}
details[open] summary{border-color:var(--cy)}
body.demo #top,body.demo #roomList{display:none!important}
body.land #plateBar{left:calc(10px + var(--sal));transform:none;flex-direction:column;align-items:flex-start;gap:4px}
body.land #hubBar{left:auto;right:calc(12px + var(--sar));transform:none;flex-direction:column;align-items:stretch}
body.land #hubBar .stars-n{text-align:center;padding:4px 0}
[hidden]{display:none!important}
body.short.land .home{padding-top:calc(54px + var(--sat))}
body.short.land .logo{font-size:clamp(28px,6vh,40px)}
body.short.land .home .sub{margin:6px 0 10px}
body.short.land .btn.big{min-height:54px}
body.short.land .home .sec{grid-template-columns:1fr 1fr 52px}
body.short.land .home .sec .btn.wide{grid-column:auto}
body.short.land .home .sec .btn.wide:first-child{grid-column:1/-1}
body.short.land .home .sec .fsb{padding:0}
body.short.land .home .sec .fsb .lbl{display:none}
.fsb svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
#plateBar{max-width:calc(100vw - 20px)}
@media (max-width:420px){#plateBar .pl-m{display:none}#plateCv{width:min(180px,52vw);height:auto;aspect-ratio:180/24}}
.pc b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.land #roomList .pc.meta{flex:1.25 0 200px}
body.land #roomList .pc .frs i{width:12px}
/* selector de idioma común de jetgames.fun (ES | EN) en el inicio */
.home .hlang{display:flex;justify-content:center;margin-top:12px}
.home .hlang .seg{background:rgba(10,4,24,.55);backdrop-filter:blur(6px)}
body.short.land .home .hlang{margin-top:6px}

/* ===== interfaces 26-10 (catálogo de cambios) ===== */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* SRC-G04: confirmaciones */
.cf{max-width:440px}
.cf-b{font-size:calc(15px*var(--fs));line-height:1.5;margin:0 0 12px}
.cf-b.dim{color:var(--dim)}
.cf-acts{display:flex;flex-wrap:wrap;gap:12px 16px;margin-top:8px}
.cf-acts .btn{margin:0;flex:1 1 140px;padding:0 12px}
textarea.copybox{min-height:120px;font-size:13px;-webkit-user-select:text;user-select:text}
/* SRC-ES02: ayudas de la sección Partida */
.set.col{flex-direction:column;align-items:flex-start;gap:4px}
.help{font-size:13px;line-height:1.45;color:var(--dim)}
/* PLAY-ESTACION-05: tarjeta de éxito */
.succ-card{max-width:400px;text-align:center}
.succ-stars{font-size:30px;color:#ffd34d;letter-spacing:6px;margin:8px 0 2px}
.succ-stars span{opacity:.25}
.succ-l{font:500 13px/1.6 'JetBrains Mono',monospace;color:#B3C1CF;margin:0 0 6px}
.succ-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:12px}
.succ-acts .btn{flex:1 1 150px;gap:8px}
/* PLAY-ESTACION-07: mover la vista de la sala */
#roomPan{position:fixed;left:0;right:0;top:42%;z-index:16;display:flex;justify-content:space-between;padding:0 calc(8px + var(--sar)) 0 calc(8px + var(--sal));pointer-events:none}
#roomPan .rp{pointer-events:auto;background:rgba(18,29,43,.82);border-color:#52677E}
#roomPan .rp[aria-disabled=true]{opacity:.3}
body.land #roomPan{top:38%}
@media (prefers-reduced-motion:reduce){.stamp.on{animation:none}}
