*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--primary: #8B5CF6;--secondary: #EC4899;--darker: #0f172a;--dark: #1e293b;--success: #10b981;--warning: #f59e0b;--error: #ef4444}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,var(--darker) 0%,var(--dark) 100%);color:#fff;overflow-x:hidden;overscroll-behavior:none;-webkit-user-select:none;user-select:none;min-height:100vh}#app{min-height:100vh;position:relative}.btn{padding:12px 24px;border-radius:12px;font-weight:600;border:none;cursor:pointer;transition:all .2s;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;touch-action:manipulation}.btn:active{transform:scale(.95)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 20px #8b5cf666}.btn-primary:hover:not(:disabled){background:#7c3aed}.btn-secondary{background:var(--secondary);color:#fff;box-shadow:0 4px 20px #ec489966}.btn-secondary:hover:not(:disabled){background:#db2777}.btn-ghost{background:#ffffff1a;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-ghost:hover:not(:disabled){background:#ffffff26}.card{background:#1e293bcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.input{width:100%;padding:14px 18px;border-radius:12px;background:#1e293bcc;border:2px solid rgba(255,255,255,.1);color:#fff;font-size:16px;transition:all .2s}.input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #8b5cf633}.input::placeholder{color:#fff6}.badge{display:inline-block;padding:6px 12px;border-radius:8px;font-size:14px;font-weight:600}.badge-primary{background:#8b5cf633;color:var(--primary);border:1px solid var(--primary)}.badge-warning{background:#f59e0b33;color:var(--warning);border:1px solid var(--warning)}.badge-success{background:#10b98133;color:var(--success);border:1px solid var(--success)}.home-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}.home-title{font-size:3.5rem;margin-bottom:8px}.home-subtitle{font-size:2rem;font-weight:700;background:linear-gradient(to right,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:32px}.player-list{display:flex;flex-direction:column;gap:12px;width:100%;max-width:400px;margin:20px 0}.player-item{display:flex;align-items:center;justify-content:space-between;padding:16px;background:#1e293bcc;border-radius:12px;border:2px solid rgba(255,255,255,.1)}.player-item.active{border-color:var(--primary);box-shadow:0 0 20px #8b5cf64d}.game-container{position:relative;width:100%;height:100vh;overflow:hidden}.board-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:transform 1s cubic-bezier(.25,.46,.45,.94);cursor:grab;will-change:transform}.board-wrapper.dragging{cursor:grabbing;transition:none}.zoom-controls{position:fixed;top:20px;right:20px;z-index:500;display:flex;flex-direction:column;gap:8px}.zoom-btn{width:50px;height:50px;border-radius:50%;background:#1e293be6;border:2px solid rgba(255,255,255,.3);color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s}.zoom-btn:hover{background:#8b5cf6cc;border-color:#fff;transform:scale(1.1)}.zoom-btn:active{transform:scale(.95)}.game-board{position:relative;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(8,1fr);gap:1vmin;width:135vmin;height:120vmin;margin:auto;padding:2vmin}.field{position:relative;display:flex;align-items:center;justify-content:center;background:#1e293bf2;border:2px solid rgba(139,92,246,.2);border-radius:1vmin;font-size:1.65vmin;font-weight:700;text-align:center;cursor:pointer;transition:transform .2s ease-out,background .3s,border-color .3s,box-shadow .3s;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:1vmin;overflow:hidden;box-shadow:0 0 8px #8b5cf64d,0 2px 10px #00000080;line-height:1.2;min-height:0}.field:hover{background:#8b5cf64d;border-color:var(--primary);z-index:10}.field.active{background:var(--primary);border-color:#fff;box-shadow:0 0 30px #8b5cf6cc;z-index:20;animation:pulse 2s infinite}.field.special{background:linear-gradient(135deg,#8b5cf67d,#ec489982);border-color:#fff}.field.rule{background:#8b5cf64d;border-color:var(--primary);box-shadow:0 0 15px #8b5cf666}.field.move{background:#3282ac4d;border-color:var(--warning);box-shadow:0 0 15px #3282ac66}.field.end{background:linear-gradient(135deg,#10b981cc,#3b82f6cc);border-color:#fff;box-shadow:0 0 20px #10b98199,0 0 20px #3b82f699}.field-number{position:absolute;top:.5vmin;left:.5vmin;font-size:1.5vmin;opacity:.7;font-weight:600;background:#0006;padding:.3vmin .6vmin;border-radius:.4vmin}.field-name{font-size:1.65vmin;padding:2px}.player-token{position:absolute;width:5vmin;height:5vmin;border-radius:50%;border:.3vmin solid white;display:flex;align-items:center;justify-content:center;font-size:2.5vmin;font-weight:700;transition:all .3s cubic-bezier(.34,1.56,.64,1);z-index:1000;box-shadow:0 4px 15px #0009,0 0 0 .3vmin #fff6;pointer-events:none;animation:bounceIn .4s cubic-bezier(.68,-.55,.265,1.55)}@keyframes bounceIn{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}#dice-box{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000;pointer-events:none;display:none}#dice-box.active{display:block;pointer-events:auto}#dice-box canvas{width:100%;height:100%;background:transparent}.sidebar{position:fixed;top:0;left:-280px;width:280px;height:100vh;background:#0f172afa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:1000;transition:left .3s cubic-bezier(.4,0,.2,1);border-right:2px solid rgba(139,92,246,.3);display:flex;flex-direction:column;overflow:hidden}.sidebar.open{left:0}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid rgba(255,255,255,.1)}.sidebar-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:8px;border-radius:8px;transition:all .2s}.sidebar-close:hover{background:#ffffff1a}.sidebar-content{flex:1;overflow-y:auto;padding:20px}.sidebar-section{margin-bottom:24px}.sidebar-section h4{font-size:.9rem;font-weight:600;opacity:.7;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}.player-list-compact{display:flex;flex-direction:column;gap:8px}.player-item-compact{display:flex;align-items:center;gap:10px;padding:10px;background:#1e293b99;border-radius:8px;border:1px solid rgba(255,255,255,.05);transition:all .2s;font-size:.9rem}.player-item-compact.active{background:#8b5cf633;border-color:var(--primary)}.gear-btn{position:fixed;top:20px;left:20px;width:50px;height:50px;border-radius:50%;background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(139,92,246,.5);color:#fff;font-size:1.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:900;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #0006}.gear-btn:hover{background:#8b5cf6cc;transform:translate(0) rotate(90deg)}.gear-btn:active{transform:translate(0) scale(.95)}.active-effects-display{position:fixed;top:20px;right:20px;z-index:850;max-width:min(320px,calc(100vw - 100px));background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:2px solid #ec489982;overflow:hidden;box-shadow:0 4px 20px #00000080;animation:slideInRight .4s cubic-bezier(.34,1.56,.64,1)}.effects-header{background:#ec489982;padding:12px 16px;font-weight:700;font-size:.95rem;border-bottom:2px solid #ec489982;display:flex;align-items:center;gap:8px}.effect-item{padding:12px 16px;display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid rgba(255,255,255,.1);transition:background .2s}.effect-item:last-child{border-bottom:none}.effect-item:hover{background:#ffffff0d}.effect-item.positive{border-left:3px solid var(--success)}.effect-item.negative{border-left:3px solid var(--error)}.effect-item.neutral{border-left:3px solid var(--primary)}.effect-item.warning{border-left:3px solid var(--warning)}.effect-item-icon{font-size:24px;min-width:24px;text-align:center;line-height:1}.effect-item-content{flex:1;min-width:0}.effect-item-player{font-weight:700;font-size:.9rem;margin-bottom:4px}.effect-item-description{font-size:.8rem;opacity:.85;line-height:1.3}.rules-notifications{position:fixed;top:20px;right:20px;z-index:800;max-width:min(320px,calc(100vw - 100px));background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:2px solid rgba(139,92,246,.5);overflow:hidden;box-shadow:0 4px 20px #00000080;animation:slideInRight .4s cubic-bezier(.34,1.56,.64,1)}.rules-header{background:#8b5cf64d;padding:12px 16px;font-weight:700;font-size:.95rem;border-bottom:2px solid rgba(139,92,246,.5);color:#fff;display:flex;align-items:center;justify-content:center;gap:8px}.rule-notification{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:flex-start;gap:10px;color:#fff;transition:background .2s}.rule-notification:last-child{border-bottom:none}.rule-notification:hover{background:#1e293b8c}.compact-controls{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:800;display:flex;flex-direction:column;align-items:center;gap:10px;transition:opacity .3s ease}.current-player-compact{display:flex;align-items:center;gap:10px;padding:8px 16px;background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;border:2px solid var(--primary);box-shadow:0 4px 15px #8b5cf666}.dice-btn{padding:14px 32px;font-size:1.1rem;font-weight:700;box-shadow:0 6px 25px #8b5cf680;border:2px solid rgba(255,255,255,.3)}@media (max-width: 768px){.sidebar{width:260px;left:-260px}.gear-btn{width:44px;height:44px;font-size:1.3rem;top:16px;left:16px}.rules-notifications{top:16px;right:16px;max-width:calc(100vw - 80px)}.rule-notification{padding:8px 12px;font-size:.8rem}.compact-controls{bottom:16px}.current-player-compact{padding:6px 14px;font-size:.9rem}.dice-btn{padding:12px 28px;font-size:1rem}}.game-ui{display:none}.game-info{max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:12px}.current-player{text-align:center;padding:16px;background:#1e293be6;border-radius:12px;border:2px solid var(--primary)}.active-rules{max-height:100px;overflow-y:auto;padding:12px;background:#f59e0b1a;border:1px solid var(--warning);border-radius:8px}.rule-item{padding:8px;margin:4px 0;background:#0000004d;border-radius:6px;font-size:14px}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s}.modal-content{background:linear-gradient(135deg,var(--dark),var(--darker));border-radius:20px;padding:32px;max-width:500px;width:100%;border:2px solid rgba(255,255,255,.1);animation:slideUp .3s}.modal-title{font-size:2rem;margin-bottom:16px;text-align:center}.modal-description{font-size:1.1rem;line-height:1.6;margin-bottom:24px;text-align:center;color:#ffffffe6}.dice-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2000;perspective:1000px}.dice-container.hidden{display:none}.dice{width:100px;height:100px;position:relative;transform-style:preserve-3d;animation:roll 1s ease-out}.face{position:absolute;width:100px;height:100px;background:#fff;border:2px solid #333;border-radius:10px;display:flex;flex-wrap:wrap;justify-content:space-around;align-items:center;padding:15px;box-shadow:inset 0 5px 10px #0003}.dot{width:20px;height:20px;background:#333;border-radius:50%}.front{transform:rotateY(0) translateZ(50px)}.back{transform:rotateY(180deg) translateZ(50px)}.right{transform:rotateY(90deg) translateZ(50px)}.left{transform:rotateY(-90deg) translateZ(50px)}.top{transform:rotateX(90deg) translateZ(50px)}.bottom{transform:rotateX(-90deg) translateZ(50px)}.front .dot:nth-child(1){grid-column:2;grid-row:2}.back .dot:nth-child(1){align-self:flex-start;justify-self:flex-end}.back .dot:nth-child(2){align-self:flex-end;justify-self:flex-start}.right{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:10px}.right .dot:nth-child(1){grid-area:1 / 1}.right .dot:nth-child(2){grid-area:2 / 2}.right .dot:nth-child(3){grid-area:3 / 3}.left{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);padding:15px}.top{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);padding:10px}.top .dot:nth-child(1){grid-area:1 / 1}.top .dot:nth-child(2){grid-area:1 / 2}.top .dot:nth-child(3){grid-area:2 / 2}.top .dot:nth-child(4){grid-area:3 / 1}.top .dot:nth-child(5){grid-area:3 / 2}.bottom{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:10px}.bottom .dot:nth-child(1){grid-area:1 / 1}.bottom .dot:nth-child(2){grid-area:1 / 3}.bottom .dot:nth-child(3){grid-area:2 / 1}.bottom .dot:nth-child(4){grid-area:2 / 3}.bottom .dot:nth-child(5){grid-area:3 / 1}.bottom .dot:nth-child(6){grid-area:3 / 3}@keyframes rollDice{0%{transform:rotateX(0) rotateY(0) rotate(0) translateY(0);opacity:1}10%{transform:rotateX(180deg) rotateY(180deg) rotate(90deg) translateY(-30px)}20%{transform:rotateX(360deg) rotateY(360deg) rotate(180deg) translateY(0)}30%{transform:rotateX(540deg) rotateY(180deg) rotate(270deg) translateY(-20px)}40%{transform:rotateX(720deg) rotateY(540deg) rotate(360deg) translateY(0)}50%{transform:rotateX(900deg) rotateY(360deg) rotate(450deg) translateY(-15px)}60%{transform:rotateX(1080deg) rotateY(720deg) rotate(540deg) translateY(0)}70%{transform:rotateX(1260deg) rotateY(540deg) rotate(630deg) translateY(-10px)}80%{transform:rotateX(1440deg) rotateY(900deg) rotate(720deg) translateY(0)}90%{transform:rotateX(1620deg) rotateY(720deg) rotate(810deg) translateY(-5px)}to{transform:rotateX(1800deg) rotateY(1080deg) rotate(900deg) translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 30px #8b5cf6cc}50%{box-shadow:0 0 50px #8b5cf6}}.toast-container{position:fixed;top:20px;right:20px;z-index:3000;display:flex;flex-direction:column;gap:12px}.toast{padding:16px 24px;border-radius:12px;background:#1e293bf2;border:2px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInRight .3s;box-shadow:0 4px 20px #00000080}.toast.success{border-color:var(--success);background:#10b98133}.toast.error{border-color:var(--error);background:#ef444433}.toast.warning{border-color:var(--warning);background:#f59e0b33}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.effects-panel{position:fixed;bottom:20px;left:20px;max-width:350px;z-index:1500;display:flex;flex-direction:column;gap:8px;pointer-events:none}.effect-badge{background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid;border-radius:12px;padding:12px 16px;display:flex;align-items:center;gap:12px;animation:slideInLeft .3s;box-shadow:0 4px 20px #00000080;pointer-events:auto}.effect-badge.positive{border-color:var(--success);background:#10b98126}.effect-badge.negative{border-color:var(--error);background:#ef444426}.effect-badge.neutral{border-color:var(--primary);background:#8b5cf626}.effect-badge.warning{border-color:var(--warning);background:#f59e0b26}.effect-icon{font-size:24px;min-width:24px;text-align:center}.effect-content{flex:1}.effect-player{font-weight:700;font-size:.95rem;margin-bottom:2px}.effect-description{font-size:.85rem;opacity:.9;line-height:1.3}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.coinflip-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2500;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}.coinflip-container{background:#1e293bf2;border:2px solid rgba(139,92,246,.5);border-radius:20px;padding:40px;text-align:center;max-width:90%;width:400px;box-shadow:0 10px 50px #000000b3}.coin{width:150px;height:150px;margin:30px auto;background:linear-gradient(135deg,gold,#ffed4e,gold);border-radius:50%;border:5px solid #ffaa00;display:flex;align-items:center;justify-content:center;font-size:60px;box-shadow:0 10px 30px #ffd70066;animation:coinFlip 1s ease-in-out}@keyframes coinFlip{0%{transform:rotateY(0)}25%{transform:rotateY(180deg)}50%{transform:rotateY(360deg)}75%{transform:rotateY(540deg)}to{transform:rotateY(720deg)}}.prediction-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2500;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}.prediction-container{background:#1e293bf2;border:2px solid rgba(139,92,246,.5);border-radius:20px;padding:40px;text-align:center;max-width:90%;width:500px;box-shadow:0 10px 50px #000000b3}.prediction-title{font-size:1.8rem;margin-bottom:10px;background:linear-gradient(to right,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.prediction-subtitle{font-size:1rem;opacity:.7;margin-bottom:30px}.dice-selection{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:30px 0}.dice-option{background:#8b5cf633;border:3px solid rgba(139,92,246,.5);border-radius:16px;padding:25px;font-size:2rem;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;aspect-ratio:1}.dice-option:hover{background:#8b5cf666;border-color:var(--primary);transform:scale(1.05)}.dice-option:active{transform:scale(.95)}.dice-option.selected{background:var(--primary);border-color:#fff;box-shadow:0 0 30px #8b5cf6cc}.result-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2600;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}.result-container{background:#1e293bf2;border:2px solid rgba(139,92,246,.5);border-radius:20px;padding:40px;text-align:center;max-width:90%;width:500px;box-shadow:0 10px 50px #000000b3}.result-icon{font-size:80px;margin-bottom:20px}.result-title{font-size:1.8rem;margin-bottom:15px;font-weight:700}.result-description{font-size:1.1rem;opacity:.8;margin-bottom:30px;line-height:1.5}.result-players{background:#0000004d;border-radius:12px;padding:20px;margin:20px 0}.result-player-item{display:flex;align-items:center;justify-content:space-between;padding:12px;margin:8px 0;background:#ffffff0d;border-radius:8px}.result-player-name{display:flex;align-items:center;gap:10px;font-weight:600}.result-player-drinks{font-size:1.2rem;font-weight:700}@media (max-width: 768px){.home-title{font-size:2.5rem}.home-subtitle{font-size:1.5rem}.btn{padding:14px 20px;font-size:16px}.field{font-size:.6vmin}.game-ui{padding:12px}.active-effects-display{max-width:calc(100vw - 40px);font-size:.9rem}.effect-item-icon{font-size:20px}.rules-notifications{max-width:calc(100vw - 40px)}.modal-content{padding:24px}.modal-title{font-size:1.5rem}.modal-description{font-size:1rem}.player-token{width:4vmin;height:4vmin;font-size:1.8vmin;border-width:2px}}@media (max-width: 480px){.field{font-size:.5vmin}.player-token{width:4.5vmin;height:4.5vmin;font-size:2vmin;border-width:1.5px}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}::-webkit-scrollbar-thumb{background:#8b5cf680;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#8b5cf6b3}@media (max-width: 768px){html.mobile-camera-active,body.mobile-camera-active{overflow:hidden;position:fixed;width:100%;height:100%}#viewport{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden;background:linear-gradient(135deg,var(--darker) 0%,var(--dark) 100%);touch-action:none}#world{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform;transition:transform .2s ease-out}#world .game-board{position:relative;margin:0}#world .player-token{position:absolute;z-index:101;transition:left .3s ease-out,top .3s ease-out;width:15vmin!important;height:15vmin!important;font-size:6vmin!important;border-width:4px!important}.field-name{font-size:3.5vmin!important;padding:4px!important;line-height:1.2}.field-number{font-size:3vmin!important}.mobile-ui-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1000}.mobile-ui-overlay>*{pointer-events:auto}.mobile-ui-overlay .gear-btn{position:fixed;top:20px;left:20px;z-index:1001}.active-effects-display.mobile-fixed{position:fixed!important;right:20px;z-index:1000;transition:top .3s ease-out,bottom .3s ease-out}.active-effects-display.mobile-fixed.player-at-top{bottom:140px;top:auto;max-height:calc(100vh - 160px);overflow-y:auto;width:calc(100% - 40px);right:20px;left:20px;max-width:none}.active-effects-display.mobile-fixed.player-at-bottom{top:20px;bottom:auto;max-height:calc(100vh - 160px);overflow-y:auto;width:calc(100% - 40px);right:20px;left:20px;max-width:none}.rules-notifications.mobile-fixed{position:fixed!important;left:20px;z-index:1000;transition:top .3s ease-out,bottom .3s ease-out}.rules-notifications.mobile-fixed.player-at-top{bottom:140px;top:auto;max-height:calc(100vh - 160px);overflow-y:auto;width:calc(100% - 40px);right:20px;left:20px;max-width:none}.rules-notifications.mobile-fixed.player-at-bottom{top:80px;bottom:auto;max-height:calc(100vh - 160px);overflow-y:auto;width:calc(100% - 40px);right:20px;left:20px;max-width:none}.compact-controls.mobile-fixed{position:fixed!important;bottom:20px;left:50%;transform:translate(-50%);z-index:1000}.mobile-ui-overlay .sidebar{position:fixed;z-index:2000}#world.debug-bounds{border:2px dashed rgba(255,255,0,.5)}}@media (min-width: 769px){#viewport{position:relative;width:100%;min-height:100vh;overflow:visible}#world{position:relative;transform:none!important;transition:none}#player{display:none}}.mobile-controls{position:fixed;bottom:20px;right:20px;display:grid;grid-template-columns:repeat(3,60px);grid-template-rows:repeat(3,60px);gap:10px;z-index:1000}.control-btn{background:#8b5cf6cc;border:2px solid rgba(255,255,255,.3);border-radius:12px;color:#fff;font-size:24px;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d;transition:all .1s}.control-btn:active{background:#8b5cf6;transform:scale(.95)}.control-btn[data-direction=up]{grid-column:2;grid-row:1}.control-btn[data-direction=left]{grid-column:1;grid-row:2}.control-btn[data-direction=down]{grid-column:2;grid-row:3}.control-btn[data-direction=right]{grid-column:3;grid-row:2}@media (min-width: 769px){.mobile-controls{display:none}}.game-tiles{position:relative;width:100%;height:100%}.game-tile{transition:transform .2s,box-shadow .2s}.game-tile:active{transform:scale(.95);box-shadow:0 2px 8px #0006}