/* Sideweave playfield only; the shared presentation owns its chrome and footer. */
/* The toolbar owns the bottom row. A flexible board row absorbs viewport
   height without lifting the controls or stretching the word display. */
.page-sideweave .sw-stage {
 display:grid;grid-template-columns:minmax(0,1fr);
 grid-template-rows:minmax(0,1fr) 10px 46px 76px 20px 46px;
 align-items:center;justify-items:center;container-type:size;
 flex:1 1 0;width:100%;height:100%;min-width:0;min-height:0;
 gap:clamp(4px,.7vh,9px);padding:4px 0 8px;box-sizing:border-box;
}
/* Both wrappers flatten into the existing six-row desktop grid. Mobile alone
   turns them into actual flex layout groups. */
.page-sideweave .sw-board-group,
.page-sideweave .sw-info {display:contents;}
.page-sideweave .sw-board-host {
 display:flex;align-items:flex-end;justify-content:center;
 width:min(100cqw,var(--float-square-size,520px),max(110px,calc(100cqh - 275px)));
 height:auto;aspect-ratio:1/1;align-self:end;
 min-width:0;min-height:0;max-height:100%;
}
.page-sideweave .sw-rule {
 box-sizing:border-box;width:min(28%,150px);height:1px;
 background:linear-gradient(90deg,transparent,
  color-mix(in srgb,var(--sw-ring,#9EA9AD) 38%,transparent),transparent);
}
.page-sideweave .sw-board {
 display:block;width:100%;height:100%;max-width:100%;max-height:100%;
 aspect-ratio:1/1;overflow:visible;touch-action:none;user-select:none;-webkit-user-select:none;
}
.page-sideweave .sw-arc {stroke:var(--sw-ring,#9EA9AD);fill:none;stroke-width:2;stroke-linecap:butt;pointer-events:none;}
.page-sideweave {--sw-used-ink:color-mix(in srgb,var(--text,#25282D) 26%,var(--surface,#fff));}
.page-sideweave .sw-path {stroke:var(--sw-used-ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;fill:none;opacity:.62;pointer-events:none;}
/* The accepted-word trace is only a whisper above the existing paths;
   the full path is still revealed by the separate WAAPI effects layer. */
.page-sideweave .sw-path.sw-path-accept {
 stroke:color-mix(in srgb,var(--game-ink,#3A7F82) 48%,var(--surface,#fff));
 stroke-width:3.3;opacity:0;
}
@media(prefers-reduced-motion:reduce){
 .page-sideweave .sw-path.sw-path-accept{display:none}
}
.page-sideweave .sw-path.current {stroke:var(--game-ink,#3A7F82);opacity:.35;stroke-width:3.6;}
.page-sideweave .sw-pip {fill:var(--sw-ring,#9EA9AD);stroke:none;pointer-events:none;transition:fill .15s ease,r .15s ease;}
.page-sideweave .sw-pip.used:not(.active) {fill:var(--sw-used-ink);}
.page-sideweave .sw-pip.active {fill:var(--game-ink,#3A7F82);r:9.6;}
.page-sideweave .sw-letter {cursor:pointer;outline:none;}
.page-sideweave .sw-letter circle {fill:transparent;stroke:transparent;stroke-width:2;filter:none!important;transition:fill .12s ease,stroke .12s ease;}
.page-sideweave .sw-letter text {
 fill:var(--text,#25282D);font-family:inherit;font-size:28px;
 font-weight:690;text-anchor:middle;dominant-baseline:middle;
 paint-order:normal;stroke:none!important;filter:none!important;text-shadow:none!important;pointer-events:none;
}
.page-sideweave .sw-letter.used:not(.active) text {fill:color-mix(in srgb,var(--text,#25282D) 36%,var(--surface,#fff));}
.page-sideweave .sw-letter.active circle {fill:color-mix(in srgb,var(--game-ink,#3A7F82) 13%,var(--surface,#fff));}
.page-sideweave .sw-letter.active text {fill:var(--game-ink,#3A7F82);font-weight:850;}
.page-sideweave .sw-letter:focus-visible circle {stroke:var(--game-ink,#3A7F82);}
@media(hover:hover){.page-sideweave .sw-letter:hover circle{fill:color-mix(in srgb,var(--game-ink,#3A7F82) 8%,transparent);}}
.page-sideweave .sw-word {box-sizing:border-box;width:100%;height:46px;min-width:0;
 font-size:clamp(24px,3.1vw,32px);font-weight:735;letter-spacing:.09em;
 line-height:46px;text-align:center;color:var(--text,#222);
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.page-sideweave .sw-word.is-empty {font-weight:500;letter-spacing:0;color:var(--muted,#737980);font-size:13px;}
.page-sideweave .sw-found {box-sizing:border-box;width:100%;height:76px;min-height:0;
 display:flex;gap:5px 7px;flex-wrap:wrap;justify-content:center;align-content:center;
 align-items:center;max-width:100%;overflow-y:auto;scrollbar-width:thin;}
.page-sideweave .sw-chip {position:relative;left:0;top:0;
 font-size:clamp(16px,2vw,18px);font-weight:725;
 letter-spacing:.035em;line-height:1.2;border-radius:20px;
 border:1px solid var(--line,#ddd);padding:5px 11px;
 color:var(--text,#222);background:var(--surface,#fff);}
/* The travelling accepted word is a temporary, non-interactive viewport
   overlay, so it cannot push the board, bank, controls or progress bar. */
.sw-word-flight {
 position:fixed;z-index:90;display:flex;align-items:center;
 justify-content:center;box-sizing:border-box;margin:0;padding:0;
 background:transparent;color:var(--text,#25282D);border:0;
 text-align:center;white-space:nowrap;pointer-events:none;
 user-select:none;-webkit-user-select:none;
 transform-origin:center center;will-change:transform,opacity;
}
.page-sideweave .sw-toolbar {position:relative;display:flex;align-items:center;
 justify-content:center;width:min(100%,530px);min-width:0;height:46px;}
.page-sideweave .sw-controls {display:flex;justify-content:center;gap:8px;
 flex-wrap:nowrap;align-items:center;margin:0;padding:0;min-width:0;}
.page-sideweave .sw-restart {position:absolute;right:0;top:50%;
 transform:translateY(-50%);font-size:12px;min-width:0;padding-inline:12px;}
.page-sideweave .sw-controls .tg-game-button {min-width:80px;}
/* Disabled word actions are unavailable, not loading. */
.page-sideweave .sw-controls .tg-game-button:disabled {cursor:default;}
.page-sideweave .sw-hint {box-sizing:border-box;width:100%;height:20px;
 font-size:12px;line-height:20px;white-space:nowrap;overflow:hidden;
 text-overflow:ellipsis;text-align:center;color:var(--muted,#737980);margin:0;}
.page-sideweave .sw-hint[data-error="true"] {color:#B96861;}
/* Explicit sizing belongs on the outer presentation preview. Its former
   auto-width flex item made the child's percentage width shrink unpredictably. */
.page-sideweave .tg-game-intro .tg-game-stage-preview {
 box-sizing:border-box;display:flex;flex-direction:column;align-items:center;
 width:min(100%,var(--float-square-size,520px));max-width:100%;min-width:0;
}
.page-sideweave .sw-preview {display:flex;align-items:center;justify-content:center;
 flex-direction:column;gap:9px;width:100%;margin:0 auto;}
.page-sideweave .sw-preview .sw-board {
 width:100%;height:auto;max-height:none;opacity:.8;pointer-events:none;
}
.page-sideweave .sw-preview p{max-width:380px;text-align:center;margin:0;color:var(--muted,#737980);font-size:14px;line-height:1.5;}
.page-sideweave .sw-stage[hidden],.page-sideweave .sw-preview[hidden]{display:none;}
html[data-theme="dark"] .page-sideweave {--sw-ring:#859398;}
@media(min-width:701px) and (max-height:740px){
 .page-sideweave .sw-stage {
  gap:4px;padding-bottom:6px;
  grid-template-rows:minmax(0,1fr) 8px 36px 52px 18px 42px;
 }
 .page-sideweave .sw-board-host{
  width:min(100cqw,var(--float-square-size,520px),max(100px,calc(100cqh - 210px)));
 }
 .page-sideweave .sw-word {height:36px;line-height:36px;font-size:24px;}
 .page-sideweave .sw-found {height:52px;}
 .page-sideweave .sw-hint {height:18px;line-height:18px;}
 .page-sideweave .sw-toolbar {height:42px;}
}
@media(max-width:600px){
 .page-sideweave .sw-stage {gap:5px;padding-bottom:8px;}
 .page-sideweave .sw-board {max-width:100%;}
 .page-sideweave .sw-controls {gap:6px;}
 .page-sideweave .sw-controls .tg-game-button {min-width:73px;padding-inline:12px;}
 .page-sideweave .sw-restart {padding-inline:8px;}
}

/* The word chain is game content; distribution framing belongs to
 * the shared result-chart component in game-presentation.css. */
.page-sideweave .sw-solved-list{
 display:flex;justify-content:center;flex-wrap:wrap;gap:7px;
 max-width:100%;margin:16px auto 0;
}
.page-sideweave .sw-solved-chip{
 padding:7px 11px;border:1px solid var(--line);
 border-radius:20px;background:var(--surface-soft);
 font-weight:750;font-size:14px;letter-spacing:.045em;color:var(--text);
}
@media(max-width:480px){
 .page-sideweave .sw-solved-chip{font-size:13px;padding:6px 9px;}
}

/* Modal chrome is shared via tegazumiDialogs. Sideweave owns content only. */
.sw-yesterday-modal .sw-yesterday-board{display:flex;justify-content:center;align-items:center;
 padding:5px 0 15px}
.sw-yesterday-modal .sw-yesterday-board .sw-board{width:min(100%,220px);
 height:auto;aspect-ratio:1;pointer-events:none}
.sw-yesterday-modal .sw-yesterday-answers{display:grid;gap:17px;text-align:center}
.sw-yesterday-modal .sw-answer-row{display:flex;flex-direction:column;align-items:center;
 gap:7px;min-width:0}
.sw-yesterday-modal .sw-answer-label{font-size:11px;font-weight:680;color:var(--muted)}
.sw-yesterday-modal .sw-answer-word-bank{display:flex;flex-wrap:wrap;align-items:center;
 justify-content:center;gap:6px;max-width:100%}
.sw-yesterday-modal .sw-answer-token{display:inline-flex;align-items:center;
 justify-content:center;max-width:100%;border:1px solid var(--line);
 border-radius:20px;padding:5px 11px;font-size:14px;line-height:1.2;
 font-weight:730;letter-spacing:.03em;color:var(--text);background:var(--surface);
 overflow-wrap:anywhere}
.sw-yesterday-modal .sw-answer-reference .sw-answer-token{font-size:clamp(19px,3vw,24px);
 padding:7px 15px;font-weight:770}
.sw-yesterday-modal .sw-answer-reference .sw-answer-label{font-size:12px}
.sw-yesterday-modal .sw-answer-count{color:var(--muted);font-size:11px;
 font-variant-numeric:tabular-nums}
.sw-yesterday-modal .sw-yesterday-subheading{font-size:12px;font-weight:760;
 margin:12px 0 0;color:var(--muted)}
.sw-yesterday-modal .sw-yesterday-empty,.sw-yesterday-modal .sw-yesterday-message{
 margin:0;color:var(--muted);font-size:12px;line-height:1.5;text-align:center}
@media(max-width:520px){
 .sw-yesterday-modal .sw-yesterday-board .sw-board{width:min(100%,190px)}
 .sw-yesterday-modal .sw-answer-token{font-size:12px;padding:5px 9px}
}

/* Desktop Sideweave: reclaim space previously reserved unnecessarily inside
   the game stage. Controls move down as the actual SVG grows, not via offsets. */
@media (min-width:701px) and (min-height:741px) and (max-height:1150px){
 .page-sideweave .sw-stage{
  grid-template-rows:minmax(0,1fr) 7px 40px 55px 18px 43px;
  gap:clamp(3px,.48vh,6px);padding:0 0 3px;
 }
 .page-sideweave .sw-board-host{
  width:min(100cqw,620px,max(140px,calc(100cqh - 194px)));
 }
 .page-sideweave .sw-word{height:40px;line-height:40px}
 .page-sideweave .sw-found{height:55px}
 .page-sideweave .sw-hint{height:18px;line-height:18px}
 .page-sideweave .sw-toolbar{height:43px}
}

/* Shared Sideweave help SVG: illuminated leading stroke and moving tip. */
.tg-help-sideweave .sw-path.current{
 stroke:#67cccc;opacity:.92;stroke-width:3.7;
 transition:none;filter:drop-shadow(0 0 2px #7ee3e3a0);
}

/* Responsive Sideweave architecture: the board and its word display form one
   centred unit. The toolbar is a separate bottom anchor. No grid row offsets
   or invisible spacer rows: a single flexible parent owns the free height. */
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-stage{
   display:flex;flex-direction:column;align-items:center;justify-content:stretch;
   gap:0;box-sizing:border-box;
   padding:0 0 1px;width:100%;height:100%;min-height:0;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-group{
   display:flex;flex:1 1 auto;min-height:0;min-width:0;width:100%;
   flex-direction:column;align-items:center;justify-content:center;
   gap:clamp(3px,.55dvh,7px);
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-host{
   display:flex;flex:0 1 auto;align-items:center;justify-content:center;
   align-self:center;min-width:0;min-height:0;
   width:min(calc(100cqw - 6px),var(--float-square-size,530px),
     max(90px,calc(100cqh - 175px)));
   height:auto;aspect-ratio:1/1;max-width:100%;max-height:100%;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-info{
   display:flex;flex:0 0 auto;flex-direction:column;align-items:center;
   justify-content:center;min-width:0;width:min(100%,530px);
   max-width:100%;gap:3px;margin:0;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-rule{
   flex:0 0 1px;width:min(23%,125px);
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-word{
   flex:0 0 34px;height:34px;line-height:34px;
   font-size:clamp(20px,5.7vw,25px);
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-word.is-empty{
   font-size:13px;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-found{
   flex:0 0 38px;height:38px;min-height:0;overflow-y:auto;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-hint{
   flex:0 0 16px;height:16px;line-height:16px;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
   display:flex;flex:0 0 42px;align-items:center;align-self:center;
   justify-content:center;position:relative;
   width:min(100%,530px);height:42px;margin:0;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls{
   gap:5px;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls .tg-game-button{
   min-width:0;min-height:40px;padding:6px 10px;font-size:12px;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-restart{
   min-height:40px;padding:6px 9px;font-size:11px;
 }
}
@media(max-width:360px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-host{
   width:min(calc(100cqw - 6px),var(--float-square-size,530px),
     max(90px,calc(100cqh - 205px)));
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
   flex-basis:66px;height:66px;align-items:flex-start;
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-restart{
   top:auto;bottom:0;transform:none;
 }
}


/* Plus Daily Archive uses the same game actions, native dialog and badge
   vocabulary as the rest of Tegazumi. Everything is read-only until Play. */
.page-sideweave .sw-archive-button{
 display:inline-flex;align-items:center;justify-content:center;gap:9px;
 white-space:nowrap;
}
.page-sideweave .sw-archive-plus{
 width:17px;height:17px;flex:none;font-size:14px;letter-spacing:0;
}
.sw-archive-modal .tg-dialog-content{
 display:flex;flex-direction:column;align-items:stretch;gap:13px;
 max-height:min(76dvh,690px);overflow-y:auto;
}
.sw-archive-modal .sw-archive-picker{
 display:flex;align-items:center;justify-content:center;gap:11px;
}
.sw-archive-modal .sw-archive-date{
 width:min(210px,100%);min-width:0;padding:10px 12px;
 background:var(--surface);color:var(--text);
 border:1px solid var(--line);border-radius:10px;
 font:inherit;font-size:13px;color-scheme:light dark;
}
.sw-archive-modal .sw-archive-arrow{
 display:inline-flex;justify-content:center;align-items:center;
 min-width:40px;width:40px;height:40px;padding:0;
 line-height:0;flex:none;
}
.sw-archive-modal .sw-archive-note{
 font-size:12px;line-height:1.5;color:var(--muted);text-align:center;margin:0;
}
.sw-archive-modal .sw-archive-board{
 display:flex;justify-content:center;align-items:center;
 max-height:170px;min-height:0;
}
.sw-archive-modal .sw-archive-board .sw-board{
 display:block;width:min(100%,165px);height:auto;aspect-ratio:1;
 pointer-events:none;
}
.sw-archive-modal .sw-archive-standings{
 border:1px solid var(--line);border-radius:12px;background:var(--surface);
 min-height:60px;
}
.sw-archive-modal .sw-archive-heading{
 display:flex;justify-content:space-between;align-items:baseline;
 gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);
}
.sw-archive-modal .sw-archive-heading h3{
 margin:0;color:var(--text);font-size:13px;font-weight:650;
}
.sw-archive-modal .sw-archive-count{
 color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums;
}
.sw-archive-modal .sw-archive-rows{
 list-style:none;margin:0;padding:0;max-height:210px;overflow:auto;
}
.sw-archive-modal .sw-archive-entry{
 display:grid;grid-template-columns:35px minmax(0,1fr) auto;
 align-items:center;gap:9px;padding:9px 14px;font-size:12px;
}
.sw-archive-modal .sw-archive-entry+.sw-archive-entry{border-top:1px solid var(--line)}
.sw-archive-modal .sw-archive-rank{color:var(--muted);font-variant-numeric:tabular-nums}
.sw-archive-modal .sw-archive-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:620}
.sw-archive-modal .sw-archive-score{font-variant-numeric:tabular-nums;white-space:nowrap}
.sw-archive-modal .sw-archive-empty{
 padding:15px;text-align:center;font-size:12px;color:var(--muted);
}
.sw-archive-modal .sw-archive-play{
 width:100%;min-height:42px;
}
.page-sideweave .sw-archive-result{
 margin:13px auto;color:var(--text);font-size:13px;line-height:1.55;
 text-align:center;max-width:540px;
}
.page-sideweave .sw-archive-review{
 display:inline-flex;justify-content:center;align-items:center;
}
.sw-archive-modal .sw-archive-play:disabled,
.sw-archive-modal .sw-archive-arrow:disabled{opacity:.43;cursor:default}
@media(max-width:520px){
 .sw-archive-modal .tg-dialog-content{gap:10px;max-height:75dvh}
 .sw-archive-modal .sw-archive-board{max-height:130px}
 .sw-archive-modal .sw-archive-board .sw-board{width:130px}
 .sw-archive-modal .sw-archive-date{width:min(170px,100%);padding:9px}
 .sw-archive-modal .sw-archive-picker{gap:6px}
 .sw-archive-modal .sw-archive-arrow{width:36px;min-width:36px}
}


.sw-archive-modal .sw-archive-what-if{
 background:var(--plus-soft,#e9dff8);color:var(--plus-ink,#6d4f91);
 border:1px dashed currentColor;border-radius:7px;margin:4px;
 font-weight:650;
}
.sw-archive-modal .sw-archive-what-if .sw-archive-name{font-weight:740}


/* Archive modal reserves exactly the same space on every date. */
.sw-archive-modal .tg-dialog-content{min-height:510px}
.sw-archive-modal .sw-archive-note{min-height:36px;display:grid;place-items:center}
.sw-archive-modal .sw-archive-board{height:170px;min-height:170px}
.sw-archive-modal .sw-archive-standings{height:258px;min-height:258px;display:flex;flex-direction:column;overflow:hidden}
.sw-archive-modal .sw-archive-rows{flex:1;min-height:0;overflow-y:auto;max-height:none}
.sw-archive-modal .sw-archive-chevron{
 display:block;width:18px;height:18px;flex:none;
}
.sw-archive-modal .sw-archive-board.is-loading::before{
 content:"";display:block;width:150px;height:150px;border-radius:9px;
 background:var(--surface-secondary,var(--surface));opacity:.5;
}
.sw-archive-modal .sw-archive-placeholder{height:36px;box-sizing:border-box}
.sw-archive-modal .sw-archive-placeholder+.sw-archive-placeholder{border-top:1px solid var(--line)}
.sw-archive-modal .sw-archive-standings.is-loading .sw-archive-rows{
 visibility:hidden;
}
@media(max-width:520px){
 .sw-archive-modal .tg-dialog-content{min-height:430px}
 .sw-archive-modal .sw-archive-board{height:130px;min-height:130px}
 .sw-archive-modal .sw-archive-standings{height:225px;min-height:225px}
 .sw-archive-modal .sw-archive-board.is-loading::before{width:115px;height:115px}
}


/* All Daily Archives are a Plus benefit, not an active Free control. */
.tg-game-page .tg-game-intro .tg-game-actions .sw-archive-button[data-plus-locked="true"]{
 background:var(--surface-soft)!important;
 border-color:var(--line)!important;
 color:var(--muted)!important;
 opacity:.48;box-shadow:none!important;
 cursor:not-allowed;transform:none!important;
}
.tg-game-page .tg-game-intro .tg-game-actions .sw-archive-button[data-plus-locked="true"] .sw-archive-plus{
 background:var(--surface-tertiary,var(--surface))!important;
 color:var(--muted)!important;
}

/* Saved word controls and read-only board reference. */
.page-sideweave .sw-words-button{
 position:absolute;left:0;top:50%;transform:translateY(-50%);
 min-width:0;padding:0 10px;font-size:12px;white-space:nowrap
}
.sw-words-modal .tg-dialog-content{
 display:flex;flex-direction:column;align-items:stretch;gap:18px;
 padding-top:10px
}
.sw-words-modal .sw-words-message{
 margin:0 0 3px;text-align:center;font-size:12px;line-height:1.5;color:var(--muted)
}
.sw-words-modal .sw-words-list{
 display:flex;align-items:center;align-content:flex-start;justify-content:center;
 flex-wrap:wrap;gap:9px;width:100%;min-height:35px;
 max-height:220px;overflow-y:auto;padding:3px 0 5px
}
.sw-words-modal .sw-words-entry{
 border:1px solid var(--line);border-radius:999px;
 background:var(--surface-soft);color:var(--text);
 padding:8px 13px;font:750 12px/1.25 system-ui;cursor:pointer
}
.sw-words-modal .sw-words-entry.is-selected{
 border-color:var(--game-ink,#3A7F82);
 background:color-mix(in srgb,var(--game-ink,#3A7F82) 13%,var(--surface))
}
.sw-words-modal .sw-words-board{
 display:grid;place-items:center;width:min(100%,270px);
 max-height:270px;aspect-ratio:1;margin:9px auto 0
}
.sw-words-modal .sw-words-board .sw-board{width:100%;height:100%;pointer-events:none}
.sw-words-modal .sw-words-board .sw-path.sw-path-review{
 stroke:var(--game-ink,#3A7F82);stroke-width:5;opacity:1
}

@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
  gap:4px;justify-content:space-between
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-words-button,
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-restart{
  position:static;inset:auto;transform:none;flex:0 0 auto
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls{
  flex:1 1 auto;min-width:0;gap:4px
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar .tg-game-button{
  min-width:0;min-height:40px;padding-inline:clamp(4px,1vw,9px);
  font-size:clamp(9px,2.5vw,12px);white-space:nowrap
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .float-title-emblem{
  transition:opacity .22s ease
 }
 /* The Sideweave mark now lives behind the board like every other game.
    The legacy overlap indicator must not hide it altogether on phones. */
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .float-title-emblem.sw-board-overlap{
  opacity:.07!important
 }
}
@media(max-width:360px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
  height:42px;flex-basis:42px;align-items:center
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-restart{
  position:static;inset:auto;transform:none
 }
}

@media(max-width:520px){
 .sw-words-modal .tg-dialog-content{gap:14px;padding-top:10px}
 .sw-words-modal .sw-words-list{max-height:160px;gap:7px}
 .sw-words-modal .sw-words-board{
  width:min(100%,235px);max-height:235px;margin-top:8px
 }
}

/* Keep fingers away from the labels and from adjacent action buttons. */
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
  width:min(100%,530px);padding-inline:3px;gap:7px
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar .tg-game-button{
  box-sizing:border-box;padding-inline:clamp(10px,2.6vw,15px)!important;
  min-height:42px;letter-spacing:0;white-space:nowrap
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls{gap:7px}
}
/* Short phones use two comfortable rows rather than four compressed pills. */
@media(max-width:430px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:repeat(2,41px);gap:6px 9px;
  flex:0 0 88px;height:88px;align-items:stretch;
  padding-inline:4px
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar .sw-controls{
  display:contents
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-words-button{
  grid-column:1;grid-row:1
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-restart{
  grid-column:2;grid-row:1
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls button:first-child{
  grid-column:1;grid-row:2
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-controls button:last-child{
  grid-column:2;grid-row:2
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar .tg-game-button{
  width:100%;height:41px;min-height:41px;padding-inline:12px!important;
  font-size:12px!important
 }
}

/* Reclaim the removed progress footer. On small phones height, rather than
   width, decides board size. No hidden progress row reserves space. */
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .tg-game-progress-footer{display:none!important}
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-group{
  justify-content:center;gap:clamp(2px,.38dvh,5px)
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-host{
  width:min(calc(100cqw - 4px),var(--float-square-size,530px),
   max(150px,calc(100cqh - 139px)));
  flex:0 1 auto
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-word{
  flex-basis:30px;height:30px;line-height:30px
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-found{
  flex-basis:30px;height:30px
 }
}
@media(max-width:430px) and (max-height:760px){
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-host{
  width:min(calc(100cqw - 2px),var(--float-square-size,530px),
    max(160px,calc(100cqh - 148px)))
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-group{gap:2px}
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-info{gap:2px}
}

/* Mobile Sideweave: use every pixel formerly wasted by the progress track.
   Only Sideweave opts out; other games keep their own progress/footer layout.
   The two-row control toolbar remains a real bottom anchor, with a 9px
   breathing space above the fixed mobile navigation. The extra 15px compensates\n   for the shared mobile workspace extending below the nav's top edge. */
@media(max-width:700px){
 /* Keep the page's 13px outer gutter but remove the redundant 12px panel
    inset on each side, so the square SVG can fill the phone width. */
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .tg-game-panel{
  padding-inline:0
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave
  .tg-game-panel.tg-game-panel--no-progress{
  grid-template-rows:0px minmax(0,1fr) 0px!important
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-stage{
  height:100%;min-height:0;padding:0 0 24px;gap:0
 }
 /* The board unit owns a measurable flex slot. Container height now excludes
    the bottom actions, so its SVG can fill BOTH the available width and height
    instead of subtracting a guessed 139-205px from the whole play stage. */
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-group{
  flex:1 1 0;min-height:0;min-width:0;width:100%;
  container-type:size;justify-content:center;
  gap:clamp(2px,.38dvh,5px)
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-board-host{
  width:min(calc(100cqw - 4px),var(--float-square-size,530px),
    max(100px,calc(100cqh - 94px)));
  flex:0 1 auto;min-height:0;aspect-ratio:1/1
 }
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-toolbar{
  margin:0;flex-shrink:0
 }
 /* Slightly heavier/larger letterforms, not a new letter layout. The SVG
    viewBox, hit targets and side arcs keep their existing geometry. */
 body.float-ui .app-shell:not(.admin-mode) .page-sideweave .sw-letter text{
  font-size:30px
 }
}

/* Words-found scroll affordances belong to this modal's list only.
   Overflow is measured in JS, so arrows never appear outside the dialog
   or when all accepted words already fit. */
.sw-words-modal .sw-words-scroll{
 position:relative;box-sizing:border-box;min-height:0;width:100%;
 overflow:hidden;isolation:isolate;border-radius:8px;
}
.sw-words-modal .sw-words-list{
 max-height:220px;overflow-y:auto;overscroll-behavior:contain;
 scrollbar-width:thin;
}
.sw-words-modal .sw-words-scroll-arrow{
 position:absolute;left:50%;transform:translateX(-50%);
 z-index:2;width:42px;height:25px;min-width:42px;
 display:grid;place-items:center;cursor:pointer;
 border:1px solid var(--line);border-radius:999px;
 background:color-mix(in srgb,var(--surface) 96%,transparent);
 box-shadow:0 2px 12px #0002;color:var(--text);
 font:700 20px/1 system-ui;opacity:.95;
}
.sw-words-modal .sw-words-scroll-arrow[hidden]{display:none!important}
.sw-words-modal .sw-words-scroll-up{top:0}
.sw-words-modal .sw-words-scroll-down{bottom:0}
.sw-words-modal .sw-words-scroll-arrow:focus-visible{
 outline:2px solid var(--game-ink,#3A7F82);outline-offset:2px;
}