/* Shared hall HUD uses a fixed 1920px reference and bounded complete-entry result pages. */
.panel-hud {container-type:inline-size;}
.panel-hud[data-panel-mode="editor"] {position:absolute;inset:0;pointer-events:none;}
.panel-hud[data-panel-mode="editor"] button {pointer-events:none;}
.panel-hud .phasebar,.panel-hud .screen-guidance,.panel-hud .side {position:absolute;left:85.625%;right:auto;transform:translateX(-50%);width:17.65%;min-width:0;max-width:none;box-sizing:border-box;align-items:stretch;z-index:400;color:#f4edd6;text-shadow:0 1px 2px #000b;background:none;border:none;box-shadow:none;padding:0;margin:0;overflow:clip;}
.panel-hud .phasebar {top:15.6%;height:11.8%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;gap:.16cqw;text-align:center;}
.panel-hud .phasebar #roundInfo {font-size:calc((1.13cqw) * var(--info-fit,1) * var(--text-scale,1));font-weight:700;letter-spacing:0;line-height:1.12;}
.panel-hud .phasebar .phase-name {font-size:calc((1.62cqw) * var(--info-fit,1) * var(--text-scale,1));font-weight:700;line-height:1.1;}
.panel-hud .phase-tools {display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:.6cqw;align-items:center;}
.panel-hud .phase-tools .timer {grid-column:2;justify-self:center;}
.panel-hud .phase-tools #screenSoundBtn {grid-column:3;justify-self:start;}
.panel-hud .phasebar .timer {font-size:calc((.95cqw) * var(--info-fit,1) * var(--text-scale,1));padding:0;border:0;line-height:1.15;}
.panel-hud #screenSoundBtn {border:0;padding:0;background:none;color:#c9c4ad;font:inherit;font-size:calc((.65cqw) * var(--info-fit,1) * var(--text-scale,1));cursor:pointer;white-space:nowrap;}
.panel-hud #demoBadge {border:0;padding:0;font-size:calc((.57cqw) * var(--info-fit,1) * var(--text-scale,1));color:var(--mist);}
.panel-hud .screen-guidance {top:33.5%;height:10.4%;display:flex;flex-direction:column;justify-content:flex-start;gap:.3cqw;text-align:center;font-size:calc((.89cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.24;}
.panel-hud #eventBadge:empty {display:none;}
.panel-hud #eventBadge strong {display:block;font-size:calc((1.03cqw) * var(--info-fit,1) * var(--text-scale,1));font-weight:700;line-height:1.15;margin-bottom:.2cqw;}
.panel-hud #eventBadge span {display:block;font-size:calc((.79cqw) * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud.panel-has-caption #phaseHint {display:none;}
.panel-hud .side {top:50.5%;height:30%;width:17.15%;display:flex;flex-direction:column;justify-content:flex-start;font-size:calc((.75cqw) * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud .side .panel {flex:0 0 auto;width:100%;min-width:0;box-sizing:border-box;padding:0;margin:0 0 .55cqw;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;}
.panel-hud .side .panel-head {font-family:var(--serif);font-size:calc((1.02cqw) * var(--info-fit,1) * var(--text-scale,1));letter-spacing:.04em;text-align:center;justify-content:center;display:block;margin:0 0 .1cqw;padding-bottom:0;line-height:1.2;color:#f4edd6;}
.panel-hud .side .panel-head .wall-label {font-family:var(--mono);font-size:calc((.61cqw) * var(--info-fit,1) * var(--text-scale,1));font-weight:400;letter-spacing:0;display:block;margin-top:.22cqw;line-height:1.25;}
.panel-hud .screen-rank-grid {display:block;width:100%;min-width:0;}
.panel-hud .rank-columns,.panel-hud .screen-rank-card {display:grid;grid-template-columns:1.2em minmax(0,1fr) 2.5em 1.5em 2em;column-gap:.12cqw;align-items:baseline;text-align:left;}
.panel-hud .rank-columns {font-size:calc((.56cqw) * var(--info-fit,1) * var(--text-scale,1));color:#c9c4ad;line-height:1.2;margin-bottom:.05cqw;}
.panel-hud .screen-rank-card {font-size:calc((.74cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.12;border-bottom:1px solid #b4b68c35;padding:0;}
.panel-hud .screen-rank-card .place {color:#d7b673;}
.panel-hud .screen-rank-card .team-name {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--serif);font-size:.95em;}
.panel-hud .screen-rank-card .points,.panel-hud .screen-rank-card .hp,.panel-hud .screen-rank-card .gold {text-align:right;font-family:var(--mono);font-size:.8em;}
.panel-hud .screen-rank-card .points,.panel-hud .screen-rank-card .gold {color:#e3c76e;}
.panel-hud .screen-rank-card .hp {color:var(--hp);}
.panel-hud .screen-rank-note {font-size:calc((.63cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.3;color:#cbc5ae;margin-top:.35cqw;}
.panel-hud .side .comparison-panel {margin-top:.6cqw;padding-top:.5cqw;border-top:1px solid #b4b68c55;}
.panel-hud .side table {font-size:inherit;width:100%;box-sizing:border-box;}
.panel-hud .side .comparison-panel table {font-size:calc((.7cqw) * var(--info-fit,1) * var(--text-scale,1)) !important;}
.panel-hud .side .comparison-panel .muted {font-size:calc((.68cqw) * var(--info-fit,1) * var(--text-scale,1)) !important;}
.panel-hud .side .feed {display:block;}
.panel-hud .side .feed > div {padding:.3cqw 0;border-bottom:1px solid #b4b68c35;font-size:calc((.8cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.3;}
.panel-hud .side .feed > div:last-child {color:var(--brass);}
.panel-hud .feed .mark {font-family:var(--mono);font-size:.72em;letter-spacing:.04em;margin-right:.3cqw;}
.panel-hud .feed .ok {color:var(--good);}
.panel-hud .feed .no {color:var(--rust);}
.panel-hud .feed .sh {color:var(--brass);}
.panel-hud .side .attack-grid {display:block;}
.panel-hud .attack-card {padding:.25cqw 0;border-bottom:1px solid #b4b68c35;line-height:1.25;}
.panel-hud .attack-card small {display:block;color:#cbc5ae;font-size:.85em;}
.panel-hud #roundBeat {position:static;transform:none;width:auto;max-width:none;margin:0;padding:0;text-align:center;color:var(--brass);background:none;border:0;border-radius:0;box-shadow:none;pointer-events:none;font-size:calc((.89cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.25;}
.panel-hud .side > .panel:last-child {margin-bottom:0;}
.panel-hud.panel-has-caption #eventBadge,.panel-hud.panel-has-caption #wallStatus {display:none;}
.panel-hud #wallStatus {font-family:var(--mono);font-size:calc((.95cqw) * var(--info-fit,1) * var(--text-scale,1));line-height:1.2;color:#ccc4aa;}

.panel-hud .screen-guidance #roundCaption {display:none;}
.panel-hud.panel-has-caption #roundCaption {display:block;}
.panel-hud .phasebar,.panel-hud .screen-guidance,.panel-hud .side {overscroll-behavior:none;}
.panel-hud .phasebar > * {max-width:100%;}
.panel-hud .side .panel,.panel-hud .side .comparison-panel {margin:0;}
.panel-hud .side .panel + .panel {margin-top:calc(.35cqw * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud .side .panel-head {margin-bottom:calc(.1cqw * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud .side .panel-head .num {display:block;font-size:calc(.65cqw * var(--info-fit,1) * var(--text-scale,1)) !important;}
.panel-hud .side table th,.panel-hud .side table td {font-size:inherit;letter-spacing:0;white-space:normal;padding:calc(.12cqw * var(--info-fit,1) * var(--text-scale,1));line-height:1.15;}
.panel-hud .side .comparison-panel {padding-top:calc(.3cqw * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud .side .comparison-panel .muted {margin-top:calc(.25cqw * var(--info-fit,1) * var(--text-scale,1)) !important;}
.panel-hud .side .feed > div,.panel-hud .side .attack-card {padding:calc(.15cqw * var(--info-fit,1) * var(--text-scale,1)) 0;}
.panel-hud .side .screen-rank-note {margin-top:calc(.25cqw * var(--info-fit,1) * var(--text-scale,1));}
.panel-hud .phasebar,.panel-hud .screen-guidance,.panel-hud .side {padding-top:.25cqw;padding-left:.25cqw;}
.panel-hud [data-panel-element] {left:calc(var(--panel-x)*100%) !important;top:calc(var(--panel-y)*100%) !important;width:calc(var(--panel-width)*100%) !important;height:calc(var(--panel-height)*100%) !important;transform:none !important;overflow:visible;}
.panel-hud [data-panel-role] {position:relative;transform:translate(calc(var(--text-dx,0)*100cqw),calc(var(--text-dy,0)*56.25cqw));}
.panel-hud #phaseHint {font-size:calc(.89cqw*var(--info-fit,1)*var(--text-scale,1));}
.panel-hud #roundCaption {font-size:calc(.89cqw*var(--info-fit,1)*var(--text-scale,1));line-height:1.25;color:var(--brass);}
.panel-hud #roundCaption:empty {display:none;}
.panel-hud.panel-has-caption #roundCaption {display:block;}
.panel-hud #roundBeat {font-size:inherit;}
.panel-hud .panel-side-body {font-size:calc(.75cqw*var(--info-fit,1)*var(--text-scale,1));min-width:0;}
.panel-hud [hidden] {display:none !important;}


/* Reference layout avoids browser rounding of tiny fonts, inline baselines and
   fractional borders in the constructor. Only the complete HUD is scaled. */
.panel-hud-surface {position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;container-type:inline-size;z-index:400;pointer-events:none;}
.panel-hud-surface #screenSoundBtn {pointer-events:auto;}
.panel-hud[data-panel-mode="editor"] .panel-hud-surface #screenSoundBtn {pointer-events:none;}

/* Sound is controlled by the host; the hidden role remains for saved layouts. */
#screenSoundBtn{display:none!important;pointer-events:none!important}

/* The same two training messages remain visible through every phase. */
.training-top-panels #roundInfo{display:none!important}
.training-top-panels #phaseHint{display:block!important}
.training-top-panels #roundCaption{display:none!important}

/* Optional per-role typography is an explicit override; null retains the preset. */
.panel-hud [data-panel-color],.panel-hud [data-panel-color] * {color:var(--role-color)!important;}
.panel-hud [data-panel-font],.panel-hud [data-panel-font] * {font-family:var(--role-font)!important;}
.panel-hud [data-panel-weight],.panel-hud [data-panel-weight] * {font-weight:var(--role-weight)!important;}
/* An event owns the second board, including during training and a live caption. */
.guide-event-only #eventBadge {display:block!important;}
.guide-event-only #phaseHint,.guide-event-only #roundCaption {display:none!important;}
.guide-event-only #wallStatus:not([hidden]) {display:block!important;}

/* Bounded, complete-entry pages: no scrollbars or text leaking off the board. */
.panel-hud [data-panel-element="side"] {overflow:hidden;}
.panel-hud .panel-side-body {overflow:hidden;}
.panel-hud .panel-side-page {position:absolute;left:0;top:0;display:flow-root;transform-origin:0 0;overflow-wrap:anywhere;}
.panel-hud .panel-side-page .screen-rank-card .team-name {white-space:normal;text-overflow:clip;overflow:visible;}
.panel-hud .panel-side-page .feed>div,.panel-hud .panel-side-page .attack-card {padding:.08cqw 0;line-height:1.16;}

/* Keep the second board centered as its visible text wraps between steps. */
.panel-hud .screen-guidance {justify-content:center;padding-top:.25cqw;padding-bottom:.25cqw;}

/* Keep a separate centered heading and description while editing either role. */
.panel-hud #eventBadge > [data-panel-role="eventTitle"],
.panel-hud #eventBadge > [data-panel-role="eventBody"] {display:block;text-align:inherit;}

/* Final results: separate actual and hypothetical totals on the same board. */
.panel-hud.final-results [data-panel-element="side"] {top:calc(var(--panel-y)*100% - 20px) !important;height:calc(var(--panel-height)*100% + 20px) !important;}
.panel-hud .final-comparison-grid {display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px;}
.panel-hud .final-comparison-card {box-sizing:border-box;min-width:0;padding:9px 7px;border:1px solid #b4b68c77;border-radius:5px;background:#111c20b3;text-align:left;}
.panel-hud .final-comparison-card.alliance {border-color:#8fbdad99;background:#203c32b3;}
.panel-hud .final-comparison-card h3 {font:700 .85em var(--serif);color:#f4edd6;line-height:1.25;margin:0 0 8px;}
.panel-hud .final-comparison-card div {display:flex;justify-content:space-between;gap:5px;line-height:1.45;color:#ece9df;}
.panel-hud .final-comparison-card strong {font-family:var(--mono);color:#f1cf7d;}

/* Kingdom health is visible from the first preparation of Mist. */
.kingdom-wall-meter {position:absolute;top:calc(clamp(12px,2%,24px) + 26px);left:14%;width:72%;height:28px;box-sizing:border-box;z-index:450;overflow:visible;border:2px solid #c29aee;border-radius:7px;background:linear-gradient(180deg,#41285c,#2d1b43);box-shadow:0 0 8px #bc83f24d,0 0 22px #a865da30,inset 0 0 7px #d9b0ff33;color:#fff;pointer-events:none;}
.kingdom-wall-meter[hidden] {display:none !important;}
.kingdom-wall-track {position:absolute;inset:0;overflow:hidden;border-radius:5px;}
.kingdom-wall-fill {height:100%;background:#527b42;box-shadow:inset 0 1px 0 #ffffff25;transition:width .6s ease,background-color .6s ease;}
.kingdom-wall-meter[data-tone="yellow"] .kingdom-wall-fill {background:#a08026;}
.kingdom-wall-meter[data-tone="red"] .kingdom-wall-fill {background:#9e3b3f;}
.kingdom-wall-label {position:absolute;left:0;right:0;bottom:calc(100% + 8px);white-space:nowrap;display:flex;align-items:center;justify-content:center;font:700 16px/1.1 var(--sans,sans-serif);text-shadow:0 1px 3px #000,0 0 5px #000,0 0 9px #c197ff66;}

/* Thresholds remain readable below the inset wall bar on hall and constructor. */
.kingdom-wall-tick {position:absolute;top:0;bottom:0;width:0;border-left:2px solid #e3c6ffb3;}
.kingdom-wall-tick > span {position:absolute;top:calc(100% + 5px);left:-1px;transform:translateX(-50%);padding:2px 7px;border:1px solid #af7ee288;border-radius:4px;background:#241831ed;color:#f5edff;font:700 14px/1.15 var(--sans,sans-serif);text-shadow:0 1px 2px #000;}
.panel-hud.live-mist #wallStatus:not([hidden]) {display:block!important;}

/* Preserve the calibrated text size; a concise wall line leaves room for the message. */
.panel-hud.live-mist .screen-guidance {gap:.15cqw;padding-top:0;padding-bottom:0;}
.panel-hud.live-mist #wallStatus {order:1;flex-shrink:0;white-space:nowrap;}

/* Static outcome ranges stay aligned with the400/700 threshold markers. */
.kingdom-wall-zones {position:absolute;inset:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:stretch;}
.kingdom-wall-zones > span {display:flex;align-items:center;justify-content:center;min-width:0;white-space:nowrap;color:#fff;font:700 clamp(10px,.8cqw,14px)/1.1 var(--sans,sans-serif);text-shadow:0 1px 3px #000,0 0 5px #000;}

.kingdom-wall-zones > [hidden] {display:none!important;}

/* Final comparison savings should remain readable on the hall projector. */
.panel-hud .side .comparison-panel .alliance-savings {font-size:calc(.82cqw * var(--info-fit,1) * var(--text-scale,1));line-height:1.3;color:#ece9df;margin-top:calc(.3cqw * var(--info-fit,1) * var(--text-scale,1));}

/* Center the final standings caption without changing other round headings. */
.final-places-header .phasebar {justify-content:center;padding-top:0;padding-bottom:0;}
.final-places-header .phasebar #phase,.final-places-header .phasebar .phase-tools,.final-places-header .phasebar #demoBadge {display:none!important;}
.panel-hud.final-places-header .phasebar #roundInfo {transform:translateX(calc(var(--text-dx,0)*100cqw));}
