:root{--ui-bg: rgba(10, 14, 28, .88);--ui-line: #263055;--ui-text: #cfd6ea;--ui-dim: #7f8ab0;--ui-accent: #ff5a36;--ui-cyan: #38e1ff;--ui-gold: #ffd166;--safe-t: env(safe-area-inset-top, 0px);--safe-r: env(safe-area-inset-right, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px)}#ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;color:var(--ui-text);font-size:14px}#ui button,#ui input{font:inherit}#ui .layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:auto}#ui .hidden{display:none!important}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:max(16px,var(--safe-t)) max(16px,var(--safe-r)) max(16px,var(--safe-b)) max(16px,var(--safe-l));background:radial-gradient(ellipse at center,#070a148c,#070a14e6);overflow-y:auto;pointer-events:auto;align-items:flex-start}.screen>*{margin-top:auto;margin-bottom:auto}.panel{background:var(--ui-bg);border:1px solid var(--ui-line);border-radius:16px;padding:22px 24px;width:min(560px,100%);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 20px 60px #00000073}.panel h2{margin:0 0 4px;color:#fff;font-size:20px;letter-spacing:.04em}.panel .sub{color:var(--ui-dim);margin:0 0 18px;font-size:13px}.main{display:grid;grid-template-columns:1.15fr 1fr;gap:32px;width:min(880px,100%);align-items:center}.logo{margin:0;line-height:0}.logo .wordmark{width:min(520px,100%);height:auto;overflow:visible;filter:drop-shadow(0 10px 24px rgba(0,0,0,.55))}.tagline{margin:4px 0 0 6px;color:#e6ebf7;font-size:13px;font-weight:800;letter-spacing:.42em}.tagline i{font-style:normal;color:var(--ui-accent)}.brand{display:flex;flex-direction:column}.brand .hero{width:100%;height:clamp(120px,28vh,230px);display:block;margin:4px 0 6px}.pilot{display:flex;align-items:center;gap:10px;align-self:flex-start;padding:6px 12px;border-radius:999px;background:#0a0e1cb3;border:1px solid var(--ui-line);cursor:text}.pilot span{color:var(--ui-dim);font-size:10px;font-weight:800;letter-spacing:.2em}.pilot input{width:130px;border:0;background:transparent;color:#fff;font:700 14px inherit;font-family:inherit;outline:none;padding:2px 0}.pilot b{color:var(--ui-dim);font-size:12px}.pilot:focus-within{border-color:var(--ui-accent)}.screen.title{background:linear-gradient(90deg,#070a14db,#070a1473 48%,#070a14b3)}.field label{display:block;color:var(--ui-dim);font-size:11px;letter-spacing:.12em;font-weight:700;margin-bottom:6px}.field input{width:100%;box-sizing:border-box;padding:11px 14px;border-radius:10px;outline:none;background:#121933;border:1px solid #33406e;color:#fff;font-size:16px}.field input:focus{border-color:var(--ui-accent)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.actions .wide{grid-column:1 / -1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 16px;border-radius:12px;cursor:pointer;background:#1b2340;border:1px solid #33406e;color:#fff;font-weight:700;letter-spacing:.04em;-webkit-tap-highlight-color:transparent;transition:background .12s,transform .08s}.btn:hover{background:#26315a}.btn:active{transform:scale(.97)}.btn.primary{background:var(--ui-accent);border-color:#ff7a5c;color:#fff}.btn.primary:hover{background:#ff6a49}.btn.ghost{background:transparent}.btn.small{min-height:34px;padding:0 12px;font-size:12px;border-radius:9px}.btn[disabled]{opacity:.45;pointer-events:none}.btn .big{font-size:16px}.btn small{display:block;font-weight:500;color:#ffffffbf;font-size:11px;letter-spacing:0}.btn.primary.tall{min-height:64px;flex-direction:column;gap:2px}.row{display:flex;gap:10px;margin-top:18px}.row .btn{flex:1}.opt{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:10px;margin-bottom:12px}.opt>span{color:var(--ui-dim);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.seg{display:flex;background:#121933;border:1px solid #33406e;border-radius:10px;padding:3px;gap:3px}.seg button{flex:1;min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--ui-text);cursor:pointer;font-weight:700}.seg button.on{background:var(--ui-accent);color:#fff}.codeinput{width:100%;box-sizing:border-box;text-align:center;letter-spacing:.4em;text-transform:uppercase;font-size:30px!important;font-weight:800;padding:12px;border-radius:12px;outline:none;background:#121933;border:1px solid #33406e;color:#fff}.codeinput:focus{border-color:var(--ui-accent)}.error{color:#ff4d6d;min-height:20px;margin-top:10px;font-weight:600}.spinner{width:36px;height:36px;margin:6px auto 14px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--ui-accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.center{text-align:center}.howto{display:grid;grid-template-columns:1fr 1fr;gap:18px;font-size:13px}.howto h3{margin:0 0 8px;color:var(--ui-cyan);font-size:11px;letter-spacing:.12em}.howto dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:5px 12px}.howto dt{color:#fff;font-weight:700}.howto dd{margin:0;color:var(--ui-text)}.scores{width:100%;border-collapse:collapse;margin:6px 0 4px}.scores th{color:var(--ui-dim);font-size:11px;letter-spacing:.1em;text-align:left;padding:4px 6px}.scores td{padding:7px 6px;border-top:1px solid rgba(255,255,255,.06);font-weight:700}.scores td.n,.scores th.n{text-align:right;width:44px}.scores th.n[title]{width:52px}.scores tr.me td{background:#ffffff0d}.crown{color:var(--ui-gold);margin-left:6px;font-size:12px}.chip{position:absolute;top:max(10px,var(--safe-t));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;background:#0a0e1ccc;border:1px solid var(--ui-line);font-size:12px;cursor:pointer;pointer-events:auto;white-space:nowrap;-webkit-tap-highlight-color:transparent}.chip .dot{width:8px;height:8px;border-radius:50%;background:var(--ui-dim)}.chip b{color:#fff;letter-spacing:.12em}.chip .ping{font-weight:700;font-variant-numeric:tabular-nums}.chip .menu{color:var(--ui-dim);font-size:14px;line-height:1}.lobby{position:absolute;top:calc(max(10px,var(--safe-t)) + 66px);right:max(16px,var(--safe-r));width:min(330px,46vw);box-sizing:border-box;padding:10px 12px;border-radius:12px;background:#0a0e1cd1;border:1px solid var(--ui-line);pointer-events:auto;font-size:12px}.lobby .head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}.lobby .head b{color:#fff;letter-spacing:.06em}.lobby .players{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.lobby .players span{padding:2px 8px;border-radius:999px;background:#ffffff0f;font-weight:700}.lobby .bar{display:flex;gap:8px;align-items:center}.lobby .bar .msg{flex:1;color:var(--ui-dim)}.toast{position:absolute;bottom:calc(max(16px,var(--safe-b)) + 8px);left:50%;transform:translate(-50%);background:#0a0e1ceb;border:1px solid var(--ui-line);padding:8px 14px;border-radius:999px;color:#fff;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none}.toast.show{opacity:1}@media (max-height: 460px){.panel{padding:14px 16px}.panel .sub{margin-bottom:10px}.logo .wordmark{width:min(330px,100%)}.tagline{font-size:11px}.brand .hero{height:clamp(90px,30vh,150px)}.btn{min-height:40px}.btn.primary.tall{min-height:54px}.opt{margin-bottom:8px}.seg button{min-height:32px}.row{margin-top:10px}.scores td{padding:4px 6px}.lobby{width:min(300px,40vw);padding:7px 10px;font-size:11px;top:calc(max(10px,var(--safe-t)) + 60px)}.lobby .players{margin:5px 0;gap:4px}.lobby .players span{padding:1px 6px}.lobby .bar{gap:6px}.lobby .bar .msg{font-size:10px}.lobby .btn.small{min-height:26px;padding:0 9px;font-size:11px}}@media (max-width: 620px){.main{grid-template-columns:1fr;gap:14px}.howto{grid-template-columns:1fr}.opt{grid-template-columns:1fr;gap:4px}}.tutorial{position:absolute;top:calc(max(10px,var(--safe-t)) + 40px);left:50%;transform:translate(-50%);width:min(440px,calc(100vw - 32px));box-sizing:border-box;padding:10px 14px;border-radius:12px;background:#0a0e1ce0;border:1px solid var(--ui-line);pointer-events:auto;transition:border-color .2s,background .2s}.tutorial.nice{border-color:#7cff6b;background:#14281ceb}.tutorial .tut-head{display:flex;align-items:center;gap:10px;font-size:11px}.tutorial .tut-head span{color:var(--ui-dim);font-weight:700;letter-spacing:.08em}.tutorial .tut-head b{color:var(--ui-gold);letter-spacing:.1em;flex:1}.tutorial .tut-skip{font:inherit;font-size:10px;color:var(--ui-dim);background:none;border:1px solid #33406e;border-radius:999px;padding:3px 9px;cursor:pointer}.tutorial .tut-text{color:#fff;font-weight:700;font-size:14px;margin:6px 0 8px}.tutorial .tut-dots{display:flex;gap:5px}.tutorial .tut-dots i{flex:1;height:3px;border-radius:2px;background:#ffffff1f}.tutorial .tut-dots i.on{background:#7cff6b}.tutorial .tut-dots i.now{background:var(--ui-gold)}.btn.tutorialcta{border-color:var(--ui-gold);color:var(--ui-gold)}@media (max-height: 460px){.tutorial{padding:7px 12px;top:calc(max(8px,var(--safe-t)) + 36px);width:min(400px,52vw)}.tutorial .tut-text{font-size:12px;margin:4px 0 6px}}.steps{margin:12px 0 16px;padding-left:22px;color:#cfd6ea;line-height:1.9;font-size:14px}.steps b{color:#fff}.steps .ico{vertical-align:-3px;color:#38e1ff}.intro{position:fixed;left:0;right:0;top:8%;text-align:center;pointer-events:none;z-index:30}.intro.hidden{display:none}.intro small{display:block;color:#cfd6ea;letter-spacing:.4em;font-size:12px;font-weight:800}.intro h1{margin:2px 0 0;font-size:clamp(34px,min(8vw,13vh),84px);font-weight:900;letter-spacing:.08em;text-shadow:0 4px 24px rgba(0,0,0,.6)}.intro .tag{margin:2px 0 10px;color:#fff;font-size:16px;font-weight:600;text-shadow:0 2px 10px rgba(0,0,0,.7)}.intro .feat{display:inline-block;margin:0;padding:6px 14px;border-radius:999px;border:1px solid;background:#070a14b3;color:#e6ebf7;font-size:13px;font-weight:700}.intro.play>*{animation:introIn 4.2s cubic-bezier(.2,.8,.2,1) both}.intro.play>:nth-child(2){animation-delay:.08s}.intro.play>:nth-child(3){animation-delay:.16s}.intro.play>:nth-child(4){animation-delay:.26s}@keyframes introIn{0%{opacity:0;transform:translateY(16px) scale(.96);letter-spacing:.3em}12%{opacity:1;transform:none}80%{opacity:1;transform:none}to{opacity:0;transform:translateY(-10px)}}.vote .vlabel{margin:14px 0 8px;color:var(--ui-dim, #7f8ab0);font-size:11px;font-weight:800;letter-spacing:.18em}.vcards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.vcard{display:flex;flex-direction:column;gap:3px;padding:8px;border-radius:12px;border:1.5px solid #263055;background:#101528e6;color:#fff;text-align:left;cursor:pointer;font:inherit}.vcard img{width:100%;height:auto;border-radius:8px;image-rendering:pixelated}.vcard b{font-size:15px}.vcard small{color:#9aa4c4;font-size:11px}.vcard .vcount{color:var(--acc);font-size:12px;letter-spacing:2px;min-height:16px}.vcard .vcount i{color:#5c6687;font-style:normal;letter-spacing:0}.vcard.mine{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc) inset,0 0 18px -4px var(--acc)}@media (max-height: 500px){.vote .vlabel{margin:6px 0 4px}.vcard{flex-direction:row;align-items:center;gap:8px;padding:6px 8px}.vcard img{width:64px;flex:none}.vcard small{display:none}.vcard .vcount{margin-left:auto}}.update{position:fixed;top:calc(max(10px,var(--safe-t)) + 44px);left:50%;transform:translate(-50%);z-index:40;padding:7px 14px;border-radius:999px;border:1px solid #ffd166;background:#0a0e1cf0;color:#ffd166;font:600 12px ui-sans-serif,-apple-system,sans-serif;letter-spacing:.04em;cursor:pointer;pointer-events:auto}.update.hidden{display:none}.update b{color:#fff}.scores td.mods{width:1%;white-space:nowrap;text-align:right}.scores .mod{margin-left:4px;padding:3px 7px;border-radius:6px;border:1px solid var(--ui-line);background:transparent;color:var(--ui-dim);font:700 10px ui-sans-serif,-apple-system,sans-serif;letter-spacing:.06em;cursor:pointer}.scores .mod:hover{color:#fff;border-color:#7f8ab0}.scores .mod.armed{color:#fff;background:#ff4d6d;border-color:#ff4d6d}.privacy-id .pid{display:flex;align-items:center;gap:8px}.privacy-id code{flex:1;padding:7px 10px;border-radius:8px;background:#0000004d;color:var(--ui-text);font-size:12px;letter-spacing:.04em}.legal-note{margin:10px 0 0;color:var(--ui-dim);font-size:11px}.legal-note a,.legal a{color:var(--ui-dim)}.legal{position:fixed;left:max(10px,var(--safe-l));bottom:max(2px,var(--safe-b));display:flex;align-items:center;gap:0;font-size:12px}.legal a{padding:10px 8px}.legal i{font-style:normal;color:var(--ui-dim)}.legal a:hover,.legal-note a:hover{color:#fff}.docview{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;flex-direction:column;background:#070a14;pointer-events:auto;padding:max(8px,var(--safe-t)) max(8px,var(--safe-r)) max(8px,var(--safe-b)) max(8px,var(--safe-l))}.docview.hidden{display:none}.docbar{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 8px;color:#fff;letter-spacing:.12em;font-size:13px}.docview iframe{flex:1;width:100%;border:0;border-radius:10px;background:#070a14}
