*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}.header h1{color:#667eea;font-size:32px}.user-info{display:flex;align-items:center;gap:15px}.user-info button{padding:8px 16px;background:#e74c3c;color:#fff;border:none;border-radius:5px;cursor:pointer}.lobby{display:grid;grid-template-columns:1fr 2fr;gap:20px}.lobby-section{background:#fff;padding:20px;border-radius:10px;box-shadow:0 2px 10px #0000001a}.lobby-section h2{color:#667eea;margin-bottom:20px}.create-room{display:flex;flex-direction:column;gap:10px}.create-room input,.create-room select{padding:10px;border:2px solid #e0e0e0;border-radius:5px}.create-room button{padding:12px;background:#667eea;color:#fff;border:none;border-radius:5px;cursor:pointer;font-weight:700}.rooms-list{display:flex;flex-direction:column;gap:10px}.room-item{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#f8f9fa;border-radius:5px;border-left:4px solid #667eea}.room-item button{padding:8px 16px;background:#667eea;color:#fff;border:none;border-radius:5px;cursor:pointer}.game-container{background:#fff;border-radius:16px;padding:18px;box-shadow:0 12px 32px #0000001f}.game-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;margin-bottom:12px;background:#fff;border:1px solid #dfe5f1;border-radius:16px;box-shadow:0 12px 28px #0f172a14;flex-wrap:nowrap}.game-toolbar::-webkit-scrollbar{display:none}.scoreboard{display:flex;align-items:center;gap:14px;flex:0 1 auto;min-width:0}.scoreboard__players{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;min-width:0}.scoreboard__player{display:flex;align-items:baseline;gap:6px;font-weight:600;color:#1b2747;white-space:nowrap}.scoreboard__name{font-size:13px;font-weight:600;color:#2a3f66}.scoreboard__score{font-size:18px;font-weight:700;color:#e54b4b}.scoreboard__divider{color:#b6bfd8;font-size:12px}.game-meta{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;flex:0 1 auto;min-width:0}.game-info{text-align:center;line-height:1.2;min-width:0}.game-info h2{color:#17213c;font-size:15px;font-weight:700;margin:0;white-space:nowrap}#game-status{color:#6c7896;font-weight:600;font-size:12px;margin:0;white-space:nowrap}.game-board-container{width:100%;padding:8px 12px;display:flex;justify-content:center;align-items:center;overflow:hidden;margin:0 auto;max-width:min(100%,1040px)}#board{border:3px solid #667eea;border-radius:10px;background:#8b4513;cursor:pointer;width:100%;height:auto;max-width:1000px;max-height:calc(100vh - 140px)}.dice-panel{display:flex;align-items:center;justify-content:center;padding:8px 14px;border-radius:12px;background:linear-gradient(120deg,#f8faffe6,#f2f7ffd9);border:1px solid #e1e8f5;flex:0 0 auto}.dice-container{display:flex;align-items:center;justify-content:center;gap:12px}.die{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);place-items:center;width:42px;height:42px;padding:6px;border-radius:12px;border:1px solid #d4d9e3;background:#fff;box-shadow:0 2px 8px #53638d2e;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.die.rolling{animation:die-wiggle .5s ease-in-out infinite}.die__text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#2c3e50;pointer-events:none}.die--multiplier .die__text{font-size:12px;letter-spacing:.08em}.die--text .pip,.die--empty .pip{opacity:0}.die--empty .die__text{color:#c9d3ec}.pip{width:7px;height:7px;border-radius:50%;background:#1b2747;opacity:0;justify-self:center;align-self:center}.pip--tl{grid-area:1 / 1}.pip--tm{grid-area:1 / 2}.pip--tr{grid-area:1 / 3}.pip--ml{grid-area:2 / 1}.pip--mc{grid-area:2 / 2}.pip--mr{grid-area:2 / 3}.pip--bl{grid-area:3 / 1}.pip--bm{grid-area:3 / 2}.pip--br{grid-area:3 / 3}.die[data-value="1"] .pip--mc,.die[data-value="2"] .pip--tl,.die[data-value="2"] .pip--br,.die[data-value="3"] .pip--tl,.die[data-value="3"] .pip--mc,.die[data-value="3"] .pip--br,.die[data-value="4"] .pip--tl,.die[data-value="4"] .pip--tr,.die[data-value="4"] .pip--bl,.die[data-value="4"] .pip--br,.die[data-value="5"] .pip--tl,.die[data-value="5"] .pip--tr,.die[data-value="5"] .pip--mc,.die[data-value="5"] .pip--bl,.die[data-value="5"] .pip--br,.die[data-value="6"] .pip--tl,.die[data-value="6"] .pip--tr,.die[data-value="6"] .pip--ml,.die[data-value="6"] .pip--mr,.die[data-value="6"] .pip--bl,.die[data-value="6"] .pip--br{opacity:1}.toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 0 auto}.icon-button{width:40px;height:40px;border-radius:12px;border:1px solid #d4d9e3;background:#fff;color:#2c3e50;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 10px #404e771f}.icon-button svg{width:20px;height:20px}.icon-button.icon-roll{background:#e8f7ed;color:#1e8449}.icon-button.icon-roll:disabled{background:#f2fcf6;color:#9fcfb3;border-color:#e1efe5}.icon-button.icon-done{background:#e7f1fb;color:#1b4f72}.icon-button.icon-done:disabled{background:#f1f6fd;color:#9fb8d4;border-color:#dbe6f5}.icon-button.icon-auto-roll{background:#f5f5f5;color:#7f8c8d;border-color:#d4d9e3;position:relative}.icon-button.icon-auto-roll.active{background:#e8f5fc;color:#2980b9;border-color:#2980b9;box-shadow:0 0 0 3px #2980b933}.icon-button.icon-auto-roll.active svg{animation:auto-roll-active 1.5s ease-in-out infinite}.icon-button.icon-auto-roll:not(.active):hover{background:#e8e8e8}.icon-button.icon-auto-roll.active:hover{background:#d4ecf8}@keyframes auto-roll-active{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.icon-button.icon-exit{background:#fdecea;color:#c0392b}.icon-button:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 6px 16px #404e772e}.icon-button:disabled{opacity:.7;cursor:not-allowed;box-shadow:none}.icon-button--attention{animation:roll-button-pulse 1.2s ease-in-out infinite;box-shadow:0 0 #1e844900}.loading{text-align:center;color:#999;padding:20px}@keyframes roll-button-pulse{0%{box-shadow:0 0 #1e844900;transform:translateY(0)}50%{box-shadow:0 0 0 6px #1e844933;transform:translateY(-1px)}to{box-shadow:0 0 #1e844900;transform:translateY(0)}}@keyframes die-wiggle{0%{transform:rotate(0) scale(1)}25%{transform:rotate(2deg) scale(1.03)}50%{transform:rotate(-2deg) scale(1.02)}75%{transform:rotate(1deg) scale(1.03)}to{transform:rotate(0) scale(1)}}@media(max-width:768px){body{overflow-x:hidden}.container{padding:10px}.lobby{grid-template-columns:1fr}.header{flex-direction:column;gap:10px;padding:15px}.header h1{font-size:24px}.game-container{padding:6px;margin:0;border-radius:6px;box-shadow:0 2px 8px #00000026}.game-toolbar{gap:10px;padding:8px 10px}.scoreboard{min-width:200px;gap:10px}.scoreboard__players{gap:8px}.scoreboard__name{font-size:12px}.scoreboard__score{font-size:16px}.game-info h2{font-size:13px;font-weight:600}.dice-container{gap:6px}.die{width:32px;height:32px;box-shadow:none}.toolbar-actions{gap:8px}.icon-button{width:32px;height:32px}#board{border-width:2px;max-height:78vh}.login-box{min-width:auto;width:90%;padding:30px 20px}.room-item{flex-direction:column;gap:10px;align-items:flex-start}.room-item button{width:100%}}@media(max-width:768px)and (orientation:portrait){.game-toolbar{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;gap:12px;padding:14px 16px}.scoreboard{padding:14px;background:#f8fafc;border-radius:12px;justify-content:center}.scoreboard__players{gap:16px}.scoreboard__player{gap:8px}.scoreboard__name{font-size:14px}.scoreboard__score{font-size:20px}.game-meta{padding:14px;background:#f8fafc;border-radius:12px}.game-info h2{font-size:16px}#game-status{font-size:13px}.dice-panel{padding:16px;background:#f8fafc;border:none}.dice-container{gap:16px}.die{width:52px;height:52px}.toolbar-actions{justify-content:center;gap:14px;padding:12px;background:#f8fafc;border-radius:12px}.icon-button{width:54px;height:54px}.icon-button svg{width:24px;height:24px}}@media(max-height:520px)and (orientation:landscape){.game-container{padding:8px;margin:0;border-radius:10px;box-shadow:0 4px 18px #00000026;display:flex;flex-direction:row;gap:12px;align-items:stretch;max-height:100vh}.game-toolbar{flex-direction:column;justify-content:space-between;width:220px;min-width:220px;max-width:220px;padding:24px 18px;gap:24px;border-radius:12px;box-shadow:0 4px 16px #0f172a1f;overflow-y:auto;overflow-x:hidden;min-height:calc(100vh - 16px);height:calc(100vh - 16px)}.scoreboard{flex-direction:column;align-items:stretch;gap:14px;flex:0 0 auto;min-width:0;max-width:100%;box-sizing:border-box}.scoreboard__players{flex-direction:row;gap:10px;align-items:stretch;min-width:0;max-width:100%}.scoreboard__player{flex:1;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:14px 8px;background:#f8fafc;border-radius:10px;min-width:0;max-width:50%;overflow:hidden;box-sizing:border-box}.scoreboard__name{font-size:13px;font-weight:600;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.scoreboard__score{font-size:24px;font-weight:700}.scoreboard__divider{display:none}.game-meta{flex:0 0 auto;padding:16px 12px;background:#f8fafc;border-radius:10px;min-width:0;max-width:100%;overflow:hidden;box-sizing:border-box}.game-info{min-width:0;max-width:100%;overflow:hidden;box-sizing:border-box}.game-info h2{font-size:15px;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}#game-status{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.dice-panel{padding:18px 14px;border-radius:12px;flex:0 0 auto;background:#f8fafc;min-width:0;max-width:100%;overflow:hidden;box-sizing:border-box;display:flex;flex-direction:row;justify-content:center;gap:12px}.dice-container{flex-direction:row;gap:12px;align-items:center;justify-content:center;min-width:0;max-width:100%}.die{width:50px;height:50px;min-width:50px;max-width:50px;flex-shrink:0;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.die:hover{transform:translateY(-2px);box-shadow:0 4px 12px #53638d40}.dice-panel--can-roll .die{animation:dice-pulse 1.5s ease-in-out infinite}@keyframes dice-pulse{0%,to{transform:scale(1);box-shadow:0 2px 8px #53638d2e}50%{transform:scale(1.08);box-shadow:0 4px 16px #1e844966,0 0 0 4px #1e844926}}.dice-panel--can-roll .die:hover{animation:none;transform:translateY(-2px)}.toolbar-actions{flex-direction:column;justify-content:flex-start;gap:10px;flex:0 0 auto;align-items:stretch;min-width:0;max-width:100%;box-sizing:border-box}.icon-button.icon-roll{display:none}.icon-button{width:100%;max-width:100%;height:52px;min-width:0;box-sizing:border-box;padding:0;border-width:1px}.icon-button svg{width:22px;height:22px}.game-board-container{flex:1;padding:0;display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}#board{width:100%;height:100%;max-width:100%;max-height:calc(100vh - 20px);object-fit:contain}}@media(max-width:480px){.container,.game-container{padding:4px}.game-toolbar{padding:6px;gap:6px}.game-info h2{font-size:12px}.scoreboard{min-width:180px;gap:8px}.scoreboard__players{gap:6px}.scoreboard__player{gap:4px}.scoreboard__name{font-size:11px}.scoreboard__score{font-size:14px}#board{border:1px solid #667eea}.die{width:28px;height:28px}.icon-button{width:30px;height:30px}.header h1{font-size:18px}}@media(hover:none)and (pointer:coarse){.icon-button{min-height:34px;min-width:34px;padding:0}.die{min-width:34px;min-height:34px}#board{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.icon-button:active{transform:scale(.95)}}