:root{--ink:#fff8df;--muted:#c9c7ac;--gold:#f3c654;--deep:#071912;--panel:#102c22;--line:rgba(243,198,84,.28);--danger:#ff9f9f;--die:#f3c654;--pips:#301d0b;--shadow:0 20px 55px rgba(0,0,0,.38)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#06140f;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}a{color:inherit}.setup{min-height:100dvh;padding:clamp(12px,2vw,24px);background:radial-gradient(circle at 50% -10%,rgba(243,198,84,.23),transparent 32%),linear-gradient(rgba(4,21,15,.9),rgba(4,21,15,.98)),repeating-linear-gradient(100deg,#173f30 0 2px,#0b251b 2px 80px)}.setup-head{width:min(1050px,100%);margin:auto;display:flex;align-items:center;justify-content:space-between}.quit,.text-link{font-weight:850;text-decoration:none;color:var(--gold)}.crest{display:grid;place-items:center;width:46px;aspect-ratio:1;border-radius:50%;background:#173c65;border:3px solid var(--gold);color:var(--gold);font-size:1.45rem;box-shadow:0 0 0 5px rgba(243,198,84,.1)}.connection{font-size:.76rem;font-weight:900;letter-spacing:.08em;color:#8de0b0}.title{text-align:center;margin:10px auto 18px}.title>p:first-child,.section-title span,.panel>span,.player-court header span,.table-copy span,.game-head span{color:var(--gold);font-size:.7rem;font-weight:950;letter-spacing:.13em}.title h1{font-family:Georgia,serif;font-size:clamp(2.8rem,7vw,5.2rem);line-height:.88;margin:10px 0}.title h1 span{color:var(--gold)}.title>p:last-child{margin:0;color:var(--muted)}.setup-grid{width:min(1050px,100%);margin:auto;display:grid;grid-template-columns:.75fr 1.25fr;gap:12px}.panel{border:1px solid var(--line);border-radius:14px;background:rgba(13,40,30,.9);padding:16px;box-shadow:var(--shadow)}.identity{display:flex;flex-direction:column;justify-content:center;text-align:center;grid-column:1}.identity strong{font:700 1.35rem Georgia,serif;margin:5px}.identity small{color:var(--muted)}.identity .text-link{margin-top:9px}.online{grid-column:2;grid-row:1 / span 2}.rules{grid-column:1}.section-title{display:flex;justify-content:space-between}.section-title b{font-size:.75rem;color:#9de3b8}.panel p{color:var(--muted);margin:8px 0}.lobby-controls{display:grid;grid-template-columns:1fr auto;gap:8px}.lobby-controls input{grid-column:1}.panel input,.panel select,.panel button{min-height:44px;border:1px solid var(--line);border-radius:8px;background:#071e16;color:var(--ink);padding:8px 12px}.panel button{font-weight:900;background:#31443c}.lobby{margin-top:12px;padding:12px;background:#071e16;border-radius:10px}.lobby>div:first-child{display:flex;justify-content:space-between}.lobbyCode{}.lobby ul{list-style:none;padding:0;margin:10px 0;display:grid;gap:5px}.lobby li{display:flex;justify-content:space-between}.lobby-actions{display:flex;gap:7px}.lobby-actions button{flex:1}.error{color:var(--danger)!important;font-size:.78rem;font-weight:800}.fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.fields label{display:grid;gap:5px;font-size:.72rem;font-weight:850;color:var(--muted)}fieldset{border:0;padding:10px 0 0;margin:0}legend{font-size:.72rem;font-weight:900;color:var(--gold)}.skin-picker{display:grid;grid-template-columns:1fr 1fr;gap:6px}.skin-picker .skin{min-height:36px;padding:5px;font-size:.7rem;display:flex;align-items:center;gap:6px}.skin.active{outline:2px solid var(--gold)}.skin i{width:17px;height:17px;border-radius:4px;background:var(--sample);box-shadow:inset -3px -3px rgba(0,0,0,.18)}.skin[data-skin=royal-gold]{--sample:#f3c654}.skin[data-skin=dragon-ember]{--sample:#db563d}.skin[data-skin=moonstone]{--sample:#dceaff}.skin[data-skin=forest-jade]{--sample:#42c985}.deal{width:100%;margin-top:10px!important;background:linear-gradient(#f5cf68,#d8982f)!important;color:#241607!important;border:0!important}

.game{height:100dvh;max-height:100dvh;overflow:hidden;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;background:radial-gradient(circle at 50% 40%,#275c45,#0a271c 68%,#06140f);padding:max(7px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));gap:6px}.game-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:36px}.game-head>div{text-align:center}.game-head strong{display:block;font-family:Georgia,serif}.sound{justify-self:end;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#18382b;color:var(--gold)}.opponents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-height:0}.opponent{border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(7,25,18,.72);padding:6px;min-width:0}.opponent.active{border-color:var(--gold);box-shadow:0 0 18px rgba(243,198,84,.2)}.opponent header{display:flex;justify-content:space-between;gap:4px;font-size:.72rem}.opponent header strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-board{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;margin-top:4px}.mini-slot{aspect-ratio:1;border-radius:3px;background:#06140f;border:1px solid rgba(255,255,255,.1);display:grid;place-items:center;font-weight:900;font-size:.64rem}.mini-slot.filled{background:#b5852d;color:white}.table{position:relative;min-height:0;display:grid;grid-template-rows:auto minmax(76px,1fr) auto;justify-items:center;align-items:center;overflow:hidden;border:1px solid rgba(243,198,84,.19);border-radius:18px;background:radial-gradient(ellipse at center,rgba(49,118,83,.86),rgba(10,45,31,.85));box-shadow:inset 0 0 50px rgba(0,0,0,.28)}.table::before{content:"";position:absolute;inset:0;opacity:.14;background:repeating-radial-gradient(ellipse,#fff 0 1px,transparent 1px 7px);pointer-events:none}.table-copy{text-align:center;z-index:1;padding-top:5px}.table-copy strong{display:block;font-size:clamp(.72rem,1.5vw,.9rem);max-width:70vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dice-stage{perspective:600px;display:grid;place-items:center;width:clamp(64px,12vh,108px);height:clamp(64px,12vh,108px);z-index:1}.die{--size:clamp(54px,9.5vh,84px);--half:calc(var(--size)/2);position:relative;width:var(--size);height:var(--size);transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(24deg);transition:transform .55s cubic-bezier(.2,.7,.2,1);filter:drop-shadow(0 18px 10px rgba(0,0,0,.32));--die:#f3c654;--pip:#3a2108}.die.skin-dragon-ember{--die:#d6553e;--pip:#fff2d0}.die.skin-moonstone{--die:#e8f0ff;--pip:#1a477b}.die.skin-forest-jade{--die:#3fc981;--pip:#082f21}.die.rolling{animation:tumble .9s cubic-bezier(.35,.05,.2,1)}.face{position:absolute;inset:0;display:grid;place-items:center;text-align:center;border:2px solid rgba(255,255,255,.35);border-radius:16%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.42),transparent 32%),var(--die);color:var(--pip);font-size:calc(var(--size)*.25);line-height:.65;backface-visibility:hidden}.f1{transform:translateZ(var(--half))}.f2{transform:rotateY(90deg) translateZ(var(--half))}.f3{transform:rotateY(180deg) translateZ(var(--half))}.f4{transform:rotateY(-90deg) translateZ(var(--half))}.f5{transform:rotateX(90deg) translateZ(var(--half))}.f6{transform:rotateX(-90deg) translateZ(var(--half))}.die[data-value="1"]{transform:rotateX(-18deg) rotateY(24deg)}.die[data-value="2"]{transform:rotateX(-18deg) rotateY(-66deg)}.die[data-value="3"]{transform:rotateX(-18deg) rotateY(204deg)}.die[data-value="4"]{transform:rotateX(-18deg) rotateY(114deg)}.die[data-value="5"]{transform:rotateX(-108deg) rotateY(0)}.die[data-value="6"]{transform:rotateX(72deg) rotateY(0)}@keyframes tumble{0%{transform:translateY(0) rotateX(0) rotateY(0) rotateZ(0)}35%{transform:translateY(-28px) rotateX(260deg) rotateY(190deg) rotateZ(70deg)}70%{transform:translateY(4px) rotateX(590deg) rotateY(460deg) rotateZ(170deg)}100%{transform:translateY(0) rotateX(720deg) rotateY(720deg) rotateZ(180deg)}}.roll{z-index:1;margin-bottom:6px;border:0;border-radius:999px;min-height:42px;padding:8px 28px;background:linear-gradient(#f7d36d,#d89a31);color:#291908;font-weight:950;box-shadow:0 6px 0 #8e5a20}.roll:active{transform:translateY(3px);box-shadow:0 3px 0 #8e5a20}.roll:disabled{filter:grayscale(.7);opacity:.55;cursor:not-allowed}
.player-court{border:1px solid var(--line);background:#0a2118;border-radius:13px;padding:7px 9px}.player-court header{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px}.player-court header strong{display:block;font-family:Georgia,serif}.supply,.sets{text-align:center}.supply b,.sets b{display:block;font-size:1.1rem}.board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-top:6px}.gate{position:relative;min-height:clamp(47px,8vh,72px);border:1px solid rgba(243,198,84,.24);border-radius:8px;background:linear-gradient(145deg,#163b2b,#081b14);display:grid;place-items:center;overflow:hidden}.gate::before{content:"";position:absolute;inset:4px;border:1px dashed rgba(255,255,255,.1);border-radius:5px}.gate b{font:800 clamp(1.15rem,4vh,2.1rem) Georgia,serif;color:#7f988b}.gate.filled{background:linear-gradient(145deg,#e4b94e,#9b691f)}.gate.filled b{color:#fff9da;text-shadow:0 2px 2px rgba(0,0,0,.3)}.gate small{position:absolute;top:3px;left:5px;font-weight:900}.gate em{position:absolute;bottom:3px;right:5px;font-style:normal;font-weight:900;transform:rotate(180deg)}.game-foot{display:flex;justify-content:space-between;color:var(--muted);font-size:.67rem;padding:0 3px}.result{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:rgba(3,13,9,.78);backdrop-filter:blur(9px)}.result>div{text-align:center;width:min(380px,100%);padding:28px;border:1px solid var(--line);border-radius:20px;background:#0b281d;box-shadow:var(--shadow)}.result .crest{margin:auto}.result h2{font:800 2.4rem Georgia,serif;margin:14px}.result button,.result a{display:flex;justify-content:center;width:100%;padding:12px;margin-top:8px;border-radius:9px;border:1px solid var(--line);background:#eab94d;color:#261606;font-weight:900;text-decoration:none}
@media(max-width:700px){.setup-grid{grid-template-columns:1fr}.identity,.online,.rules{grid-column:1;grid-row:auto}.title{margin-bottom:12px}.online{order:3}.setup{padding:10px}.connection{max-width:32vw;text-align:right}.game{gap:4px}.opponents{gap:3px}.opponent{padding:4px}.opponent header span{display:none}.table{border-radius:12px}.player-court{padding:5px}.player-court header{gap:5px}.board{gap:3px}.gate{min-height:44px}.game-foot span:nth-child(2){max-width:45vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-height:620px){.game-head{min-height:28px}.table{grid-template-columns:1fr auto 1fr;grid-template-rows:1fr}.table-copy{padding:0 3px}.dice-stage{height:68px}.roll{margin:0 5px;padding:7px 16px}.gate{min-height:38px}.opponent{padding:3px}.player-court header strong{font-size:.83rem}}
.table::before{opacity:.16;background:linear-gradient(115deg,transparent 0 28%,rgba(255,255,255,.08) 29%,transparent 30% 70%,rgba(255,255,255,.05) 71%,transparent 72%),repeating-linear-gradient(90deg,transparent 0 119px,rgba(243,198,84,.08) 120px),repeating-linear-gradient(0deg,transparent 0 79px,rgba(255,255,255,.035) 80px)}
.die[data-value="1"]{transform:rotateX(0) rotateY(0) rotateZ(-3deg)}.die[data-value="2"]{transform:rotateX(0) rotateY(-90deg) rotateZ(2deg)}.die[data-value="3"]{transform:rotateX(0) rotateY(180deg) rotateZ(-2deg)}.die[data-value="4"]{transform:rotateX(0) rotateY(90deg) rotateZ(3deg)}.die[data-value="5"]{transform:rotateX(-90deg) rotateY(0) rotateZ(-2deg)}.die[data-value="6"]{transform:rotateX(90deg) rotateY(0) rotateZ(2deg)}
@media(min-width:701px) and (min-height:621px){.game{grid-template-rows:auto auto auto auto auto;align-content:center;gap:10px;padding:18px}.game-head,.opponents,.table,.player-court,.game-foot{width:min(1240px,100%);margin-inline:auto}.opponents:has(.opponent:only-child){grid-template-columns:repeat(3,minmax(0,1fr))}.opponent:only-child{grid-column:2}.opponents:has(.opponent:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.opponent{padding:9px 11px}.opponent header{font-size:.82rem}.mini-slot{max-height:52px;font-size:.8rem}.table{height:clamp(280px,42vh,500px);grid-template-rows:auto 1fr auto;border-radius:24px}.table-copy{padding-top:12px}.table-copy strong{font-size:1rem}.dice-stage{width:160px;height:160px;perspective:850px}.die{--size:clamp(92px,12vh,126px)}.roll{min-height:48px;padding:10px 38px;margin-bottom:14px;font-size:.95rem}.player-court{padding:11px 13px}.player-court header strong{font-size:1.1rem}.gate{min-height:clamp(68px,8vh,96px)}.gate b{font-size:clamp(1.7rem,4vh,2.7rem)}}
.one-field{grid-template-columns:1fr}.rule-note{font-size:.74rem}.die,.die[data-value]{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:7%;padding:14%;transform:none;transform-style:flat;border:3px solid rgba(255,255,255,.52);border-radius:20%;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.5),transparent 34%),var(--die);box-shadow:inset -8px -10px 16px rgba(0,0,0,.2),0 18px 18px rgba(0,0,0,.28);filter:none}.die.rolling{animation:die-roll .9s cubic-bezier(.2,.7,.25,1)}@keyframes die-roll{0%{transform:translate(0,0) rotate(0) scale(1)}25%{transform:translate(-34px,-42px) rotate(-110deg) scale(1.08)}52%{transform:translate(28px,-56px) rotate(170deg) scale(1.13)}78%{transform:translate(-12px,-12px) rotate(290deg) scale(1.04)}100%{transform:translate(0,0) rotate(360deg) scale(1)}}.pip{visibility:hidden;width:100%;aspect-ratio:1;align-self:center;border-radius:50%;background:var(--pip);box-shadow:inset 2px 2px 2px rgba(255,255,255,.25),inset -2px -2px 3px rgba(0,0,0,.3)}.die[data-value="1"] .p5,.die[data-value="2"] .p1,.die[data-value="2"] .p9,.die[data-value="3"] .p1,.die[data-value="3"] .p5,.die[data-value="3"] .p9,.die[data-value="4"] .p1,.die[data-value="4"] .p3,.die[data-value="4"] .p7,.die[data-value="4"] .p9,.die[data-value="5"] .p1,.die[data-value="5"] .p3,.die[data-value="5"] .p5,.die[data-value="5"] .p7,.die[data-value="5"] .p9,.die[data-value="6"] .p1,.die[data-value="6"] .p3,.die[data-value="6"] .p4,.die[data-value="6"] .p6,.die[data-value="6"] .p7,.die[data-value="6"] .p9{visibility:visible}.opponent-stats{display:flex;align-items:center;gap:8px;margin-top:7px;color:var(--muted);font-size:.75rem}.opponent-stats em{margin-left:auto;color:var(--danger)}.player-die,.gate-die{--mini-die:#f3c654;--mini-pip:#3a2108;display:grid;place-items:center;background:var(--mini-die);color:var(--mini-pip);border:1px solid rgba(255,255,255,.45);box-shadow:inset -2px -3px 4px rgba(0,0,0,.2)}.player-die{width:22px;aspect-ratio:1;border-radius:5px}.gate-die{width:clamp(23px,2.6vw,34px);aspect-ratio:1;border-radius:7px;font-style:normal;font-weight:950}.skin-dragon-ember{--mini-die:#d6553e;--mini-pip:#fff2d0}.skin-moonstone{--mini-die:#e8f0ff;--mini-pip:#1a477b}.skin-forest-jade{--mini-die:#3fc981;--mini-pip:#082f21}.shared-board{grid-template-columns:repeat(6,minmax(0,1fr))}.shared-gate{display:block;min-height:clamp(78px,10vh,116px);padding:7px;background:linear-gradient(155deg,#173d2d,#071b13)}.shared-gate::before{inset:5px}.shared-gate.one-away{border-color:var(--gold);box-shadow:inset 0 0 18px rgba(243,198,84,.15)}.shared-gate header{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}.shared-gate header span{font-size:.65rem;color:var(--gold);font-weight:950;letter-spacing:.08em}.shared-gate header b{font:900 .82rem Inter,system-ui,sans-serif;color:var(--ink)}.gate-pile{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:4px;min-height:48px;padding-top:5px}.gate-pile em{font-size:.65rem;color:#789b8a;font-style:normal;text-align:center}@media(max-width:700px){.shared-gate{min-height:66px;padding:4px}.shared-gate header span{font-size:.53rem}.gate-pile{min-height:36px;gap:2px}.gate-die{width:19px;border-radius:4px}.opponent-stats{margin-top:3px}.dice-stage{perspective:500px}}
.die-throw{position:relative;width:var(--throw-size,126px);height:var(--throw-size,126px);display:grid;place-items:center;transform-style:preserve-3d;will-change:transform}.die,.die[data-value]{position:relative;display:block;width:var(--size);height:var(--size);padding:0;overflow:visible;transform-style:preserve-3d;transform-origin:50% 50%;background:none;border:0;border-radius:0;box-shadow:none;filter:none;transition:transform .32s cubic-bezier(.2,.7,.2,1);will-change:transform}.die.rolling{animation:none}.die-shell-face{position:absolute;inset:-1px;background:var(--die);border:0;border-radius:2%;box-shadow:inset -5px -6px 12px rgba(0,0,0,.16);backface-visibility:hidden;-webkit-backface-visibility:hidden;pointer-events:none}.die-shell-face.face-1{transform:translateZ(calc(var(--size)/2 - 1px))}.die-shell-face.face-6{transform:rotateY(180deg) translateZ(calc(var(--size)/2 - 1px))}.die-shell-face.face-3{transform:rotateY(90deg) translateZ(calc(var(--size)/2 - 1px))}.die-shell-face.face-4{transform:rotateY(-90deg) translateZ(calc(var(--size)/2 - 1px))}.die-shell-face.face-2{transform:rotateX(90deg) translateZ(calc(var(--size)/2 - 1px))}.die-shell-face.face-5{transform:rotateX(-90deg) translateZ(calc(var(--size)/2 - 1px))}.die-face{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:7%;padding:14%;border:2px solid rgba(255,255,255,.48);border-radius:20%;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.52),transparent 34%),var(--die);box-shadow:inset -8px -10px 16px rgba(0,0,0,.2),0 2px 5px rgba(0,0,0,.26);backface-visibility:hidden;-webkit-backface-visibility:hidden}.die-face.face-1{transform:translateZ(calc(var(--size)/2))}.die-face.face-6{transform:rotateY(180deg) translateZ(calc(var(--size)/2))}.die-face.face-3{transform:rotateY(90deg) translateZ(calc(var(--size)/2))}.die-face.face-4{transform:rotateY(-90deg) translateZ(calc(var(--size)/2))}.die-face.face-2{transform:rotateX(90deg) translateZ(calc(var(--size)/2))}.die-face.face-5{transform:rotateX(-90deg) translateZ(calc(var(--size)/2))}.die .die-face .pip{visibility:hidden;width:100%;aspect-ratio:1;align-self:center;border-radius:50%;background:var(--pip);box-shadow:inset 2px 2px 2px rgba(255,255,255,.24),inset -2px -2px 3px rgba(0,0,0,.34)}.die .die-face .pip.on{visibility:visible}@media(min-width:701px) and (min-height:621px){.die-throw{--throw-size:160px}}@media(max-width:700px){.die-throw{--throw-size:92px}}
[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){.die.rolling{animation:none}.die{transition:none}}
.admin-debug-button{position:fixed;right:.7rem;bottom:.7rem;z-index:90;background:#7b2626;color:#fff3c4;border:1px solid #e6ba58;border-radius:999px;padding:.55rem .8rem;font-weight:900}.admin-debug-panel{z-index:100;width:min(24rem,calc(100% - 1rem));color:#f7e8bd;background:#10271e;border:1px solid #e6ba58;border-radius:.7rem}.admin-debug-panel::backdrop{background:#000a}.admin-debug-panel form{display:grid;gap:.65rem}.admin-debug-panel header{display:flex;justify-content:space-between}.admin-debug-panel label{display:grid;gap:.2rem}.admin-debug-panel input,.admin-debug-panel select{padding:.55rem;background:#06160f;color:#fff;border:1px solid #71805e}.admin-debug-panel small{color:#f2c96b}