:root{--sky: #7ec8ff;--sky2: #3aa7ff;--grass: #6fd36f;--sun: #ffd644;--coral: #ff7a59;--ink: #1f2a44;--paper: #ffffff;--paper2: #f2f6ff;--shadow: 0 10px 30px rgba(20, 40, 90, .25);--radius: 18px;--font: "Segoe UI", "Tahoma", "Noto Sans Arabic", system-ui, sans-serif;--panel-w: 420px}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:var(--font);color:var(--ink);background:linear-gradient(180deg,var(--sky) 0%,#dff4ff 60%,var(--grass) 100%);-webkit-user-select:none;user-select:none;touch-action:none}body.parent-body{overflow:auto;touch-action:auto;-webkit-user-select:text;user-select:text}#game{position:fixed;inset:0;width:100%;height:100%;display:block;outline:none}#ui{position:fixed;inset:0;pointer-events:none}#ui>*{pointer-events:auto}[dir=rtl]{direction:rtl}.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;overflow:auto}.screen.title-bg{background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.5) 0 60px,transparent 61px),radial-gradient(circle at 75% 30%,rgba(255,255,255,.45) 0 90px,transparent 91px),radial-gradient(circle at 60% 80%,rgba(255,255,255,.35) 0 50px,transparent 51px),linear-gradient(180deg,var(--sky) 0%,#dff4ff 60%,var(--grass) 100%)}.panel{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;width:min(var(--panel-w),100%);max-height:100%;overflow:auto}.panel.wide{--panel-w: 900px}h1.logo{margin:0 0 6px;font-size:56px;letter-spacing:2px;text-align:center;color:var(--sky2);text-shadow:3px 3px 0 #fff,6px 6px 0 rgba(31,42,68,.15)}h2{margin:0 0 14px;font-size:22px}p.muted{color:#5b6784;margin:4px 0 14px;font-size:14px}label{display:block;font-weight:600;margin:12px 0 4px;font-size:14px}input,select,textarea{width:100%;font:inherit;font-size:16px;padding:11px 12px;border:2px solid #cfd8ee;border-radius:12px;background:var(--paper2);color:var(--ink);outline:none}input:focus,select:focus{border-color:var(--sky2)}button,.btn{font:inherit;font-size:16px;font-weight:700;padding:11px 18px;border:0;border-radius:12px;background:var(--sky2);color:#fff;cursor:pointer;box-shadow:0 4px #1c7fd1;transition:transform .05s}button:active{transform:translateY(2px);box-shadow:0 2px #1c7fd1}button:disabled{opacity:.5;cursor:default}button.secondary{background:#e9eefb;color:var(--ink);box-shadow:0 4px #c5cfe8}button.danger{background:var(--coral);box-shadow:0 4px #cc5236}button.success{background:var(--grass);box-shadow:0 4px #43a343}button.link{background:none;box-shadow:none;color:var(--sky2);padding:6px 8px;text-decoration:underline}button.big{width:100%;font-size:20px;padding:14px;margin-top:18px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.spread{justify-content:space-between}.error{background:#ffe6e0;color:#a12c14;border-radius:10px;padding:10px 12px;margin-top:12px;font-size:14px}.notice{background:#e3f6e3;color:#1f6a1f;border-radius:10px;padding:10px 12px;margin-top:12px;font-size:14px}.lang-switch{position:absolute;top:12px;inset-inline-end:12px}.footer-note{text-align:center;font-size:12px;color:#5b6784;margin-top:16px}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:start;padding:8px 6px;border-bottom:1px solid #e3e8f5;vertical-align:middle}th{background:var(--paper2)}code.code{font-family:Consolas,monospace;font-size:18px;letter-spacing:2px;background:#fff6cc;border-radius:8px;padding:4px 8px}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700;background:#e9eefb}.badge.owner{background:var(--sun)}.badge.parent{background:#d9c9ff}.badge.online{background:#c8f5c8}.badge.off{background:#ffd9d0}.parent-body{background:#eef2fb}.parent-layout{max-width:1100px;margin:0 auto;padding:20px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.tabs button{background:#fff;color:var(--ink);box-shadow:0 3px #c5cfe8}.tabs button.active{background:var(--sky2);color:#fff;box-shadow:0 3px #1c7fd1}.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:16px}.card h3{margin:0 0 10px}.inline-form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.inline-form label{margin:0;flex:1 1 140px}.inline-form input,.inline-form select{margin-top:4px}.small{font-size:13px;padding:7px 12px;box-shadow:0 3px #00000026}.hud{position:absolute;inset:0;pointer-events:none}.hud>*{pointer-events:auto}.hud-top{position:absolute;top:10px;inset-inline-start:10px;inset-inline-end:10px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;pointer-events:none}.hud-top>*{pointer-events:auto}.pill{background:#ffffffeb;border-radius:999px;padding:8px 14px;font-weight:700;box-shadow:var(--shadow);display:inline-flex;align-items:center;gap:8px}.coin{display:inline-block;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff2a8,var(--sun) 60%,#d9a800);border:2px solid #c99a00}.hud-buttons{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.hud-buttons button{padding:8px 12px;font-size:14px}.toast{position:absolute;top:70px;left:50%;transform:translate(-50%);background:#1f2a44e6;color:#fff;padding:10px 16px;border-radius:12px;font-weight:600;animation:toast 3s forwards;max-width:90vw;text-align:center}@keyframes toast{0%{opacity:0;transform:translate(-50%,-10px)}10%,85%{opacity:1;transform:translate(-50%)}to{opacity:0}}.modal{position:absolute;inset:0;background:#141e3c73;display:flex;align-items:center;justify-content:center;padding:12px}@media (max-width: 600px){h1.logo{font-size:40px}.panel{padding:18px}}.hud-prompt{position:absolute;bottom:120px;left:50%;transform:translate(-50%);font-size:18px;background:#ffd644f2}.hud-status{position:absolute;top:60px;left:50%;transform:translate(-50%);background:var(--coral);color:#fff;padding:8px 14px;border-radius:12px;font-weight:700}.hud-hint{position:absolute;bottom:10px;left:50%;transform:translate(-50%);background:#1f2a448c;color:#fff;padding:6px 12px;border-radius:10px;font-size:13px;white-space:nowrap;max-width:95vw;overflow:hidden;text-overflow:ellipsis}.hud-bottom{position:absolute;bottom:40px;inset-inline-start:10px;display:flex;flex-direction:column;gap:8px;max-width:min(420px,90vw)}.hud-side{position:absolute;top:60px;inset-inline-end:10px;display:flex;flex-direction:column;gap:8px;max-width:min(320px,60vw)}@media (max-width: 700px){.hud-hint{display:none}}.side-panel{position:absolute;top:60px;bottom:10px;inset-inline-end:10px;width:min(520px,95vw);background:#fffffff5;border-radius:var(--radius);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}.side-panel .head{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid #e3e8f5}.side-panel .head h2{margin:0}.cat-tabs{display:flex;gap:6px;padding:8px 12px;overflow-x:auto;flex-wrap:nowrap;border-bottom:1px solid #e3e8f5}.cat-tabs button{white-space:nowrap;padding:6px 12px;font-size:13px;background:#e9eefb;color:var(--ink);box-shadow:0 3px #c5cfe8}.cat-tabs button.active{background:var(--sky2);color:#fff;box-shadow:0 3px #1c7fd1}.item-grid{flex:1;overflow-y:auto;padding:12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;align-content:start}.item-card{background:var(--paper2);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:6px;border:2px solid transparent}.item-card.equipped{border-color:var(--grass)}.item-card.owned{background:#eefbea}.item-card .swatch{height:54px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:22px;color:#ffffffe6;text-shadow:0 1px 2px rgba(0,0,0,.35)}.item-card .name{font-weight:700;font-size:14px;line-height:1.2}.item-card .price{font-size:13px;display:flex;align-items:center;gap:4px}.item-card button{padding:7px 10px;font-size:13px}.rarity{font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px;align-self:flex-start;background:#e9eefb}.rarity.rare{background:#cfe6ff}.rarity.epic{background:#e4d2ff}.rarity.legendary{background:#ffe3a3}.rarity.founder{background:linear-gradient(90deg,#ffd644,#ff3b6b);color:#fff}.emote-bar{display:flex;gap:6px;flex-wrap:wrap;background:#ffffffeb;border-radius:14px;padding:8px;box-shadow:var(--shadow)}.emote-bar button{padding:8px 12px;font-size:14px}.game-card{background:#fffffff0;border-radius:14px;padding:10px 12px;box-shadow:var(--shadow);min-width:220px;font-size:14px}.game-info{font-weight:700;margin-top:6px}.game-timer{font-size:20px;font-weight:800;color:var(--sky2)}.game-live,.board-block{margin-top:6px}.live-row{display:flex;justify-content:space-between;gap:10px;padding:2px 0;border-bottom:1px dashed #e3e8f5}.live-row.hl{color:#1c7fd1;font-weight:700}.game-board .muted{font-size:12px;margin:6px 0 2px;color:#5b6784}.palette{display:flex;gap:6px;flex-wrap:wrap;background:#fffffff0;border-radius:14px;padding:8px;box-shadow:var(--shadow);align-items:center}.palette .sw{width:34px;height:34px;border-radius:9px;border:3px solid transparent;cursor:pointer;box-shadow:inset 0 -3px #00000026;padding:0}.palette .sw.active{border-color:var(--ink);transform:scale(1.1)}.palette .key{position:relative;font-size:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);font-weight:800}.chat-box{background:#fffffff0;border-radius:14px;padding:8px 10px;box-shadow:var(--shadow);width:min(360px,90vw);font-size:14px}.chat-box .chat-lines{display:none;max-height:160px;overflow-y:auto;margin:6px 0}.chat-box.open .chat-lines{display:block}.chat-box.unread{box-shadow:0 0 0 3px var(--sun),var(--shadow)}.chat-line{padding:2px 0;word-break:break-word}.chat-line .who{font-weight:700;color:var(--sky2);margin-inline-end:6px}.chat-line.me .who{color:#2a8a2a}.chat-form{display:none;gap:6px;margin-top:4px}.chat-box.open .chat-form{display:flex}.chat-form input{padding:8px 10px;font-size:14px}.touch-layer{position:absolute;inset:0;pointer-events:none}.touch-stick{position:absolute;bottom:90px;inset-inline-start:30px;width:140px;height:140px;border-radius:50%;background:#ffffff4d;border:3px solid rgba(255,255,255,.7);pointer-events:auto;touch-action:none}.touch-stick .knob{position:absolute;left:40px;top:40px;width:60px;height:60px;border-radius:50%;background:#ffffffd9;box-shadow:var(--shadow)}.touch-buttons{position:absolute;bottom:90px;inset-inline-end:24px;display:grid;grid-template-columns:repeat(2,64px);gap:10px;pointer-events:auto}.touch-btn{width:64px;height:64px;border-radius:50%;font-size:22px;padding:0;background:#ffffffd9;color:var(--ink);box-shadow:0 4px #0003;touch-action:none}.touch-btn.big{width:84px;height:84px;grid-column:span 2;justify-self:center;background:var(--sun)}.touch-btn.active{background:var(--grass)}.emote-float{position:absolute;bottom:200px;left:50%;transform:translate(-50%);max-width:90vw}.hud.touch-on .hud-bottom{bottom:250px;max-width:min(360px,55vw)}.hud.touch-on .hud-hint{display:none}.hud.touch-on .hud-prompt{bottom:260px}.server-wrap{text-align:center;margin-top:4px}.server-toggle{font-size:11px;color:#9aa6c4;text-decoration:none}.server-box{text-align:start;margin-top:6px;background:var(--paper2);border-radius:12px;padding:10px}.server-box label{margin-top:0}@media (max-width: 520px){.hud-buttons button{padding:6px 8px;font-size:12px}.pill{padding:6px 10px;font-size:13px}}.touch-btn.talk{background:#ffd9d0}.touch-btn.talk.active{background:var(--coral);color:#fff}.players-list .item-card{gap:8px}.hud-card{position:absolute;top:10px;inset-inline-start:10px;display:flex;align-items:center;gap:10px;background:#ffffffeb;border-radius:16px;padding:8px 14px 8px 8px;box-shadow:var(--shadow);pointer-events:auto}.avatar-dot{width:40px;height:40px;border-radius:12px;background:var(--sky2);color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center}.hud-card-text{display:flex;flex-direction:column;line-height:1.2}.hud-name{font-weight:800;font-size:15px}.hud-coins{display:flex;align-items:center;gap:5px;font-weight:700;font-size:14px;color:#6b5200}.hud-coins .coin{width:14px;height:14px}.coins-symbol{font-size:11px;color:#8a7a4a}.mic-state{font-size:11px;color:#5b6784}.mic-state.live{color:#c92a2a;font-weight:700}.hud-bar{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;gap:10px;padding:8px;background:#ffffffdb;border-radius:22px;box-shadow:var(--shadow);pointer-events:auto}.bar-btn{width:64px;height:64px;border-radius:18px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:#fff;color:var(--ink);box-shadow:0 4px #cfd8ee;transition:transform .08s,box-shadow .08s,background .08s}.bar-btn:hover{transform:translateY(-3px);background:#eef4ff;box-shadow:0 7px #cfd8ee}.bar-btn:active{transform:translateY(2px) scale(.96);box-shadow:0 1px #cfd8ee}.bar-icon{font-size:26px;line-height:1}.bar-label{font-size:11px;font-weight:700}.hud-hint,.hud-bottom{bottom:96px}.touch-btn.big-talk{width:84px;height:84px;font-size:30px;grid-column:span 2;justify-self:center}.hud.touch-on .hud-bar{top:8px;bottom:auto;padding:4px;gap:4px;border-radius:16px}.hud.touch-on .bar-btn{width:48px;height:48px;border-radius:14px}.hud.touch-on .bar-icon{font-size:20px}.hud.touch-on .bar-label{display:none}.hud.touch-on .hud-bottom{bottom:300px}@media (max-width: 520px){.bar-btn{width:52px;height:52px}.bar-label{font-size:10px}}.fps-box{position:absolute;top:10px;left:50%;transform:translate(-50%);background:#0009;color:#9f9;font:12px Consolas,monospace;padding:4px 8px;border-radius:6px;pointer-events:none}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti i{position:absolute;top:-14px;width:10px;height:14px;border-radius:2px;animation:confetti-fall 2s ease-in forwards}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(105vh) rotate(720deg);opacity:.8}}