/* Product adapter: night-kit-20261026.1. Canonical night.css stays byte-identical.
   Geometry retains full illustrations and proven kiosk sizing. Wrong red is the owner's explicit requirement. */
.shp-root{--c-bg:var(--shp-surface);--c-text:var(--shp-text);--c-success:var(--shp-success);--c-surface-sunk:var(--shp-raised);--c-line:var(--shp-option-border);--c-text-muted:var(--shp-muted);--c-error:#B03A2C;--c-error-bg:#F6DED8;--c-on-error:#FFFFFF;--c-surface:var(--shp-text);--c-brand:var(--shp-border);--c-line-strong:var(--shp-option-border);--c-accent:var(--shp-accent);--c-on-accent:var(--shp-on-accent);--c-selected:var(--shp-text);--c-on-selected:var(--shp-deep);--c-success-bg:var(--shp-success);--c-on-success:var(--shp-deep);--c-focus:var(--shp-focus);--c-focus-halo:transparent;--font-base:Roboto,Arial,sans-serif;--r-m:32px;--r-s:20px;--sh-key:none;--key-depth:0px;--fw-bold:700;--lh-tight:1.12;--lh-heading:1.2;--lh-body:1.45;--fs-display:80px;--fs-h1:54px;--fs-h2:36px;--fs-body:28px;--fs-label:26px;--fs-caption:20px;--target:80px;--safe:48px;--go-min-w:240px;--bw-base:2px;--bw-strong:3px;--bw-sel:5px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-8:48px}
:root{--paper:var(--c-bg);--ink:var(--c-text);--green:var(--c-success);--wash:var(--c-surface-sunk);--line:var(--c-line);--muted:var(--c-text-muted);--red:var(--c-error);--field:var(--c-surface)}
.shp-root{font-family:var(--font-base);background:var(--c-bg);color:var(--c-text)}
.shp-root header{width:calc(100% - 2*var(--safe));margin:0 auto;padding:var(--sp-4) 0;min-height:var(--target);gap:var(--sp-5);border-bottom:var(--bw-strong) solid var(--c-brand)}
.brand{flex:none;padding:24px;line-height:1}.brand img{width:280px;height:auto;aspect-ratio:359/144;object-fit:contain;display:block}
.tools{margin-left:auto;gap:var(--sp-4)}
.shp-root .quiet{min-height:var(--target);font-size:var(--fs-caption);padding:var(--sp-4);border-radius:var(--r-m);border:var(--bw-strong) solid var(--c-line-strong);color:var(--c-text);background:var(--c-surface);box-shadow:var(--sh-key)}
.shp-root .quiet:hover{background:var(--c-surface-sunk)}
.shp-root main{width:min(1800px,calc(100% - 2*var(--safe)));margin:auto}
#app:focus-visible{outline:none;box-shadow:none}
.shp-root .hero{gap:var(--sp-8);padding:var(--sp-5) 0}
.shp-root .hero h1{font-size:var(--fs-display);line-height:var(--lh-tight);letter-spacing:-.01em;margin-bottom:var(--sp-6);max-width:760px}
.shp-root .hero p{font-size:var(--fs-body);line-height:var(--lh-body);margin-bottom:var(--sp-6);max-width:650px}
.shp-root .primary{min-height:var(--target);min-width:var(--go-min-w);padding:var(--sp-4) var(--sp-6);font-size:var(--fs-label);border-radius:var(--r-m);border:var(--bw-strong) solid var(--c-line-strong);background:var(--c-accent);color:var(--c-on-accent);box-shadow:var(--sh-key);font-weight:var(--fw-bold);line-height:var(--lh-heading)}
.shp-root .primary:hover{background:var(--c-selected)}
.shp-root .primary:active,.shp-root .quiet:active{transform:translateY(var(--key-depth));box-shadow:none}
.shp-root .hero .primary{min-height:calc(var(--target)*1.35);font-size:var(--fs-h2)}
.shp-root .small-note{color:var(--c-text-muted);font-size:var(--fs-caption);line-height:var(--lh-body);margin-top:var(--sp-5)}
.shp-root .heading{margin:var(--sp-5) 0 var(--sp-4);gap:var(--sp-5)}
.shp-root .heading h1{font-size:var(--fs-h1);line-height:var(--lh-heading);letter-spacing:0;margin-bottom:var(--sp-3)}
.shp-root .heading p{font-size:var(--fs-label);line-height:var(--lh-body);max-width:1300px}
.shp-root .round-count{font-size:var(--fs-caption);color:var(--c-text-muted)}
.shp-root .scenes{gap:var(--sp-5);margin:var(--sp-5) 0}
.shp-root .scene.shp-answer{display:flex;flex-direction:column;overflow:hidden;background:var(--_bg);border:var(--bw-strong) solid var(--_bd);border-radius:var(--r-m);box-shadow:var(--sh-key);color:var(--c-text);padding:0;min-height:var(--target)}
.shp-root .scene img{aspect-ratio:1.6;object-fit:contain;object-position:center;background:var(--c-surface);width:100%;border-radius:0;border-bottom:var(--bw-strong) solid var(--_bd)}
.shp-root .caption{flex:1;min-height:calc(var(--fs-label)*4.2);font-size:var(--fs-label);font-weight:var(--fw-bold);line-height:var(--lh-heading);gap:var(--sp-3);padding:var(--sp-4)}
.shp-root .number.shp-hw{flex:0 0 1.75em;width:1.75em;height:1.75em;border-radius:50%;background:var(--c-surface-sunk);color:var(--c-text);font-size:var(--fs-label)}
.shp-root .scene:hover:not(:disabled){transform:none}
.shp-root .scene.is-selected{background:var(--c-selected);border-width:var(--bw-sel);box-shadow:none;transform:translateY(var(--key-depth))}
.shp-root .scene.is-selected:hover{transform:translateY(var(--key-depth))}
.shp-root .scene:active{transform:translateY(var(--key-depth));box-shadow:none}
.shp-root .scene.is-selected .number{background:var(--c-line-strong);color:var(--c-surface)}
.shp-root .mark{top:var(--sp-3);right:var(--sp-3);padding:var(--sp-2) var(--sp-3);background:var(--c-selected);color:var(--c-on-selected);border:var(--bw-base) solid var(--c-line-strong);border-radius:var(--r-s);font-size:var(--fs-caption);line-height:1.1}
.shp-root .feedback .scene.shp-answer:disabled{--_bg:var(--c-success-bg);--_bd:var(--c-success);background:var(--c-success-bg);color:var(--c-text);border-width:var(--bw-sel);border-style:solid;opacity:1;box-shadow:none;cursor:default}
.shp-root .feedback .mark{background:var(--c-success);color:var(--c-on-success);border-color:var(--c-success)}
.shp-root .clear-choice{--_bg:var(--c-surface-sunk)}
.shp-root .clear-choice .caption{background:var(--c-surface-sunk)}
.shp-root .clear-symbol{min-height:calc(var(--target)*2);color:var(--c-brand)}
.shp-root .controls{gap:var(--sp-5);margin:var(--sp-5) 0}
.shp-root .instruction{font-size:var(--fs-label);line-height:var(--lh-body);max-width:1200px}
.shp-root .instruction strong{font-size:var(--fs-h2);line-height:var(--lh-heading);margin-bottom:var(--sp-2)}
.shp-root .single-answer .scenes{grid-template-columns:minmax(0,580px)}
.shp-root .feedback .caption{min-height:calc(var(--fs-label)*2.8)}
.shp-root .score{font-size:var(--fs-h2)}
.shp-root footer{width:calc(100% - 2*var(--safe));margin-left:auto;margin-right:auto;padding:var(--sp-5) 0;font-size:var(--fs-caption);line-height:var(--lh-heading);color:var(--c-text-muted)}
.shp-root button:focus-visible{outline:var(--bw-strong) solid var(--c-focus);outline-offset:4px;box-shadow:0 0 0 10px var(--c-focus-halo)}
.shp-root .hero-art img{border-radius:var(--r-m)}
.shp-root ::selection{background:var(--c-selected);color:var(--c-on-selected)}
@media(min-width:851px) and (max-width:1439px){.shp-root{--fs-display:64px;--fs-h1:44px;--fs-h2:32px;--fs-body:24px;--fs-label:19px;--fs-caption:17px;--target:68px;--bw-sel:5px;--safe:36px;--key-depth:5px}.brand{padding:19px}.brand img{width:220px}.shp-root .caption{padding:var(--sp-3)}}
@media(orientation:portrait) and (min-width:851px) and (max-width:1200px){.shp-root{--fs-display:92px;--fs-h1:62px;--fs-h2:44px;--fs-body:32px;--fs-label:26px;--fs-caption:24px;--target:120px;--bw-sel:8px;--safe:56px;--key-depth:8px}.shp-root .scenes{grid-template-columns:repeat(2,minmax(0,1fr))}.shp-root .controls{align-items:stretch;flex-direction:column}.shp-root .primary{width:100%}.shp-root .hero{grid-template-columns:1fr}.shp-root .hero-art{max-width:700px}.brand img{width:250px}.tools .quiet{font-size:20px}}
@media(max-width:850px){.shp-root{--fs-display:32px;--fs-h1:24px;--fs-h2:18px;--fs-body:16px;--fs-label:16px;--fs-caption:13px;--target:48px;--bw-sel:2px;--safe:16px;--key-depth:3px}.shp-root header{flex-wrap:wrap;gap:var(--sp-3);padding:var(--sp-3) 0}.brand{padding:16px;margin:auto}.brand img{width:190px}.tools{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}.shp-root .quiet{font-size:var(--fs-caption);padding:var(--sp-2)}.shp-root .hero{gap:var(--sp-6)}.shp-root .hero h1{margin-bottom:var(--sp-5)}.shp-root .hero p{margin-bottom:var(--sp-5)}.shp-root .heading{gap:var(--sp-3)}.shp-root .scenes{gap:var(--sp-3)}.shp-root .scene img{aspect-ratio:1.2}.shp-root .caption{padding:var(--sp-3);font-size:var(--fs-label);gap:var(--sp-2);min-height:116px}.shp-root .number.shp-hw{font-size:14px;flex-basis:28px;width:28px;height:28px}.shp-root .mark{font-size:11px;top:var(--sp-2);right:var(--sp-2);padding:var(--sp-1) var(--sp-2)}.shp-root .clear-symbol{min-height:140px}.shp-root .single-answer .scenes{grid-template-columns:minmax(0,390px)}.shp-root .single-answer .caption{min-height:85px}.shp-root .primary{font-size:var(--fs-label);min-width:var(--go-min-w)}.shp-root .hero .primary{font-size:var(--fs-h2)}.shp-root .small-note{font-size:14px}.shp-root .feedback .scene img{aspect-ratio:1.45}.shp-root .round-count{font-size:var(--fs-label)}}

@media(min-width:1440px) and (orientation:landscape){.shp-root .authored-question .scene img{aspect-ratio:2.1}.shp-root .authored-question .caption{font-size:24px}.shp-root .authored-question .heading p{font-size:28px}}

/* Single active answer; selected illustrations stay in full colour. */
.shp-root .selected img{filter:none}
.shp-root .scenes[data-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.shp-root .feedback .scenes[data-count]{grid-template-columns:minmax(0,580px)}
@media(orientation:portrait) and (min-width:851px) and (max-width:1200px){.shp-root .scenes[data-count="3"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.shp-root .scenes[data-count="3"]{grid-template-columns:repeat(2,minmax(0,1fr))}.shp-root .feedback .scenes[data-count]{grid-template-columns:minmax(0,390px)}}

/* Keep complete welcome/result artwork and actions inside the landscape kiosk. */
@media(min-width:1440px) and (orientation:landscape){
 .shp-root .feedback .scene img{aspect-ratio:2.1}
 .shp-root .hero{padding:16px 0}
 .shp-root .hero h1{font-size:80px;margin-bottom:24px}
 .shp-root .hero p{font-size:28px;margin-bottom:24px}
 .shp-root .hero .primary{min-height:112px;font-size:34px}
 .shp-root .hero .small-note{font-size:20px;margin-top:20px}
 .shp-root .hero-art{max-width:760px;justify-self:end}
 .shp-root .score{font-size:36px;margin-bottom:14px}
}

/* Existing kit is-wrong semantics: error border/background/mark, never selection gold. */
.shp-root .scene.is-wrong{background:var(--c-error-bg);border-color:var(--c-error);border-width:max(4px,var(--bw-sel));border-style:dashed;box-shadow:none;transform:none}
.shp-root .scene.is-wrong:hover{transform:none}
.shp-root .scene.is-wrong img{border-bottom-color:var(--c-error)}
.shp-root .scene.is-wrong .number,.shp-root .scene.is-wrong .mark{background:var(--c-error);color:var(--c-on-error);border-color:var(--c-error)}
.shp-root .answer-error{background:var(--c-error-bg);outline:2px solid var(--c-error);outline-offset:6px;border-radius:var(--r-m);padding:0}
.shp-root .answer-error strong{color:var(--c-error)}

/* Canonical controls/selection surfaces, independent of the previous daytime kit. */
html{background:#1B552D}
.shp-root header{border:0}
.shp-root .brand{padding:16px}.shp-root .brand img{aspect-ratio:auto}
.shp-root .primary{background:var(--shp-accent);color:var(--shp-on-accent);border:3px solid transparent;border-radius:999px;box-shadow:none;transition:transform .12s ease-out,background-color .12s ease-out}
.shp-root .primary:hover{background:var(--shp-accent);border-color:var(--shp-text)}
.shp-root .primary:active{background:var(--shp-pressed);color:var(--shp-text);transform:scale(.97)}
.shp-root .primary:disabled{background:var(--shp-raised);color:var(--shp-border);transform:none;border-color:transparent}
.shp-root .scene.shp-answer{background:var(--shp-option);border-color:var(--shp-option-border);color:var(--shp-text);border-radius:30px;box-shadow:none;transform:none}
.shp-root .scene img{background:var(--shp-text);border-bottom-color:var(--shp-option-border);filter:none}
.shp-root .scene .number{background:var(--shp-text);color:var(--shp-deep)}
.shp-root .scene.is-selected{background:var(--shp-text);color:var(--shp-deep);border-color:var(--shp-accent);border-width:3px}
.shp-root .scene.is-selected .number{background:var(--shp-accent);color:var(--shp-on-accent)}
.shp-root .scene.is-selected .mark{background:var(--shp-accent);color:var(--shp-on-accent);border-color:var(--shp-accent)}
.shp-root .scene:hover:not(:disabled){border-color:var(--shp-border);transform:none}
.shp-root .scene.is-selected:hover{border-color:var(--shp-accent)}
.shp-root .scene.is-wrong{background:var(--c-error-bg);color:var(--shp-deep);border:5px dashed var(--c-error)}
.shp-root .scene.is-wrong:hover{border-color:var(--c-error)}
.shp-root .scene.is-wrong .number,.shp-root .scene.is-wrong .mark{background:var(--c-error);color:var(--c-on-error)}
.shp-root .answer-error{color:var(--shp-deep);padding:12px 16px;outline:none;border:3px solid var(--c-error);border-radius:20px}
.shp-root .feedback .scene.shp-answer:disabled{background:var(--shp-success);color:var(--shp-deep);border-color:var(--shp-success)}
.shp-root .feedback .mark{background:var(--shp-success);color:var(--shp-deep)}
.shp-root button:focus-visible{outline:3px solid var(--shp-focus);outline-offset:4px;box-shadow:none}
.shp-root .hero-art{transform:none}.shp-root .hero-art img{transform:none;border-radius:32px}
.shp-root .round-count{font-variant-numeric:tabular-nums}
.shp-root footer{color:var(--shp-muted)}
@media(max-width:850px){.shp-root .scene.shp-answer{border-radius:24px}.shp-root .primary{min-width:0}.shp-root .answer-error{padding:12px}}

/* Canonical pressed-button contrast requires at least20px bold. */
.shp-root .primary,.shp-root .hero .primary{font-size:max(20px,var(--fs-label))}

/* TG27-046: retain the whole illustration without white letterboxing. */
.shp-root .scene img{background:var(--shp-option)}

/* Photorealistic source frames are horizontal16:9; keep every subject visible. */
.shp-root .scene img,.shp-root .authored-question .scene img,.shp-root .feedback .scene img{aspect-ratio:16/9;object-fit:contain;background:var(--shp-option)}

/* Explicit participant action requested by the owner. */
.shp-root .restart{flex:none;min-height:56px;font-size:20px;font-weight:700;padding:12px 24px}
@media(max-width:850px){.shp-root.is-active header{flex-wrap:nowrap;gap:12px}.shp-root.is-active .brand{margin:0;padding:12px}.shp-root.is-active .brand img{width:110px}.shp-root .restart{padding:12px 16px}}
