body.word-duel-active { background: #121213; color: #f8f8f8; overflow-x:hidden; }
body.word-duel-active .title-bar { background: #121213; border-bottom: 1px solid #3a3a3c; }
.word-duel-view [hidden] { display:none !important; }
.word-duel-view { --wd-green:#538d4e; --wd-yellow:#b59f3b; --wd-gray:#3a3a3c; --wd-line:#565758; max-width: 1180px; margin: 0 auto; color:#f8f8f8; font-family: Arial, Helvetica, sans-serif; }
.word-duel-lobby { max-width: 720px; margin: 3rem auto; text-align:center; }
.word-duel-hero h1 { margin:.8rem 0 .35rem; font-size:clamp(2rem,6vw,4.2rem); letter-spacing:-.05em; text-transform:uppercase; }
.word-duel-hero p { color:#aaa; }
.word-duel-hero { display:none; }
.word-duel-logo { display:flex; justify-content:center; gap:.35rem; }
.word-duel-logo span { width:48px; aspect-ratio:1; display:grid; place-items:center; background:var(--wd-green); color:white; font-size:1.8rem; font-weight:800; }
.word-duel-logo span:nth-child(2),.word-duel-logo span:nth-child(4){background:var(--wd-yellow)}
.word-duel-choice { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2rem; }
.word-duel-choice button { min-height:150px; display:grid; place-items:center; align-content:center; gap:.35rem; border:2px solid var(--wd-line); background:#1f1f20; color:white; border-radius:4px; }
.word-duel-choice button span { font-size:2.3rem; }.word-duel-choice button strong{font-size:1.1rem}
.word-duel-form,.word-duel-action-card { margin:2rem auto; padding:1.5rem; display:grid; gap:1rem; background:#1f1f20; border:1px solid var(--wd-line); text-align:left; max-width:480px; }
.word-duel-form label { display:grid; gap:.4rem; color:#ccc; font-weight:700; }
.word-duel-form input,.word-duel-form select,.word-duel-action-card input,.word-duel-guess-form input { background:#121213; border:2px solid var(--wd-line); color:white; padding:.85rem; border-radius:0; font-size:1rem; }
.word-duel-mode-selector{margin:0;padding:.8rem;border:1px solid var(--wd-line)}.word-duel-mode-selector legend{padding:0 .35rem;color:#ccc;font-weight:700}.word-duel-mode-selector>div{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.word-duel-mode-selector label{display:block;position:relative;cursor:pointer}.word-duel-mode-selector input{position:absolute;opacity:0;pointer-events:none}.word-duel-mode-selector span{display:grid;gap:.2rem;height:100%;padding:.75rem;border:2px solid var(--wd-line);background:#181819;box-sizing:border-box}.word-duel-mode-selector small{color:#999;font-weight:400}.word-duel-mode-selector input:checked+span{border-color:var(--wd-green);box-shadow:inset 4px 0 var(--wd-green);background:#202920}.word-duel-mode-selector input:focus-visible+span{outline:2px solid white;outline-offset:2px}.word-duel-custom-config{display:grid;gap:1rem}.word-duel-custom-config[hidden]{display:none!important}
.word-duel-round-config{margin:0;padding:.8rem;border:1px solid var(--wd-line);display:grid;gap:.65rem}.word-duel-round-config legend{padding:0 .35rem;color:#ccc;font-weight:700}.word-duel-round-config>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:.55rem}.word-duel-round-config label{font-size:.82rem}.word-duel-round-config input{width:100%;box-sizing:border-box}
.word-duel-identity { display:grid; grid-template-columns:75px 1fr; gap:.65rem; }
.word-duel-test-toggle{display:flex!important;grid-template-columns:none!important;align-items:center;gap:.65rem;padding:.8rem;border:1px solid var(--wd-line);background:#181819}.word-duel-test-toggle input{width:auto!important;margin:0}
.word-duel-room-directory{display:grid;gap:.65rem}.word-duel-room-directory>header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.word-duel-available-rooms{display:grid;gap:.45rem;max-height:230px;overflow:auto}.word-duel-room-card{display:grid!important;grid-template-columns:1fr auto;align-items:center;gap:.75rem;width:100%;padding:.7rem!important;text-align:left;background:#181819!important;border:1px solid var(--wd-line)!important}.word-duel-room-card>span{display:grid}.word-duel-room-card small{color:#72b76e}.word-duel-room-card.is-full small{color:#d8bd55}.word-duel-room-card.is-selected{border-color:#fff!important;box-shadow:inset 4px 0 var(--wd-green)}.word-duel-empty-rooms{margin:0;padding:.8rem;border:1px dashed var(--wd-line);color:#999;text-align:center}
.word-duel-form-actions,.word-duel-header-actions { display:flex; gap:.6rem; justify-content:flex-end; }
.word-duel-header-actions button{min-height:clamp(28px,4.8vh,38px);padding-inline:clamp(7px,1vw,12px);border-width:1px;color:#fff8e8;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 24px rgba(0,0,0,.24);font-size:clamp(.62rem,1.45vh,.84rem)}.word-duel-header-actions .button-icon{font-size:1.08em;line-height:1}#wordDuelShareButton:not([hidden]){border-color:rgba(63,211,224,.82);background:linear-gradient(180deg,rgba(36,151,169,.96),rgba(19,92,116,.98))}#wordDuelRestartButton:not([hidden]){color:#ecfff8;border-color:rgba(60,220,160,.82);background:linear-gradient(180deg,rgba(33,174,122,.98),rgba(21,105,82,.98))}#wordDuelLeaveButton{color:#fff1f3;border-color:rgba(255,97,120,.82);background:linear-gradient(180deg,rgba(174,60,84,.96),rgba(108,35,60,.98))}.word-duel-header-actions button:hover,.word-duel-header-actions button:focus-visible{filter:brightness(1.08);transform:translateY(-1px)}
.word-duel-view button:not(.secondary) { background:var(--wd-green); color:white; border:0; padding:.8rem 1.1rem; font-weight:800; cursor:pointer; }
.word-duel-game { padding:1rem 0 3rem; }.word-duel-game-header,.word-duel-round-strip{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--wd-line);padding:.8rem 0}.word-duel-game-header>div:first-child{display:grid}.word-duel-game-header span{font-size:.72rem;text-transform:uppercase;color:#999;letter-spacing:.12em}
.word-duel-round-strip { justify-content:center; flex-wrap:wrap; }.word-duel-round-strip span{padding:.3rem .65rem;background:#262627;border-radius:999px;color:#ccc}
.word-duel-layout { display:grid; grid-template-columns:280px minmax(0,1fr); gap:1.5rem; margin-top:1.5rem; }.word-duel-layout aside{border-right:1px solid var(--wd-line);padding-right:1rem}.word-duel-layout aside h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:#aaa}
.word-duel-players { display:grid; gap:.5rem; }.word-duel-player-card{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.6rem;text-align:left;background:#1d1d1e!important;border:1px solid var(--wd-line)!important;padding:.65rem!important;color:white}.word-duel-player-card.is-selected{border-color:white!important}.word-duel-player-card.is-ready{border-left:5px solid var(--wd-green)!important}.word-duel-player-card small{color:#aaa}.word-duel-player-card b{font-variant-numeric:tabular-nums}
.word-duel-stage { display:grid; justify-items:center; align-content:start; min-width:0; }.word-duel-stage>.message{min-height:1.5em;text-align:center}.word-duel-action-card{text-align:center;width:min(100%,480px)}
.word-duel-waiting-card{width:min(100%,480px);display:grid;justify-items:center;gap:.6rem;margin:2rem auto;padding:1.5rem;background:#1f1f20;border:1px solid var(--wd-line);text-align:center}.word-duel-waiting-card>span{color:#aaa;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem}.word-duel-waiting-card>strong{font-size:2rem;letter-spacing:.18em;color:var(--wd-green);text-transform:uppercase}.word-duel-waiting-card p{margin:0;color:#ddd}
.word-duel-action-card #wordDuelProposalHint.is-error{color:#ff6b6b;font-weight:800}
.word-duel-board-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem}.word-duel-board-head>div{display:grid}.word-duel-board-head span{color:#aaa;font-size:.8rem}.word-duel-board-head strong{color:var(--wd-yellow);letter-spacing:.15em;text-transform:uppercase}
#wordDuelBoardPanel{width:min(100%,620px)}.word-duel-grid{display:grid;gap:5px;justify-content:center}.word-duel-row{display:flex;gap:5px;justify-content:center}.word-duel-tile{width:clamp(38px,8vw,58px);aspect-ratio:1;display:grid;place-items:center;border:2px solid var(--wd-line);font-weight:800;font-size:clamp(1.2rem,4vw,2rem);text-transform:uppercase}.word-duel-tile.correct{background:var(--wd-green);border-color:var(--wd-green)}.word-duel-tile.present{background:var(--wd-yellow);border-color:var(--wd-yellow)}.word-duel-tile.absent{background:var(--wd-gray);border-color:var(--wd-gray)}
.word-duel-guess-form{display:grid;grid-template-columns:1fr auto;gap:.5rem;margin:1rem auto 0;max-width:440px}.word-duel-guess-form input{text-transform:uppercase;letter-spacing:.18em;text-align:center;font-weight:800}
.word-duel-guess-waiting{max-width:440px;margin:1rem auto 0;padding:.85rem;border:1px solid var(--wd-line);color:#ccc;text-align:center}.word-duel-guess-waiting p{margin:0}.word-duel-pending-players{display:grid;grid-template-columns:1fr;gap:.35rem;margin:.65rem auto 0;padding:0;list-style:none;width:min(100%,260px)}.word-duel-pending-players li{padding:.45rem .65rem;background:#181819;border-left:3px solid var(--wd-yellow);color:#fff;text-align:left}.word-duel-guess-waiting strong,.word-duel-guess-waiting span{display:block;margin-top:.5rem}.word-duel-guess-waiting strong{color:#8fca8b}.word-duel-guess-waiting span{color:#f0cb62;font-weight:800;letter-spacing:.08em}
.word-duel-primary{margin-top:1rem;min-width:220px}.word-duel-ranking{width:min(100%,650px);display:grid;gap:.5rem}.word-duel-ranking h2{text-align:center}.word-duel-rank{display:grid;grid-template-columns:42px 1fr auto;align-items:center;padding:.8rem;background:#1f1f20;border-left:4px solid var(--wd-gray)}.word-duel-rank:nth-of-type(1){border-color:#ffd700}.word-duel-rank:nth-of-type(2){border-color:#c0c0c0}.word-duel-rank:nth-of-type(3){border-color:#cd7f32}.word-duel-rank strong:last-child{font-size:1.15rem}
.word-duel-rank>span{display:grid}.word-duel-rank small{color:#8fca8b;font-size:.72rem;margin-top:.15rem}
.word-duel-notifications{position:fixed;top:calc(var(--title-bar-height,72px) + 10px);right:16px;z-index:30;display:grid;width:min(340px,calc(100vw - 24px));gap:8px;pointer-events:none}.word-duel-notification{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.7rem;background:#181819;border:2px solid var(--wd-line,#565758);border-left:6px solid var(--wd-yellow,#b59f3b);box-shadow:0 10px 30px #0008;animation:word-duel-toast 3.6s ease var(--notification-delay,0ms) both}.word-duel-notification.is-correct{border-left-color:var(--wd-green,#538d4e)}.word-duel-notification>span{display:grid;place-items:center;width:38px;height:38px;background:#2b2b2c;font-size:1.35rem}.word-duel-notification>div{display:grid;min-width:0}.word-duel-notification strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.word-duel-notification small{color:#bbb}.word-duel-notification b{color:var(--wd-yellow,#b59f3b)}.word-duel-notification.is-correct b{color:#79bd73}@keyframes word-duel-toast{0%{opacity:0;transform:translateX(30px)}8%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-10px)}}
.word-duel-home-card { background:linear-gradient(145deg,#121213,#2a2a2b)!important }.word-duel-home-card>span{background:#538d4e!important;color:white!important}
@media(max-width:520px){.word-duel-mode-selector>div{grid-template-columns:1fr}}
@media(max-width:760px){.word-duel-lobby{margin:1.2rem auto}.word-duel-choice{grid-template-columns:1fr}.word-duel-choice button{min-height:100px}.word-duel-layout{grid-template-columns:1fr}.word-duel-layout aside{border-right:0;border-bottom:1px solid var(--wd-line);padding:0 0 1rem}.word-duel-players{display:flex;overflow-x:auto}.word-duel-player-card{min-width:170px}.word-duel-game-header{align-items:flex-start}.word-duel-header-actions{flex-direction:column}.word-duel-board-head{align-items:flex-start}.word-duel-guess-form{grid-template-columns:1fr}.word-duel-logo span{width:38px;font-size:1.4rem}}
@media(max-width:760px){.word-duel-game{padding:.4rem 0 2rem;overflow-x:clip}body:has(#wordDuelGuessInput:focus) .word-duel-game{padding-bottom:50vh}.word-duel-game-header{display:grid;grid-template-columns:1fr;gap:.65rem}.word-duel-header-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}.word-duel-header-actions:has(#wordDuelRestartButton[hidden]){grid-template-columns:repeat(2,minmax(0,1fr))}.word-duel-header-actions button{width:100%;min-width:0;min-height:42px;padding:7px 6px;font-size:clamp(.66rem,2.8vw,.86rem);line-height:1.05;white-space:normal}.word-duel-layout{grid-template-columns:minmax(112px,32vw) minmax(0,1fr);gap:.6rem;margin-top:.75rem;align-items:start}.word-duel-layout aside{padding:0 .5rem 0 0;border-right:1px solid var(--wd-line);border-bottom:0;min-width:0}.word-duel-players{display:grid;overflow:visible;gap:.35rem}.word-duel-player-card{min-width:0;grid-template-columns:auto minmax(0,1fr);padding:.45rem!important;gap:.35rem}.word-duel-player-card>b{grid-column:2}.word-duel-player-card strong,.word-duel-player-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem}.word-duel-stage>.message{font-size:.78rem}.word-duel-tile{width:clamp(24px,7vw,40px);border-width:1px;font-size:clamp(.9rem,4vw,1.35rem)}.word-duel-row,.word-duel-grid{gap:3px}.word-duel-board-head{display:grid;font-size:.75rem}.word-duel-guess-form{grid-template-columns:1fr;gap:.35rem}.word-duel-guess-form input{width:100%;min-width:0;padding:.65rem;font-size:16px!important;box-sizing:border-box;scroll-margin-block:18vh 46vh;transform:translateZ(0)}.word-duel-action-card,.word-duel-waiting-card{margin:.6rem auto;padding:.8rem}.word-duel-ranking{gap:.35rem}.word-duel-rank{grid-template-columns:30px minmax(0,1fr) auto;padding:.55rem;font-size:.78rem}.word-duel-round-strip{padding:.55rem 0;font-size:.78rem}.word-duel-notifications{right:8px;width:calc(100vw - 16px)}}