:root{--bg: #0c0f1a;--bg-card: #151929;--bg-elevated: #1c2137;--border: #2a3050;--text: #e8eaf6;--text-muted: #8892b0;--primary: #6366f1;--primary-hover: #818cf8;--secondary: #334155;--danger: #ef4444;--success: #22c55e;--radius: 14px;--shadow: 0 8px 32px rgba(0, 0, 0, .4);font-family:Outfit,system-ui,sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}input,textarea,select,[contenteditable=true]{-webkit-user-select:text;user-select:text}img{-webkit-user-drag:none;user-drag:none}html{height:100%;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;touch-action:pan-y;overscroll-behavior:none}html::-webkit-scrollbar{display:none}html.is-drag-scrolling,html.is-drag-scrolling *{cursor:grabbing}body{background:var(--bg);background-image:radial-gradient(ellipse 80% 60% at 50% -20%,rgba(99,102,241,.18),transparent),radial-gradient(ellipse 50% 40% at 100% 100%,rgba(239,68,68,.08),transparent);color:var(--text);min-height:100%;line-height:1.5;overflow:visible;cursor:grab}button,a,input,textarea,select,label{cursor:pointer}input,textarea{cursor:text}.app{max-width:1200px;margin:0 auto;padding:24px 20px 48px}.toast{position:fixed;top:20px;right:20px;z-index:1000;padding:12px 20px;border-radius:10px;font-weight:500;animation:slideIn .3s ease}.toast--error{background:var(--danger);color:#fff}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.hero{text-align:center;margin-bottom:40px}.hero-badge{display:inline-block;padding:6px 14px;background:#6366f126;border:1px solid rgba(99,102,241,.3);border-radius:999px;font-size:.85rem;color:var(--primary-hover);margin-bottom:16px}.hero h1{font-size:3.2rem;font-weight:800;letter-spacing:-.03em;background:linear-gradient(135deg,#fff 30%,#a5b4fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-sub{color:var(--text-muted);font-size:1.1rem;margin-top:8px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.card h2,.card h3{font-size:1.1rem;margin-bottom:16px;font-weight:600}.card--wide{grid-column:1 / -1}.lobby-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:20px}.form-stack{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field span{font-size:.85rem;color:var(--text-muted)}.field input,.field select{padding:10px 14px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;color:var(--text);font-family:inherit;font-size:1rem;outline:none;transition:border-color .2s}.field input:focus,.field select:focus{border-color:var(--primary)}.btn{padding:10px 20px;border:none;border-radius:10px;font-family:inherit;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px)}.btn--secondary{background:var(--secondary);color:var(--text)}.btn--secondary:hover:not(:disabled){background:#475569}.btn--danger{background:var(--danger);color:#fff}.btn--ghost{background:transparent;color:var(--text-muted);border:1px solid var(--border)}.btn--ghost:hover:not(:disabled){background:var(--bg-elevated);color:var(--text)}.btn--sm{padding:6px 14px;font-size:.85rem}.btn--lg{padding:14px 28px;font-size:1.05rem}.btn--full{width:100%}.status{margin-top:12px;font-size:.9rem}.status--ok{color:var(--success)}.status--err{color:var(--danger)}.room-list{list-style:none;display:flex;flex-direction:column;gap:10px}.room-item{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--bg-elevated);border-radius:10px;gap:12px}.room-info strong{display:block}.room-meta{font-size:.85rem;color:var(--text-muted)}.room-join-inline{display:flex;gap:8px;align-items:center}.room-join-inline input{padding:6px 10px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);width:100px}.join-by-id{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}.join-by-id h3{font-size:1rem;margin-bottom:6px}.join-by-id-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.join-by-id-row input{flex:1;min-width:120px;padding:8px 12px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit}.empty{color:var(--text-muted);text-align:center;padding:20px}.rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.rules-grid strong{display:block;margin-bottom:4px;color:var(--primary-hover)}.rules-grid p{font-size:.9rem;color:var(--text-muted)}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.game-header h1{font-size:1.6rem;font-weight:700}.room-id{font-size:.85rem;color:var(--text-muted)}.game-layout{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start}@media(max-width:800px){.game-layout{grid-template-columns:1fr}}.player-list{list-style:none;display:flex;flex-direction:column;gap:8px}.player-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--bg-elevated);transition:all .2s}.player-item--active{background:#6366f126;border:1px solid rgba(99,102,241,.4)}.player-item--offline{opacity:.5}.player-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0}.player-details strong{display:block;font-size:.95rem}.player-details span{font-size:.8rem;color:var(--text-muted)}.sidebar{display:flex;flex-direction:column;gap:16px}.turn-panel .timer{font-size:1.4rem;font-weight:700;margin:8px 0}.timer--urgent{color:var(--danger);animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.6}}.extra-turn{color:#fbbf24;font-weight:600;margin:8px 0}.last-action{font-size:.85rem;color:var(--text-muted);margin-top:8px}.waiting-text,.hint{color:var(--text-muted);font-size:.9rem;margin-bottom:12px}.result-win{color:var(--success)}.result-draw{color:#fbbf24}.game-main{display:flex;flex-direction:column;align-items:center;gap:24px}.board-wrapper{display:grid;grid-template-columns:28px auto;grid-template-rows:auto auto;gap:4px}.board-axis--top{grid-column:2;display:grid;grid-template-columns:repeat(6,64px);text-align:center;font-size:.8rem;color:var(--text-muted);font-weight:600}.board-row-labels{grid-column:1;grid-row:2;display:grid;grid-template-rows:repeat(6,64px);align-items:center;text-align:center;font-size:.8rem;color:var(--text-muted);font-weight:600}.board{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(6,64px);grid-template-rows:repeat(6,64px);gap:4px;padding:8px;background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.cell--preview-opponent{border-color:#fbbf248c;background:#fbbf241f;animation:cellPulseOpponent 1.4s ease infinite}@keyframes cellPulseOpponent{50%{box-shadow:0 0 0 3px #fbbf244d}}.opponent-panel{border-color:#fbbf2459}.opponent-roll-hint{color:#fbbf24;font-weight:500}.cell{background:var(--bg-elevated);border-radius:10px;display:flex;align-items:center;justify-content:center;position:relative;border:2px solid transparent;transition:all .2s;padding:0;cursor:default;font:inherit;color:inherit}.cell--selectable{cursor:pointer;border-color:#6366f180;animation:cellPulse 1.2s ease infinite}.cell--option{background:#6366f11a}.cell--selected{border-color:var(--primary);background:#6366f133;box-shadow:0 0 16px #6366f159}.cell--selectable:hover:not(:disabled){transform:scale(1.04)}@keyframes cellPulse{50%{box-shadow:0 0 0 3px #6366f140}}.cell-option-label{position:absolute;bottom:4px;font-size:.65rem;font-weight:700;color:var(--primary-hover);pointer-events:none}.piece{width:70%;height:70%;border-radius:50%;border:3px solid var(--piece-border, #94a3b8);box-sizing:border-box;animation:placePiece .3s ease}@keyframes placePiece{0%{transform:scale(0)}to{transform:scale(1)}}.action-panel{width:100%;max-width:520px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}.dice-pair{display:flex;gap:24px;align-items:flex-start;justify-content:center;position:relative;padding:4px 0 8px}.die-scene{--die-size: 72px;--die-half: calc(var(--die-size) / 2);width:var(--die-size);height:calc(var(--die-size) + 14px);perspective:560px;perspective-origin:50% 42%;position:relative;flex-shrink:0;display:flex;justify-content:center;isolation:isolate}.die-shadow{position:absolute;left:50%;bottom:2px;width:58px;height:14px;transform:translate(-50%);background:radial-gradient(ellipse at center,rgba(0,0,0,.42) 0%,transparent 72%);filter:blur(2px);pointer-events:none;z-index:0}.die-cube{width:var(--die-size);height:var(--die-size);position:relative;z-index:1;transform-style:preserve-3d;will-change:transform;transform-origin:center center}.die-core{position:absolute;top:0;right:0;bottom:0;left:0;width:var(--die-size);height:var(--die-size);background:#e2e8f0;transform:translateZ(0)}.die-cube--spinning{animation:dieSpinWild .5s linear infinite}@keyframes dieSpinWild{0%{transform:rotateX(0) rotateY(0) rotate(0)}25%{transform:rotateX(180deg) rotateY(120deg) rotate(45deg)}50%{transform:rotateX(360deg) rotateY(300deg) rotate(90deg)}75%{transform:rotateX(540deg) rotateY(480deg) rotate(135deg)}to{transform:rotateX(720deg) rotateY(660deg) rotate(180deg)}}.die-face{position:absolute;top:0;right:0;bottom:0;left:0;width:var(--die-size);height:var(--die-size);border-radius:0;background:linear-gradient(155deg,#fff,#eef2f7 42%,#dde4ec);box-shadow:inset 0 1px #fffffff2,inset 0 -2px 4px #0f172a14;backface-visibility:hidden}.die-face--1{transform:rotateY(0) translateZ(var(--die-half))}.die-face--6{transform:rotateY(180deg) translateZ(var(--die-half))}.die-face--2{transform:rotateX(90deg) translateZ(var(--die-half))}.die-face--5{transform:rotateX(-90deg) translateZ(var(--die-half))}.die-face--3{transform:rotateY(90deg) translateZ(var(--die-half))}.die-face--4{transform:rotateY(-90deg) translateZ(var(--die-half))}.die-dot{position:absolute;width:13px;height:13px;background:radial-gradient(circle at 35% 35%,#334155,#0f172a);border-radius:50%;transform:translate(-50%,-50%);box-shadow:inset 0 -1px 2px #00000059}.double-badge{position:absolute;top:-12px;right:-20px;background:#fbbf24;color:#1e293b;padding:4px 10px;border-radius:999px;font-size:.75rem;font-weight:700;animation:bounce .5s ease}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.dice-assignment p{color:var(--text-muted);margin-bottom:10px}.assignment-options{display:flex;flex-direction:column;gap:8px}.cell-action p{margin-bottom:12px;color:var(--text-muted)}.opponent-actions{display:flex;flex-direction:column;gap:8px;align-items:center}.waiting-turn{opacity:.7}.pass-btn{margin-top:8px;font-weight:700;letter-spacing:.05em}.profile-row{display:flex;gap:14px;align-items:flex-start}.profile-avatar{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--border);flex-shrink:0}.profile-avatar--placeholder{display:flex;align-items:center;justify-content:center;background:var(--bg-elevated);color:var(--text-muted);font-size:1.4rem}.profile-fields{flex:1;display:flex;flex-direction:column;gap:10px}.player-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.checkbox-field{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text-muted)}.range-row{display:flex;align-items:center;gap:8px}.range-row input{width:64px;padding:6px 8px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000a6;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px}.modal{max-width:640px;width:100%;max-height:90vh;overflow-y:auto}.skin-shop-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.skin-grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:16px}.skin-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}.skin-card--active{border-color:var(--primary)}.skin-preview{width:100%;aspect-ratio:1;border-radius:50%;max-width:80px;margin:0 auto}.skin-info{display:flex;flex-direction:column;gap:4px;font-size:.85rem}.skin-info span{color:var(--text-muted)}.skin-price{color:var(--primary-hover)!important;font-weight:600}.app--loading{display:flex;align-items:center;justify-content:center;min-height:50vh;color:var(--text-muted)}@media(max-width:500px){.board{grid-template-columns:repeat(6,48px);grid-template-rows:repeat(6,48px)}.board-axis--top{grid-template-columns:repeat(6,48px)}.board-row-labels{grid-template-rows:repeat(6,48px)}.hero h1{font-size:2.2rem}}