:root{--ink:#17212b;--muted:#64707c;--paper:#f6f3eb;--card:#fffdf8;--accent:#e36f45;--blue:#3d6f8e;--line:#d8d4ca;--tile:#f0d49b}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--paper);color:var(--ink)}.wrap{width:min(1180px,94vw);margin:auto}header{background:#18232d;color:white;border-bottom:4px solid var(--accent)}.nav{height:64px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:1.45rem;font-weight:850;letter-spacing:-.04em;color:white;text-decoration:none}.nav nav{display:flex;gap:18px}.nav nav a{color:#dfe8ee;text-decoration:none}main{padding:36px 0 60px}footer{padding:30px 0;color:var(--muted);font-size:.85rem}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;padding:30px 0 46px}.hero h1{font-size:clamp(2.4rem,6vw,5.4rem);line-height:.92;letter-spacing:-.06em;margin:.2em 0}.hero p{font-size:1.12rem;color:var(--muted);max-width:680px}.eyebrow{font-weight:800;font-size:.76rem;letter-spacing:.16em;color:var(--accent)}.button{display:inline-block;background:var(--accent);color:white;border:0;border-radius:8px;padding:11px 16px;font-weight:750;text-decoration:none;cursor:pointer;margin:5px 4px 5px 0}.button.ghost{background:#e8e3d8;color:var(--ink)}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 8px 25px #00000008;margin-bottom:18px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.mini-board{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;transform:rotate(2deg)}.mini-board span{aspect-ratio:1;background:#e7e0d3;border-radius:6px;display:grid;place-items:center;font-weight:850;font-size:clamp(.8rem,3vw,1.5rem)}.mini-board .bonus{background:#bcd5df}.rowlink,.statrow{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #ece7dc;text-decoration:none;color:inherit}.rowlink span,.statrow small{color:var(--muted)}.form label,.narrow label{display:grid;gap:6px;font-weight:700;margin-bottom:14px}input,select{width:100%;padding:10px;border:1px solid #c9c4ba;border-radius:8px;background:white;font:inherit}.checks{display:flex;gap:12px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:7px;background:#eee9df;padding:8px 10px;border-radius:8px}.checks input{width:auto}.playerline{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:8px;margin-bottom:8px}.hint{font-size:.85rem;color:var(--muted)}.flash{padding:12px 16px;border-radius:9px;margin-bottom:16px}.flash.ok{background:#dff2df}.flash.err{background:#f6dede}.gamehead{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:18px}.scores{display:flex;gap:8px;flex-wrap:wrap}.score{background:#e8e4db;padding:8px 11px;border-radius:8px;display:grid;min-width:100px}.score.active{outline:3px solid var(--accent)}.score small{font-size:.6rem;color:var(--muted)}.score strong{font-size:1.4rem}.gamegrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}.board{display:grid;grid-template-columns:repeat(var(--size),minmax(18px,1fr));gap:2px;width:min(78vh,100%);aspect-ratio:1}.sq{padding:0;border:1px solid #cec8ba;background:#e9e4d9;aspect-ratio:1;display:grid;place-items:center;overflow:hidden}.sq small{font-size:clamp(.3rem,.7vw,.55rem);color:#65717a}.sq.dl{background:#b9dce9}.sq.tl{background:#6fb0cf}.sq.dw,.sq.start{background:#efb8a5}.sq.tw{background:#e67963}.tile{width:88%;height:88%;display:grid;place-items:center;background:var(--tile);border:1px solid #c8a96e;border-radius:4px;font-weight:900;font-size:clamp(.55rem,1.5vw,1.1rem);box-shadow:0 2px 2px #0002}.tile.pending{outline:3px solid var(--accent)}.rack{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.racktile{background:var(--tile);border:1px solid #c8a96e;border-radius:6px;min-width:38px;height:44px;font-weight:900}.racktile.chosen{outline:3px solid var(--accent)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}.metric{background:#18232d;color:white;padding:16px;border-radius:11px}.metric span{display:block;color:#b9c7d0;font-size:.8rem;text-transform:uppercase}.metric strong{font-size:2rem}.narrow{max-width:500px;margin:auto}.pack{display:flex;justify-content:space-between;gap:20px;align-items:center}code{background:#eee8dd;padding:3px 6px;border-radius:5px}@media(max-width:800px){.hero,.grid2,.gamegrid{grid-template-columns:1fr}.mini-board{max-width:420px}.gamehead{display:block}.scores{margin-top:15px}.playerline{grid-template-columns:1fr 1fr}.metrics{grid-template-columns:1fr 1fr}.board{width:100%}} 

/* v0.2 lexical learning UI */
.wordlink{appearance:none;border:0;background:none;color:inherit;font:inherit;font-weight:700;padding:0;text-decoration:underline;text-decoration-style:dotted;cursor:pointer}
.definition-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;display:grid;place-items:center;padding:20px}
.definition-modal[hidden]{display:none}
.definition-card{position:relative;background:#fff;color:#17202a;width:min(560px,100%);max-height:75vh;overflow:auto;border-radius:18px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.3)}
.definition-card h2{margin-top:0}.definition-close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:30px;cursor:pointer}

/* v0.2.1 touch-first tile placement */
.racktile,.tile.pending{touch-action:none;user-select:none;-webkit-user-select:none}
.racktile{cursor:grab}.racktile:active,.tile.pending:active{cursor:grabbing}
.sq.has-pending{outline:2px solid rgba(227,111,69,.45);outline-offset:-2px}
.sq.drop-target{outline:4px solid var(--accent);outline-offset:-4px;transform:scale(.96)}
.drag-ghost{position:fixed;z-index:2000;width:44px;height:44px;pointer-events:none;opacity:.92;transform:rotate(2deg) scale(1.05);font-size:1.05rem}
body.is-dragging{cursor:grabbing}
body.is-dragging .sq:not(:has(.tile:not(.pending))){box-shadow:inset 0 0 0 1px rgba(61,111,142,.22)}
@media(max-width:800px){.racktile{min-width:42px;height:48px}.tile.pending{outline-width:2px}}


/* ===== WordWarren v0.3 gameplay ===== */
.flash-stack{
    position:fixed;
    z-index:5000;
    top:76px;
    right:max(16px,3vw);
    width:min(520px,92vw);
    pointer-events:none;
}
.flash-stack .flash{
    box-shadow:0 10px 30px rgba(0,0,0,.16);
    border:1px solid rgba(0,0,0,.08);
    animation:ww-toast-in .18s ease-out;
}
@keyframes ww-toast-in{from{transform:translateY(-8px);opacity:0}to{transform:none;opacity:1}}

.warren-board .sq{
    background:#e8e2d5;
    border-color:#c8bfad;
    border-radius:2px;
}
.warren-board .sq.l2{background:#b8cfb3}
.warren-board .sq.l3{background:#718f72;color:#fff}
.warren-board .sq.w2{background:#c9b6d8}
.warren-board .sq.w3{background:#75587e;color:#fff}
.warren-board .sq.start{background:#d8b45a;color:#2d2618}
.warren-board .sq.dl{background:#b8cfb3}
.warren-board .sq.tl{background:#718f72;color:#fff}
.warren-board .sq.dw{background:#c9b6d8}
.warren-board .sq.tw{background:#75587e;color:#fff}

.bonus-label{
    font-size:clamp(.38rem,.8vw,.62rem)!important;
    font-weight:850;
    letter-spacing:.04em;
    color:inherit!important;
}
.board-key{
    display:flex;
    gap:7px;
    align-items:center;
    flex-wrap:wrap;
    margin:10px 0 4px;
    color:var(--muted);
}
.board-key .key{
    display:inline-grid;
    place-items:center;
    width:28px;
    height:24px;
    border-radius:5px;
    font-size:.65rem;
    font-weight:900;
}
.board-key .l2{background:#b8cfb3}.board-key .l3{background:#718f72;color:white}
.board-key .w2{background:#c9b6d8}.board-key .w3{background:#75587e;color:white}

.tile,.racktile{
    position:relative;
    user-select:none;
    -webkit-user-select:none;
    touch-action:none;
}
.tile-letter{line-height:1}
.tile-points{
    position:absolute;
    right:4px;
    bottom:2px;
    font-size:.48em!important;
    font-weight:800;
    color:#5d4a28!important;
}
.racktile{
    display:grid;
    place-items:center;
    min-width:42px;
    height:48px;
    padding:0;
    font-size:1.04rem;
    cursor:grab;
}
.racktile:active{cursor:grabbing}
.racktile.display-only{display:grid;cursor:default}

.drag-ghost{
    position:fixed!important;
    z-index:10000!important;
    pointer-events:none!important;
    transform:translate(-50%,-50%) scale(1.12)!important;
    opacity:.96!important;
    box-shadow:0 12px 28px rgba(0,0,0,.32)!important;
    margin:0!important;
}
body.is-dragging{cursor:grabbing}
body.is-dragging *{cursor:grabbing!important}
.sq.drop-target{
    outline:4px solid #416b52!important;
    outline-offset:-4px;
    transform:scale(.97);
}
.sq.drop-invalid{
    outline:4px solid #a54848!important;
    outline-offset:-4px;
}

.watch-rack{
    position:sticky;
    bottom:12px;
    z-index:300;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    padding:12px 16px;
    margin:18px 0 0;
    background:rgba(255,253,248,.96);
    backdrop-filter:blur(8px);
}
.watch-rack .rack{margin:0}

.ai-thinking{display:flex;align-items:center;gap:9px;margin:14px 0}
.thinking-dot{
    width:10px;height:10px;border-radius:50%;background:var(--accent);
    animation:ww-pulse 1s infinite alternate;
}
@keyframes ww-pulse{from{opacity:.3;transform:scale(.8)}to{opacity:1;transform:scale(1.15)}}

.current-turn-card form{display:inline-block}
.primary-definition{font-size:1.05rem}
.definition-card details{margin-top:12px}
.definition-card summary{cursor:pointer;font-weight:800}

@media(max-width:800px){
    .flash-stack{top:70px;right:4vw;width:92vw}
    .watch-rack{align-items:flex-start;flex-direction:column}
    .watch-rack .rack{width:100%}
}


/* ===== WordWarren v0.3.1 board visual reset ===== */
.gamegrid{grid-template-columns:minmax(0,1fr) 290px;gap:28px}
.board{
    gap:3px;
    padding:10px;
    border-radius:18px;
    background:#24302d;
    box-shadow:0 14px 34px rgba(18,28,25,.16);
}
.warren-board .sq{
    border:0!important;
    border-radius:5px!important;
    background:#f1ede3!important;
    box-shadow:inset 0 0 0 1px rgba(60,70,65,.10);
    transition:transform .08s ease,box-shadow .08s ease;
}
.warren-board .sq.l2,
.warren-board .sq.dl{background:#bfd5c8!important;color:#21473a!important}
.warren-board .sq.l3,
.warren-board .sq.tl{background:#6f9a86!important;color:white!important}
.warren-board .sq.w2,
.warren-board .sq.dw{background:#d5c2a3!important;color:#543f25!important}
.warren-board .sq.w3,
.warren-board .sq.tw{background:#a66f49!important;color:white!important}
.warren-board .sq.start{
    background:#d0a548!important;
    color:#30240d!important;
    box-shadow:inset 0 0 0 2px rgba(68,48,16,.16);
}
.bonus-label{
    font-size:clamp(.52rem,.9vw,.72rem)!important;
    font-weight:900!important;
    letter-spacing:.02em!important;
}
.tile{
    width:90%;
    height:90%;
    border-radius:7px!important;
    background:#f3d99f!important;
    border:1px solid #b9934e!important;
    box-shadow:0 2px 4px rgba(60,43,15,.22)!important;
    font-size:clamp(.72rem,1.6vw,1.18rem)!important;
}
.rack{
    gap:8px!important;
}
.racktile{
    width:46px!important;
    min-width:46px!important;
    height:50px!important;
    border-radius:8px!important;
    background:#f3d99f!important;
    border:1px solid #b9934e!important;
    box-shadow:0 2px 4px rgba(60,43,15,.16);
    font-size:1.08rem!important;
}
.tile-letter{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    font-size:1em;
    line-height:1;
}
.tile-points{
    right:4px!important;
    bottom:3px!important;
    font-size:.50em!important;
    line-height:1!important;
}
.board-key{
    padding:8px 2px 0;
    gap:6px 8px;
}
.board-key small{margin-right:8px}
.board-key .key{width:32px;height:27px;border-radius:6px}
.board-key .l2{background:#bfd5c8}
.board-key .l3{background:#6f9a86;color:#fff}
.board-key .w2{background:#d5c2a3}
.board-key .w3{background:#a66f49;color:#fff}

@media(max-width:800px){
    .board{gap:2px;padding:6px;border-radius:12px}
    .racktile{width:42px!important;min-width:42px!important;height:46px!important}
}


/* ===== WordWarren v0.3.2 corrections ===== */
body{padding-bottom:112px}

.board{
    background:#1f2f2b!important;
    gap:3px!important;
}
.warren-board .sq{
    background:#f4efe4!important;
    box-shadow:inset 0 0 0 1px rgba(43,55,50,.13)!important;
}
.warren-board .sq.l2,
.warren-board .sq.dl{
    background:#9fc8b2!important;
    color:#123c2e!important;
}
.warren-board .sq.l3,
.warren-board .sq.tl{
    background:#4f8f73!important;
    color:#fff!important;
}
.warren-board .sq.w2,
.warren-board .sq.dw{
    background:#e0b471!important;
    color:#4a2f0a!important;
}
.warren-board .sq.w3,
.warren-board .sq.tw{
    background:#b7663f!important;
    color:#fff!important;
}
.warren-board .sq.start{
    background:#d9c45e!important;
    color:#302b0d!important;
}
.bonus-label{
    font-size:clamp(.56rem,.95vw,.78rem)!important;
    font-weight:950!important;
}

.player-rack-dock{
    position:fixed;
    z-index:4000;
    left:0;
    right:0;
    bottom:0;
    min-height:92px;
    background:rgba(24,35,45,.97);
    border-top:4px solid var(--accent);
    box-shadow:0 -10px 30px rgba(0,0,0,.20);
    backdrop-filter:blur(8px);
}
.dock-inner{
    min-height:88px;
    display:flex;
    align-items:center;
    gap:24px;
}
.dock-title{
    color:white;
    display:grid;
    min-width:95px;
}
.dock-title small{
    color:#aebac2;
    font-size:.65rem;
    font-weight:800;
    letter-spacing:.12em;
}
.dock-rack{
    margin:0!important;
    flex-wrap:nowrap!important;
}
.dock-rack .racktile:disabled{
    opacity:.78;
    cursor:default;
}
.racktile.drag-source{
    opacity:.2!important;
}
.drag-follow{
    position:fixed!important;
    z-index:20000!important;
    left:0!important;
    top:0!important;
    margin:0!important;
    pointer-events:none!important;
    opacity:.98!important;
    box-shadow:0 14px 34px rgba(0,0,0,.38)!important;
    will-change:transform;
}
html.dragging-tile,
html.dragging-tile body{
    cursor:grabbing!important;
}
.sq.drop-target{
    outline:5px solid #2e7d55!important;
    outline-offset:-5px!important;
    filter:brightness(1.08);
}
.sq.drop-invalid{
    outline:5px solid #b23a3a!important;
    outline-offset:-5px!important;
}
@media(max-width:800px){
    body{padding-bottom:132px}
    .player-rack-dock{min-height:118px}
    .dock-inner{align-items:flex-start;padding-top:10px;flex-direction:column;gap:6px}
    .dock-title{display:flex;gap:8px;align-items:center}
    .dock-rack{overflow-x:auto;width:100%;padding-bottom:8px}
}


/* ===== WordWarren v0.3.3 ===== */
body{padding-bottom:104px}

.tile-points,
.racktile .tile-points{
    font-style:italic!important;
    font-weight:700!important;
    right:4px!important;
    bottom:3px!important;
    font-size:.48em!important;
}

.bonus-legend{
    display:grid;
    grid-template-columns:repeat(4,max-content);
    gap:8px 18px;
    align-items:center;
    margin:12px 0 4px;
}
.legend-item{
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--muted);
    font-size:.78rem;
}
.legend-swatch{
    width:34px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:6px;
    font-weight:900;
    font-size:.68rem;
    border:1px solid rgba(0,0,0,.08);
}
.legend-swatch.l2{background:#9fc8b2;color:#123c2e}
.legend-swatch.l3{background:#4f8f73;color:white}
.legend-swatch.w2{background:#e0b471;color:#4a2f0a}
.legend-swatch.w3{background:#b7663f;color:white}

.player-rack-dock{
    min-height:88px!important;
}
.dock-inner{
    min-height:84px!important;
    display:grid!important;
    grid-template-columns:auto 1fr auto!important;
    align-items:center!important;
    gap:18px!important;
}
.dock-rack{
    overflow-x:auto;
    padding:4px 0;
}
.dock-actions{
    display:flex;
    gap:6px;
    align-items:center;
    justify-content:flex-end;
    white-space:nowrap;
}
.dock-actions form{
    display:flex;
    align-items:center;
    margin:0;
}
.dock-actions .button{
    margin:0 3px;
}
.dock-waiting{
    color:#c8d0d6;
    font-size:.85rem;
}

.mouse-drag-ghost{
    position:fixed!important;
    z-index:30000!important;
    margin:0!important;
    pointer-events:none!important;
    opacity:.98!important;
    transform:scale(1.12)!important;
    transform-origin:center!important;
    box-shadow:0 16px 38px rgba(0,0,0,.42)!important;
    cursor:grabbing!important;
}
body.drag-active{
    cursor:grabbing!important;
    user-select:none!important;
}
.drag-source{
    opacity:.25!important;
}

.warren-board .sq.l2,
.warren-board .sq.dl{
    background:#8fc7aa!important;
}
.warren-board .sq.l3,
.warren-board .sq.tl{
    background:#39795e!important;
}
.warren-board .sq.w2,
.warren-board .sq.dw{
    background:#e2a95b!important;
}
.warren-board .sq.w3,
.warren-board .sq.tw{
    background:#aa5532!important;
}
.warren-board .sq.start{
    background:#d7be4d!important;
}

@media(max-width:900px){
    .bonus-legend{grid-template-columns:repeat(2,max-content)}
    .dock-inner{grid-template-columns:1fr!important;gap:5px!important;padding:8px 0}
    .dock-title{display:flex;gap:8px}
    .dock-actions{justify-content:flex-start}
    body{padding-bottom:180px}
}


/* ===== WordWarren v0.3.4 ===== */
.score-strip{
    display:flex;
    align-items:stretch;
    gap:10px;
}
.tiles-left{
    background:#18232d;
    color:white;
    border-radius:9px;
    min-width:76px;
    padding:8px 11px;
    display:grid;
    align-content:center;
    text-align:center;
}
.tiles-left small{
    color:#b9c7d0;
    font-size:.58rem;
    font-weight:800;
    letter-spacing:.08em;
}
.tiles-left strong{
    font-size:1.55rem;
    line-height:1.05;
}

.racktile.exchange-selected{
    outline:4px solid #e36f45!important;
    outline-offset:2px;
    transform:translateY(-4px);
}
.dock-actions #changeTiles{
    min-width:104px;
}

@media(max-width:900px){
    .score-strip{display:block}
    .tiles-left{display:inline-grid;margin-bottom:8px}
}


/* ===== WordWarren v0.3.5 ===== */
.dock-rack .racktile.is-used,
.dock-rack .racktile[hidden]{
    display:none!important;
}


/* ===== WordWarren v0.4.0 ===== */

/* Fixed reserved status area: never floats over the game. */
.flash-stack{display:none!important}
.status-reserve{
    min-height:54px;
    display:flex;
    align-items:center;
}
.game-status{
    width:100%;
    min-height:38px;
    border-radius:8px;
    display:flex;
    align-items:center;
    padding:8px 12px;
    border:1px solid transparent;
}
.game-status.ok{
    background:#e1f2e3;
    border-color:#c4e5c8;
}
.game-status.err{
    background:#f6dddd;
    border-color:#edc5c5;
}
.game-status.idle{
    visibility:hidden;
}

/* Tile face always owns its own colour, preventing bonus-square inheritance. */
.tile,
.tile-letter,
.racktile,
.racktile .tile-letter{
    color:#171b19!important;
}
.tile-points,
.racktile .tile-points{
    color:#66502d!important;
}

/* Planning tiles are visually distinct but still readable. */
.sq.has-pending .tile.pending{
    opacity:.86;
    outline:2px dashed rgba(31,69,56,.48);
    outline-offset:-2px;
}

/* Final results */
.final-results{
    border:2px solid rgba(31,69,56,.22);
}
.final-row strong{
    font-size:1.05rem;
}

/* Slight board-density balance for v0.4 */
.warren-board .sq.l2,
.warren-board .sq.dl{background:#95c7aa!important}
.warren-board .sq.l3,
.warren-board .sq.tl{background:#3f8065!important}
.warren-board .sq.w2,
.warren-board .sq.dw{background:#dda75a!important}
.warren-board .sq.w3,
.warren-board .sq.tw{background:#ad5936!important}

/* Rack arrangement affordance */
.dock-rack .racktile{
    transition:transform .12s ease,outline .12s ease;
}
.dock-rack .racktile:hover:not(:disabled){
    transform:translateY(-2px);
}


/* ===== WordWarren v0.4.1 ===== */
.tile.pending{cursor:grab!important}
.tile.pending:active{cursor:grabbing!important}


/* ===== WordWarren v0.4.2 ===== */
.dock-inner{
    grid-template-columns:auto minmax(300px,1fr) minmax(180px,320px) auto!important;
}
.dock-status{
    min-height:42px;
    border-radius:7px;
    padding:8px 11px;
    display:flex;
    align-items:center;
    font-size:.82rem;
    line-height:1.2;
}
.dock-status.ok{
    background:#dcefe0;
    color:#214d30;
}
.dock-status.err{
    background:#f3dada;
    color:#742f2f;
}
.dock-status.idle{
    background:rgba(255,255,255,.08);
    color:#d3dce1;
}
.dock-rack .racktile:not(:disabled){
    cursor:grab;
}
.dock-rack .racktile:not(:disabled):active{
    cursor:grabbing;
}
@media(max-width:1100px){
    .dock-inner{
        grid-template-columns:auto minmax(250px,1fr) auto!important;
    }
    .dock-status{
        grid-column:2 / 4;
        grid-row:2;
    }
}


/* ===== WordWarren v0.4.3 ===== */

/* Desktop dock: player -> full rack -> controls/preview -> compact status. */
.dock-inner{
    grid-template-columns:95px minmax(360px,1fr) auto minmax(150px,220px)!important;
    gap:14px!important;
}
.dock-rack{
    overflow:visible!important;
    min-width:360px;
    flex-wrap:nowrap!important;
}
.dock-actions{
    gap:5px!important;
    justify-content:flex-start!important;
}
.dock-actions .button{
    padding:9px 11px!important;
    margin:0 2px!important;
}
.dock-status{
    max-width:220px;
    min-width:150px;
    min-height:40px!important;
}
.score-preview{
    height:44px;
    min-width:74px;
    border-radius:8px;
    display:grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto auto;
    align-content:center;
    justify-content:center;
    column-gap:4px;
    padding:4px 9px;
    background:rgba(255,255,255,.10);
    color:#dfe7eb;
    border:1px solid rgba(255,255,255,.10);
}
.score-preview small{
    grid-column:1 / 3;
    font-size:.50rem;
    line-height:1;
    letter-spacing:.10em;
    font-weight:850;
    color:#aebbc3;
}
.score-preview strong{
    font-size:1.2rem;
    line-height:1;
    color:white;
}
.score-preview span{
    align-self:end;
    font-size:.62rem;
    color:#b9c5cc;
}
.score-preview.has-tiles{
    background:#315d49;
    border-color:#4d7e66;
}

/* Move-history dictionary affordance. */
.history-word{
    font-weight:750;
}
.definition-info{
    width:20px;
    height:20px;
    display:inline-grid;
    place-items:center;
    margin-left:4px;
    padding:0;
    border:1px solid #9aa5aa;
    border-radius:50%;
    background:#fff;
    color:#45535a;
    font:italic 700 .72rem Georgia,serif;
    cursor:pointer;
    vertical-align:middle;
}
.definition-info:hover{
    background:#e8f0ec;
    border-color:#5e806f;
}
.definition-played-as{
    display:block;
    margin:-5px 0 12px;
    color:var(--muted);
}
.definition-line{
    margin:10px 0;
    line-height:1.45;
}
.definition-example{
    margin:-4px 0 12px;
    padding-left:12px;
    border-left:3px solid #d9d2c5;
    color:var(--muted);
    font-size:.9rem;
}
.definition-card details{
    margin-top:14px;
}
.definition-card summary{
    cursor:pointer;
    font-weight:800;
}

/* Existing top game status stays suppressed; gameplay feedback belongs in dock. */
@media(max-width:1180px){
    .dock-inner{
        grid-template-columns:85px minmax(330px,1fr) auto!important;
    }
    .dock-status{
        grid-column:2 / 4!important;
        grid-row:2!important;
        max-width:none;
        width:100%;
    }
}
@media(max-width:900px){
    .dock-inner{
        grid-template-columns:1fr!important;
    }
    .dock-rack{
        min-width:0;
        overflow-x:auto!important;
    }
    .dock-status{
        grid-column:1!important;
        grid-row:auto!important;
    }
}


/* ===== WordWarren v0.5.0 corrected cumulative UI ===== */

/* A normal desktop must always show the complete seven-tile rack. */
@media(min-width:1101px){
    .player-rack-dock .dock-inner{
        grid-template-columns:82px 322px minmax(420px,1fr) minmax(160px,210px)!important;
        column-gap:12px!important;
    }

    .player-rack-dock .dock-rack{
        width:322px!important;
        min-width:322px!important;
        max-width:322px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
        gap:6px!important;
        margin:0!important;
    }

    .player-rack-dock .dock-rack .racktile{
        flex:0 0 40px!important;
        width:40px!important;
        min-width:40px!important;
        max-width:40px!important;
        height:44px!important;
    }

    .player-rack-dock .dock-actions{
        min-width:0!important;
        white-space:nowrap!important;
    }

    .player-rack-dock .dock-status{
        min-width:160px!important;
        max-width:210px!important;
    }
}

/* While another player is taking a turn the rack stays fully interactive. */
.player-rack-dock .racktile:not(:disabled){
    pointer-events:auto!important;
    touch-action:none!important;
    cursor:grab!important;
}
.player-rack-dock .racktile:not(:disabled):active{
    cursor:grabbing!important;
}


/* ===== WordWarren v0.5.0 final cumulative interaction fix ===== */
.score-preview:not(.has-tiles){
    opacity:.72;
}
.player-rack-dock .dock-rack{
    scrollbar-width:none;
}
.player-rack-dock .dock-rack::-webkit-scrollbar{
    display:none;
}


/* ===== WordWarren v0.5.0 score visibility correction ===== */
.player-rack-dock .dock-inner{
    grid-template-columns:82px auto minmax(320px,1fr) auto minmax(150px,210px)!important;
}

.score-preview-fixed{
    min-width:132px!important;
    width:132px!important;
    height:48px!important;
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    padding:5px 9px!important;
    border-radius:8px!important;
    background:#263b32!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.18)!important;
    opacity:1!important;
    visibility:visible!important;
    overflow:visible!important;
}

.score-preview-fixed .score-preview-label{
    grid-column:1 / 3;
    font-size:.60rem!important;
    line-height:1!important;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:800;
    color:#c9d8d0!important;
    white-space:nowrap;
}

.score-preview-fixed strong{
    font-size:1.35rem!important;
    line-height:1!important;
    color:#fff!important;
}

.score-preview-fixed .score-preview-points{
    align-self:end;
    font-size:.66rem!important;
    color:#d8e2dd!important;
    margin-left:4px;
}

.score-preview-fixed.has-tiles{
    background:#315d49!important;
    border-color:#5b8d73!important;
}

@media(max-width:1100px){
    .player-rack-dock .dock-inner{
        grid-template-columns:80px 132px minmax(280px,1fr) auto!important;
    }
    .player-rack-dock .dock-status{
        grid-column:3 / 5!important;
    }
}

@media(max-width:900px){
    .player-rack-dock .dock-inner{
        grid-template-columns:1fr!important;
    }
    .score-preview-fixed{
        width:100%!important;
        max-width:180px!important;
    }
}


/* ===== WordWarren v0.5.0 bottom dock visual correction ===== */

/* Desktop order:
   player label | seven-tile rack | estimated score | actions | status */
@media(min-width:1101px){
    .player-rack-dock .dock-inner{
        display:grid!important;
        grid-template-columns:86px 330px 138px minmax(390px,1fr) minmax(150px,210px)!important;
        align-items:center!important;
        gap:12px!important;
    }

    .player-rack-dock .dock-title{
        grid-column:1!important;
        min-width:0!important;
    }

    .player-rack-dock .dock-rack{
        grid-column:2!important;
        width:330px!important;
        min-width:330px!important;
        max-width:330px!important;
        display:flex!important;
        justify-content:flex-start!important;
        gap:6px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }

    .player-rack-dock .dock-rack .racktile{
        flex:0 0 42px!important;
        width:42px!important;
        min-width:42px!important;
        max-width:42px!important;
        height:46px!important;
    }

    .player-rack-dock .score-preview-fixed{
        grid-column:3!important;
        width:138px!important;
        min-width:138px!important;
        max-width:138px!important;
        height:48px!important;
        box-sizing:border-box!important;
        display:grid!important;
        grid-template-columns:auto 1fr!important;
        grid-template-rows:16px 24px!important;
        align-items:center!important;
        padding:5px 9px!important;
        margin:0!important;
        border-radius:8px!important;
        background:#f2d58c!important;
        border:2px solid #ef6a3b!important;
        color:#172733!important;
        opacity:1!important;
        visibility:visible!important;
    }

    .player-rack-dock .score-preview-fixed .score-preview-label{
        grid-column:1 / 3!important;
        font-size:10px!important;
        line-height:1!important;
        font-weight:800!important;
        letter-spacing:.04em!important;
        text-transform:uppercase!important;
        color:#172733!important;
        opacity:1!important;
    }

    .player-rack-dock .score-preview-fixed strong{
        font-size:22px!important;
        line-height:1!important;
        font-weight:800!important;
        color:#172733!important;
        opacity:1!important;
    }

    .player-rack-dock .score-preview-fixed .score-preview-points{
        align-self:end!important;
        margin-left:4px!important;
        font-size:11px!important;
        color:#172733!important;
        opacity:1!important;
    }

    .player-rack-dock .score-preview-fixed.has-tiles{
        background:#f7e1a6!important;
        border-color:#ef6a3b!important;
    }

    .player-rack-dock .dock-actions{
        grid-column:4!important;
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:8px!important;
        flex-wrap:nowrap!important;
    }

    .player-rack-dock .dock-status{
        grid-column:5!important;
        min-width:150px!important;
        max-width:210px!important;
        margin:0!important;
    }
}

/* Medium screens: keep rack and score together, move status below if needed. */
@media(min-width:901px) and (max-width:1100px){
    .player-rack-dock .dock-inner{
        display:grid!important;
        grid-template-columns:82px minmax(300px,1fr) 138px auto!important;
        gap:10px!important;
        align-items:center!important;
    }
    .player-rack-dock .dock-title{grid-column:1!important;}
    .player-rack-dock .dock-rack{
        grid-column:2!important;
        min-width:0!important;
        width:auto!important;
        max-width:none!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }
    .player-rack-dock .score-preview-fixed{
        grid-column:3!important;
        width:138px!important;
        min-width:138px!important;
        background:#f2d58c!important;
        border:2px solid #ef6a3b!important;
        color:#172733!important;
        opacity:1!important;
    }
    .player-rack-dock .score-preview-fixed *{
        color:#172733!important;
        opacity:1!important;
    }
    .player-rack-dock .dock-actions{grid-column:4!important;}
    .player-rack-dock .dock-status{
        grid-column:2 / 5!important;
        grid-row:2!important;
        max-width:none!important;
    }
}

/* Small screens: stack cleanly; do not hide the score. */
@media(max-width:900px){
    .player-rack-dock .dock-inner{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:8px!important;
    }
    .player-rack-dock .dock-title,
    .player-rack-dock .dock-rack,
    .player-rack-dock .score-preview-fixed,
    .player-rack-dock .dock-actions,
    .player-rack-dock .dock-status{
        grid-column:1!important;
        width:100%!important;
        max-width:none!important;
    }
    .player-rack-dock .score-preview-fixed{
        width:160px!important;
        min-width:160px!important;
        max-width:160px!important;
        background:#f2d58c!important;
        border:2px solid #ef6a3b!important;
        color:#172733!important;
        opacity:1!important;
    }
    .player-rack-dock .score-preview-fixed *{
        color:#172733!important;
        opacity:1!important;
    }
}

/* WORDWARREN_DOCK3_LOADED */


/* =====================================================================
   WordWarren v0.6 — game-shell + brand system
   ===================================================================== */

.brand-lockup{
    display:flex!important;
    align-items:center;
    gap:10px;
}
.brand-mark{
    width:38px;
    height:38px;
    display:block;
    flex:0 0 38px;
}
.brand-copy{
    display:grid;
    line-height:1;
    gap:3px;
}
.brand-copy strong{
    font-size:1.28rem;
    letter-spacing:-.04em;
}
.brand-copy small{
    font-size:.58rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#b9cabc;
    font-weight:750;
}

.game-screen header{
    height:54px;
    border-bottom-width:3px;
}
.game-screen .nav{
    height:54px;
}
.game-screen footer{
    display:none;
}

/* Desktop game behaves as an application viewport rather than a long page. */
@media(min-width:1100px) and (min-height:690px){
    html:has(body.game-screen),
    body.game-screen{
        height:100%;
        overflow:hidden;
    }

    body.game-screen{
        min-height:100vh;
    }

    .game-screen .game-main{
        width:min(1360px,96vw)!important;
        height:calc(100vh - 54px - 82px)!important;
        min-height:0!important;
        padding:9px 0 7px!important;
        overflow:hidden!important;
    }

    .game-screen-shell{
        height:100%;
        min-height:0;
        display:grid;
        grid-template-rows:auto minmax(0,1fr);
        gap:7px;
    }

    .game-screen .gamehead{
        min-height:58px;
        margin:0!important;
        align-items:center!important;
        gap:14px!important;
    }

    .game-screen .gamehead h1{
        font-size:1.55rem;
        line-height:1;
        margin:.3rem 0 0;
    }

    .game-screen .gamehead .eyebrow{
        font-size:.62rem;
    }

    .game-screen .score-strip{
        display:flex;
        align-items:center;
        justify-content:flex-end;
        gap:7px;
        min-width:0;
    }

    .game-screen .scores{
        flex-wrap:nowrap!important;
        gap:6px!important;
    }

    .game-screen .score{
        min-width:88px!important;
        padding:6px 8px!important;
        border-radius:7px!important;
    }

    .game-screen .score small{
        font-size:.52rem!important;
    }

    .game-screen .score strong{
        font-size:1.08rem!important;
    }

    .game-screen .tiles-left{
        min-width:62px!important;
        padding:7px 9px!important;
    }

    .game-screen .gamegrid{
        height:100%;
        min-height:0;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) 262px!important;
        gap:14px!important;
        align-items:start!important;
    }

    .game-screen .gamegrid > section{
        min-width:0;
        min-height:0;
        height:100%;
        display:flex;
        flex-direction:column;
        justify-content:flex-start;
        align-items:center;
    }

    .game-screen .board{
        width:min(calc(100vh - 223px),calc(100vw - 410px),690px)!important;
        max-width:100%!important;
        flex:0 0 auto;
        gap:2px!important;
    }

    .game-screen .bonus-legend{
        width:min(calc(100vh - 223px),calc(100vw - 410px),690px)!important;
        min-height:24px;
        margin:6px 0 0!important;
        font-size:.67rem;
        gap:10px!important;
    }

    .game-screen .legend-swatch{
        width:27px!important;
        height:23px!important;
    }

    .game-screen .gamegrid > aside{
        min-height:0;
        height:100%;
        overflow:hidden;
        display:flex;
        flex-direction:column;
        gap:9px;
    }

    .game-screen .gamegrid > aside .card{
        margin:0!important;
        padding:13px 14px!important;
        border-radius:11px!important;
        box-shadow:0 4px 14px #00000008!important;
    }

    .game-screen .gamegrid > aside h2{
        margin:0 0 8px!important;
        font-size:1.08rem!important;
    }

    .game-screen .current-turn-card{
        flex:0 0 auto;
    }

    .game-screen .current-turn-card p{
        margin:.35rem 0!important;
        font-size:.82rem;
    }

    .game-screen .move-history-card{
        flex:1 1 auto;
        min-height:0;
        overflow-y:auto;
        scrollbar-width:thin;
    }

    .game-screen .move-history-card .statrow{
        padding:7px 0!important;
        font-size:.82rem;
    }

    /* Fixed game dock: one compact row, no page scrolling. */
    .game-screen .player-rack-dock{
        height:82px!important;
        min-height:82px!important;
        padding:7px 0!important;
    }

    .game-screen .player-rack-dock .dock-inner{
        width:min(1360px,96vw)!important;
        height:68px!important;
        display:grid!important;
        grid-template-columns:86px 330px 142px minmax(350px,1fr) 174px!important;
        gap:11px!important;
        align-items:center!important;
    }

    .game-screen .dock-title{
        grid-column:1!important;
    }

    .game-screen .dock-rack{
        grid-column:2!important;
        width:330px!important;
        min-width:330px!important;
        max-width:330px!important;
        height:50px!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:6px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }

    .game-screen .dock-rack .racktile{
        flex:0 0 42px!important;
        width:42px!important;
        min-width:42px!important;
        max-width:42px!important;
        height:48px!important;
    }

    .game-screen .score-preview-fixed{
        grid-column:3!important;
        width:142px!important;
        min-width:142px!important;
        max-width:142px!important;
        height:50px!important;
        margin:0!important;
        padding:5px 9px!important;
        display:grid!important;
        grid-template-columns:auto 1fr!important;
        grid-template-rows:16px 24px!important;
        align-items:center!important;
        box-sizing:border-box!important;
        border:2px solid #e36f45!important;
        border-radius:9px!important;
        background:#f1d28d!important;
        color:#17212b!important;
        opacity:1!important;
        visibility:visible!important;
    }

    .game-screen .score-preview-fixed *,
    .game-screen .score-preview-fixed .score-preview-label,
    .game-screen .score-preview-fixed strong,
    .game-screen .score-preview-fixed .score-preview-points{
        color:#17212b!important;
        opacity:1!important;
    }

    .game-screen .score-preview-fixed .score-preview-label{
        grid-column:1/3!important;
        font-size:.58rem!important;
        line-height:1!important;
        font-weight:850!important;
        text-transform:uppercase;
        letter-spacing:.06em;
    }

    .game-screen .score-preview-fixed strong{
        font-size:1.35rem!important;
        line-height:1!important;
    }

    .game-screen .score-preview-fixed .score-preview-points{
        margin-left:4px!important;
        align-self:end!important;
        font-size:.65rem!important;
    }

    .game-screen .dock-actions{
        grid-column:4!important;
        min-width:0!important;
        display:flex!important;
        flex-wrap:nowrap!important;
        justify-content:flex-start!important;
        align-items:center!important;
        gap:5px!important;
        overflow:visible!important;
    }

    .game-screen .dock-actions form{
        display:flex!important;
        align-items:center!important;
        margin:0!important;
    }

    .game-screen .dock-actions .button{
        margin:0 3px 0 0!important;
        padding:9px 12px!important;
        white-space:nowrap!important;
        font-size:.78rem!important;
    }

    .game-screen .dock-status{
        grid-column:5!important;
        width:174px!important;
        min-width:174px!important;
        max-width:174px!important;
        margin:0!important;
        min-height:45px!important;
        max-height:58px!important;
        overflow:hidden!important;
        display:flex!important;
        align-items:center!important;
        padding:8px 10px!important;
        font-size:.72rem!important;
    }
}

/* Laptop / shorter browser windows: still prioritise complete game visibility. */
@media(min-width:1100px) and (max-height:689px){
    .game-screen .game-main{
        width:min(1320px,96vw)!important;
        padding:8px 0 88px!important;
    }
    .game-screen .board{
        width:min(63vh,calc(100vw - 410px))!important;
    }
    .game-screen .gamehead{
        margin-bottom:8px!important;
    }
    .game-screen .card{
        padding:12px!important;
    }
}

/* Tablet/mobile remain naturally scrollable and touch-first. */
@media(max-width:1099px){
    body.game-screen{
        overflow:auto;
    }
    .game-screen .game-main{
        padding-top:16px!important;
        padding-bottom:150px!important;
    }
    .game-screen .brand-copy small{
        display:none;
    }
}


/* ===== WordWarren v0.6.1 ===== */
.move-history-card{
    min-height:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
}
.move-history-card>h2{flex:0 0 auto!important}
.move-history-scroll{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    padding-right:4px;
}
@media(min-width:1100px) and (min-height:690px){
    .game-screen .game-main,
    .game-screen .player-rack-dock .dock-inner{
        width:min(1210px,94vw)!important;
    }
    .game-screen .gamegrid{
        grid-template-columns:minmax(0,1fr) 236px!important;
        gap:10px!important;
    }
    .game-screen .board,
    .game-screen .bonus-legend{
        width:min(calc(100vh - 223px),calc(100vw - 390px),690px)!important;
    }
    .game-screen .player-rack-dock .dock-inner{
        grid-template-columns:76px 318px 132px minmax(330px,1fr) 160px!important;
        gap:8px!important;
    }
}


/* =====================================================================
   WordWarren v0.7.0 — final browser design
   Stable v0.6.4 structure, polished alignment and hierarchy only.
   ===================================================================== */

:root{
    --ww-shell:1120px;
    --ww-side:236px;
    --ww-gap:16px;
    --ww-green:#17372f;
    --ww-green-2:#21483e;
    --ww-cream:#f7f3e9;
    --ww-card:#fffdf8;
    --ww-gold:#f0d38f;
    --ww-orange:#e56d3f;
    --ww-line:#d9d2c4;
}

/* Brand/header */
.game-screen header{
    background:#15232d!important;
    border-bottom:3px solid var(--ww-orange)!important;
}
.game-screen .nav{
    width:min(var(--ww-shell),94vw)!important;
    height:54px!important;
}
.game-screen .brand-mark{
    width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
}
.game-screen .brand-copy strong{
    font-size:1.16rem!important;
}
.game-screen .brand-copy small{
    font-size:.52rem!important;
}

/* Entire active game uses one alignment spine. */
@media(min-width:1100px) and (min-height:720px){
    html:has(body.game-screen),
    body.game-screen{
        height:100%;
        overflow:hidden!important;
    }

    .game-screen .game-main{
        width:min(var(--ww-shell),94vw)!important;
        height:calc(100vh - 54px - 78px)!important;
        min-height:0!important;
        padding:10px 0 7px!important;
        overflow:hidden!important;
    }

    .game-screen-shell{
        height:100%!important;
        min-height:0!important;
        display:grid!important;
        grid-template-rows:64px minmax(0,1fr)!important;
        gap:8px!important;
    }

    /* Header: metadata left, compact scoreboard right, aligned to stage below. */
    .game-screen .gamehead-final{
        display:grid!important;
        grid-template-columns:190px minmax(0,1fr)!important;
        gap:var(--ww-gap)!important;
        align-items:center!important;
        margin:0!important;
        min-height:0!important;
    }

    .game-screen .gamehead-final > div:first-child{
        min-width:0!important;
    }

    .game-screen .gamehead-final .eyebrow{
        display:block!important;
        margin-bottom:4px!important;
        font-size:.56rem!important;
        line-height:1!important;
        letter-spacing:.13em!important;
    }

    .game-screen .gamehead-final h1{
        margin:0!important;
        font-size:1.28rem!important;
        line-height:1!important;
        letter-spacing:-.025em!important;
    }

    .game-screen .scoreboard-final{
        display:grid!important;
        grid-template-columns:62px minmax(0,1fr)!important;
        gap:6px!important;
        align-items:center!important;
        min-width:0!important;
    }

    .game-screen .scoreboard-final .tiles-left{
        height:52px!important;
        min-width:62px!important;
        width:62px!important;
        padding:6px!important;
        border-radius:8px!important;
        display:grid!important;
        place-items:center!important;
        align-content:center!important;
    }

    .game-screen .scoreboard-final .tiles-left small{
        font-size:.48rem!important;
        letter-spacing:.08em!important;
    }

    .game-screen .scoreboard-final .tiles-left strong{
        font-size:1.25rem!important;
        line-height:1!important;
    }

    .game-screen .scoreboard-final .scores{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:6px!important;
        min-width:0!important;
        margin:0!important;
    }

    .game-screen .scoreboard-final .score{
        height:52px!important;
        min-width:0!important;
        padding:6px 8px!important;
        border-radius:8px!important;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        grid-template-rows:auto 1fr!important;
        background:#e9e5dc!important;
        box-shadow:inset 0 0 0 1px rgba(0,0,0,.02)!important;
    }

    .game-screen .scoreboard-final .score.active{
        outline:2px solid var(--ww-orange)!important;
        outline-offset:0!important;
        background:#f2eee5!important;
    }

    .game-screen .scoreboard-final .score small{
        grid-column:1/3!important;
        font-size:.47rem!important;
        line-height:1!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }

    .game-screen .scoreboard-final .score b{
        min-width:0!important;
        align-self:end!important;
        font-size:.72rem!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }

    .game-screen .scoreboard-final .score strong{
        align-self:end!important;
        font-size:1rem!important;
        line-height:1!important;
    }

    /* Board/sidebar stage */
    .game-screen .gamegrid-final{
        height:100%!important;
        min-height:0!important;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) var(--ww-side)!important;
        gap:var(--ww-gap)!important;
        align-items:start!important;
    }

    .game-screen .board-stage{
        height:100%!important;
        min-height:0!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:flex-end!important;
        justify-content:flex-start!important;
    }

    .game-screen .board-stage .board{
        width:min(calc(100vh - 216px),650px,calc(100vw - 430px))!important;
        max-width:100%!important;
        margin:0!important;
        box-shadow:0 12px 30px rgba(23,55,47,.12)!important;
    }

    .game-screen .board-stage .bonus-legend{
        width:min(calc(100vh - 216px),650px,calc(100vw - 430px))!important;
        margin:6px 0 0!important;
        min-height:24px!important;
        font-size:.64rem!important;
        gap:10px!important;
    }

    /* Sidebar visually belongs to the board and exactly fills its stage height. */
    .game-screen .game-sidebar{
        height:min(calc(100vh - 186px),680px)!important;
        min-height:0!important;
        display:grid!important;
        grid-template-rows:auto minmax(0,1fr)!important;
        gap:8px!important;
        overflow:hidden!important;
    }

    .game-screen .game-sidebar .card{
        margin:0!important;
        border-radius:10px!important;
        border:1px solid var(--ww-line)!important;
        box-shadow:0 5px 16px rgba(0,0,0,.035)!important;
        padding:12px 13px!important;
    }

    .game-screen .game-sidebar h2{
        margin:0 0 7px!important;
        font-size:.98rem!important;
        letter-spacing:-.02em!important;
    }

    .game-screen .current-turn-card{
        min-height:100px!important;
    }

    .game-screen .current-turn-card p{
        margin:.3rem 0!important;
        font-size:.74rem!important;
    }

    .game-screen .history-panel{
        min-height:0!important;
        display:flex!important;
        flex-direction:column!important;
        overflow:hidden!important;
    }

    .game-screen .history-panel .move-history-scroll{
        flex:1 1 auto!important;
        min-height:0!important;
        overflow-y:auto!important;
        padding-right:4px!important;
        scrollbar-width:thin!important;
    }

    .game-screen .history-panel .statrow{
        padding:6px 0!important;
        font-size:.73rem!important;
    }

    .game-screen .definition-info{
        width:17px!important;
        height:17px!important;
        line-height:15px!important;
        font-size:.62rem!important;
    }

    /* Bottom dock uses same visual width as the game and groups related controls. */
    .game-screen .player-rack-dock-final{
        height:78px!important;
        min-height:78px!important;
        padding:8px 0!important;
        border-top:3px solid var(--ww-orange)!important;
        background:#172630!important;
    }

    .game-screen .player-rack-dock-final .dock-inner{
        width:min(var(--ww-shell),94vw)!important;
        height:59px!important;
        display:grid!important;
        grid-template-columns:78px 316px 132px minmax(350px,1fr) 178px!important;
        gap:9px!important;
        align-items:center!important;
    }

    .game-screen .dock-title{
        min-width:0!important;
    }

    .game-screen .dock-title small{
        font-size:.49rem!important;
        letter-spacing:.12em!important;
    }

    .game-screen .dock-title b{
        font-size:.78rem!important;
    }

    .game-screen .dock-rack{
        width:316px!important;
        min-width:316px!important;
        max-width:316px!important;
        height:49px!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:5px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }

    .game-screen .dock-rack .racktile{
        flex:0 0 41px!important;
        width:41px!important;
        min-width:41px!important;
        max-width:41px!important;
        height:47px!important;
        border-radius:7px!important;
        box-shadow:0 2px 5px rgba(0,0,0,.18)!important;
    }

    .game-screen .score-preview-fixed{
        width:132px!important;
        min-width:132px!important;
        max-width:132px!important;
        height:47px!important;
        margin:0!important;
        border:2px solid var(--ww-orange)!important;
        border-radius:8px!important;
        background:var(--ww-gold)!important;
        color:#17212b!important;
        opacity:1!important;
    }

    .game-screen .score-preview-fixed *,
    .game-screen .score-preview-fixed strong,
    .game-screen .score-preview-fixed .score-preview-label,
    .game-screen .score-preview-fixed .score-preview-points{
        color:#17212b!important;
        opacity:1!important;
    }

    .game-screen .dock-actions{
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        gap:4px!important;
        flex-wrap:nowrap!important;
        overflow:visible!important;
    }

    .game-screen .dock-actions form{
        display:flex!important;
        align-items:center!important;
        margin:0!important;
    }

    .game-screen .dock-actions .button{
        margin:0 3px 0 0!important;
        padding:8px 11px!important;
        border-radius:7px!important;
        font-size:.73rem!important;
        line-height:1.1!important;
        white-space:nowrap!important;
    }

    .game-screen .dock-actions .button:not(.ghost){
        box-shadow:0 2px 5px rgba(0,0,0,.16)!important;
    }

    .game-screen .dock-status{
        min-width:0!important;
        max-width:178px!important;
        width:178px!important;
        min-height:45px!important;
        max-height:55px!important;
        margin:0!important;
        padding:7px 9px!important;
        overflow:hidden!important;
        display:flex!important;
        align-items:center!important;
        border-radius:7px!important;
        font-size:.68rem!important;
        line-height:1.2!important;
    }
}

/* 1080p and similar: remove non-game page chrome while playing. */
@media(min-width:1100px) and (min-height:800px){
    .game-screen footer{display:none!important}
}

/* Short desktop windows should scroll rather than crop the board. */
@media(min-width:1100px) and (max-height:719px){
    html:has(body.game-screen),
    body.game-screen{
        height:auto!important;
        overflow:auto!important;
    }
    .game-screen .game-main{
        width:min(var(--ww-shell),94vw)!important;
        height:auto!important;
        overflow:visible!important;
        padding-bottom:96px!important;
    }
    .game-screen .gamegrid-final{
        grid-template-columns:minmax(0,1fr) var(--ww-side)!important;
    }
    .game-screen .board-stage .board{
        width:min(600px,calc(100vw - 430px))!important;
    }
    .game-screen .game-sidebar{
        height:630px!important;
    }
}

/* Mobile/tablet keep the stable touch-first flow. */
@media(max-width:1099px){
    .game-screen .gamehead-final{
        display:block!important;
    }
    .game-screen .scoreboard-final{
        margin-top:10px!important;
    }
    .game-screen .game-sidebar{
        height:auto!important;
        overflow:visible!important;
    }
}


/* =====================================================================
   WordWarren v0.7.1 — title/scores/tiles-left + two-row dock
   ===================================================================== */

@media(min-width:1100px) and (min-height:720px){
    .game-screen .game-main{
        height:calc(100vh - 54px - 108px)!important;
    }

    .game-screen-shell{
        grid-template-rows:108px minmax(0,1fr)!important;
        gap:8px!important;
    }

    .game-screen .gamehead-v071{
        display:grid!important;
        grid-template-rows:28px 52px 22px!important;
        gap:3px!important;
        margin:0!important;
        min-height:0!important;
    }

    .game-screen .game-title-row{
        display:flex!important;
        align-items:center!important;
        gap:10px!important;
        min-width:0!important;
    }

    .game-screen .game-title-row .eyebrow{
        margin:0!important;
        font-size:.56rem!important;
        line-height:1!important;
        letter-spacing:.13em!important;
    }

    .game-screen .game-title-row h1{
        margin:0!important;
        font-size:1.28rem!important;
        line-height:1!important;
        letter-spacing:-.025em!important;
    }

    .game-screen .scores-row{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:6px!important;
        width:100%!important;
        min-width:0!important;
    }

    .game-screen .scores-row .score{
        height:52px!important;
        min-width:0!important;
        padding:6px 8px!important;
        border-radius:8px!important;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        grid-template-rows:auto 1fr!important;
        background:#e9e5dc!important;
    }

    .game-screen .scores-row .score.active{
        outline:2px solid var(--ww-orange)!important;
        background:#f2eee5!important;
    }

    .game-screen .scores-row .score small{
        grid-column:1/3!important;
        font-size:.47rem!important;
        line-height:1!important;
    }

    .game-screen .scores-row .score b{
        align-self:end!important;
        font-size:.72rem!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }

    .game-screen .scores-row .score strong{
        align-self:end!important;
        font-size:1rem!important;
    }

    .game-screen .tiles-left-row{
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        padding-top:1px!important;
    }

    .game-screen .tiles-left-row .tiles-left{
        width:auto!important;
        min-width:0!important;
        height:auto!important;
        display:flex!important;
        align-items:center!important;
        gap:7px!important;
        padding:0!important;
        border-radius:0!important;
        background:transparent!important;
        color:var(--muted)!important;
    }

    .game-screen .tiles-left-row .tiles-left small{
        font-size:.52rem!important;
        letter-spacing:.08em!important;
        color:var(--muted)!important;
    }

    .game-screen .tiles-left-row .tiles-left strong{
        font-size:.85rem!important;
        line-height:1!important;
        color:var(--ink)!important;
    }

    /* Slightly reduce board height to account for taller game header. */
    .game-screen .board-stage .board{
        width:min(calc(100vh - 260px),640px,calc(100vw - 430px))!important;
    }

    .game-screen .board-stage .bonus-legend{
        width:min(calc(100vh - 260px),640px,calc(100vw - 430px))!important;
    }

    .game-screen .game-sidebar{
        height:min(calc(100vh - 230px),670px)!important;
    }

    /* Two-row bottom control area */
    .game-screen .player-rack-dock-v071{
        height:108px!important;
        min-height:108px!important;
        padding:7px 0 8px!important;
    }

    .game-screen .player-rack-dock-v071 .dock-inner{
        width:min(var(--ww-shell),94vw)!important;
        height:90px!important;
        display:grid!important;
        grid-template-rows:50px 34px!important;
        gap:6px!important;
        align-items:center!important;
    }

    .game-screen .player-rack-dock-v071 .dock-row{
        width:100%!important;
        display:grid!important;
        align-items:center!important;
        min-width:0!important;
    }

    .game-screen .player-rack-dock-v071 .dock-row-rack{
        grid-template-columns:78px 1fr 132px!important;
        gap:10px!important;
    }

    .game-screen .player-rack-dock-v071 .dock-row-controls{
        grid-template-columns:minmax(0,1fr) 240px!important;
        gap:10px!important;
    }

    .game-screen .player-rack-dock-v071 .dock-rack{
        width:auto!important;
        min-width:0!important;
        max-width:none!important;
        height:49px!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:6px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }

    .game-screen .player-rack-dock-v071 .dock-rack .racktile{
        flex:0 0 42px!important;
        width:42px!important;
        min-width:42px!important;
        max-width:42px!important;
        height:48px!important;
    }

    .game-screen .player-rack-dock-v071 .score-preview-fixed{
        width:132px!important;
        min-width:132px!important;
        max-width:132px!important;
        height:48px!important;
        margin:0!important;
    }

    .game-screen .player-rack-dock-v071 .dock-actions{
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        gap:5px!important;
        flex-wrap:nowrap!important;
    }

    .game-screen .player-rack-dock-v071 .dock-actions form{
        display:flex!important;
        align-items:center!important;
        margin:0!important;
    }

    .game-screen .player-rack-dock-v071 .dock-actions .button{
        padding:7px 11px!important;
        margin:0 3px 0 0!important;
        font-size:.72rem!important;
    }

    .game-screen .player-rack-dock-v071 .dock-status{
        width:240px!important;
        max-width:240px!important;
        min-width:240px!important;
        min-height:32px!important;
        max-height:34px!important;
        margin:0!important;
        padding:5px 8px!important;
        font-size:.67rem!important;
        border-radius:6px!important;
    }
}

/* Shorter desktop windows: keep two-row controls but allow scrolling. */
@media(min-width:1100px) and (max-height:719px){
    .game-screen .player-rack-dock-v071{
        min-height:108px!important;
    }
}


/* =====================================================================
   WordWarren v0.7.2 — corrected compact hierarchy + true two-row dock
   ===================================================================== */
@media(min-width:1100px) and (min-height:720px){
    .game-screen .game-main{
        height:calc(100vh - 54px - 104px)!important;
        padding-top:6px!important;
    }

    .game-screen-shell{
        grid-template-rows:78px minmax(0,1fr)!important;
        gap:6px!important;
    }

    /* Compact game title / scores / tiles-left block */
    .game-screen .gamehead-v071{
        height:78px!important;
        min-height:78px!important;
        display:grid!important;
        grid-template-rows:22px 42px 12px!important;
        gap:1px!important;
        margin:0!important;
        align-content:start!important;
    }

    .game-screen .game-title-row{
        height:22px!important;
        display:flex!important;
        align-items:center!important;
        gap:8px!important;
    }

    .game-screen .game-title-row .eyebrow{
        margin:0!important;
        font-size:.52rem!important;
    }

    .game-screen .game-title-row h1{
        margin:0!important;
        font-size:1.14rem!important;
        line-height:1!important;
    }

    .game-screen .scores-row{
        height:42px!important;
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:6px!important;
        align-items:stretch!important;
    }

    .game-screen .scores-row .score{
        height:42px!important;
        min-height:42px!important;
        padding:4px 7px!important;
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        grid-template-rows:auto 1fr!important;
    }

    .game-screen .scores-row .score small{
        font-size:.43rem!important;
        line-height:1!important;
    }

    .game-screen .scores-row .score b{
        font-size:.68rem!important;
    }

    .game-screen .scores-row .score strong{
        font-size:.9rem!important;
    }

    .game-screen .tiles-left-row{
        height:12px!important;
        padding:0!important;
        margin:0!important;
        display:flex!important;
        align-items:flex-end!important;
    }

    .game-screen .tiles-left-row .tiles-left{
        display:flex!important;
        align-items:center!important;
        gap:5px!important;
        padding:0!important;
        margin:0!important;
        background:transparent!important;
        color:inherit!important;
        min-width:0!important;
        width:auto!important;
        height:auto!important;
    }

    .game-screen .tiles-left-row .tiles-left small{
        font-size:.45rem!important;
        line-height:1!important;
    }

    .game-screen .tiles-left-row .tiles-left strong{
        font-size:.72rem!important;
        line-height:1!important;
    }

    /* Recover board size/vertical position */
    .game-screen .board-stage .board{
        width:min(calc(100vh - 226px),650px,calc(100vw - 430px))!important;
    }

    .game-screen .board-stage .bonus-legend{
        width:min(calc(100vh - 226px),650px,calc(100vw - 430px))!important;
    }

    .game-screen .game-sidebar{
        height:min(calc(100vh - 198px),680px)!important;
    }

    /* Real two-row dock */
    .game-screen .player-rack-dock-v072{
        height:104px!important;
        min-height:104px!important;
        padding:6px 0 7px!important;
    }

    .game-screen .player-rack-dock-v072 .dock-inner{
        width:min(var(--ww-shell),94vw)!important;
        height:88px!important;
        display:grid!important;
        grid-template-rows:50px 32px!important;
        gap:6px!important;
        align-items:center!important;
    }

    .game-screen .player-rack-dock-v072 .dock-row{
        display:grid!important;
        width:100%!important;
        min-width:0!important;
        align-items:center!important;
    }

    .game-screen .player-rack-dock-v072 .dock-row-rack{
        grid-template-columns:78px minmax(0,1fr) 132px!important;
        gap:10px!important;
    }

    .game-screen .player-rack-dock-v072 .dock-row-controls{
        grid-template-columns:minmax(0,1fr) 220px!important;
        gap:10px!important;
    }

    .game-screen .player-rack-dock-v072 .dock-title{
        grid-column:auto!important;
    }

    .game-screen .player-rack-dock-v072 .dock-rack{
        grid-column:auto!important;
        width:auto!important;
        min-width:0!important;
        max-width:none!important;
        height:50px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:6px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
        margin:0!important;
    }

    .game-screen .player-rack-dock-v072 .dock-rack .racktile{
        flex:0 0 42px!important;
        width:42px!important;
        min-width:42px!important;
        max-width:42px!important;
        height:48px!important;
    }

    .game-screen .player-rack-dock-v072 .score-preview-fixed{
        grid-column:auto!important;
        width:132px!important;
        min-width:132px!important;
        max-width:132px!important;
        height:48px!important;
        margin:0!important;
        display:grid!important;
        opacity:1!important;
        visibility:visible!important;
    }

    .game-screen .player-rack-dock-v072 .dock-actions{
        grid-column:auto!important;
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        gap:4px!important;
        flex-wrap:nowrap!important;
        overflow:visible!important;
    }

    .game-screen .player-rack-dock-v072 .dock-actions form{
        display:flex!important;
        margin:0!important;
    }

    .game-screen .player-rack-dock-v072 .dock-actions .button{
        padding:6px 10px!important;
        margin:0 3px 0 0!important;
        font-size:.7rem!important;
    }

    .game-screen .player-rack-dock-v072 .dock-status{
        grid-column:auto!important;
        width:220px!important;
        min-width:220px!important;
        max-width:220px!important;
        height:32px!important;
        min-height:32px!important;
        max-height:32px!important;
        margin:0!important;
        padding:5px 8px!important;
        font-size:.65rem!important;
        overflow:hidden!important;
    }
}


/* =====================================================================
   WordWarren v0.8.0 — agreed desktop composition
   Left play column: title / scores / board / rack all exactly same width.
   Right column: Tiles Left / Current Turn / Move History.
   ===================================================================== */

.ww-game-v080{
    --ww-play-width:min(680px,calc(100vh - 310px),calc(100vw - 370px));
}

@media(min-width:1100px){
    /* v0.8 uses a normal in-flow game stage: disable older fixed-game geometry. */
    html:has(body.game-screen),
    body.game-screen{
        height:auto!important;
        min-height:100%!important;
        overflow:auto!important;
    }

    .game-screen .game-main{
        width:min(1080px,calc(100vw - 40px))!important;
        height:auto!important;
        min-height:0!important;
        overflow:visible!important;
        padding:12px 0 20px!important;
    }

    .game-screen footer{
        display:none!important;
    }

    .ww-game-v080{
        width:calc(var(--ww-play-width) + var(--ww-side-width) + var(--ww-stage-gap));
        max-width:100%;
        display:grid;
        grid-template-columns:var(--ww-play-width) var(--ww-side-width);
        gap:var(--ww-stage-gap);
        align-items:start;
        justify-content:start;
        margin:0!important;
    }

    /* LEFT COLUMN: every principal element uses identical width. */
    .ww-play-column{
        width:var(--ww-play-width);
        min-width:0;
        display:flex;
        flex-direction:column;
        align-items:stretch;
    }

    .ww-game-title{
        width:100%;
        min-height:38px;
        display:flex;
        align-items:baseline;
        justify-content:center;
        gap:9px;
        padding:1px 0 7px;
        box-sizing:border-box;
        text-align:center;
    }

    .ww-game-title h1{
        margin:0!important;
        max-width:72%;
        font-size:1.28rem!important;
        line-height:1.1!important;
        letter-spacing:-.025em;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .ww-game-title span{
        flex:0 0 auto;
        font-size:.66rem;
        font-weight:800;
        text-transform:uppercase;
        letter-spacing:.06em;
        color:var(--muted);
        white-space:nowrap;
    }

    .ww-score-row{
        width:100%;
        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:6px;
        margin:0 0 8px;
    }

    .ww-score-card{
        min-width:0;
        height:46px;
        box-sizing:border-box;
        display:grid;
        grid-template-rows:auto 1fr;
        gap:2px;
        padding:5px 7px;
        border:1px solid #ddd6ca;
        border-radius:8px;
        background:#ece8df;
        overflow:hidden;
    }

    .ww-score-card.active{
        border:2px solid var(--ww-orange,#e56d3f);
        padding:4px 6px;
        background:#f5f0e7;
    }

    .ww-score-card small{
        min-width:0;
        font-size:.44rem;
        line-height:1;
        color:var(--muted);
        text-transform:uppercase;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .ww-score-main{
        min-width:0;
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        gap:5px;
        align-items:end;
    }

    .ww-score-main b{
        min-width:0;
        font-size:.72rem;
        line-height:1;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .ww-score-main strong{
        font-size:1rem;
        line-height:1;
    }

    .ww-board-wrap,
    .ww-board-v080,
    .ww-bonus-legend,
    .ww-rack-panel{
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box!important;
    }

    .ww-board-v080{
        margin:0!important;
        gap:2px!important;
        box-shadow:0 9px 24px rgba(23,55,47,.12)!important;
    }

    .ww-bonus-legend{
        margin:6px 0 7px!important;
        min-height:24px!important;
        display:flex!important;
        justify-content:flex-start!important;
        gap:11px!important;
        font-size:.62rem!important;
    }

    /* Rack panel is exactly board width and contains both rows. */
    .ww-rack-panel{
        position:static!important;
        inset:auto!important;
        transform:none!important;
        height:auto!important;
        min-height:0!important;
        margin:0!important;
        padding:0!important;
        border:1px solid #d9d2c4;
        border-radius:9px;
        background:#fffdf8;
        overflow:hidden;
        box-shadow:0 4px 14px rgba(0,0,0,.035);
    }

    .ww-rack-row{
        width:100%;
        min-height:62px;
        box-sizing:border-box;
        display:grid;
        grid-template-columns:82px minmax(0,1fr) 118px;
        gap:8px;
        align-items:center;
        padding:7px 10px;
        border-bottom:1px solid #e6dfd4;
    }

    .ww-rack-title{
        min-width:0;
        color:#17372f!important;
    }

    .ww-rack-title small{
        display:block;
        margin-bottom:3px;
        font-size:.48rem;
        letter-spacing:.09em;
        color:#37685a!important;
    }

    .ww-rack-title b{
        display:block;
        max-width:100%;
        font-size:.72rem;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        color:#17212b!important;
    }

    .ww-rack{
        width:auto!important;
        min-width:0!important;
        max-width:none!important;
        height:48px!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:5px!important;
        overflow:visible!important;
        flex-wrap:nowrap!important;
    }

    .ww-rack .racktile{
        flex:0 0 40px!important;
        width:40px!important;
        min-width:40px!important;
        max-width:40px!important;
        height:46px!important;
        border-radius:7px!important;
    }

    .ww-estimate{
        position:static!important;
        width:118px!important;
        min-width:118px!important;
        max-width:118px!important;
        height:48px!important;
        margin:0!important;
        box-sizing:border-box!important;
        opacity:1!important;
        visibility:visible!important;
        display:grid!important;
        border:0!important;
        border-left:1px solid #e6dfd4!important;
        border-radius:0!important;
        background:transparent!important;
        color:#17372f!important;
    }

    .ww-estimate *,
    .ww-estimate strong,
    .ww-estimate .score-preview-label,
    .ww-estimate .score-preview-points{
        color:#17372f!important;
        opacity:1!important;
    }

    .ww-control-row{
        width:100%;
        min-height:46px;
        box-sizing:border-box;
        display:grid;
        grid-template-columns:minmax(0,1fr) minmax(150px,220px);
        gap:8px;
        align-items:center;
        padding:6px 10px;
    }

    .ww-actions{
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        gap:4px!important;
        flex-wrap:nowrap!important;
        overflow:visible!important;
    }

    .ww-actions form{
        display:flex!important;
        align-items:center!important;
        margin:0!important;
    }

    .ww-actions .button{
        margin:0 3px 0 0!important;
        padding:7px 10px!important;
        font-size:.7rem!important;
        line-height:1.1!important;
        white-space:nowrap!important;
        border-radius:6px!important;
    }

    .ww-status{
        width:auto!important;
        min-width:0!important;
        max-width:none!important;
        min-height:32px!important;
        max-height:38px!important;
        margin:0!important;
        padding:5px 8px!important;
        font-size:.65rem!important;
        line-height:1.2!important;
        border-radius:6px!important;
        overflow:hidden!important;
    }

    /* RIGHT SIDEBAR */
    .ww-side-column{
        width:var(--ww-side-width);
        min-width:0;
        display:grid;
        grid-template-rows:70px auto minmax(250px,1fr);
        gap:10px;
        align-self:stretch;
    }

    .ww-side-column .card{
        margin:0!important;
        border:1px solid #d9d2c4!important;
        border-radius:10px!important;
        padding:12px 13px!important;
        box-shadow:0 4px 14px rgba(0,0,0,.035)!important;
        background:#fffdf8!important;
    }

    .ww-tiles-left-card{
        display:grid!important;
        grid-template-columns:1fr auto!important;
        grid-template-rows:auto auto!important;
        align-content:center!important;
        padding:10px 14px!important;
    }

    .ww-tiles-left-card small{
        grid-column:1/3;
        font-size:.54rem;
        font-weight:850;
        letter-spacing:.09em;
        color:#37685a;
    }

    .ww-tiles-left-card strong{
        grid-column:1/3;
        margin-top:2px;
        font-size:1.55rem;
        line-height:1;
        color:#17212b;
    }

    .ww-current-card h2,
    .ww-history-card h2{
        margin:0 0 7px!important;
        font-size:.98rem!important;
    }

    .ww-current-card p{
        margin:.3rem 0!important;
        font-size:.73rem!important;
    }

    .ww-history-card{
        min-height:0!important;
        display:flex!important;
        flex-direction:column!important;
        overflow:hidden!important;
    }

    .ww-history-card .move-history-scroll{
        min-height:0!important;
        flex:1 1 auto!important;
        overflow-y:auto!important;
        padding-right:4px!important;
        scrollbar-width:thin;
    }

    .ww-history-card .statrow{
        padding:6px 0!important;
        font-size:.72rem!important;
    }
}

/* Smaller desktop/laptop: preserve relationships, allow page scrolling. */
@media(min-width:1100px) and (max-height:760px){
    .ww-game-v080{
        --ww-play-width:min(610px,calc(100vw - 370px));
    }
}

/* Tablet/mobile: one column, board and controls remain touch friendly. */
@media(max-width:1099px){
    .ww-game-v080{
        width:100%;
        display:flex;
        flex-direction:column;
        gap:12px;
    }

    .ww-play-column,
    .ww-board-wrap,
    .ww-board-v080,
    .ww-bonus-legend,
    .ww-rack-panel{
        width:100%!important;
        max-width:100%!important;
    }

    .ww-game-title{
        text-align:center;
        margin-bottom:8px;
    }

    .ww-score-row{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:6px;
        margin-bottom:10px;
    }

    .ww-score-card{
        min-width:0;
        padding:7px;
        border:1px solid #ddd6ca;
        border-radius:8px;
        background:#ece8df;
    }

    .ww-score-main{
        display:flex;
        justify-content:space-between;
        gap:6px;
    }

    .ww-rack-panel{
        position:static!important;
        padding:8px!important;
        background:#172630!important;
        border-radius:8px;
    }

    .ww-rack-row,
    .ww-control-row{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
        align-items:center;
    }

    .ww-rack{
        overflow-x:auto!important;
        flex:1 1 100%;
    }

    .ww-side-column{
        display:flex;
        flex-direction:column;
        gap:10px;
    }
}

.game-name-field{
    display:block;
    margin-bottom:16px;
}
.game-name-field input{
    margin-top:5px;
    width:100%;
}


/* =====================================================================
   WordWarren v0.10.0 — accounts / alpha tester UI
   ===================================================================== */
.main-nav{
    display:flex;
    align-items:center;
    gap:16px;
}
.nav-form{
    display:inline-flex;
    margin:0;
}
.nav-link-button{
    appearance:none;
    border:0;
    background:transparent;
    color:inherit;
    font:inherit;
    cursor:pointer;
    padding:0;
}
.nav-link-button:hover{
    text-decoration:underline;
}

.auth-shell{
    max-width:520px;
    margin:24px auto 48px;
}
.auth-card{
    padding:24px!important;
}
.auth-card h1{
    margin-top:5px;
}
.auth-card .button{
    margin-top:6px;
}

.account-badge{
    min-width:70px;
    padding:8px 12px;
    border-radius:999px;
    text-align:center;
    font-weight:850;
    text-transform:uppercase;
    font-size:.72rem;
}
.account-badge.free{
    background:#e8e3d8;
    color:#283a34;
}
.account-badge.pro{
    background:#17372f;
    color:#f0d38f;
}

.danger-card{
    border-color:#e2b6b0!important;
}
.rowlink form,
.statrow form{
    margin:0;
}
.rowlink .button,
.statrow .button{
    flex:0 0 auto;
}

@media(max-width:760px){
    .main-nav{
        gap:10px;
        flex-wrap:wrap;
        justify-content:flex-end;
    }
    .main-nav a,
    .nav-link-button{
        font-size:.78rem;
    }
}


/* =====================================================================
   WordWarren v0.10.3 — alpha game-screen tidy
   ===================================================================== */
@media(min-width:1100px){
    /* Use more of the browser width and align the game stage further left. */
    .game-screen .game-main{
        width:min(1180px,calc(100vw - 28px))!important;
        margin-left:auto!important;
        margin-right:auto!important;
        padding-top:7px!important;
        padding-bottom:10px!important;
    }

    .ww-game-v080{
        --ww-play-width:min(680px,calc(100vh - 300px),calc(100vw - 340px));
        --ww-side-width:260px;
        --ww-stage-gap:12px;

        width:calc(var(--ww-play-width) + var(--ww-side-width) + var(--ww-stage-gap))!important;
        margin-left:0!important;
        margin-right:auto!important;
        gap:var(--ww-stage-gap)!important;
        align-items:start!important;
    }

    /* The complete left-side composition shares exactly the board width. */
    .ww-play-column,
    .ww-game-title,
    .ww-score-row,
    .ww-board-wrap,
    .ww-board-v080,
    .ww-bonus-legend,
    .ww-rack-panel{
        width:var(--ww-play-width)!important;
        max-width:var(--ww-play-width)!important;
        box-sizing:border-box!important;
    }

    .ww-game-title{
        min-height:31px!important;
        padding:0 0 5px!important;
        gap:8px!important;
    }

    .ww-game-title h1{
        font-size:1.18rem!important;
    }

    .ww-game-title span{
        font-size:.58rem!important;
    }

    .ww-score-row{
        height:43px!important;
        margin-bottom:6px!important;
        gap:5px!important;
    }

    .ww-score-card{
        height:43px!important;
        padding:4px 6px!important;
    }

    .ww-score-card.active{
        padding:3px 5px!important;
    }

    .ww-board-v080{
        margin:0!important;
    }

    .ww-bonus-legend{
        min-height:20px!important;
        height:20px!important;
        margin:4px 0 4px!important;
        gap:9px!important;
        line-height:1!important;
    }

    .ww-rack-panel{
        margin:0!important;
        overflow:visible!important;
    }

    .ww-rack-row{
        min-height:58px!important;
        height:58px!important;
        grid-template-columns:78px minmax(0,1fr) 116px!important;
        padding:5px 8px!important;
        gap:7px!important;
    }

    .ww-rack{
        height:46px!important;
        gap:5px!important;
    }

    .ww-rack .racktile{
        width:40px!important;
        min-width:40px!important;
        max-width:40px!important;
        height:44px!important;
        flex-basis:40px!important;
    }

    .ww-estimate{
        width:116px!important;
        min-width:116px!important;
        max-width:116px!important;
        height:46px!important;
    }

    /* Controls now use the full board width because status moved to sidebar. */
    .ww-control-row{
        min-height:43px!important;
        height:43px!important;
        display:block!important;
        padding:5px 8px!important;
    }

    .ww-actions{
        width:100%!important;
        min-width:0!important;
        height:33px!important;
        justify-content:flex-start!important;
        overflow:visible!important;
    }

    .ww-actions form{
        height:33px!important;
    }

    .ww-actions .button{
        min-height:31px!important;
        padding:6px 11px!important;
        font-size:.69rem!important;
    }

    .ww-actions .dock-waiting{
        display:flex!important;
        align-items:center!important;
        height:31px!important;
        color:var(--muted)!important;
        font-size:.69rem!important;
    }

    /* Right-side information hierarchy */
    .ww-side-column{
        width:var(--ww-side-width)!important;
        display:grid!important;
        grid-template-rows:66px auto 52px minmax(250px,1fr)!important;
        gap:8px!important;
        align-self:stretch!important;
    }

    .ww-side-column .card{
        padding:10px 12px!important;
    }

    .ww-tiles-left-card{
        min-height:66px!important;
    }

    .ww-current-card{
        min-height:0!important;
    }

    .ww-current-card h2,
    .ww-history-card h2{
        margin-bottom:5px!important;
    }

    .ww-current-card p{
        margin:.22rem 0!important;
    }

    .ww-current-card .ai-thinking{
        margin-top:5px!important;
    }

    /* Latest game message belongs to Current Turn, not the rack. */
    .ww-turn-status{
        width:100%;
        min-width:0;
        height:52px;
        min-height:52px;
        max-height:52px;
        box-sizing:border-box;
        display:flex;
        align-items:center;
        padding:8px 10px;
        border:1px solid #d8d2c7;
        border-radius:9px;
        font-size:.68rem;
        line-height:1.25;
        font-weight:650;
        overflow:hidden;
        background:#f3f0e8;
        color:#26332f;
    }

    .ww-turn-status.ok{
        background:#dcefe4;
        border-color:#b8dbc6;
        color:#174a2f;
    }

    .ww-turn-status.err{
        background:#f5dedb;
        border-color:#e6bbb5;
        color:#7b2820;
    }

    .ww-turn-status.warn{
        background:#f5ead0;
        border-color:#e5ce96;
        color:#6c4d12;
    }

    .ww-turn-status.idle{
        background:#f2eee5;
        color:#42534d;
    }

    .ww-history-card{
        min-height:0!important;
        height:100%!important;
    }
}

/* At the browser height shown during alpha testing, preserve the whole rack/control block. */
@media(min-width:1100px) and (max-height:900px){
    .ww-game-v080{
        --ww-play-width:min(650px,calc(100vh - 275px),calc(100vw - 340px));
    }

    .game-screen .game-main{
        padding-top:6px!important;
    }

    .ww-game-title{
        min-height:29px!important;
    }

    .ww-score-row{
        margin-bottom:5px!important;
    }

    .ww-bonus-legend{
        margin:3px 0!important;
    }
}

/* Mobile/tablet status follows Current Turn naturally. */
@media(max-width:1099px){
    .ww-turn-status{
        min-height:46px;
        padding:9px 11px;
        border-radius:8px;
        border:1px solid #d8d2c7;
        background:#f2eee5;
        font-size:.76rem;
    }
    .ww-turn-status.ok{background:#dcefe4;border-color:#b8dbc6;color:#174a2f}
    .ww-turn-status.err{background:#f5dedb;border-color:#e6bbb5;color:#7b2820}
    .ww-turn-status.warn{background:#f5ead0;border-color:#e5ce96;color:#6c4d12}
}


/* =====================================================================
   WordWarren v0.11.0 — navigation, compact game creation, mobile UX
   ===================================================================== */

.site-footer{
    display:flex;
    justify-content:space-between;
    gap:16px;
    padding-top:16px;
    padding-bottom:24px;
    font-size:.72rem;
    color:var(--muted);
}

.desktop-nav{
    display:flex;
    align-items:center;
    gap:14px;
}

.nav-dropdown{
    position:relative;
}
.nav-dropdown > summary{
    list-style:none;
    cursor:pointer;
    user-select:none;
}
.nav-dropdown > summary::-webkit-details-marker{display:none}
.nav-dropdown-menu{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    z-index:2000;
    min-width:170px;
    display:grid;
    gap:2px;
    padding:7px;
    border:1px solid #33444d;
    border-radius:9px;
    background:#15252e;
    box-shadow:0 12px 30px rgba(0,0,0,.22);
}
.nav-dropdown-menu a,
.nav-dropdown-menu button{
    width:100%;
    box-sizing:border-box;
    display:block;
    border:0;
    border-radius:6px;
    padding:8px 10px;
    background:transparent;
    color:#fff;
    text-align:left;
    font:inherit;
    cursor:pointer;
    text-decoration:none;
}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu button:hover{
    background:rgba(255,255,255,.08);
}
.nav-dropdown-menu form{margin:0}

.mobile-menu{display:none}

/* My Games / statistics */
.page-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
}
.compact-head{
    margin-bottom:12px;
}
.compact-head h1{
    margin:.1rem 0 0;
}
.compact-card{
    margin-bottom:12px;
}
.game-switch-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(110px,auto) 55px;
    gap:12px;
    align-items:center;
    padding:10px 0;
    border-bottom:1px solid #e7e0d5;
    color:inherit;
    text-decoration:none;
}
.game-switch-row:last-child{border-bottom:0}
.game-switch-row:hover .game-switch-main b{text-decoration:underline}
.game-switch-main{
    min-width:0;
    display:grid;
}
.game-switch-main b,
.game-switch-main small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.game-switch-main small,
.game-switch-state{
    color:var(--muted);
    font-size:.73rem;
}
.game-switch-state strong{color:#b74f2b}
.game-switch-score{
    text-align:right;
    font-weight:900;
}
.stats-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:14px;
}
.stats-grid .metric{
    padding:13px;
}
.stats-grid .metric strong{
    font-size:1.55rem;
}
.account-shortcuts{
    display:flex;
    gap:8px;
    margin-bottom:14px;
    flex-wrap:wrap;
}

/* Invitations */
.ww-invite-card h2{margin-bottom:7px!important}
.invite-copy-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:6px;
    align-items:center;
}
.invite-copy-row input{
    min-width:0;
    width:100%;
    padding:7px 8px;
    border:1px solid #d6cec2;
    border-radius:6px;
    font-size:.64rem;
    background:#fff;
}
.join-seat{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:10px 0;
    border-bottom:1px solid #e7e0d5;
}
.join-seat span{display:grid}
.join-seat small{color:var(--muted)}

/* Compact New Game */
.new-game-shell{
    max-width:900px;
    margin:0 auto;
}
.compact-game-form{
    padding:16px!important;
}
.new-game-primary{
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(180px,.8fr) 120px;
    gap:10px;
    align-items:end;
}
.new-game-primary label,
.playerline-compact select,
.playerline-compact input{
    min-width:0;
}
.new-game-section-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:13px;
    margin-bottom:6px;
}
.new-game-section-head h2{
    margin:0!important;
    font-size:1.05rem!important;
}
.invite-toggle{
    display:flex!important;
    align-items:center;
    gap:6px;
    font-size:.72rem;
    font-weight:700;
}
.players-compact{
    display:grid;
    gap:5px;
}
.playerline-compact{
    display:grid!important;
    grid-template-columns:24px minmax(130px,1.25fr) minmax(92px,.75fr) minmax(92px,.7fr) minmax(130px,1fr)!important;
    gap:5px!important;
    align-items:center;
}
.playerline-compact .seat-label{
    display:grid;
    place-items:center;
    width:24px;
    height:30px;
    border-radius:6px;
    background:#efe9dd;
    font-size:.68rem;
    font-weight:900;
}
.playerline-compact input,
.playerline-compact select{
    height:34px;
    padding:5px 7px!important;
    font-size:.76rem!important;
}
.compact-hint{
    margin:5px 0 9px!important;
}
.advanced-game-options{
    margin-top:8px;
    border-top:1px solid #e7e0d5;
    padding-top:8px;
}
.advanced-game-options > summary{
    cursor:pointer;
    font-weight:850;
    font-size:.82rem;
}
.advanced-game-grid{
    margin-top:10px;
    gap:9px!important;
}
.dictionary-compact{
    margin-top:10px;
}
.dictionary-compact h3{
    margin:0 0 6px;
    font-size:.88rem;
}
.new-game-submit{
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}

/* Sidebar with optional invite card should flex rather than depend on fixed row count. */
@media(min-width:1100px){
    .ww-side-column{
        display:flex!important;
        flex-direction:column!important;
        gap:8px!important;
        align-self:stretch!important;
    }
    .ww-tiles-left-card{flex:0 0 66px!important}
    .ww-current-card{flex:0 0 auto!important}
    .ww-turn-status{flex:0 0 52px!important}
    .ww-invite-card{flex:0 0 auto!important}
    .ww-history-card{
        flex:1 1 260px!important;
        min-height:220px!important;
    }
}

/* Proper phone layout: reorders the existing desktop regions into a mobile flow. */
@media(max-width:760px){
    body{
        overflow-x:hidden;
    }

    header .nav{
        min-height:52px;
        padding:6px 10px!important;
    }
    .brand-mark{
        width:34px!important;
        height:34px!important;
    }
    .brand-copy strong{
        font-size:1rem!important;
    }
    .brand-copy small{
        font-size:.43rem!important;
    }
    .desktop-nav{display:none!important}
    .mobile-menu{
        display:block;
        position:relative;
        margin-left:auto;
    }
    .mobile-menu > summary{
        list-style:none;
        cursor:pointer;
        padding:7px 9px;
        border:1px solid rgba(255,255,255,.25);
        border-radius:6px;
        color:#fff;
        font-size:.78rem;
    }
    .mobile-menu > summary::-webkit-details-marker{display:none}
    .mobile-menu-panel{
        position:absolute;
        right:0;
        top:calc(100% + 7px);
        z-index:3000;
        width:190px;
        display:grid;
        padding:7px;
        border-radius:9px;
        background:#15252e;
        box-shadow:0 14px 32px rgba(0,0,0,.25);
    }
    .mobile-menu-panel a,
    .mobile-menu-panel button{
        display:block;
        width:100%;
        box-sizing:border-box;
        border:0;
        border-radius:6px;
        padding:9px 10px;
        background:transparent;
        color:white;
        font:inherit;
        text-align:left;
        text-decoration:none;
    }
    .mobile-menu-panel form{margin:0}

    .status-reserve{
        min-height:0!important;
        margin-top:5px!important;
        margin-bottom:5px!important;
    }

    .game-screen .game-main,
    main.game-main{
        width:auto!important;
        max-width:none!important;
        margin:0!important;
        padding:7px 8px 14px!important;
    }

    .ww-game-v080{
        width:100%!important;
        max-width:100%!important;
        display:flex!important;
        flex-direction:column!important;
        gap:7px!important;
    }

    /* display:contents allows the right-column cards to join the mobile order */
    .ww-play-column,
    .ww-side-column{
        display:contents!important;
    }

    .ww-game-title{order:1!important}
    .ww-score-row{order:2!important}
    .ww-tiles-left-card{order:3!important}
    .ww-current-card{order:4!important}
    .ww-turn-status{order:5!important}
    .ww-invite-card{order:6!important}
    .ww-board-wrap{order:7!important}
    .ww-rack-panel{order:8!important}
    .ww-history-card{order:9!important}
    .final-results{order:10!important}

    .ww-game-title{
        width:100%!important;
        max-width:100%!important;
        min-height:28px!important;
        padding:0 2px 3px!important;
        display:flex!important;
        justify-content:center!important;
        gap:6px!important;
        align-items:baseline!important;
    }
    .ww-game-title h1{
        max-width:64%!important;
        font-size:1rem!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }
    .ww-game-title span{
        font-size:.49rem!important;
        white-space:nowrap!important;
    }

    .ww-score-row{
        width:100%!important;
        max-width:100%!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:4px!important;
        margin:0!important;
    }
    .ww-score-card{
        height:42px!important;
        min-width:0!important;
        padding:4px 6px!important;
    }

    .ww-tiles-left-card,
    .ww-current-card,
    .ww-invite-card,
    .ww-history-card{
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box!important;
        margin:0!important;
        padding:9px 10px!important;
    }
    .ww-tiles-left-card{
        min-height:48px!important;
        height:auto!important;
        display:flex!important;
        justify-content:space-between!important;
        align-items:center!important;
    }
    .ww-tiles-left-card small,
    .ww-tiles-left-card strong{
        grid-column:auto!important;
        margin:0!important;
    }
    .ww-tiles-left-card strong{font-size:1.2rem!important}
    .ww-current-card h2,
    .ww-history-card h2{
        font-size:.9rem!important;
    }

    .ww-turn-status{
        width:100%!important;
        min-height:42px!important;
        height:auto!important;
        max-height:none!important;
        box-sizing:border-box!important;
        order:5!important;
    }

    .ww-board-wrap,
    .ww-board-v080,
    .ww-bonus-legend{
        width:100%!important;
        max-width:100%!important;
    }
    .ww-board-v080{
        aspect-ratio:1!important;
        gap:1px!important;
    }
    .ww-board-v080 .sq{
        border-width:1px!important;
        min-width:0!important;
    }
    .ww-board-v080 .bonus-label{
        font-size:clamp(.32rem,1.6vw,.52rem)!important;
    }
    .ww-board-v080 .tile-letter{
        font-size:clamp(.48rem,3vw,.92rem)!important;
    }
    .ww-bonus-legend{
        min-height:0!important;
        height:auto!important;
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:4px 8px!important;
        margin:4px 0!important;
        font-size:.58rem!important;
    }

    .ww-rack-panel{
        position:static!important;
        width:100%!important;
        max-width:100%!important;
        margin:0!important;
        padding:7px!important;
        border-radius:8px!important;
        background:#fffdf8!important;
    }
    .ww-rack-row{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) 92px!important;
        grid-template-areas:
          "title estimate"
          "rack rack"!important;
        gap:5px 7px!important;
        height:auto!important;
        min-height:0!important;
        padding:0 0 7px!important;
    }
    .ww-rack-title{
        grid-area:title!important;
        align-self:center!important;
    }
    .ww-estimate{
        grid-area:estimate!important;
        width:92px!important;
        min-width:92px!important;
        max-width:92px!important;
        height:38px!important;
        border:1px solid #e4dccc!important;
        border-radius:6px!important;
    }
    .ww-rack{
        grid-area:rack!important;
        width:100%!important;
        display:grid!important;
        grid-template-columns:repeat(7,minmax(0,1fr))!important;
        gap:4px!important;
        overflow:visible!important;
        height:auto!important;
    }
    .ww-rack .racktile{
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
        height:auto!important;
        aspect-ratio:.9!important;
        font-size:clamp(.72rem,4.5vw,1rem)!important;
    }

    .ww-control-row{
        display:block!important;
        height:auto!important;
        min-height:0!important;
        padding:7px 0 0!important;
    }
    .ww-actions{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:5px!important;
        height:auto!important;
    }
    .ww-actions form{
        display:contents!important;
        height:auto!important;
    }
    .ww-actions .button{
        width:100%!important;
        min-height:38px!important;
        margin:0!important;
        font-size:.72rem!important;
    }
    .ww-actions .dock-waiting{
        grid-column:1/3!important;
        height:auto!important;
        min-height:34px!important;
    }

    .ww-history-card{
        min-height:180px!important;
        max-height:320px!important;
        display:flex!important;
    }

    /* Compact creation form on phone */
    .new-game-shell{
        max-width:none!important;
    }
    .compact-game-form{
        padding:10px!important;
    }
    .new-game-primary{
        grid-template-columns:1fr 1fr!important;
        gap:7px!important;
    }
    .new-game-primary label:first-child{
        grid-column:1/3;
    }
    .new-game-section-head{
        align-items:flex-start!important;
        flex-direction:column!important;
        gap:5px!important;
    }
    .playerline-compact{
        grid-template-columns:22px minmax(0,1fr) 92px!important;
        gap:4px!important;
        padding:4px 0!important;
        border-bottom:1px solid #ece5da;
    }
    .playerline-compact select:nth-of-type(2),
    .playerline-compact select:nth-of-type(3){
        grid-column:2/4;
    }
    .advanced-game-grid{
        grid-template-columns:1fr!important;
    }
    .new-game-submit .button{
        width:100%;
    }

    .stats-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .game-switch-row{
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:6px!important;
    }
    .game-switch-state{
        grid-column:1/2;
    }
    .game-switch-score{
        grid-column:2/3;
        grid-row:1/3;
        align-self:center;
    }

    .site-footer{
        flex-direction:column;
        gap:4px;
        padding:12px 8px 18px!important;
        font-size:.65rem;
    }
}

@media(max-width:760px){
    .game-screen .site-footer{
        display:flex!important;
    }
}

/* WordWarren v0.12.0 pre-game lobby */
.lobby-shell{max-width:900px;margin:0 auto}
.lobby-state{padding:7px 10px;border-radius:999px;background:#f4ead3;color:#70501b;font-size:.72rem;font-weight:850;text-transform:uppercase}
.lobby-player-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #e7e0d5}
.lobby-player-row:last-child{border-bottom:0}
.lobby-player-row span{display:grid}
.lobby-player-row small{color:var(--muted)}
.lobby-player-row .ready{color:#23623f}
.lobby-player-row .waiting{color:#9a6818}
.lobby-start{margin-top:12px}
.lobby-refresh{text-align:center;color:var(--muted);font-size:.72rem}
@media(max-width:760px){
 .lobby-grid{grid-template-columns:1fr!important}
 .lobby-shell .page-head{align-items:flex-start;flex-direction:column}
}


/* v0.12.0 contextual New Game player controls */
.playerline-compact .ai-level-select:disabled{
    opacity:.45;
    background:#eeeae2;
    color:#817a70;
    cursor:not-allowed;
}
.playerline-compact.human-player-row .ai-level-select{
    border-color:#ddd6ca;
}
.playerline-compact.computer-player-row .ai-level-select{
    opacity:1;
}
.playerline-compact.unused-player-row{
    opacity:.55;
}


/* v0.12.1 automatic Human multiplayer mode */
.multiplayer-mode-hint{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:4px 8px;
    border-radius:999px;
    background:#ece8df;
    color:#4f5c57;
    font-size:.68rem;
    font-weight:750;
    white-space:nowrap;
}
.multiplayer-mode-hint.online{
    background:#e5efe9;
    color:#24583d;
}
@media(max-width:760px){
    .multiplayer-mode-hint{
        white-space:normal;
    }
}


/* =====================================================================
   WordWarren v0.13.0 — game lifecycle, results, statistics
   ===================================================================== */
.ww-score-card.inactive-player{
    opacity:.58;
}
.turn-timeout-note{
    margin:.3rem 0!important;
    padding:5px 7px;
    border-radius:6px;
    background:#f4ead3;
    color:#76551c;
    font-size:.66rem;
    font-weight:750;
}
.turn-timeout-note.overdue{
    background:#f4ddda;
    color:#7a2b23;
}
.ww-game-actions{
    display:grid;
    gap:7px;
}
.ww-game-actions h2{
    margin-bottom:2px!important;
}
.ww-game-actions form{
    margin:0;
}
.ww-game-actions .button{
    width:100%;
}
.danger-button{
    border-color:#d6a39d!important;
    color:#8a3329!important;
}
.game-list-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
    border-bottom:1px solid #e7e0d5;
}
.game-list-item:last-child{border-bottom:0}
.game-list-item .game-switch-row{
    border-bottom:0!important;
}
.game-list-item form{
    margin:0;
}
.mini-action{
    border:0;
    background:transparent;
    font:inherit;
    font-size:.68rem;
    font-weight:750;
    cursor:pointer;
    padding:6px 4px;
}
.danger-link{
    color:#8b3f35;
}
.opponent-table{
    display:grid;
}
.opponent-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) repeat(4,48px);
    gap:8px;
    align-items:center;
    min-height:42px;
    border-bottom:1px solid #e7e0d5;
}
.opponent-row:last-child{border-bottom:0}
.opponent-row > span:first-child{
    min-width:0;
    display:grid;
}
.opponent-row small{
    color:var(--muted);
    font-size:.68rem;
}
.opponent-row > strong,
.opponent-head > span:not(:first-child){
    text-align:center;
}
.opponent-head{
    min-height:28px;
    color:var(--muted);
    font-size:.66rem;
    font-weight:800;
    text-transform:uppercase;
}

@media(max-width:760px){
    .opponent-row{
        grid-template-columns:minmax(0,1fr) repeat(4,34px);
        gap:4px;
    }
    .game-list-item{
        grid-template-columns:minmax(0,1fr) auto;
    }
}

.result-badge{
    display:inline-block;
    margin-left:5px;
    padding:2px 5px;
    border-radius:999px;
    font-size:.52rem;
    font-weight:900;
    letter-spacing:.04em;
}
.result-badge.win{background:#dcefe4;color:#1d5a38}
.result-badge.draw{background:#eee8d8;color:#62531f}
.result-badge.loss{background:#f1dfdc;color:#7c3028}


/* v0.13.1 game-level language selector */
.new-game-primary .field-help{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:.64rem;
    font-weight:600;
}


/* =====================================================================
   WordWarren v0.14.0 — player identity + game chat
   ===================================================================== */
.ww-avatar{
    width:34px;
    height:34px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    background:#f2eee5;
    border:1px solid #d9d0c3;
    font-size:1.15rem;
    line-height:1;
    box-sizing:border-box;
}
.ww-avatar.tiny{
    width:22px;
    height:22px;
    font-size:.78rem;
}
.ww-avatar.small{
    width:28px;
    height:28px;
    font-size:.92rem;
}
.ww-avatar.large{
    width:54px;
    height:54px;
    font-size:1.8rem;
}
.account-title-with-avatar{
    display:flex;
    align-items:center;
    gap:10px;
}
.avatar-picker{
    border:0;
    padding:0;
    margin:0;
}
.avatar-picker legend{
    font-size:.72rem;
    font-weight:800;
    margin-bottom:6px;
}
.avatar-options{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}
.avatar-option{
    display:grid!important;
    place-items:center;
    gap:3px;
    min-height:72px;
    border:1px solid #d9d0c3;
    border-radius:8px;
    background:#faf8f3;
    cursor:pointer;
    padding:5px!important;
    position:relative;
    text-align:center;
}
.avatar-option input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.avatar-choice-face{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#f0eadf;
    font-size:1.35rem;
}
.avatar-option small{
    font-size:.58rem;
    line-height:1.1;
}
.avatar-option:has(input:checked){
    border-width:2px;
    border-color:#597368;
    background:#eef4f0;
}
.ww-score-player,
.game-current-player{
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-width:0;
}
.ww-score-player b{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.lobby-player-row{
    grid-template-columns:auto minmax(0,1fr) auto;
}
.opponent-identity{
    display:flex!important;
    flex-direction:row!important;
    align-items:center;
    gap:7px;
}
.opponent-identity > span:last-child{
    display:grid;
    min-width:0;
}

/* Game chat */
.ww-chat-card{
    flex:0 0 auto!important;
    min-height:0!important;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.ww-chat-heading{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:8px;
}
.ww-chat-heading h2{
    margin:0!important;
}
.ww-chat-heading small,
.ww-chat-limit{
    color:var(--muted);
    font-size:.58rem;
}
.ww-chat-messages{
    max-height:138px;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
    gap:7px;
    padding-right:3px;
    scrollbar-width:thin;
}
.ww-chat-message{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:6px;
    align-items:start;
}
.ww-chat-message.mine{
    background:#f6f2e9;
    border-radius:7px;
    padding:5px;
}
.ww-chat-meta{
    display:flex;
    justify-content:space-between;
    gap:7px;
    align-items:baseline;
}
.ww-chat-meta b{
    font-size:.68rem;
}
.ww-chat-meta time{
    color:var(--muted);
    font-size:.54rem;
    white-space:nowrap;
}
.ww-chat-message p{
    margin:2px 0 0!important;
    font-size:.67rem;
    line-height:1.28;
    overflow-wrap:anywhere;
}
.ww-chat-empty{
    margin:4px 0!important;
}
.ww-chat-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:5px;
    margin:0;
}
.ww-chat-form input{
    min-width:0;
    height:34px;
    padding:6px 8px;
    border:1px solid #d6cec2;
    border-radius:6px;
    font-size:.68rem;
}
.ww-chat-form .button{
    min-height:34px;
    padding:5px 10px;
}
.lobby-chat-wrap{
    margin-top:10px;
}
.lobby-chat-wrap .ww-chat-card{
    max-width:none;
}
.sr-only{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}

@media(min-width:1100px){
    .ww-chat-card{
        max-height:205px;
    }
    .ww-chat-messages{
        max-height:112px;
    }
}

@media(max-width:760px){
    .ww-chat-card{
        order:9!important;
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box!important;
        margin:0!important;
        padding:9px 10px!important;
    }
    .ww-history-card{order:10!important}
    .final-results{order:11!important}
    .ww-game-actions{order:12!important}
    .ww-chat-messages{
        max-height:220px;
    }
    .avatar-options{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* =====================================================================
   WordWarren v0.15.0 — alpha readiness / appearance / app-mobile shell
   ===================================================================== */

/* Appearance */
html[data-theme="dark"]{
    --ink:#e9eee9;
    --muted:#aab6b0;
    --paper:#111815;
    --card:#19231f;
    --line:#334139;
    --tile:#d6b978;
    color-scheme:dark;
}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink)}
html[data-theme="dark"] header{background:#0d1512}
html[data-theme="dark"] .card,
html[data-theme="dark"] .compact-game-form,
html[data-theme="dark"] .definition-card{
    background:var(--card);
    color:var(--ink);
    border-color:var(--line);
    box-shadow:0 8px 25px #0004;
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{
    background:#101914;
    color:var(--ink);
    border-color:#435248;
}
html[data-theme="dark"] .button.ghost,
html[data-theme="dark"] .checks label,
html[data-theme="dark"] .avatar-option,
html[data-theme="dark"] .ww-chat-message.mine,
html[data-theme="dark"] .ww-turn-status.idle{
    background:#26332d;
    color:var(--ink);
}
html[data-theme="dark"] .rowlink,
html[data-theme="dark"] .statrow,
html[data-theme="dark"] .opponent-row,
html[data-theme="dark"] .game-list-item{
    border-color:#334139;
}
html[data-theme="dark"] .metric{background:#24322c}
html[data-theme="dark"] .metric span{color:#b7c3bd}
html[data-theme="dark"] .warren-board .sq{
    background:#26322d;
    border-color:#46534c;
}
html[data-theme="dark"] .warren-board .sq.l2,
html[data-theme="dark"] .warren-board .sq.dl{background:#59745f}
html[data-theme="dark"] .warren-board .sq.l3,
html[data-theme="dark"] .warren-board .sq.tl{background:#35543e}
html[data-theme="dark"] .warren-board .sq.w2,
html[data-theme="dark"] .warren-board .sq.dw{background:#8a7040}
html[data-theme="dark"] .warren-board .sq.w3,
html[data-theme="dark"] .warren-board .sq.tw{background:#814d3c}
html[data-theme="dark"] .warren-board .sq.start{background:#b48d36;color:#fff8e5}
html[data-theme="dark"] .tile,
html[data-theme="dark"] .racktile{
    color:#241d13;
    background:#dfc486;
    border-color:#a4874d;
}
html[data-theme="dark"] .bonus-label{color:#eef3ef!important}
html[data-theme="dark"] .site-footer a,
html[data-theme="dark"] .prose-card a{color:#b9d4c7}
html[data-theme="dark"] .lobby-state,
html[data-theme="dark"] .multiplayer-mode-hint{background:#26332d;color:#dce7e1}
html[data-theme="dark"] .avatar-choice-face,
html[data-theme="dark"] .ww-avatar{background:#27342e;border-color:#46554c}
html[data-theme="dark"] .definition-modal{background:rgba(0,0,0,.76)}

.nav-appearance-label,
.mobile-appearance-label{
    display:grid;
    gap:4px;
    padding:8px 12px;
    font-size:.66rem;
    color:var(--muted);
}
.nav-appearance-label select,
.mobile-appearance-label select{
    padding:6px 7px;
    min-width:125px;
    font-size:.72rem;
}
.site-footer{
    display:flex;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
}
.site-footer a{color:inherit}

/* Alpha content */
.alpha-feature-note{
    border:1px solid #b78592;
    border-radius:9px;
    padding:9px 11px;
    margin:-2px 0 11px;
    background:#f5e9ec;
    color:#633b45;
    font-size:.72rem;
}
.alpha-feature-note b,
.alpha-feature-note span{display:block}
html[data-theme="dark"] .alpha-feature-note{
    background:#39252d;
    color:#f1dbe2;
    border-color:#76505b;
}
.dictionary-choice{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr);
    column-gap:7px!important;
}
.dictionary-choice small{
    grid-column:2;
    color:var(--muted);
    font-size:.6rem;
}
.theme-dirty-rabbits{
    --accent:#a54867;
}
.theme-dirty-rabbits .ww-game-title h1::after{
    content:" · 18+ Beta";
    font-size:.55em;
    font-weight:800;
    color:#a54867;
}
.surprise-label{
    width:76%;
    height:76%;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#e5b84d;
    color:#34270b!important;
    font-weight:950;
    font-size:clamp(.28rem,.65vw,.5rem)!important;
    box-shadow:0 1px 3px #0003;
}

/* Legal/help/about */
.info-page{max-width:860px;margin:0 auto}
.prose-card{line-height:1.55}
.prose-card h2{margin-top:1.4em;margin-bottom:.35em}
.prose-card h2:first-of-type{margin-top:.35em}
.prose-card p{color:var(--ink)}
.legal-date{font-size:.78rem;color:var(--muted)!important}
.about-version{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.about-mark{width:64px;height:64px}
.legal-check{
    display:flex!important;
    grid-template-columns:none!important;
    flex-direction:row!important;
    align-items:flex-start;
    gap:8px!important;
    font-weight:600!important;
}
.legal-check input{width:auto;margin-top:3px}

/* AI recovery */
.ai-recover-form{margin-top:3px!important}
.ai-recover-button{
    font-size:.62rem!important;
    padding:6px 8px!important;
    margin:0!important;
}

/* Mobile app-style game navigation */
.ww-mobile-tabs{display:none}

@media(max-width:760px){
    body.game-screen{
        min-height:100dvh;
    }
    body.game-screen header{
        position:sticky;
        top:0;
        z-index:120;
    }
    body.game-screen main.game-main{
        width:100%!important;
        max-width:none!important;
        padding:0 8px 16px!important;
    }
    body.game-screen .site-footer{
        display:none;
    }
    .ww-game-v080{
        position:relative;
        gap:7px!important;
    }
    .ww-mobile-tabs{
        display:grid!important;
        grid-auto-flow:column;
        grid-auto-columns:minmax(0,1fr);
        order:0!important;
        position:sticky;
        top:52px;
        z-index:110;
        width:calc(100% + 16px);
        margin-left:-8px;
        background:var(--paper);
        border-bottom:1px solid var(--line);
        padding:5px 8px;
        gap:4px;
    }
    .ww-mobile-tabs button{
        min-height:38px;
        border:0;
        border-radius:8px;
        background:transparent;
        color:var(--muted);
        font-weight:800;
        font-size:.68rem;
    }
    .ww-mobile-tabs button.active{
        background:var(--accent);
        color:white;
    }

    /* GAME: stable board/rack experience; secondary panels are out of flow. */
    .ww-game-v080.mobile-tab-game .ww-chat-card,
    .ww-game-v080.mobile-tab-game .ww-history-card,
    .ww-game-v080.mobile-tab-game .ww-invite-card,
    .ww-game-v080.mobile-tab-game .ww-game-actions{
        display:none!important;
    }

    /* CHAT */
    .ww-game-v080.mobile-tab-chat .ww-game-title,
    .ww-game-v080.mobile-tab-chat .ww-score-row,
    .ww-game-v080.mobile-tab-chat .ww-tiles-left-card,
    .ww-game-v080.mobile-tab-chat .ww-current-card,
    .ww-game-v080.mobile-tab-chat .ww-turn-status,
    .ww-game-v080.mobile-tab-chat .ww-invite-card,
    .ww-game-v080.mobile-tab-chat .ww-board-wrap,
    .ww-game-v080.mobile-tab-chat .ww-rack-panel,
    .ww-game-v080.mobile-tab-chat .ww-history-card,
    .ww-game-v080.mobile-tab-chat .final-results,
    .ww-game-v080.mobile-tab-chat .ww-game-actions{
        display:none!important;
    }
    .ww-game-v080.mobile-tab-chat .ww-chat-card{
        display:flex!important;
        order:1!important;
        min-height:calc(100dvh - 120px)!important;
        max-height:none!important;
    }
    .ww-game-v080.mobile-tab-chat .ww-chat-messages{
        flex:1 1 auto;
        max-height:none!important;
        min-height:240px;
    }
    .ww-game-v080.mobile-tab-chat .ww-chat-form{
        position:sticky;
        bottom:0;
        background:var(--card);
        padding-top:6px;
    }

    /* HISTORY */
    .ww-game-v080.mobile-tab-history .ww-game-title,
    .ww-game-v080.mobile-tab-history .ww-score-row,
    .ww-game-v080.mobile-tab-history .ww-tiles-left-card,
    .ww-game-v080.mobile-tab-history .ww-current-card,
    .ww-game-v080.mobile-tab-history .ww-turn-status,
    .ww-game-v080.mobile-tab-history .ww-invite-card,
    .ww-game-v080.mobile-tab-history .ww-board-wrap,
    .ww-game-v080.mobile-tab-history .ww-rack-panel,
    .ww-game-v080.mobile-tab-history .ww-chat-card,
    .ww-game-v080.mobile-tab-history .final-results,
    .ww-game-v080.mobile-tab-history .ww-game-actions{
        display:none!important;
    }
    .ww-game-v080.mobile-tab-history .ww-history-card{
        display:flex!important;
        order:1!important;
        min-height:calc(100dvh - 125px)!important;
        max-height:none!important;
    }
    .ww-game-v080.mobile-tab-history .move-history-scroll{
        flex:1 1 auto!important;
        max-height:none!important;
    }

    /* PLAYERS */
    .ww-game-v080.mobile-tab-players .ww-game-title,
    .ww-game-v080.mobile-tab-players .ww-tiles-left-card,
    .ww-game-v080.mobile-tab-players .ww-turn-status,
    .ww-game-v080.mobile-tab-players .ww-board-wrap,
    .ww-game-v080.mobile-tab-players .ww-rack-panel,
    .ww-game-v080.mobile-tab-players .ww-chat-card,
    .ww-game-v080.mobile-tab-players .ww-history-card{
        display:none!important;
    }
    .ww-game-v080.mobile-tab-players .ww-score-row{
        display:grid!important;
        order:1!important;
    }
    .ww-game-v080.mobile-tab-players .ww-current-card{
        display:block!important;
        order:2!important;
    }
    .ww-game-v080.mobile-tab-players .ww-invite-card{
        display:block!important;
        order:3!important;
    }
    .ww-game-v080.mobile-tab-players .final-results{
        display:block!important;
        order:4!important;
    }
    .ww-game-v080.mobile-tab-players .ww-game-actions{
        display:grid!important;
        order:5!important;
    }

    /* Less vertical drift in the primary game tab. */
    .ww-game-v080.mobile-tab-game .ww-game-title{
        margin-top:2px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-row{
        margin-bottom:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-current-card{
        padding-top:7px!important;
        padding-bottom:7px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-board-wrap{
        margin-top:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-rack-panel{
        position:sticky;
        bottom:0;
        z-index:80;
        background:var(--paper);
        padding-bottom:max(5px,env(safe-area-inset-bottom))!important;
        box-shadow:0 -8px 18px rgba(0,0,0,.08);
    }

    .site-footer{font-size:.7rem}
}

@media(max-width:390px){
    .ww-mobile-tabs button{font-size:.61rem;padding:4px 2px}
    .new-game-primary{grid-template-columns:1fr!important}
    .new-game-primary label:first-child{grid-column:auto!important}
}


/* =====================================================================
   WordWarren v0.15.1 — account content catalogue
   ===================================================================== */
.content-summary-card{
    display:grid;
    grid-template-columns:170px minmax(0,1fr);
    gap:20px;
    align-items:center;
}
.content-summary-card > div{
    display:grid;
    gap:3px;
}
.content-summary-card small{
    color:var(--muted);
    font-size:.64rem;
    font-weight:800;
    letter-spacing:.08em;
}
.content-summary-card strong{
    font-size:1.5rem;
}
.content-summary-card p{margin:0;color:var(--muted)}

.content-section{margin:24px 0}
.content-section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:18px;
    margin-bottom:10px;
}
.content-section-head h2{margin:.2rem 0}
.content-section-head p{margin:0;color:var(--muted)}

.content-catalogue-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.content-item-card{
    margin:0!important;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.content-item-card h3{
    margin:0;
    font-size:1.05rem;
}
.content-item-card > p{
    margin:0;
    color:var(--muted);
    line-height:1.4;
    flex:1 1 auto;
}
.content-item-top{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:flex-start;
}
.content-item-top > div:first-child{
    display:flex;
    gap:6px;
    align-items:center;
    flex-wrap:wrap;
}
.content-badge{
    display:inline-flex;
    padding:3px 6px;
    border-radius:999px;
    background:#efe3c9;
    color:#654b15;
    font-size:.55rem;
    font-weight:850;
}
.content-status-stack{
    display:flex;
    gap:4px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.content-status{
    display:inline-flex;
    align-items:center;
    min-height:22px;
    padding:3px 7px;
    border-radius:999px;
    font-size:.55rem;
    font-weight:850;
    white-space:nowrap;
}
.content-status.owned{background:#dfeee5;color:#27583b}
.content-status.purchasable{background:#e6edf2;color:#315b71}
.content-status.pro{background:#eee4c8;color:#6c5318}
.content-status.coming-soon{background:#ece8e1;color:#70685f}
.content-meta{
    display:flex;
    justify-content:space-between;
    gap:8px;
    padding-top:8px;
    border-top:1px solid var(--line);
    color:var(--muted);
    font-size:.64rem;
}
.content-action{
    display:grid;
    align-items:start;
    gap:3px;
}
.content-action .button{
    width:max-content;
    margin:0;
}
.content-action small{
    color:var(--muted);
    font-size:.58rem;
    line-height:1.3;
}
.content-purchase-note{
    margin-top:24px;
}
.account-content-head{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:flex-start;
}
.account-content-head h2{margin-top:0}
.account-content-head p{margin-bottom:8px}

html[data-theme="dark"] .content-badge{
    background:#5b4722;
    color:#f2dfaf;
}
html[data-theme="dark"] .content-status.owned{background:#263d31;color:#cce7d5}
html[data-theme="dark"] .content-status.purchasable{background:#263844;color:#cce0ec}
html[data-theme="dark"] .content-status.pro{background:#4b3d20;color:#f1ddad}
html[data-theme="dark"] .content-status.coming-soon{background:#303630;color:#c4cbc6}

@media(max-width:760px){
    .content-summary-card{
        grid-template-columns:1fr;
        gap:8px;
    }
    .content-catalogue-grid{
        grid-template-columns:1fr;
    }
    .content-item-top{
        align-items:flex-start;
    }
    .content-meta{
        flex-direction:column;
        gap:3px;
    }
}


/* =====================================================================
   WordWarren v0.15.2 — Hidden Surprises
   ===================================================================== */
.hidden-surprise-setup{
    display:grid;
    grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);
    gap:12px;
    align-items:start;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid var(--line);
    border-radius:11px;
    background:var(--card);
}
.hidden-surprise-choice label{
    display:grid;
    gap:5px;
    font-weight:800;
}
.hidden-surprise-choice p{
    margin:8px 0 0;
    color:var(--muted);
    font-size:.72rem;
    line-height:1.35;
}
.surprise-effects-guide{
    border-left:1px solid var(--line);
    padding-left:12px;
}
.surprise-effects-guide summary{
    cursor:pointer;
    font-size:.72rem;
    font-weight:850;
    margin-bottom:8px;
}
.surprise-effect-grid,
.help-surprise-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
}
.surprise-effect-grid > span,
.help-surprise-grid > span{
    display:grid;
    gap:1px;
    padding:6px 7px;
    border-radius:7px;
    background:#f2eee5;
}
.surprise-effect-grid b,
.help-surprise-grid b{font-size:.64rem}
.surprise-effect-grid small,
.help-surprise-grid small{
    color:var(--muted);
    font-size:.56rem;
    line-height:1.2;
}
html[data-theme="dark"] .surprise-effect-grid > span,
html[data-theme="dark"] .help-surprise-grid > span{
    background:#26332d;
}

.sq.surprise-revealed{
    position:relative;
}
.surprise-marker{
    position:absolute;
    right:-2px;
    top:-2px;
    z-index:5;
    width:17px;
    height:17px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#f6e3a4;
    border:1px solid #9b7930;
    font-size:.58rem;
    line-height:1;
    box-shadow:0 1px 3px rgba(0,0,0,.24);
    pointer-events:none;
}
.sq.surprise-hinted{
    box-shadow:inset 0 0 0 2px #d7a93a;
}
.surprise-hint-label{
    width:54%;
    height:54%;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#f2cf72;
    color:#392b0d!important;
    font-size:clamp(.5rem,1vw,.82rem)!important;
    font-weight:950;
}
@keyframes ww-surprise-pop{
    0%{transform:scale(1);box-shadow:0 0 0 0 rgba(226,174,49,.9)}
    20%{transform:scale(1.12);box-shadow:0 0 0 7px rgba(226,174,49,.5)}
    45%{transform:scale(.98);box-shadow:0 0 0 3px rgba(226,174,49,.35)}
    70%{transform:scale(1.08);box-shadow:0 0 0 7px rgba(226,174,49,.18)}
    100%{transform:scale(1);box-shadow:0 0 0 0 rgba(226,174,49,0)}
}
.sq.surprise-flash{
    z-index:8;
    animation:ww-surprise-pop .85s ease-out 2;
}
.legend-swatch.surprise,
.legend-swatch.surprise-hint{
    border-radius:50%;
    background:#f2cf72;
    color:#392b0d;
}
.surprise-legend-item{
    max-width:250px;
}
.lucky-paw-panel{
    display:grid;
    grid-template-columns:minmax(150px,1fr) minmax(100px,160px) auto;
    gap:7px;
    align-items:center;
    margin:7px 0 0;
    padding:7px;
    border:1px solid #a9c9a8;
    border-radius:8px;
    background:#edf5e9;
}
.lucky-paw-panel > div{
    display:grid;
    gap:1px;
}
.lucky-paw-panel b{font-size:.7rem}
.lucky-paw-panel small{
    color:#52634f;
    font-size:.56rem;
}
.lucky-paw-panel select{
    padding:6px 7px;
    font-size:.65rem;
}
.lucky-paw-panel .button{
    margin:0!important;
    padding:7px 9px!important;
    font-size:.62rem!important;
}
.safe-burrow-status{
    margin-top:6px;
    padding:6px 8px;
    border-radius:7px;
    background:#e7eef5;
    color:#355268;
    font-size:.62rem;
    font-weight:750;
}
html[data-theme="dark"] .lucky-paw-panel{
    background:#253827;
    border-color:#527052;
}
html[data-theme="dark"] .lucky-paw-panel small{color:#bdd0b8}
html[data-theme="dark"] .safe-burrow-status{
    background:#253442;
    color:#c8dce9;
}

@media(max-width:760px){
    .hidden-surprise-setup{
        grid-template-columns:1fr;
    }
    .surprise-effects-guide{
        border-left:0;
        border-top:1px solid var(--line);
        padding-left:0;
        padding-top:9px;
    }
    .surprise-effect-grid,
    .help-surprise-grid{
        grid-template-columns:1fr;
    }
    .lucky-paw-panel{
        grid-template-columns:1fr;
    }
    .lucky-paw-panel .button{
        width:100%;
    }
}


/* =====================================================================
   WordWarren v0.15.3 — alpha content completion
   ===================================================================== */
.theme-game-tagline{
    display:block;
    max-width:520px;
    color:var(--muted);
    font-size:.62rem;
    line-height:1.25;
    text-align:center;
}
.theme-rule-note{
    width:100%;
    padding:6px 9px;
    margin:0 0 5px;
    border-radius:7px;
    background:#f4eee3;
    color:#5b5146;
    font-size:.61rem;
    font-weight:750;
    text-align:center;
}
html[data-theme="dark"] .theme-rule-note{
    background:#26322d;
    color:#d8dfda;
}

/* Dirty Rabbits is a complete Theme skin; its rules remain data-driven. */
.theme-dirty-rabbits{
    --accent:#a54867;
    --dirty-deep:#4c2636;
    --dirty-mid:#7c3d56;
    --dirty-soft:#f0d7df;
}
.theme-dirty-rabbits .ww-game-title{
    position:relative;
}
.theme-dirty-rabbits .ww-game-title h1::before{
    content:"🐇";
    margin-right:.35em;
    font-size:.8em;
}
.theme-dirty-rabbits .ww-game-title h1::after{
    content:" · 18+ Beta";
    font-size:.5em;
    font-weight:850;
    color:var(--dirty-mid);
}
.theme-dirty-rabbits .theme-game-tagline{
    color:var(--dirty-mid);
}
.theme-dirty-rabbits .theme-rule-note{
    background:var(--dirty-soft);
    color:var(--dirty-deep);
    border:1px solid #d9adba;
}
.theme-dirty-rabbits .ww-board-v080{
    box-shadow:0 0 0 3px #7c3d56,0 10px 28px rgba(76,38,54,.16);
}
.theme-dirty-rabbits .warren-board .sq{
    background:#eee2e5;
    border-color:#c6adb5;
}
.theme-dirty-rabbits .warren-board .sq.l2,
.theme-dirty-rabbits .warren-board .sq.dl{background:#e4c1cf}
.theme-dirty-rabbits .warren-board .sq.l3,
.theme-dirty-rabbits .warren-board .sq.tl{background:#a85d79;color:white}
.theme-dirty-rabbits .warren-board .sq.w2,
.theme-dirty-rabbits .warren-board .sq.dw{background:#d9a65e}
.theme-dirty-rabbits .warren-board .sq.w3,
.theme-dirty-rabbits .warren-board .sq.tw{background:#7c3d56;color:white}
.theme-dirty-rabbits .warren-board .sq.start{background:#d7b65d;color:#3f2a16}
.theme-dirty-rabbits .tile,
.theme-dirty-rabbits .racktile{
    background:#f0d7bb;
    border-color:#bd9470;
    box-shadow:0 2px 3px rgba(76,38,54,.2);
}
.theme-dirty-rabbits .ww-rack-panel{
    border-color:#d4aaba;
}
.theme-dirty-rabbits .ww-score-card.active{
    outline-color:#a54867!important;
}
html[data-theme="dark"] .theme-dirty-rabbits .theme-rule-note{
    background:#4a2935;
    color:#f3dce4;
    border-color:#77475a;
}
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq{
    background:#33262c;
    border-color:#644554;
}
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.l2,
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.dl{background:#674050}
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.l3,
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.tl{background:#8c4864}
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.w2,
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.dw{background:#7b5c32}
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.w3,
html[data-theme="dark"] .theme-dirty-rabbits .warren-board .sq.tw{background:#6c3048}
html[data-theme="dark"] .theme-dirty-rabbits .tile,
html[data-theme="dark"] .theme-dirty-rabbits .racktile{
    background:#d8b98f;
    color:#26191c;
}


/* =====================================================================
   WordWarren v0.15.4 — Dirty Words alpha Dictionary
   ===================================================================== */
.dictionary-adult-badge{
    display:inline-flex;
    align-items:center;
    min-height:18px;
    padding:1px 5px;
    margin-left:4px;
    border-radius:999px;
    background:#7d344b;
    color:white;
    font-size:.52rem;
    font-style:normal;
    font-weight:900;
    vertical-align:middle;
}
.adult-dictionary-choice{
    border-left:3px solid #a54867!important;
    padding-left:7px!important;
}
.adult-dictionary-note{
    display:grid;
    gap:2px;
    margin-top:8px;
    padding:8px 9px;
    border:1px solid #d4a9b8;
    border-radius:8px;
    background:#f5e5eb;
    color:#643447;
}
.adult-dictionary-note b{font-size:.68rem}
.adult-dictionary-note span{font-size:.6rem;line-height:1.3}
.content-status.alpha-access{background:#e7edf6;color:#365b83}
.content-status.adult{background:#7d344b;color:#fff}
html[data-theme="dark"] .adult-dictionary-note{
    background:#402632;
    border-color:#745064;
    color:#f2dce5;
}
html[data-theme="dark"] .content-status.alpha-access{
    background:#293b51;
    color:#d8e6f5;
}


/* =====================================================================
   WordWarren v0.15.5 — app-shaped responsive play + Warren default Style
   ===================================================================== */

/* Presentation tokens: deliberately separate from game mechanics. Future
   cosmetic Styles can override these variables using another style-* class. */
.style-warren-default{
    --ww-warren-edge:#3c553f;
    --ww-warren-line:rgba(48,75,52,.20);
    --ww-tile-face:#f3ead7;
    --ww-tile-edge:#9b7b51;
    --ww-tile-ink:#2e2a22;
    --ww-rack-face:#e5d3af;
    --ww-score-active:#edf4e9;
    --ww-score-active-edge:#527a55;
}

/* Restrained Warren identity: concentric "burrow" geometry and tactile
   materials rather than literal/cartoon rabbit artwork. */
.style-warren-default .ww-board-v080{
    border:4px solid var(--ww-warren-edge);
    border-radius:12px;
    padding:3px;
    background:
        radial-gradient(circle at 50% 50%, transparent 0 26%, rgba(255,255,255,.08) 27% 28%, transparent 29% 45%, rgba(0,0,0,.045) 46% 47%, transparent 48%),
        var(--ww-warren-edge);
    box-shadow:0 8px 22px rgba(31,48,34,.16), inset 0 0 0 1px rgba(255,255,255,.18);
}
.style-warren-default .ww-board-v080 .sq{
    border-radius:10%;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.25),
        inset 0 -1px 0 rgba(40,55,42,.10);
    background-image:
        radial-gradient(ellipse at 50% 115%, transparent 0 42%, rgba(54,77,57,.055) 43% 46%, transparent 47%);
}
.style-warren-default .ww-board-v080 .sq.start{
    background-image:
        radial-gradient(circle at center, transparent 0 20%, rgba(63,78,47,.20) 21% 24%, transparent 25% 37%, rgba(63,78,47,.13) 38% 41%, transparent 42%);
}
.style-warren-default .tile,
.style-warren-default .racktile{
    background:
        linear-gradient(145deg, rgba(255,255,255,.30), rgba(112,83,47,.035)),
        var(--ww-tile-face);
    color:var(--ww-tile-ink);
    border:1px solid var(--ww-tile-edge);
    border-radius:15%;
    box-shadow:
        0 2px 3px rgba(54,42,25,.18),
        inset 0 1px 0 rgba(255,255,255,.55),
        inset 0 -2px 0 rgba(114,83,45,.12);
}
.style-warren-default .ww-score-card.active{
    background:var(--ww-score-active);
    border-color:var(--ww-score-active-edge);
    box-shadow:inset 0 0 0 1px var(--ww-score-active-edge);
}

/* The underlying board square remains recognisable after a tile covers it. */
.square-origin-marker,
.surprise-marker{
    position:absolute;
    z-index:8;
    top:1px;
    right:1px;
    min-width:15px;
    height:15px;
    padding:0 2px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:4px;
    border:1px solid rgba(0,0,0,.22);
    font-size:.47rem;
    line-height:1;
    font-weight:950;
    letter-spacing:-.03em;
    box-shadow:0 1px 2px rgba(0,0,0,.15);
    pointer-events:none;
}
.square-origin-marker.l2,
.square-origin-marker.dl{background:#b9d7c4;color:#234d3b}
.square-origin-marker.l3,
.square-origin-marker.tl{background:#3f8065;color:#fff}
.square-origin-marker.w2,
.square-origin-marker.dw{background:#e3b466;color:#4d3518}
.square-origin-marker.w3,
.square-origin-marker.tw{background:#a95b3a;color:#fff}
.square-origin-marker.start{background:#d9b85c;color:#302715}
.surprise-marker{
    top:auto;
    bottom:1px;
    right:1px;
    background:#f3ead7;
    color:#4b3d2d;
    font-size:.58rem;
}
.sq .tile{position:relative}
.legend-swatch.start{
    background:#d9b85c;
    color:#302715;
    border-radius:50%;
}

/* Desktop: retain the fuller browser composition and permanent visual key. */
.ww-mobile-game-identity{display:none}
.ww-mobile-play-status{display:none}
.ww-board-key{
    width:100%;
    max-width:100%;
}
.ww-board-key > summary{display:none}
.ww-board-key:not([open]) > .ww-bonus-legend{display:grid!important}

/* ---------------------------------------------------------------------
   Mobile play is intentionally app-shaped:
   navigation -> compact status -> every score -> board -> Key -> rack/actions.
   Everything else lives in the existing Chat / History / Players sections.
   --------------------------------------------------------------------- */
@media(max-width:760px){
    body.game-screen main.game-main{
        padding-left:6px!important;
        padding-right:6px!important;
    }

    .ww-game-v080{
        gap:4px!important;
        padding-bottom:0!important;
    }

    .ww-mobile-tabs{
        top:50px!important;
        padding:4px 6px!important;
        min-height:42px;
    }
    .ww-mobile-tabs button{
        min-height:34px!important;
        border-radius:10px!important;
    }

    .ww-mobile-game-identity{
        display:flex;
        order:1!important;
        width:100%;
        min-height:28px;
        align-items:center;
        gap:5px;
        padding:3px 8px 1px;
        color:var(--ink);
        font-size:.62rem;
        line-height:1.15;
        white-space:nowrap;
        overflow:hidden;
    }
    .ww-mobile-game-identity strong{
        flex:0 0 auto;
        font-weight:900;
    }
    .ww-mobile-game-identity > span:not(.ww-mobile-game-name){
        flex:0 0 auto;
    }
    .ww-mobile-game-name{
        min-width:0;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        color:var(--muted);
    }

    .ww-mobile-play-status{
        display:flex;
        order:2!important;
        width:100%;
        min-height:31px;
        align-items:center;
        justify-content:space-between;
        gap:8px;
        padding:4px 8px;
        border-radius:8px;
        background:var(--card);
        border:1px solid var(--line);
        font-size:.64rem;
        line-height:1.15;
    }
    .ww-mobile-play-status.ok{border-color:#7fa082}
    .ww-mobile-play-status.err{border-color:#b66d6d}
    .ww-mobile-status-copy{
        min-width:0;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .ww-mobile-tiles-left{
        flex:0 0 auto;
        font-weight:850;
        color:var(--muted);
    }

    /* Game title/desktop status cards are not needed while actually playing. */
    .ww-game-v080.mobile-tab-game .ww-game-title,
    .ww-game-v080.mobile-tab-game .ww-side-column{
        display:none!important;
    }

    .ww-game-v080.mobile-tab-game .ww-play-column{
        display:contents!important;
    }

    /* All scores, all the time. Four players still fit without horizontal swipe. */
    .ww-game-v080.mobile-tab-game .ww-score-row{
        display:grid!important;
        order:3!important;
        grid-template-columns:repeat(var(--ww-player-count, 4),minmax(0,1fr))!important;
        gap:3px!important;
        width:100%!important;
        margin:0!important;
        position:sticky;
        top:92px;
        z-index:96;
        padding:3px 0;
        background:var(--paper);
    }
    .ww-game-v080.mobile-tab-game .ww-score-card{
        min-width:0!important;
        height:44px!important;
        padding:3px 4px!important;
        border-radius:8px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-card small{
        display:none!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-main{
        height:100%;
        display:grid!important;
        grid-template-columns:1fr!important;
        grid-template-rows:18px 1fr!important;
        align-items:center!important;
        gap:0!important;
        text-align:center;
    }
    .ww-game-v080.mobile-tab-game .ww-score-player{
        display:flex!important;
        justify-content:center!important;
        min-width:0!important;
        gap:2px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-player b{
        max-width:calc(100% - 18px)!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
        font-size:.55rem!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-main strong{
        font-size:1rem!important;
        line-height:1!important;
    }

    .ww-game-v080.mobile-tab-game .ww-board-wrap{
        order:4!important;
        width:100%!important;
        margin:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-board-v080{
        width:min(100%,calc(100dvh - 255px))!important;
        max-width:100%!important;
        margin:0 auto!important;
        aspect-ratio:1!important;
    }

    /* One-tap Key sheet; the full legend no longer consumes play-screen height. */
    .ww-board-key{
        margin:3px 0 0!important;
    }
    .ww-board-key > summary{
        display:flex!important;
        align-items:center;
        justify-content:center;
        gap:6px;
        width:max-content;
        min-width:82px;
        margin:0 auto;
        padding:4px 9px;
        list-style:none;
        cursor:pointer;
        border:1px solid var(--line);
        border-radius:999px;
        background:var(--card);
        color:var(--ink);
        font-size:.62rem;
        font-weight:900;
    }
    .ww-board-key > summary::-webkit-details-marker{display:none}
    .ww-board-key > summary small{
        font-size:.51rem;
        font-weight:650;
        color:var(--muted);
    }
    .ww-board-key:not([open]) > .ww-bonus-legend{
        display:none!important;
    }
    .ww-board-key[open]{
        position:relative;
        z-index:115;
    }
    .ww-board-key[open] > .ww-bonus-legend{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:5px!important;
        margin:4px 0 0!important;
        padding:8px!important;
        border:1px solid var(--line);
        border-radius:10px;
        background:var(--card);
        box-shadow:0 7px 18px rgba(0,0,0,.12);
        font-size:.56rem!important;
    }
    .ww-board-key[open] .surprise-legend-item{
        grid-column:1/-1;
    }

    /* Rack and primary actions behave like the bottom control area of an app. */
    .ww-game-v080.mobile-tab-game .ww-rack-panel{
        display:block!important;
        order:5!important;
        position:sticky!important;
        bottom:0!important;
        z-index:100!important;
        width:calc(100% + 12px)!important;
        margin-left:-6px!important;
        padding:5px 6px max(6px,env(safe-area-inset-bottom))!important;
        border-radius:11px 11px 0 0!important;
        background:var(--paper)!important;
        box-shadow:0 -8px 20px rgba(0,0,0,.12)!important;
    }
    .ww-game-v080.mobile-tab-game .ww-rack-row{
        grid-template-columns:minmax(0,1fr) 64px!important;
        grid-template-areas:"rack estimate"!important;
        gap:5px!important;
        padding:0 0 4px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-rack-title{
        display:none!important;
    }
    .ww-game-v080.mobile-tab-game .ww-rack{
        grid-area:rack!important;
        gap:3px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-estimate{
        grid-area:estimate!important;
        width:64px!important;
        min-width:64px!important;
        height:auto!important;
        min-height:38px!important;
        padding:2px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-estimate .score-preview-label{
        font-size:.43rem!important;
    }
    .ww-game-v080.mobile-tab-game .ww-estimate strong{
        font-size:.9rem!important;
    }
    .ww-game-v080.mobile-tab-game .ww-estimate .score-preview-points{
        display:none!important;
    }

    .ww-game-v080.mobile-tab-game .ww-control-row{
        margin-top:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-actions{
        width:100%!important;
        display:flex!important;
        gap:4px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-actions form{
        display:flex!important;
        flex:1 1 auto!important;
        gap:4px!important;
        margin:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-actions .button{
        min-height:34px!important;
        padding:5px 7px!important;
        font-size:.59rem!important;
        white-space:nowrap!important;
        flex:1 1 auto!important;
    }
    .ww-game-v080.mobile-tab-game .dock-waiting{
        width:100%;
        min-height:30px;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:.6rem;
    }

    /* Badge size remains readable when board cells are small. */
    .square-origin-marker,
    .surprise-marker{
        min-width:12px!important;
        height:12px!important;
        padding:0 1px!important;
        font-size:clamp(.34rem,1.7vw,.46rem)!important;
        border-radius:3px!important;
    }
    .surprise-marker{
        font-size:clamp(.39rem,1.9vw,.5rem)!important;
    }

    /* Secondary tabs should not inherit primary-play sticky elements. */
    .ww-game-v080:not(.mobile-tab-game) .ww-mobile-game-identity,
    .ww-game-v080:not(.mobile-tab-game) .ww-mobile-play-status{
        display:none!important;
    }
}

@media(max-width:390px){
    .ww-game-v080.mobile-tab-game .ww-score-card{
        height:40px!important;
        padding:2px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-player .avatar{
        transform:scale(.86);
    }
    .ww-game-v080.mobile-tab-game .ww-score-player b{
        font-size:.5rem!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-main strong{
        font-size:.9rem!important;
    }
}

/* Dark-mode tokens for the Warren default Style. */
html[data-theme="dark"] .style-warren-default{
    --ww-warren-edge:#26392b;
    --ww-warren-line:rgba(221,235,222,.13);
    --ww-tile-face:#d5c29d;
    --ww-tile-edge:#8d714b;
    --ww-tile-ink:#241f19;
    --ww-score-active:#263b2b;
    --ww-score-active-edge:#6f9a76;
}


/* =====================================================================
   WordWarren v0.15.7 — Warren identity + corrected mobile game surface
   ===================================================================== */

/* Stronger, grown-up Warren identity: dark moss surround, warm game pieces,
   subtle tunnel rings and copper/earth accents. */
.style-warren-default{
    --ww-warren-edge:#1f493c;
    --ww-warren-edge-deep:#14352d;
    --ww-warren-moss:#2c604e;
    --ww-warren-copper:#c46f42;
    --ww-warren-sand:#e8d29b;
    --ww-warren-cream:#f3eee1;
    --ww-score-bg:#203a32;
    --ww-score-ink:#f6f2e8;
    --ww-score-muted:#c7d1cb;
    --ww-score-active:#315f4d;
    --ww-score-active-edge:#d2a85f;
}

.style-warren-default .ww-board-wrap{
    position:relative;
}
.style-warren-default .ww-board-wrap::before{
    content:"";
    position:absolute;
    inset:-7px;
    border-radius:18px;
    pointer-events:none;
    background:
        radial-gradient(ellipse at 18% 4%, transparent 0 23px, rgba(231,219,178,.11) 24px 26px, transparent 27px 43px),
        radial-gradient(ellipse at 78% 98%, transparent 0 34px, rgba(231,219,178,.08) 35px 38px, transparent 39px 57px);
    opacity:.9;
}
.style-warren-default .ww-board-v080{
    position:relative;
    z-index:1;
    border:5px solid var(--ww-warren-edge-deep)!important;
    outline:2px solid rgba(196,111,66,.48);
    outline-offset:-3px;
    border-radius:15px!important;
    padding:5px!important;
    background:
        radial-gradient(circle at 50% 50%, transparent 0 25%, rgba(231,219,178,.10) 26% 27%, transparent 28% 43%, rgba(231,219,178,.06) 44% 45%, transparent 46%),
        linear-gradient(145deg,var(--ww-warren-edge),var(--ww-warren-edge-deep))!important;
    box-shadow:
        0 12px 30px rgba(3,20,15,.30),
        inset 0 0 0 1px rgba(255,255,255,.08)!important;
}
.style-warren-default .ww-board-v080 .sq{
    background-color:var(--ww-warren-cream);
    border-color:#395849!important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.55),
        inset 0 -2px 0 rgba(38,62,48,.12)!important;
}
.style-warren-default .ww-board-v080 .sq:not(.l2):not(.l3):not(.w2):not(.w3):not(.dl):not(.tl):not(.dw):not(.tw):not(.start){
    background-image:
        radial-gradient(ellipse at 50% 112%, transparent 0 40%, rgba(38,82,64,.06) 41% 44%, transparent 45%);
}
.style-warren-default .tile,
.style-warren-default .racktile{
    background:
        linear-gradient(145deg,rgba(255,255,255,.34),rgba(121,85,42,.07)),
        var(--ww-warren-sand)!important;
    color:#241e16!important;
    border:1px solid #977144!important;
    box-shadow:
        0 2px 3px rgba(44,31,17,.26),
        inset 0 1px 0 rgba(255,255,255,.60),
        inset 0 -3px 0 rgba(117,82,39,.14)!important;
}

/* Underlying square identity is now an edge treatment, not an icon on top
   of the letter. The compact label occupies the lower-left corner, opposite
   the normal points value at lower-right. */
.square-origin-marker,
.surprise-marker{
    display:none!important;
}
.tile-on-special{
    position:relative;
    overflow:hidden;
}
.tile-origin-edge{
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    border:2px solid transparent;
}
.tile-on-special::after{
    content:attr(data-origin-label);
    position:absolute;
    left:2px;
    bottom:1px;
    z-index:4;
    min-width:12px;
    font-size:.38rem;
    line-height:1;
    font-weight:950;
    letter-spacing:-.02em;
    text-align:left;
    pointer-events:none;
}
.tile-origin-l2 .tile-origin-edge,.tile-origin-dl .tile-origin-edge{border-color:#86bea0}
.tile-origin-l3 .tile-origin-edge,.tile-origin-tl .tile-origin-edge{border-color:#34795e}
.tile-origin-w2 .tile-origin-edge,.tile-origin-dw .tile-origin-edge{border-color:#d79835}
.tile-origin-w3 .tile-origin-edge,.tile-origin-tw .tile-origin-edge{border-color:#b54f35}
.tile-origin-start .tile-origin-edge{border-color:#c39b34}
.tile-origin-l2::after,.tile-origin-dl::after{color:#42745e}
.tile-origin-l3::after,.tile-origin-tl::after{color:#22654d}
.tile-origin-w2::after,.tile-origin-dw::after{color:#8a5a0e}
.tile-origin-w3::after,.tile-origin-tw::after{color:#8f321f}
.tile-origin-start::after{color:#80630c}

.tile-surprise-corner{
    position:absolute;
    z-index:5;
    top:1px;
    right:1px;
    width:11px;
    height:11px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#263e34;
    border:1px solid #e7cf91;
    color:#fff;
    font-size:.42rem;
    line-height:1;
    overflow:hidden;
    pointer-events:none;
    box-shadow:0 1px 2px rgba(0,0,0,.22);
}

/* Finished state must be unmistakable. */
.ww-finished-banner{
    display:grid;
    gap:7px;
    width:100%;
    padding:14px 16px;
    border:2px solid #d2a85f;
    border-radius:14px;
    background:
        radial-gradient(circle at 92% 12%,rgba(210,168,95,.17),transparent 32%),
        #1e3e33;
    color:#f7f1e5;
    box-shadow:0 7px 20px rgba(0,0,0,.18);
}
.ww-finished-kicker{
    font-size:.68rem;
    font-weight:950;
    letter-spacing:.13em;
    color:#e3bd72;
}
.ww-finished-result{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:8px 13px;
}
.ww-finished-result strong{
    font-size:1.35rem;
}
.ww-finished-result span,
.ww-finished-final{
    color:#d4ded8;
    font-size:.72rem;
}
.ww-finished-final b{color:#fff}
.ww-finished-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.ww-finished-actions form{margin:0}
.ww-finished-actions button,
.ww-finished-actions a{
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    padding:6px 11px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:8px;
    background:#2b5546;
    color:#fff;
    text-decoration:none;
    font:inherit;
    font-size:.66rem;
    font-weight:850;
    cursor:pointer;
}

/* More sheet is app navigation for secondary game/site actions. */
.ww-more-sheet[hidden]{display:none!important}
.ww-more-sheet{
    position:fixed;
    z-index:500;
    left:10px;
    right:10px;
    bottom:max(10px,env(safe-area-inset-bottom));
    padding:12px;
    border:1px solid #53695f;
    border-radius:18px;
    background:#13251f;
    color:#f7f2e9;
    box-shadow:0 18px 60px rgba(0,0,0,.48);
}
.ww-more-sheet-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:9px;
}
.ww-more-sheet-head b{
    font-size:.9rem;
}
.ww-more-sheet-head button{
    width:32px;height:32px;border:0;border-radius:50%;
    background:#263d34;color:#fff;font-size:1.2rem;
}
.ww-more-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
}
.ww-more-grid button,
.ww-more-grid a{
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:8px 11px;
    border:1px solid #42594f;
    border-radius:10px;
    background:#20362e;
    color:#f5f1e8;
    text-decoration:none;
    font:inherit;
    font-size:.7rem;
    font-weight:800;
}
body.ww-more-open::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:490;
    background:rgba(0,0,0,.45);
}

/* Desktop score cards stay rich but have reliable dark-mode contrast. */
.style-warren-default .ww-score-card{
    background:var(--ww-score-bg)!important;
    color:var(--ww-score-ink)!important;
    border-color:#3d5b4e!important;
}
.style-warren-default .ww-score-card small{color:var(--ww-score-muted)!important}
.style-warren-default .ww-score-card.active{
    background:var(--ww-score-active)!important;
    border-color:var(--ww-score-active-edge)!important;
    box-shadow:inset 0 -3px 0 var(--ww-score-active-edge)!important;
}
.ww-score-name-mobile{display:none}

@media(max-width:760px){
    body.game-screen footer{
        display:none!important;
    }

    .ww-mobile-tabs{
        display:grid!important;
        grid-auto-flow:column;
        grid-auto-columns:1fr;
        gap:3px!important;
        padding:4px 6px!important;
    }
    .ww-mobile-tabs button{
        min-width:0!important;
        padding:5px 3px!important;
        font-size:.58rem!important;
        white-space:nowrap;
    }
    .ww-mobile-tabs .ww-more-tab{
        display:block!important;
    }

    .ww-finished-banner{
        order:1;
        padding:10px 11px;
        gap:5px;
        border-radius:11px;
    }
    .ww-finished-result strong{font-size:1.05rem}
    .ww-finished-result span,.ww-finished-final{font-size:.58rem}
    .ww-finished-actions button,.ww-finished-actions a{
        min-height:31px;
        padding:5px 8px;
        font-size:.56rem;
    }

    /* Finished banner takes priority over routine status. */
    .ww-game-v080:has(.ww-finished-banner) .ww-mobile-play-status{
        display:none!important;
    }

    /* Four readable score cards: dark surface, short name, clear score. */
    .ww-game-v080.mobile-tab-game .ww-score-row{
        gap:4px!important;
        padding:3px 0 5px!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-card{
        height:48px!important;
        background:#203a32!important;
        color:#fff!important;
        border:1px solid #425f52!important;
        padding:3px!important;
        overflow:hidden!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-card.active{
        background:#315f4d!important;
        border-color:#d2a85f!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-main{
        grid-template-rows:19px 1fr!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-player{
        gap:1px!important;
    }
    .ww-score-name-desktop{display:none!important}
    .ww-score-name-mobile{
        display:inline!important;
        color:#fff!important;
        max-width:calc(100% - 19px)!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
        font-size:.52rem!important;
        line-height:1!important;
    }
    .ww-game-v080.mobile-tab-game .ww-score-main strong{
        color:#fff!important;
        font-size:1rem!important;
        font-weight:950!important;
    }

    /* Give the phone board a visibly crafted frame without sacrificing size. */
    .style-warren-default .ww-board-wrap{
        padding:2px 1px;
        border-radius:16px;
        background:linear-gradient(180deg,#254a3d,#17352d);
        box-shadow:0 7px 18px rgba(0,0,0,.25);
    }
    .style-warren-default .ww-board-v080{
        width:100%!important;
        border-width:4px!important;
        padding:4px!important;
        outline-width:1px;
    }

    .tile-on-special::after{
        left:1px;
        bottom:1px;
        font-size:clamp(.25rem,1.25vw,.36rem);
    }
    .tile-origin-edge{
        border-width:2px;
    }
    .tile-surprise-corner{
        width:9px;
        height:9px;
        top:1px;
        right:1px;
        font-size:.33rem;
    }

    /* When finished there is no reason to keep an inert rack dock stuck down. */
    .ww-game-v080:has(.ww-finished-banner) .ww-rack-panel{
        position:static!important;
        box-shadow:none!important;
        background:transparent!important;
    }
}

@media(min-width:761px){
    .ww-more-tab,
    .ww-more-sheet{
        display:none!important;
    }
}


/* =====================================================================
   WordWarren v0.15.8 — desktop/browser polish
   ===================================================================== */

/* Desktop Key: details content must be genuinely open, not merely styled as if
   it were. The Blade now renders it open; mobile JS closes it on load. */
@media(min-width:761px){
    .ww-board-key{
        display:block!important;
        margin:6px 0 7px!important;
    }
    .ww-board-key > .ww-bonus-legend{
        display:flex!important;
        flex-wrap:wrap!important;
        align-items:center!important;
        gap:8px 12px!important;
        min-height:25px!important;
    }
}

/* Keep the score estimate fully contained by the rack panel on desktop. */
@media(min-width:761px){
    .ww-rack-row{
        grid-template-columns:78px minmax(0,1fr) minmax(92px,104px)!important;
        gap:6px!important;
        padding-left:8px!important;
        padding-right:8px!important;
    }
    .ww-estimate{
        width:100%!important;
        min-width:0!important;
        max-width:104px!important;
        overflow:hidden!important;
        padding:3px 5px!important;
        align-content:center!important;
        justify-items:start!important;
    }
    .ww-estimate .score-preview-label{
        max-width:100%!important;
        font-size:.46rem!important;
        line-height:1.05!important;
        white-space:normal!important;
        overflow-wrap:anywhere!important;
    }
    .ww-estimate strong{
        line-height:.95!important;
    }
    .ww-estimate .score-preview-points{
        font-size:.42rem!important;
    }
}

/* Revealed Hidden Surprises: clearly visible but still away from the main
   letter/points. Hovering anywhere on the revealed square shows its name and
   description via the square's title attribute. */
.sq.surprise-revealed{
    cursor:help;
}
.tile-surprise-corner{
    width:15px!important;
    height:15px!important;
    top:1px!important;
    right:1px!important;
    border:2px solid #efd28a!important;
    background:#173c31!important;
    color:#fff!important;
    font-size:.56rem!important;
    font-weight:900!important;
    box-shadow:0 1px 4px rgba(0,0,0,.35)!important;
    pointer-events:none!important;
}
.sq.surprise-revealed .tile-origin-edge{
    box-shadow:inset 0 0 0 1px rgba(239,210,138,.28);
}
.sq.surprise-revealed:not(:has(.tile))::after{
    content:"!";
    position:absolute;
    top:3px;
    right:3px;
    width:15px;
    height:15px;
    display:grid;
    place-items:center;
    border-radius:50%;
    border:2px solid #efd28a;
    background:#173c31;
    color:#fff;
    font-size:.55rem;
    font-weight:950;
    pointer-events:none;
}

/* The finished banner is a full-width row of the game grid. Previously it
   occupied the first grid cell, which pushed the play column to the right. */
@media(min-width:1100px){
    .ww-finished-banner{
        grid-column:1 / -1!important;
        width:100%!important;
        max-width:none!important;
        box-sizing:border-box!important;
        margin:0 0 2px!important;
    }
}


/* =====================================================================
   WordWarren v0.15.9 — desktop rack/key/results correction
   ===================================================================== */

@media(min-width:761px){
    /* The old v0.8 composition imposed a fixed 20px legend height. Allow the
       desktop Key to grow naturally as revealed surprise types are added. */
    .ww-board-key,
    .ww-board-key[open]{
        height:auto!important;
        min-height:0!important;
        max-height:none!important;
        overflow:visible!important;
    }
    .ww-board-key > .ww-bonus-legend,
    .ww-board-key[open] > .ww-bonus-legend{
        display:flex!important;
        flex-wrap:wrap!important;
        width:100%!important;
        height:auto!important;
        min-height:25px!important;
        max-height:none!important;
        overflow:visible!important;
        align-items:center!important;
        align-content:flex-start!important;
        gap:6px 10px!important;
        padding:0!important;
        margin:5px 0 7px!important;
        box-sizing:border-box!important;
    }
    .ww-board-key .legend-item{
        flex:0 0 auto!important;
        min-width:0!important;
    }
    .ww-board-key .surprise-legend-item{
        flex:1 0 100%!important;
        width:100%!important;
        max-width:100%!important;
        white-space:normal!important;
        line-height:1.25!important;
        padding-top:2px!important;
        box-sizing:border-box!important;
    }

    /* Rack geometry must work at the actual board width, not only at the
       original design width. Give rack tiles permission to shrink slightly
       before allowing the score preview to escape the panel. */
    .ww-rack-row{
        grid-template-columns:68px minmax(0,1fr) 86px!important;
        column-gap:5px!important;
        padding:6px 7px!important;
        overflow:hidden!important;
    }
    .ww-rack{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        gap:3px!important;
        overflow:hidden!important;
        justify-content:space-between!important;
    }
    .ww-rack .racktile{
        flex:1 1 0!important;
        width:auto!important;
        min-width:32px!important;
        max-width:40px!important;
        height:46px!important;
    }
    .ww-estimate{
        width:86px!important;
        min-width:0!important;
        max-width:86px!important;
        height:48px!important;
        padding:3px 4px!important;
        overflow:hidden!important;
        border-left:1px solid #e6dfd4!important;
        box-sizing:border-box!important;
        align-content:center!important;
    }
    .ww-estimate .score-preview-label{
        display:block!important;
        width:100%!important;
        max-width:100%!important;
        font-size:.42rem!important;
        line-height:1.05!important;
        white-space:normal!important;
        overflow-wrap:break-word!important;
        word-break:normal!important;
        letter-spacing:.03em!important;
    }
    .ww-estimate strong{
        font-size:1.15rem!important;
        line-height:.95!important;
    }
    .ww-estimate .score-preview-points{
        font-size:.38rem!important;
        line-height:1!important;
    }

    #finalResults{
        scroll-margin-top:90px;
    }
}


/* =====================================================================
   WordWarren v0.15.10 — mobile marker/score polish
   ===================================================================== */

.score-preview-label-mobile{display:none}

@media(max-width:760px){
    .score-preview-label-desktop{display:none!important}
    .score-preview-label-mobile{
        display:block!important;
        font-size:.46rem!important;
        line-height:1!important;
        letter-spacing:.04em!important;
        white-space:nowrap!important;
    }

    .ww-game-v080.mobile-tab-game .ww-estimate{
        width:58px!important;
        min-width:58px!important;
        max-width:58px!important;
        min-height:38px!important;
        padding:3px 4px!important;
        overflow:hidden!important;
        align-content:center!important;
        justify-items:start!important;
    }

    /* Revealed-surprise identity should not sit on top of the letter.
       It becomes a small protruding tab outside the top-left of the tile. */
    .tile-on-special,
    .tile.committed{
        overflow:visible!important;
    }
    .tile-surprise-corner{
        top:-5px!important;
        right:auto!important;
        left:-5px!important;
        width:11px!important;
        height:11px!important;
        border-width:1px!important;
        font-size:.38rem!important;
        transform:none!important;
        z-index:12!important;
    }

    .sq.surprise-revealed{
        overflow:visible!important;
    }
}


/* =====================================================================
   WordWarren v0.15.11 — Dirty Rabbits After Dark
   ===================================================================== */

/* Dirty Rabbits is deliberately much more than a pink accent. It becomes a
   dirtier, tactile, after-dark Warren while retaining the same responsive game
   structure and board readability. */
body.game-screen:has(.theme-dirty-rabbits){
    background:
        radial-gradient(ellipse at 18% 0%,rgba(98,73,43,.16),transparent 30%),
        radial-gradient(ellipse at 82% 100%,rgba(84,49,39,.18),transparent 34%),
        linear-gradient(180deg,#17160f 0%,#201b13 46%,#111510 100%)!important;
}

body.game-screen:has(.theme-dirty-rabbits) header{
    background:
        linear-gradient(180deg,rgba(17,18,14,.98),rgba(27,24,17,.98))!important;
    border-bottom-color:#7d4f35!important;
}

body.game-screen:has(.theme-dirty-rabbits) main.game-main{
    background:
        radial-gradient(circle at 12% 16%,rgba(178,139,83,.05) 0 2px,transparent 3px),
        radial-gradient(circle at 80% 42%,rgba(121,78,53,.06) 0 2px,transparent 3px),
        transparent!important;
}

.theme-dirty-rabbits{
    --accent:#8d3d4f!important;
    --dirty-ink:#1d1913;
    --dirty-parchment:#d8c39b;
    --dirty-parchment-light:#eee0bf;
    --dirty-earth:#3a2a1c;
    --dirty-earth-dark:#211a13;
    --dirty-moss:#263f31;
    --dirty-moss-light:#385846;
    --dirty-burgundy:#733447;
    --dirty-gold:#c79d54;
    --dirty-line:#6c573d;
}

.theme-dirty-rabbits .ww-game-title{
    position:relative;
    padding:7px 12px 6px!important;
    border:1px solid #594632;
    border-radius:9px;
    background:
        linear-gradient(90deg,rgba(113,52,71,.28),transparent 36%),
        linear-gradient(180deg,#33281c,#241e17)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.04),0 5px 14px rgba(0,0,0,.16);
}
.theme-dirty-rabbits .ww-game-title::before{
    content:"DIRTY RABBITS · AFTER DARK";
    display:block;
    margin-bottom:2px;
    color:#d9b46e;
    font-size:.5rem;
    line-height:1;
    font-weight:950;
    letter-spacing:.15em;
}
.theme-dirty-rabbits .ww-game-title h1,
.theme-dirty-rabbits .ww-game-title small{
    color:#eee2c7!important;
}
.theme-dirty-rabbits .ww-game-title h1::before{
    content:"";
    margin:0;
}
.theme-dirty-rabbits .ww-game-title h1::after{
    color:#d39aa6!important;
}

.theme-dirty-rabbits .ww-score-card{
    background:
        radial-gradient(circle at 18% 12%,rgba(255,255,255,.035),transparent 25%),
        linear-gradient(145deg,#27372e,#1c2922)!important;
    color:#f3e7ce!important;
    border-color:#6b5941!important;
    box-shadow:
        inset 0 0 0 1px rgba(207,170,99,.08),
        0 3px 8px rgba(0,0,0,.18)!important;
}
.theme-dirty-rabbits .ww-score-card.active{
    background:
        linear-gradient(145deg,#71364a,#4a2834)!important;
    border-color:#d0a45d!important;
    box-shadow:inset 0 -3px 0 #d0a45d,0 3px 9px rgba(0,0,0,.22)!important;
}
.theme-dirty-rabbits .ww-score-card *,
.theme-dirty-rabbits .ww-score-card small{
    color:#f4ead7!important;
}

.theme-dirty-rabbits .ww-board-wrap{
    padding:7px!important;
    border-radius:17px!important;
    background:
        radial-gradient(ellipse at 12% 2%,transparent 0 25px,rgba(211,180,116,.10) 26px 29px,transparent 30px),
        radial-gradient(ellipse at 88% 100%,transparent 0 36px,rgba(211,180,116,.08) 37px 40px,transparent 41px),
        linear-gradient(145deg,#32271a,#17150f)!important;
    border:1px solid #6c5537;
    box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 0 0 2px rgba(111,82,49,.28);
}

.theme-dirty-rabbits .ww-board-v080{
    border:5px solid #312519!important;
    outline:2px solid #81613c!important;
    outline-offset:-3px!important;
    border-radius:13px!important;
    padding:5px!important;
    background:
        radial-gradient(ellipse at 50% 112%,transparent 0 42%,rgba(94,69,40,.12) 43% 46%,transparent 47%),
        linear-gradient(145deg,#4a3a27,#2a2118)!important;
    box-shadow:
        inset 0 0 0 1px rgba(222,190,126,.14),
        0 4px 12px rgba(0,0,0,.30)!important;
}

.theme-dirty-rabbits .ww-board-v080 .sq{
    background-color:#d7c49f!important;
    border-color:#5b4d39!important;
    background-image:
        radial-gradient(circle at 14% 19%,rgba(70,48,25,.08) 0 1px,transparent 1.5px),
        radial-gradient(circle at 78% 71%,rgba(70,48,25,.06) 0 1px,transparent 1.5px),
        linear-gradient(145deg,rgba(255,255,255,.13),rgba(79,54,28,.04))!important;
    color:#392a1b!important;
}
.theme-dirty-rabbits .ww-board-v080 .sq.l2,
.theme-dirty-rabbits .ww-board-v080 .sq.dl{
    background:#788d63!important;
    color:#f4ecd8!important;
}
.theme-dirty-rabbits .ww-board-v080 .sq.l3,
.theme-dirty-rabbits .ww-board-v080 .sq.tl{
    background:#365b49!important;
    color:#f4ecd8!important;
}
.theme-dirty-rabbits .ww-board-v080 .sq.w2,
.theme-dirty-rabbits .ww-board-v080 .sq.dw{
    background:#a26c35!important;
    color:#fff2d5!important;
}
.theme-dirty-rabbits .ww-board-v080 .sq.w3,
.theme-dirty-rabbits .ww-board-v080 .sq.tw{
    background:#75384a!important;
    color:#fff1dc!important;
}
.theme-dirty-rabbits .ww-board-v080 .sq.start{
    background:#b18b49!important;
    color:#291c12!important;
}

.theme-dirty-rabbits .tile,
.theme-dirty-rabbits .racktile{
    background:
        radial-gradient(circle at 20% 20%,rgba(91,60,29,.08) 0 1px,transparent 1.5px),
        linear-gradient(145deg,#ead7ad,#cdb184)!important;
    color:#231a12!important;
    border-color:#7d5d38!important;
    box-shadow:
        0 2px 3px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.42),
        inset 0 -3px 0 rgba(92,62,31,.15)!important;
}

.theme-dirty-rabbits .ww-rack-panel{
    background:
        linear-gradient(180deg,#33281d,#241f18)!important;
    border-color:#6e5438!important;
    box-shadow:inset 0 1px rgba(255,255,255,.04),0 7px 18px rgba(0,0,0,.22)!important;
}
.theme-dirty-rabbits .ww-rack-title,
.theme-dirty-rabbits .ww-rack-title small,
.theme-dirty-rabbits .ww-rack-title b{
    color:#e9dcc3!important;
}
.theme-dirty-rabbits .ww-estimate{
    background:#21372d!important;
    color:#f2e7d0!important;
    border-color:#aa8952!important;
}
.theme-dirty-rabbits .ww-estimate *{
    color:#f2e7d0!important;
}

.theme-dirty-rabbits .ww-actions .button{
    border-color:#5e4a34!important;
    background:#332a20!important;
    color:#f1e4cb!important;
}
.theme-dirty-rabbits .ww-actions .button:first-child,
.theme-dirty-rabbits .ww-actions .button:not(.ghost):first-of-type{
    background:#73374a!important;
    border-color:#9b5d70!important;
}
.theme-dirty-rabbits .ww-actions .button:hover{
    filter:brightness(1.09);
}

.theme-dirty-rabbits .ww-board-key > summary,
.theme-dirty-rabbits .ww-bonus-legend{
    background:#2a241b!important;
    border-color:#69583f!important;
    color:#eadcc2!important;
}
.theme-dirty-rabbits .ww-board-key .legend-item{
    color:#e8dac0!important;
}

.theme-dirty-rabbits .theme-rule-note{
    background:#39231f!important;
    color:#edd9ba!important;
    border-color:#805342!important;
    box-shadow:inset 3px 0 #9a4d5d;
}

.theme-dirty-rabbits .dirty-surprise-revealed{
    box-shadow:
        inset 0 0 0 2px #9a4d5d,
        inset 0 0 0 4px rgba(202,157,86,.35)!important;
}
.theme-dirty-rabbits .dirty-surprise-marker{
    background:#742f44!important;
    border-color:#e2b667!important;
    color:#fff2d8!important;
    box-shadow:0 1px 4px rgba(0,0,0,.45)!important;
}
.theme-dirty-rabbits .dirty-surprise-legend{
    border-left:3px solid #9a4d5d;
    padding-left:6px;
    background:rgba(121,53,70,.10);
}

@media(max-width:760px){
    body.game-screen:has(.theme-dirty-rabbits) .ww-mobile-tabs{
        background:#201b14!important;
        border-bottom-color:#6d5134!important;
    }
    body.game-screen:has(.theme-dirty-rabbits) .ww-mobile-tabs button{
        color:#cfc0a4!important;
    }
    body.game-screen:has(.theme-dirty-rabbits) .ww-mobile-tabs button.active{
        background:#73374a!important;
        color:#fff2dc!important;
    }
    .theme-dirty-rabbits .ww-mobile-play-status{
        background:#30261d!important;
        border-color:#6d563c!important;
        color:#eee1c9!important;
    }
    .theme-dirty-rabbits .ww-mobile-play-status *{
        color:#eee1c9!important;
    }
    .theme-dirty-rabbits .ww-board-wrap{
        padding:5px!important;
    }
    .theme-dirty-rabbits .ww-rack-panel{
        background:#241f18!important;
    }
}


.theme-dirty-rabbits .dirty-rabbits-rule-key{
    flex:1 0 100%!important;
    width:100%!important;
    border-top:1px solid rgba(199,157,84,.35);
    border-bottom:1px solid rgba(199,157,84,.18);
    padding:5px 0!important;
    line-height:1.25!important;
}
.theme-dirty-rabbits .legend-swatch.dirty-rule{
    min-width:28px;
    width:auto;
    padding:0 4px;
    background:#74364a;
    color:#fff0d7;
    border:1px solid #c59b54;
    border-radius:5px;
    font-size:.48rem;
    font-weight:950;
}


/* =====================================================================
   WordWarren v0.15.12 — desktop score-preview fit
   ===================================================================== */
@media(min-width:761px){
    .ww-rack-row{
        grid-template-columns:68px minmax(0,1fr) 104px!important;
        column-gap:5px!important;
    }

    .ww-rack{
        min-width:0!important;
        overflow:hidden!important;
        gap:3px!important;
    }

    .ww-rack .racktile{
        flex:1 1 0!important;
        min-width:28px!important;
        max-width:40px!important;
    }

    .ww-estimate{
        width:104px!important;
        min-width:104px!important;
        max-width:104px!important;
        height:48px!important;
        padding:3px 6px!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
        display:grid!important;
        grid-template-columns:1fr auto!important;
        grid-template-rows:auto 1fr!important;
        align-items:center!important;
    }

    .ww-estimate .score-preview-label{
        grid-column:1 / -1!important;
        width:100%!important;
        max-width:100%!important;
        margin:0!important;
        overflow:visible!important;
        white-space:normal!important;
    }

    .ww-estimate .score-preview-label-desktop{
        display:flex!important;
        flex-direction:column!important;
        align-items:flex-start!important;
        justify-content:center!important;
        width:100%!important;
        font-size:.43rem!important;
        line-height:.92!important;
        letter-spacing:.035em!important;
        white-space:nowrap!important;
        text-transform:uppercase!important;
    }

    .ww-estimate .score-preview-label-desktop span{
        display:block!important;
        max-width:100%!important;
    }

    .ww-estimate strong{
        grid-column:1!important;
        grid-row:2!important;
        font-size:1.15rem!important;
        line-height:1!important;
    }

    .ww-estimate .score-preview-points{
        grid-column:2!important;
        grid-row:2!important;
        align-self:end!important;
        padding-bottom:2px!important;
        font-size:.38rem!important;
        line-height:1!important;
        white-space:nowrap!important;
    }
}


/* =====================================================================
   WordWarren v0.16.2.2 — mobile viewport lock + complete-board fit
   ===================================================================== */
@media(max-width:760px){
    html,
    body.game-screen{
        width:100%!important;
        max-width:100%!important;
        overflow-x:hidden!important;
        overscroll-behavior-x:none;
    }

    body.game-screen main.game-main,
    .ww-game-v080,
    .ww-game-v080 .ww-play-column,
    .ww-game-v080 .ww-board-wrap,
    .ww-game-v080 .ww-rack-panel{
        min-width:0!important;
        max-width:100vw!important;
        box-sizing:border-box!important;
    }

    .ww-game-v080.mobile-tab-game .ww-board-v080{
        width:min(100%,var(--ww-mobile-board-size,calc(100dvh - 365px)))!important;
        max-width:100%!important;
        height:auto!important;
        aspect-ratio:1 / 1!important;
    }

    .mouse-drag-ghost{
        max-width:48px!important;
        contain:layout paint!important;
    }

    body.drag-active{
        overflow-x:hidden!important;
        touch-action:none!important;
    }
}

/* =====================================================================
   WordWarren v0.16.2.3 — iPhone viewport containment + compact game tab
   ===================================================================== */
@media(max-width:760px){
    html:has(body.game-screen),
    body.game-screen{
        width:100%!important;
        max-width:100%!important;
        overflow-x:clip!important;
        overscroll-behavior-x:none!important;
        touch-action:pan-y pinch-zoom!important;
    }

    body.game-screen main.game-main,
    .game-screen-shell,
    .ww-game-v080,
    .ww-game-v080 .ww-play-column{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        overflow-x:clip!important;
    }

    /* Full-bleed mobile elements previously used width > 100%, which Safari
       could expose as a sideways draggable canvas. Keep them inside the layout. */
    .ww-mobile-tabs{
        width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
    }
    .ww-game-v080.mobile-tab-game .ww-rack-panel{
        width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
    }

    /* Theme/Dictionary detail belongs in secondary information on a phone;
       the live Game surface is scores + board + rack/actions. */
    .ww-game-v080.mobile-tab-game .ww-active-content-card{
        display:none!important;
    }

    .ww-game-v080.mobile-tab-game .ww-board-wrap{
        overflow:hidden!important;
    }
    .ww-game-v080.mobile-tab-game .ww-board-v080{
        width:min(100%,var(--ww-mobile-board-size,calc(100dvh - 420px)))!important;
        max-width:100%!important;
    }

    .ww-rack .racktile.chosen{
        outline-offset:-3px!important;
    }

    .ww-rack,
    .ww-rack .racktile,
    .ww-board-v080,
    .ww-board-v080 [data-board-cell]{
        max-width:100%!important;
    }

    body.drag-active,
    html:has(body.drag-active){
        overflow-x:clip!important;
        overscroll-behavior:none!important;
        touch-action:none!important;
    }
}

.history-player{
    margin-right:.35rem;
}

/* v0.16.2.4: rack point values are intentionally easier to read; board values are unchanged. */
.racktile .tile-points,.ww-rack .racktile .tile-points,.dock-rack .racktile .tile-points{font-size:.72rem!important;font-weight:850!important;line-height:1!important}
.nav-inline-form{display:inline;margin:0}.nav-link-button{background:none;border:0;color:#dfe8ee;font:inherit;cursor:pointer;padding:0}.mobile-menu-heading{display:block;padding:.7rem .75rem .25rem;color:var(--muted);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}.mobile-menu-panel form{margin:0}.mobile-menu-panel form button{width:100%;text-align:left;background:none;border:0;font:inherit;padding:.65rem .75rem;color:inherit;cursor:pointer}

/* =====================================================================
   WordWarren v0.16.2.7 — flexible advertising + deliberate final state
   ===================================================================== */
.ww-ad-slot{
    width:100%;box-sizing:border-box;margin:7px 0;border-radius:11px;
}
.ww-house-ad{
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
    padding:10px 12px;border:1px solid #d7b46e;background:linear-gradient(100deg,#17352c,#21493b);color:#f8f2e7;
    box-shadow:0 4px 12px rgba(0,0,0,.10);
}
.ww-ad-label{font-size:.48rem;font-weight:950;letter-spacing:.12em;color:#e5bd73;white-space:nowrap}
.ww-house-ad-copy{min-width:0;display:grid;gap:2px}.ww-house-ad-copy strong{font-size:.75rem}.ww-house-ad-copy span{font-size:.58rem;color:#d8e1dc;line-height:1.25}
.ww-house-ad-cta{display:inline-flex;align-items:center;justify-content:center;min-height:31px;padding:5px 9px;border-radius:8px;background:#ed7043;color:#fff;text-decoration:none;font-size:.58rem;font-weight:900;white-space:nowrap}
.ww-served-ad{min-height:50px;padding:6px;border:1px dashed var(--line);background:var(--card)}

.ww-final-rack-panel .ww-rack-row{grid-template-columns:auto minmax(0,1fr)!important}
.ww-final-rack-panel .ww-rack-title{min-width:74px}
.ww-final-rack-panel .racktile{cursor:default}

@media(max-width:760px){
    .ww-game-v080:has(.ww-finished-banner) .ww-finished-banner{order:1!important}
    .ww-game-v080:has(.ww-finished-banner) .ww-ad-slot[data-ad-placement="interstitial_results"]{order:2!important}
    .ww-game-v080:has(.ww-finished-banner) .ww-mobile-game-identity{order:3!important}
    .ww-game-v080:has(.ww-finished-banner) .ww-score-row{order:4!important}
    .ww-game-v080:has(.ww-finished-banner) .ww-board-wrap{order:5!important}
    .ww-game-v080:has(.ww-finished-banner) .ww-rack-panel{order:6!important}
    .ww-house-ad{grid-template-columns:minmax(0,1fr) auto;padding:8px 9px;gap:7px}
    .ww-house-ad .ww-ad-label{display:none}
    .ww-house-ad-copy strong{font-size:.66rem}.ww-house-ad-copy span{font-size:.52rem}
    .ww-house-ad-cta{font-size:.53rem;min-height:29px;padding:4px 8px}
    .ww-final-rack-panel{padding-top:5px!important;padding-bottom:5px!important}
    .ww-final-rack-panel .ww-rack-row{grid-template-columns:58px minmax(0,1fr)!important;align-items:center!important}
    .ww-final-rack-panel .ww-rack-title small{display:block!important;font-size:.47rem!important}
}

/* =====================================================================
   WordWarren v0.16.2.15 — consolidated desktop gameplay layout
   One stable CSS layout replaces the accumulated 16.2.8–16.2.14 overrides.
   No resize observers, no continuously measured dimensions, and no sticky/fixed
   rack. Desktop board size is constrained by both viewport width and height so
   the rack and turn actions remain in normal flow and visible on typical screens.
   Mobile rules above this block remain untouched.
   ===================================================================== */

/* Persistent game advertising stays a normal full-width row. */
.ww-game-v080 > .ww-ad-slot[data-ad-placement="banner_game"]{
    max-width:100%;
    min-width:0;
    overflow:hidden;
    box-sizing:border-box;
}

@media(min-width:761px){
    body.game-screen{
        --ww-side-width:220px;
        --ww-stage-gap:56px;
        /* Keep the complete play controls in the first viewport. The board is
           the only element allowed to give up vertical space. A wider real
           gutter also prevents sidebar cards/shadows from visually intruding
           into the score, board or rack column. */
        --ww-board-size:min(
            620px,
            calc(100dvh - 430px),
            calc(100vw - 344px)
        );
    }

    body.game-screen main.game-main{
        width:min(calc(var(--ww-board-size) + var(--ww-side-width) + var(--ww-stage-gap)),calc(100vw - 32px))!important;
        max-width:100%!important;
        margin:0 auto!important;
        padding-left:0!important;
        padding-right:0!important;
        box-sizing:border-box!important;
    }

    .ww-game-v080{
        display:flex!important;
        flex-direction:column!important;
        align-items:stretch!important;
        gap:7px!important;
        width:100%!important;
        max-width:100%!important;
        margin:0 auto!important;
        min-width:0!important;
    }

    .ww-game-v080 > .ww-ad-slot[data-ad-placement="banner_game"],
    .ww-game-v080 > .ww-ad-slot[data-ad-placement="interstitial_results"],
    .ww-game-v080 > .ww-finished-banner{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        align-self:stretch!important;
        box-sizing:border-box!important;
    }

    .ww-desktop-game-identity{
        display:flex!important;
        align-items:center!important;
        gap:7px!important;
        width:100%!important;
        min-width:0!important;
        box-sizing:border-box!important;
        padding:2px 2px 0!important;
        font-size:.91rem!important;
        line-height:1.15!important;
        color:var(--ink,#16222b)!important;
        white-space:nowrap!important;
        overflow:hidden!important;
    }
    .ww-desktop-game-identity strong,
    .ww-desktop-game-identity span{
        min-width:0!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }
    .ww-desktop-game-identity strong{flex:0 1 auto!important}
    .ww-desktop-game-identity span:last-child{flex:1 1 auto!important}

    .ww-desktop-play-status{
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        gap:12px!important;
        width:100%!important;
        min-height:34px!important;
        padding:6px 10px!important;
        box-sizing:border-box!important;
        border:1px solid #d9d3c7!important;
        border-radius:9px!important;
        background:#fffdf8!important;
        font-size:.78rem!important;
        line-height:1.15!important;
    }
    .ww-desktop-play-status > span:first-child{
        min-width:0!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }
    .ww-desktop-play-status > span:last-child{
        flex:0 0 auto!important;
        color:var(--muted,#66727a)!important;
        font-weight:750!important;
        white-space:nowrap!important;
    }
    .ww-desktop-play-status.err{border-color:#b65d5d!important}
    .ww-desktop-play-status.ok{border-color:#6b9d83!important;background:#f5fbf7!important}

    .ww-desktop-stage{
        display:grid!important;
        grid-template-columns:minmax(0,var(--ww-board-size)) var(--ww-side-width)!important;
        gap:var(--ww-stage-gap)!important;
        justify-content:center!important;
        align-items:start!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }
    .ww-desktop-stage > .ww-play-column{
        width:var(--ww-board-size)!important;
        max-width:var(--ww-board-size)!important;
        min-width:0!important;
    }

    /* Scores belong to the play column, never the sidebar. */
    .ww-play-column > .ww-score-row{
        display:grid!important;
        grid-template-columns:repeat(var(--ww-player-count,4),minmax(0,1fr))!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        gap:5px!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    .ww-play-column > .ww-score-row > .ww-score-card{
        width:auto!important;
        max-width:none!important;
        min-width:0!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    .ww-play-column > .ww-score-row .ww-score-main,
    .ww-play-column > .ww-score-row .ww-score-player{
        min-width:0!important;
        max-width:100%!important;
    }
    .ww-play-column > .ww-score-row .ww-score-player b{
        min-width:0!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }
    .ww-desktop-stage > .ww-side-column{
        width:var(--ww-side-width)!important;
        max-width:var(--ww-side-width)!important;
        min-width:0!important;
        max-height:calc(100dvh - 190px)!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        scrollbar-width:thin;
    }
    .ww-side-column > *{
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box!important;
    }
    .ww-desktop-stage > .ww-side-column{
        position:relative!important;
        z-index:1!important;
    }
    .ww-desktop-stage > .ww-play-column{
        position:relative!important;
        z-index:2!important;
    }

    /* One identity/status area only. */
    .ww-play-column > .ww-game-title,
    .ww-play-column > .ww-active-content-card,
    .ww-side-column > .ww-tiles-left-card,
    .ww-side-column > .ww-current-card,
    .ww-side-column > .ww-turn-status{
        display:none!important;
    }

    /* Board size is the single responsive dimension. */
    .ww-board-wrap,
    .ww-board-v080,
    .ww-board-key,
    .ww-rack-panel,
    .ww-control-row{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        box-sizing:border-box!important;
    }
    .ww-board-v080{
        height:auto!important;
        aspect-ratio:1 / 1!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }
    .ww-board-key{
        margin-top:4px!important;
        margin-bottom:4px!important;
    }

    /* Rack is ordinary flow content: no sticky/fixed positioning. The grid
       gives score preview its own real column so it cannot overlap the tiles. */
    .ww-rack-panel{
        position:static!important;
        inset:auto!important;
        margin-top:0!important;
        overflow:visible!important;
    }
    .ww-rack-panel .ww-rack-row{
        display:grid!important;
        grid-template-columns:52px minmax(0,1fr) 80px!important;
        align-items:center!important;
        gap:5px!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        padding:5px 6px!important;
        overflow:visible!important;
        box-sizing:border-box!important;
    }
    .ww-rack-title{
        min-width:0!important;
        overflow:hidden!important;
    }
    .ww-rack-title small,
    .ww-rack-title b{
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }
    .ww-rack{
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        flex-wrap:nowrap!important;
        gap:4px!important;
        min-width:0!important;
        width:100%!important;
        max-width:100%!important;
        overflow:visible!important;
    }
    .ww-rack .racktile{
        flex:0 1 40px!important;
        width:40px!important;
        min-width:32px!important;
        max-width:40px!important;
        height:40px!important;
        min-height:40px!important;
    }
    .ww-rack-panel .ww-estimate{
        position:static!important;
        inset:auto!important;
        width:80px!important;
        min-width:80px!important;
        max-width:80px!important;
        height:auto!important;
        min-height:48px!important;
        padding:4px 5px!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
        display:grid!important;
        grid-template-columns:1fr auto!important;
        grid-template-rows:auto auto!important;
        align-items:center!important;
        column-gap:3px!important;
    }
    .ww-rack-panel .ww-estimate .score-preview-label{
        grid-column:1 / -1!important;
        grid-row:1!important;
        min-width:0!important;
        font-size:.42rem!important;
        line-height:1!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }
    .ww-rack-panel .ww-estimate .score-preview-label-desktop{display:inline!important}
    .ww-rack-panel .ww-estimate .score-preview-label-mobile{display:none!important}
    .ww-rack-panel .ww-estimate strong{
        grid-column:1!important;
        grid-row:2!important;
        min-width:0!important;
        line-height:1!important;
    }
    .ww-rack-panel .ww-estimate .score-preview-points{
        grid-column:2!important;
        grid-row:2!important;
        font-size:.47rem!important;
        white-space:nowrap!important;
    }
    .ww-rack-panel .ww-estimate #specialistPreview{
        display:none!important;
    }

    .ww-control-row{
        margin-top:3px!important;
        padding-top:3px!important;
        padding-bottom:0!important;
    }
    .ww-actions{
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        flex-wrap:wrap!important;
        gap:5px!important;
        min-width:0!important;
    }
    .ww-actions form{
        display:flex!important;
        align-items:center!important;
        gap:5px!important;
        margin:0!important;
    }

    body.game-screen .site-footer{
        display:flex!important;
        position:static!important;
        clear:both!important;
        float:none!important;
        width:min(calc(var(--ww-board-size) + var(--ww-side-width) + var(--ww-stage-gap)),calc(100vw - 32px))!important;
        max-width:100%!important;
        margin:12px auto 0!important;
        padding:12px 0 22px!important;
        box-sizing:border-box!important;
        border-top:1px solid #ded8cc!important;
    }
}

/* On narrower landscape/tablet widths the sidebar moves below rather than
   stealing board space. Mobile <=760px retains the established mobile UI. */
@media(min-width:761px) and (max-width:899px){
    body.game-screen{
        --ww-board-size:min(590px,calc(100dvh - 430px),calc(100vw - 32px));
    }
    .ww-desktop-stage{
        grid-template-columns:minmax(0,var(--ww-board-size))!important;
    }
    .ww-desktop-stage > .ww-side-column{
        width:var(--ww-board-size)!important;
        max-width:var(--ww-board-size)!important;
        max-height:none!important;
        overflow:visible!important;
    }
}

@media(max-width:760px){
    .ww-game-v080 > .ww-ad-slot[data-ad-placement="banner_game"]{
        margin:3px 0!important;
    }
    body.game-screen .site-footer{display:flex!important}
}

/* =====================================================================
   WordWarren desktop sidebar visual clearance
   Geometry already provides a true 32px gutter. Remove wide card shadows
   that visually bleed back into the play column.
   ===================================================================== */
@media (min-width:761px){
    .ww-desktop-stage > .ww-side-column > .card{
        box-shadow:none!important;
    }
}
