@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#070f1d;--panel:#101f33;--line:#2a455e;--cyan:#6ceadd;--coral:#ff819a;--gold:#f7d090;--muted:#829eb4}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:#eaf4fe;font-family:Vazirmatn,Tahoma,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}.hidden{display:none!important}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 22% 20%,#254b6d49,transparent 48%),radial-gradient(ellipse at 80% 80%,#593d7142,transparent 42%),#070f1d;z-index:-1}.game-top{height:64px;display:flex;align-items:center;gap:17px;justify-content:space-between;padding:9px clamp(15px,3vw,40px);border-bottom:1px solid #315570;background:linear-gradient(#12283b,#0b1a2e);direction:ltr}.brand{font:900 19px Arial,sans-serif;letter-spacing:1px;flex-shrink:0}.brand em{font-style:normal;color:var(--cyan)}.mode-tag{font:800 11px Arial,Vazirmatn,sans-serif;letter-spacing:1px;color:#c0daed}.pill{border:1px solid #337b7a;background:#123c4b;border-radius:40px;padding:5px 11px;font:800 10px Arial,sans-serif;color:#8af7e5}.danger{background:#5a2339;color:#ffdbe2;border:1px solid #d36d8c;padding:8px 15px;border-radius:9px;font-size:12px;font-weight:800}.danger:hover{background:#813047}.primary,.secondary{border-radius:11px;padding:11px 18px;font-weight:800;font-size:13px}.primary{background:linear-gradient(105deg,#48c8bb,#88eadf);color:#072431;border:1px solid #78f0e1;width:100%}.secondary{background:#19334a;color:#d3e7f3;border:1px solid #3c657e}.wide{width:100%;margin-top:10px}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#050d1ae9;backdrop-filter:blur(8px);padding:14px;overflow:auto}.menu-card{width:min(510px,100%);max-height:calc(100dvh - 28px);overflow:auto;padding:clamp(18px,3vw,32px);text-align:center;background:linear-gradient(160deg,#18324a,#0a1526);border:1px solid #3b6780;border-radius:22px;box-shadow:0 22px 95px #000a}.kicker{font:800 10px Arial,sans-serif;letter-spacing:2px;color:var(--cyan)}.menu-icon{font-size:58px;color:#96fff1;filter:drop-shadow(0 0 16px #3ce4d5);margin:4px 0}.menu-card h1{font:900 32px Arial,sans-serif;letter-spacing:2px;margin:3px 0}.menu-card h2{font-size:23px;margin:4px 0 7px}.menu-card p{line-height:2;font-size:12px;color:#aac0d0;margin:0 0 17px}.menu-card label{display:block;text-align:right;font-size:11px;color:#a0b8c9;margin:9px 0}.menu-card input:not([type=checkbox]),.menu-card select{width:100%;background:#08172a;color:#f1f8ff;padding:10px 12px;border-radius:9px;border:1px solid #41647c;outline:none;margin-top:5px}.menu-card select:focus,.menu-card input:focus{border-color:var(--cyan)}.form-split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-split>label{min-width:0}.toggle{display:flex!important;gap:9px;align-items:center;border:1px solid #31546b;padding:10px;border-radius:10px;background:#0c2334}.toggle input{accent-color:#65e5d2;width:18px;height:18px;flex-shrink:0}.mini-or{font-size:10px;color:#87a7bb;margin:12px 0 5px}.join-form{display:flex;gap:10px;direction:ltr}.join-form input{text-align:center;letter-spacing:3px;flex:1;min-width:0}.join-form button{margin-top:5px}.back{display:block;color:#9fdfe0;text-decoration:underline;font-size:12px;margin:16px auto 3px}.room-code{direction:ltr;font:900 35px Arial,sans-serif;letter-spacing:8px;border:1px dashed #548299;background:#0a2436;border-radius:10px;margin:13px 0 0;padding:12px}.copy{background:transparent;border:0;color:#8ef0df;padding:9px}.lobby-roster{display:grid;gap:8px;margin:13px 0 17px}.lobby-member{display:flex;justify-content:space-between;align-items:center;background:#0c263a;border:1px solid #34566d;border-radius:8px;padding:9px 11px;font-size:12px}.lobby-member b{font-size:11px;color:#a5e5ec}.lobby-member.red b{color:#ff9aab}.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.result-card .result-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:15px 0}.result-stats>div{border:1px solid #315770;border-radius:9px;background:#0c263b;padding:12px;display:flex;flex-direction:column;gap:3px}.result-stats span{color:#96b1c4;font-size:11px}.result-stats b{font-size:19px;color:#aaf9e5}.toast{position:fixed;z-index:60;bottom:28px;left:50%;transform:translateX(-50%);border:1px solid #66babe;background:#123449;color:#dcf9f9;box-shadow:0 18px 50px #000a;border-radius:10px;padding:10px 20px;font-size:12px;pointer-events:none;opacity:0;transition:opacity .2s}.toast.show{opacity:1}.tug-game{max-width:1500px;margin:auto;padding:16px 24px 28px;min-height:calc(100dvh - 64px);display:flex;flex-direction:column;gap:13px}.tug-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.side-score{border:1px solid #2f5970;background:linear-gradient(#102d44,#0a1c30);padding:10px 22px;border-radius:13px;display:flex;gap:15px;align-items:center}.side-score strong{font:900 28px Arial,sans-serif}.side-score span{color:#8599b0;font-size:10px}.side-score.cyan strong{color:var(--cyan)}.side-score.coral strong{color:var(--coral)}.clock-wrap{text-align:center}.clock-wrap>*{display:block}.clock-wrap small,.clock-wrap span{color:#8aa9c1;font-size:10px}.clock-wrap strong{font:900 31px Arial}.rope-arena{position:relative;flex:1;min-height:245px;max-height:510px;overflow:hidden;background:linear-gradient(#122a3d,#143b45 66%,#122e30 67%,#09202a);border:1px solid #3b6871;border-radius:24px;box-shadow:inset 0 0 90px #081727,0 24px 60px #0005}.arena-stars{position:absolute;inset:0;background-image:radial-gradient(#8deee640 1px,transparent 1px);background-size:51px 47px;opacity:.23}.rope-tag{position:absolute;top:23px;font:900 11px Arial,sans-serif;letter-spacing:2px}.left-tag{left:30px;color:#88edfb}.right-tag{right:30px;color:#ffafba}.rope-limit{position:absolute;top:11%;height:67%;width:2px;border-left:2px dashed #fff5}.rope-limit-a{left:21%}.rope-limit-b{right:21%}.rope-track{position:absolute;top:45%;left:8%;right:8%;height:70px;transform:translateY(-50%)}.rope-line{position:absolute;top:33px;left:0;right:0;height:12px;border-radius:20px;background:repeating-linear-gradient(35deg,#a87542 0 7px,#d8b77e 7px 14px);box-shadow:0 3px 12px #0009,inset 0 -2px #75502d}.rope-knot{position:absolute;left:50%;top:-2px;transform:translateX(-50%);width:38px;height:80px;background:linear-gradient(90deg,#ffde81,#ffac6d);border:3px solid #fbeab1;border-radius:8px;box-shadow:0 0 23px #ffd68b9a,0 8px 13px #0008;display:grid;place-items:center;color:#422e30;font-size:23px;transition:left .12s linear}.rope-people{position:absolute;bottom:25%;display:flex;gap:4px;color:#88edfb;text-shadow:0 0 20px #5daeea;font-size:clamp(48px,8vw,112px);line-height:1}.left-people{left:14%;transform:scaleX(-1)}.right-people{right:14%;color:#ffa6ad;text-shadow:0 0 20px #b95e8e}.person{filter:drop-shadow(0 12px 5px #0007)}.rope-caption{position:absolute;bottom:14px;left:25px;right:25px;display:flex;justify-content:space-between;gap:6px;align-items:center;font-size:11px;color:#a9c1c8}.rope-caption b{font-size:13px;color:#e7ede3}.tug-bottom{display:grid;grid-template-columns:minmax(155px,1fr) minmax(360px,2.7fr) minmax(155px,1fr);gap:13px;direction:ltr}.tug-team-list,.typing-panel{direction:rtl;background:#0e2134d9;border:1px solid #365c73;border-radius:15px;padding:15px}.tug-team-list h3{font-size:12px;margin:0 0 12px}.tug-team-list h3 span{font:700 9px Arial;color:#89b9c8;margin-right:7px}.player-line{padding:8px 3px;border-bottom:1px solid #ffffff12;display:flex;justify-content:space-between;gap:6px;font-size:11px}.player-line b{font:800 12px Arial;color:var(--cyan)}.typing-panel-top{display:flex;align-items:center;justify-content:space-between;gap:14px;font-weight:800;font-size:12px}.combo{display:flex;align-items:center;gap:8px;color:var(--gold)}.combo small{font:800 10px Arial}.combo b{font:900 21px Arial}.word-cloud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}.word-chip{text-align:center;background:#152d43;border:1px solid #41647a;border-radius:9px;padding:9px 4px;font-weight:800;font-size:clamp(12px,1.2vw,16px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.word-chip small{display:block;font:700 10px Arial;color:#75d4d1;padding-top:3px}.word-chip.valid{border-color:#59d8c6;background:#19514b}.typing-panel input,.writer-compose input{width:100%;border:1px solid #5c8d9b;background:#071829;border-radius:9px;color:#f5fbff;padding:13px 15px;font-size:16px;outline:none;caret-color:#9ffae2}.typing-panel input:focus,.writer-compose input:focus{box-shadow:0 0 0 3px #34cbb124}.typing-panel input.invalid,.writer-compose input.invalid{border-color:#f0758c}.typing-help{color:#7194ad;margin:8px 0 0;font-size:10px}.duo-game{height:calc(100dvh - 64px);min-height:560px}.writer-view{width:min(600px,100%);margin:0 auto;height:100%;padding:20px 22px 18px;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:13px;background:linear-gradient(#122d43b9,#07152787);border-left:1px solid #244e68;border-right:1px solid #244e68}.writer-top{text-align:center}.role-badge{color:var(--cyan);font:800 11px Arial,sans-serif;letter-spacing:2px}.writer-top h1{font-size:26px;margin:8px 0 3px}.writer-top p{font-size:11px;color:#94b5c9;margin:0}.resource-orb{margin:0 auto;text-align:center;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,#225869,#14374c 65%,#0a1e37 66%);border:2px solid #5294a1;box-shadow:0 0 52px #17c4c833,inset 0 0 60px #0ab2b722;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px}.orb-icon{font-size:50px;color:#c5fff4;text-shadow:0 0 30px #54f7e6}.resource-orb small{font:800 11px Arial;letter-spacing:1px;color:#9adad8}.resource-orb strong{font:900 31px Arial}.orb-meter{height:6px;background:#133247;border-radius:20px;width:75%;overflow:hidden;margin-top:10px}.orb-meter i{display:block;height:100%;background:linear-gradient(90deg,#6ce1ff,#66f6bc);width:18%;transition:width .2s}.writer-words{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-height:36vh;overflow:auto}.writer-words .word-chip{padding:13px 4px}.writer-compose{background:#112a3c;border:1px solid #315c72;padding:13px;border-radius:15px}.writer-compose span{display:block;font-size:11px;color:#85a9bd;margin-bottom:7px}.writer-feedback{display:flex;justify-content:space-around;gap:10px;color:#96afc6;font-size:11px}.writer-feedback span{display:flex;flex-direction:column;align-items:center;gap:4px}.writer-feedback strong{font:900 18px Arial;color:#9ff3e5}.commander-view{display:flex;flex-direction:column;height:100%;min-height:0;padding:9px 15px;gap:10px}.command-info{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#0d2538;border:1px solid #31586e;border-radius:12px;padding:8px 18px;direction:ltr}.command-info>div{display:flex;flex-direction:column;gap:2px;text-align:center}.command-info small{color:#8dadc2;font-size:10px}.command-info b{font:900 18px Arial,sans-serif}.command-info>div:first-child b{color:var(--coral)}.command-info>div:last-child b{color:var(--cyan)}.commander-arena{position:relative;min-height:0;flex:1;border:1px solid #3b6275;border-radius:18px;overflow:hidden;background:#143147}.commander-arena canvas{width:100%;height:100%;display:block}.selection-message{position:absolute;top:9px;left:50%;transform:translateX(-50%);background:#071a2ec9;border:1px solid #5f9da7;border-radius:20px;padding:5px 18px;font-size:11px;white-space:nowrap;pointer-events:none}.command-toolbar{display:flex;gap:12px;align-items:stretch;position:relative;min-height:116px;padding-bottom:15px;direction:ltr}.command-towers{display:flex;gap:6px;align-items:stretch;flex-shrink:0}.command-towers button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:105px;background:#18324a;color:#d5f4ef;border:1px solid #3d687b;border-radius:12px}.command-towers button.active,.hero-hand .card.active{border-color:#8effe0;background:#1a5451;box-shadow:0 0 15px #35e6bf33}.command-towers kbd{font:800 10px Arial;color:#a5c3d0}.command-towers b{color:var(--gold)}.tiny-title{display:none}.hero-hand{display:grid;grid-template-columns:repeat(5,minmax(65px,1fr));gap:7px;flex:1}.hero-hand .card{border:1px solid #395e73;background:linear-gradient(#1c3851,#0b2134);border-radius:11px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:7px;cursor:pointer;min-width:0}.hero-hand .card .icon{font-size:25px}.hero-hand .card small{font-size:10px;color:#c3e1e7}.hero-hand .card b{font:800 14px Arial;color:#89f1dc}.hero-hand .card i{font:800 10px Arial;color:#c2d4e3;font-style:normal}.command-hints{position:absolute;left:0;right:0;bottom:0;text-align:center;color:#6e97ab;font-size:9px;pointer-events:none}.confirm-card{max-width:410px}@media(max-width:1020px){.tug-bottom{grid-template-columns:1fr 2.6fr 1fr}.tug-team-list{padding:10px}.command-towers button{min-width:80px}.word-cloud{grid-template-columns:repeat(3,1fr)}.writer-words{grid-template-columns:repeat(3,1fr)}}@media(max-width:720px){.mode-tag{font-size:9px}.pill{display:none}.tug-game{padding:8px}.tug-bottom{grid-template-columns:1fr}.tug-team-list{display:none}.rope-arena{min-height:280px}.rope-people{font-size:46px}.side-score{padding:6px;gap:7px}.side-score b{font-size:11px}.side-score strong{font-size:20px}.side-score span{display:none}.clock-wrap strong{font-size:21px}.tug-head{gap:5px}.tug-bottom .typing-panel{padding:9px}.command-toolbar{flex-direction:column;min-height:210px}.command-towers{justify-content:center}.command-towers button{min-height:51px}.hero-hand{min-height:85px}.command-hints{display:none}.duo-game{min-height:620px}.writer-view{padding:13px}.resource-orb{width:170px;height:170px}.word-cloud{grid-template-columns:repeat(4,1fr)}}
/* Keep red/blue names aligned with their physical sides of the rope. */
.tug-head{direction:ltr}.side-score{direction:rtl}
#writer-elixir,#writer-castle,#writer-time,#commander-elixir,#own-base,#enemy-base,#commander-time{direction:ltr;unicode-bidi:isolate}

/* v1.1 — four clear seats for one shared Duo Command room code */
.duo-role-block{padding:13px;border:1px solid #395d75;border-radius:15px;background:#0a1d2d;margin:9px 0 15px}
.duo-role-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.duo-role-heading b{font-size:13px;color:#e2fafe}.duo-role-heading small{font-size:10px;color:#94adc2}
.duo-roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;direction:rtl}
.duo-slot{display:flex;flex-direction:column;gap:5px;text-align:right;padding:11px 12px;min-height:94px;border-radius:11px;border:1px solid #3a5c74;background:#152a3e;color:#e7f5ff;transition:.15s ease;cursor:pointer}
.duo-slot:hover:not(:disabled),.duo-slot:focus-visible:not(:disabled){border-color:#82dfd1;background:#1c3d4e;outline:2px solid #72eade44}
.duo-slot.picked{border-color:#5ae7c5;box-shadow:inset 0 0 0 1px #5ae7c54d,0 0 13px #33cba825;background:#1b3d47}
.duo-slot:disabled,.duo-slot.taken{opacity:.53;cursor:not-allowed;border-color:#7c465e;background:#311e31}
.duo-slot .slot-team{font-size:10px;color:#d6e2fb}.duo-slot b{font-size:13px}.duo-slot small{font-size:10px;color:#7be3c3}
.duo-slot.taken small{color:#f8a5ac}.duo-availability{min-height:29px;padding:9px 0 0;font-size:11px;color:#b8d9e2;line-height:1.9}
.duo-availability.warning{color:#ffb0b0}
@media(max-width:420px){.duo-role-block{padding:10px}.duo-slot{padding:9px 8px}.duo-role-heading small{font-size:9px}}

[hidden]{display:none!important;}
