@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap";:root{--color-black: #000000;--color-red: #D12026;--color-green: #007C3F;--color-blue: #0046AD;--tile-ivory: #F7F3E3;--board-slate: #505A5B;--board-grid: #6a7374;--font-math: "Stix Two Math", serif}body{font-family:sans-serif;background-color:#333;color:#fff;display:flex;justify-content:center;align-items:flex-start;min-height:100vh;margin:0;padding:0}.body-container{display:flex;flex-direction:row;align-items:flex-start;gap:20px}#chat-container{width:250px;height:720px;display:flex;flex-direction:column;background:#444444b3;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 32px #0000004d;padding:15px;box-sizing:border-box;margin-top:2.5rem}.game-container{display:flex;flex-direction:column}header{width:100%;max-width:600px}header h1{text-align:left;font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.logo-red{color:var(--color-red)}.game-area{display:flex;gap:5px}.board-and-info-container{display:contents}#game-board{width:600px;height:600px;background-color:var(--board-slate);display:grid;grid-template-columns:repeat(var(--grid-size),1fr);grid-template-rows:repeat(var(--grid-size),1fr);border:2px solid #222;box-shadow:inset 0 0 10px #00000080}.info-panel{width:200px;padding:5px;background:#444444b3;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 32px #0000004d;box-sizing:border-box;display:flex;flex-direction:column}footer{margin-top:20px}#player-rack{display:flex;justify-content:center;background-color:#5a3a22;padding:10px;border-radius:8px;box-shadow:0 4px 8px #0000004d}#game-board,#player-rack,.tile{-webkit-user-select:none;user-select:none}.rack-slot{width:50px;height:50px;margin:0 4px;background-color:#4a2a12;border-radius:4px;display:flex;justify-content:center;align-items:center}.tile{width:45px;height:45px;background-color:var(--tile-ivory);color:var(--color-black);font-family:var(--font-math);font-size:24px;font-weight:700;display:flex;justify-content:center;align-items:center;border-radius:4px;box-shadow:2px 2px 4px #00000080;-webkit-user-select:none;user-select:none;cursor:grab;transition:transform .1s ease-in-out,outline .1s ease-in-out}.board-cell{border:1px solid var(--board-grid);box-sizing:border-box;position:relative;transform-style:preserve-3d}#center-equals{background-color:var(--tile-ivory);box-shadow:inset 2px 2px 5px #0006;display:flex;justify-content:center;align-items:center;font-family:var(--font-math);font-size:32px;font-weight:700;color:var(--board-slate);text-shadow:1px 1px 1px rgba(255,255,255,.2);pointer-events:none}#center-equals:before{content:"="}.info-panel h2{margin-top:0;margin-bottom:15px;text-align:center}.active-player{font-weight:400;color:#fff;text-shadow:0 0 4px rgba(209,32,38,.6),0 0 8px rgba(209,32,38,.4),0 0 12px rgba(209,32,38,.2)}#game-id-container{font-size:.9rem;color:#ccc;text-align:center;padding-top:10px;margin-top:auto}.action-buttons{display:flex;flex-direction:column;flex-grow:1}.info-panel button{width:100%;padding:6px 10px;margin-top:8px;font-size:14px;font-weight:600;color:#fff;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;cursor:pointer;transition:all .3s ease}.info-panel button:hover:not(:disabled){background:#fff3}.info-panel button:disabled{opacity:.5;cursor:not-allowed}#btn-play{background:#007c3fb3;border-color:#007c3fcc}#btn-play:hover:not(:disabled){background:#007c3fe6}#btn-end{background:#d12026b3;border-color:#d12026cc}#btn-end:hover:not(:disabled){background:#d12026e6}.join-section{border-top:1px solid rgba(255,255,255,.1);padding-top:10px}input[type=text]{width:100%;padding:8px 12px;margin-bottom:10px;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#ffffff1a;color:#fff;font-size:12px;box-sizing:border-box}.tile.selected{outline:3px solid var(--color-blue);box-shadow:0 0 12px 2px #0046ad99;transform:scale(1.05)}.tile.operator,.tile.op-basic,.tile.op-advanced{color:var(--color-red)}.tile.equals{color:var(--color-green)}.tile.wildcard,.tile.paren{color:var(--color-blue);font-style:italic}.board-cell.drag-over{background-color:#7a8485;border:1px dashed var(--tile-ivory)}.tile.dragging{opacity:.5;cursor:grabbing}.board-cell .tile{width:100%;height:100%;cursor:default;position:absolute}.tile.staged{cursor:grab;border:1px solid var(--color-blue)}.board-cell .tile.stacked{z-index:var(--stack-level);transform:translate(calc((var(--stack-level) - 1) * -3px),calc((var(--stack-level) - 1) * -3px));box-shadow:calc((var(--stack-level) * 2 - 1) * 1px) calc((var(--stack-level) * 2 - 1) * 1px) calc(var(--stack-level) * 3px) rgba(0,0,0,calc(.35 + var(--stack-level) * .05))}.tile.wildcard-played{color:var(--color-blue);font-style:italic}#notification-container{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:1000;display:flex;flex-direction:column;align-items:center;gap:10px}.notification{padding:12px 20px;background:#282828d9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--tile-ivory);font-size:1em;border-radius:8px;border:1px solid rgba(255,255,255,.15);box-shadow:0 4px 12px #0006;opacity:0;transform:translateY(-20px);transition:transform .4s ease,opacity .4s ease}.notification.show{opacity:1;transform:translateY(0)}#chat-messages{flex-grow:1;overflow-y:auto;border:1px solid rgba(255,255,255,.1);border-radius:4px;padding:10px;background:#0003;margin-bottom:10px}.chat-message{margin-bottom:8px;line-height:1.4}.chat-message .player-name{font-weight:700}#chat-input-area{display:flex;gap:10px}#chat-input{flex-grow:1;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#ffffff1a;color:#fff;padding:8px}#btn-send-chat{padding:8px 12px;font-weight:600;color:#fff;background:var(--color-blue);border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer;transition:background-color .2s}#btn-send-chat:hover{background:#0056b3}.chat-message.chat-system{color:var(--tile-ivory);font-style:italic}.chat-message.chat-player-1 .player-name{color:var(--color-blue)}.chat-message.chat-player-2 .player-name{color:var(--board-slate)}.player-score{font-family:JetBrains Mono,monospace;font-size:1rem;line-height:1.4;letter-spacing:.5px;color:#fff;font-weight:400;text-align:left;padding-left:10px}@media (max-width: 1099px){body{padding:0}.body-container,.game-container,.game-area{flex-direction:column;align-items:center;width:100%;gap:5px}.board-and-info-container{display:grid;grid-template-columns:1fr 140px;width:100%;gap:10px;align-items:stretch}#game-board{width:100%;height:auto;aspect-ratio:1 / 1}.info-panel{width:100%;height:100%;padding:10px}.info-panel h2{font-size:4vw;margin-bottom:2px;margin-top:0}.info-panel .scoreboard{font-size:3.5vw}.info-panel .game-stats p{font-size:3vw;margin:5px 0;text-align:center}.scoreboard{font-family:JetBrains Mono,monospace}.info-panel .action-buttons{flex-grow:0}.player-score{font-size:.75rem}.join-section{border-top:1px solid rgba(255,255,255,.1);padding-top:10px;margin-top:10px}.info-panel button{padding:5px;font-size:3.2vw;margin-top:4px}.info-panel input[type=text]{font-size:3vw;padding:5px}#game-id-container{font-size:clamp(.6rem,1.6vw,.9rem)}#chat-container{order:2;width:100%;max-width:600px;height:150px;margin-top:0}footer{order:3;width:100%;max-width:600px;margin-top:15px}#player-rack{display:grid;grid-template-columns:repeat(14,1fr);gap:3px;padding:5px;box-sizing:border-box}.rack-slot{width:100%;aspect-ratio:1 / 1;margin:0}.tile{width:90%;height:90%;font-size:clamp(16px,4vw,20px)}}@media (max-width: 1099px) and (max-height: 550px) and (orientation: landscape){.info-panel h2{font-size:.9rem;margin-bottom:4px}.info-panel .scoreboard,.info-panel .game-stats p{font-size:.75rem;margin:2px 0}.info-panel button{padding:4px;font-size:.7rem;margin-top:4px}.info-panel input[type=text],#game-id-container,label[for=solo-mode-checkbox]{font-size:.9rem}#player-rack{gap:2px}.rack-slot{min-width:0}.rack-slot .tile{font-size:clamp(14px,3vw,16px)}}.info-header{display:flex;justify-content:center;align-items:center;position:relative;margin-bottom:15px}#btn-mute{position:absolute;left:0;top:50%;transform:translateY(-50%);width:28px;height:28px;font-size:16px;font-weight:700;border-radius:50%;padding:0;margin:0;line-height:1;cursor:pointer;background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}#btn-mute:hover{background:#ffffff4d}#btn-mute.muted{opacity:.5}#btn-help{position:absolute;right:0;top:50%;transform:translateY(-50%);width:28px;height:28px;font-size:16px;font-weight:700;border-radius:50%;padding:0;margin:0;line-height:1;cursor:pointer;background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}#btn-help:hover{background:#ffffff4d}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);z-index:2000;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.modal-overlay.show-modal{opacity:1;visibility:visible}.modal-content{background:#333;color:#fff;padding:20px 30px;border-radius:12px;border:1px solid rgba(255,255,255,.1);width:90%;max-width:800px;height:80vh;overflow-y:auto;position:relative;box-shadow:0 8px 32px #0000004d}.modal-close{position:sticky;top:10px;right:15px;background:none;border:none;color:#fff;font-size:2.5rem;line-height:1;cursor:pointer;z-index:10;float:right}#rules-content h1,#rules-content h3{color:var(--color-red)}#rules-content h1{margin-top:1.5em}#rules-content ul,#rules-content ol{line-height:1.6}.notification.interactive-share{padding:18px 22px;text-align:center;border:1px solid rgba(0,70,173,.4)}.notification.interactive-share h3{margin:0 0 8px;color:#fff;font-size:1.2em}.notification.interactive-share p{margin:0 0 12px;color:#ddd}.share-id-display{background:#0000004d;border-radius:4px;padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:1.1em;color:var(--tile-ivory);margin-bottom:16px;border:1px solid rgba(255,255,255,.1)}.share-actions{display:flex;gap:12px;justify-content:center}.share-actions button{font-family:sans-serif;font-weight:600;font-size:.9em;padding:8px 16px;border-radius:6px;border:1px solid rgba(255,255,255,.2);cursor:pointer;transition:all .2s ease}#share-copy-id{background:#ffffff26;color:#fff}#share-copy-id:hover{background:#ffffff40}#share-copy-link{background-color:var(--color-blue);color:#fff}#share-copy-link:hover{background-color:#0056b3}.notification-close{position:absolute;top:5px;right:10px;background:none;border:none;color:#aaa;font-size:1.8rem;line-height:1;cursor:pointer;transition:color .2s}.notification-close:hover{color:#fff}@media (max-width: 1099px){.action-buttons hr,.join-section hr{margin:0;padding:0}.action-buttons hr{display:none}.action-buttons{border-bottom:none}#game-id-container{margin:0;padding-top:5px;border:none}.action-buttons div{border:none}}