/* Product layout adapter to immutable night-kit-20261026.1. Nature assets stay unchanged. */
.shp-night{margin:0}.shp-night .masthead{height:88px;min-height:88px;padding:12px 24px;background:var(--shp-surface);color:var(--shp-text)}
.shp-night .identity{padding:0;background:none;max-width:38%}.shp-night .identity .shp-logo{height:60px;width:auto;max-width:100%;object-fit:contain}.shp-night .mast-title{font-size:24px;color:var(--shp-text)}
.shp-night .roundbar{height:76px;padding:12px 24px;background:var(--shp-deep);color:var(--shp-text);flex-wrap:nowrap}.shp-night .roundbar h1{font-size:22px;margin:0}.shp-night .habitat-mark{background:var(--shp-accent)}.shp-night .time{padding:8px 18px;border:0;border-radius:999px;background:var(--shp-raised);color:var(--shp-text)}.shp-night .time.urgent{color:var(--shp-text)}
.shp-night button.shp-button{border-radius:999px;box-shadow:none;text-transform:none;letter-spacing:0;min-height:56px;font-size:20px;line-height:1.2;font-weight:700}.shp-night button.primary{background:var(--shp-accent);color:var(--shp-on-accent);border-color:transparent}.shp-night button.primary:hover{background:var(--shp-accent);border-color:var(--shp-text)}.shp-night button.primary:active{background:var(--shp-pressed);color:var(--shp-text)}.shp-night button.secondary,.shp-night button.subtle{background:transparent;color:var(--shp-text);border:2px solid var(--shp-border)}.shp-night button.subtle:hover,.shp-night button.secondary:hover{background:var(--shp-option)}.shp-night button.shp-button:disabled{background:var(--shp-raised);color:var(--shp-border);border-color:transparent;opacity:1;box-shadow:none;cursor:default}.shp-night button:focus-visible{outline:3px solid var(--shp-focus);outline-offset:4px;box-shadow:none}
.shp-night .scene{height:calc(100svh - 200px);min-height:520px;aspect-ratio:auto;background:var(--shp-surface)}.shp-night .shade{display:none}.shp-night .artwork{filter:none}.shp-night .paused .artwork{filter:blur(6px)}.shp-night .progress{background:var(--shp-deep);height:6px}.shp-night .progress>div{background:var(--shp-focus)}
.shp-night .scene-title{left:4%;top:10%;color:var(--shp-text);text-shadow:none;background:var(--shp-surface);border-radius:24px;padding:18px 24px;max-width:52%}.shp-night .scene-title span{font-size:24px}.shp-night .scene-title strong{font-size:42px}
.shp-night .panel{right:3%;top:24px;width:37%;max-width:560px;min-height:0;padding:24px;background:var(--shp-surface);color:var(--shp-text);border:0;border-radius:32px;box-shadow:none}.shp-night .panel h2{font-size:32px;line-height:1.12;color:var(--shp-text);margin:0 0 16px}.shp-night .panel p{font-size:18px;line-height:1.45;color:var(--shp-muted);margin:0 0 16px}.shp-night .study{margin:20px 0;padding:16px;border:0;border-radius:20px;background:var(--shp-raised);gap:16px}.shp-night .study>img{width:32%;height:108px;object-fit:contain}.shp-night .study strong{color:var(--shp-text);font-size:16px}.shp-night .study p{font-size:16px;margin:6px 0 0}.shp-night .result-species{border-color:var(--shp-border);margin:8px 0 16px;padding:12px 0;gap:16px}.shp-night .result-species img{height:100px;width:30%;object-fit:contain}.shp-night .result-species h3{font-size:24px;margin:0 0 8px}.shp-night .result-species p{font-size:16px;margin:0}.shp-night .result-symbol{display:none}.shp-night .pause-panel{top:20%}
.shp-night .seek-task{top:18px;left:24px;bottom:auto;max-width:55%;white-space:normal;transform:none;padding:12px 16px;gap:12px;border-radius:999px;background:var(--shp-surface);color:var(--shp-text);font-size:20px;line-height:1.25}.shp-night .seek-task svg{flex:none}.shp-night .feedback{top:18px;right:24px;left:auto;max-width:42%;width:auto;padding:12px 16px;border-radius:20px;background:var(--shp-raised);color:var(--shp-text);font-size:18px;line-height:1.4;transform:none;box-shadow:none}.shp-night .feedback:empty{display:none}.shp-night footer{height:36px;min-height:36px;padding:8px 24px;background:var(--shp-surface);color:var(--shp-muted);font-size:12px}
@media(min-width:1600px){.shp-night .masthead{height:144px;padding:20px 48px}.shp-night .identity .shp-logo{height:96px}.shp-night .mast-title{font-size:36px}.shp-night .roundbar{height:136px;padding:20px 48px}.shp-night .roundbar h1{font-size:34px}.shp-night .round-status{font-size:24px}.shp-night .time span{font-size:44px}.shp-night .scene{height:calc(100svh - 328px);min-height:730px}.shp-night .panel{width:38%;max-width:720px;padding:32px}.shp-night .panel h2{font-size:44px}.shp-night .panel p{font-size:26px}.shp-night .study>img{height:138px}.shp-night .study strong,.shp-night .study p{font-size:24px}.shp-night .result-species img{height:144px}.shp-night .result-species h3{font-size:34px}.shp-night .result-species p{font-size:24px}.shp-night button.shp-button{min-height:80px;font-size:28px}.shp-night .seek-task{top:24px;left:48px;font-size:30px;padding:18px 24px}.shp-night .feedback{top:24px;right:48px;font-size:26px}.shp-night footer{height:48px;font-size:18px;padding:8px 48px}}
@media(max-width:900px){.shp-night .masthead{padding:8px 16px;gap:12px}.shp-night .mast-title{font-size:20px}.shp-night .panel{width:43%;right:2%;padding:20px}.shp-night .panel h2{font-size:28px}.shp-night .panel p{font-size:16px}.shp-night .study>img{height:85px}.shp-night button.shp-button{font-size:16px}.shp-night .masthead .subtle span{display:none}}
@media(max-width:640px){.shp-night .masthead{height:90px;min-height:90px;padding:8px 12px;gap:8px}.shp-night .identity{width:144px;max-width:38%}.shp-night .identity .shp-logo{height:58px}.shp-night .mast-title{font-size:17px;max-width:125px}.shp-night .roundbar{height:76px;padding:8px 12px;gap:6px}.shp-night .roundbar h1{font-size:15px;max-width:122px}.shp-night .roundbar>div{gap:6px}.shp-night .round-status{gap:6px!important;font-size:11px}.shp-night #count{padding:4px 6px;font-size:10px;white-space:nowrap}.shp-night .time{padding:8px;gap:4px}.shp-night .time span{font-size:24px}.shp-night .time small{font-size:11px}.shp-night .time svg{display:none}.shp-night button.subtle{min-height:48px;min-width:48px;padding:8px;font-size:13px}.shp-night .scene{height:auto;min-height:0}.shp-night .scene:not(.playing):not(.paused):not(.finished){min-height:840px}.shp-night .scene.playing,.shp-night .scene.paused{height:calc(100svh - 202px);min-height:420px}.shp-night .artwork{height:300px}.shp-night .playing .artwork,.shp-night .paused .artwork{height:100%}.shp-night .scene-title{top:20px;left:16px;max-width:calc(100% - 32px);padding:12px 18px}.shp-night .scene-title span{font-size:20px}.shp-night .scene-title strong{font-size:32px}.shp-night .panel{top:300px;left:0;right:0;width:100%;max-width:none;border-radius:0;padding:24px;background:var(--shp-surface)}.shp-night .panel h2{font-size:30px}.shp-night .panel p{font-size:18px}.shp-night .study>img{height:120px}.shp-night .pause-panel{top:16%;left:5%;right:5%;width:90%;border-radius:32px}.shp-night .scene.finished{min-height:890px}.shp-night .result-species h3{font-size:25px}.shp-night .result-species img{height:120px}.shp-night .seek-task{top:14px;left:16px;max-width:calc(100% - 32px);font-size:16px;padding:10px 12px}.shp-night .feedback{top:76px;left:16px;right:auto;max-width:calc(100% - 32px);font-size:16px}.shp-night footer{padding:8px 12px;font-size:11px}.shp-night .keyboard-tip{display:none}}

.shp-night .study-pictures,.shp-night .result-pictures{width:32%;flex:none;display:flex;align-items:center;justify-content:center;gap:6px}.shp-night .study-pictures img,.shp-night .result-pictures img{width:100%;height:108px;object-fit:contain}.shp-night .study-pictures.dual,.shp-night .result-pictures.dual{width:45%}.shp-night .study-pictures.dual img,.shp-night .result-pictures.dual img{width:calc(50% - 3px)}
@media(min-width:1600px){.shp-night .study-pictures img,.shp-night .result-pictures img{height:138px}}
@media(max-width:640px){.shp-night .study-pictures img,.shp-night .result-pictures img{height:110px}.shp-night .result-species h3{font-size:23px}}
/* A result occupies its own lower strip; every found goal remains in the separate scene above. */
.shp-night .scene.finished{--result-height:224px;height:calc(100svh - 200px);min-height:540px}.shp-night .finished .artwork{height:calc(100% - var(--result-height))}
.shp-night #result.panel{top:auto;bottom:0;left:0!important;right:0!important;max-width:none;width:100%;height:var(--result-height);border-radius:0;display:grid;grid-template-columns:.8fr 1.35fr .8fr;grid-template-rows:1fr 1fr;column-gap:24px;row-gap:12px;padding:20px 24px}.shp-night #result-title{grid-column:1;grid-row:1;font-size:28px;margin:0;align-self:end}.shp-night #result-summary{grid-column:1;grid-row:2;font-size:17px;margin:0;align-self:start}.shp-night #result .result-species{grid-column:2;grid-row:1/3;margin:0;padding:0;border:0;align-self:center}.shp-night #result .result-species h3{font-size:23px}.shp-night #result .result-species p{font-size:16px}.shp-night #result .result-pictures img{height:102px}.shp-night #result #replay{grid-column:3;grid-row:1;margin:0;align-self:end}.shp-night #result #back{grid-column:3;grid-row:2;margin:0;align-self:start}
@media(min-width:1600px){.shp-night .scene.finished{--result-height:248px;height:calc(100svh - 328px);min-height:730px}.shp-night #result.panel{padding:24px 48px;column-gap:32px}.shp-night #result-title{font-size:36px}.shp-night #result-summary{font-size:24px}.shp-night #result .result-species h3{font-size:28px}.shp-night #result .result-species p{font-size:22px}.shp-night #result .result-pictures img{height:136px}}
@media(max-width:900px){.shp-night .scene.finished{height:auto;min-height:980px}.shp-night .finished .artwork{height:300px}.shp-night #result.panel{top:300px!important;bottom:auto;height:auto;display:block;padding:24px}.shp-night #result-title{font-size:30px;margin:0 0 16px}.shp-night #result-summary{font-size:18px;margin:0 0 16px}.shp-night #result .result-species{margin:8px 0 20px}.shp-night #result #replay,.shp-night #result #back{margin:12px 0 0;width:100%;min-height:56px}.shp-night #result .result-species h3{font-size:23px}.shp-night #result .result-pictures img{height:110px}}
.shp-night .result-species>div:last-child{min-width:0;overflow-wrap:anywhere}
@media(max-width:900px){.shp-night .scene.finished{height:auto;min-height:0}.shp-night #result.panel{position:relative;top:auto!important;margin-top:300px}}
@media(max-width:640px){.shp-night #result .result-species{flex-direction:column;align-items:stretch;gap:12px}.shp-night #result .result-pictures{width:100%;justify-content:center}.shp-night #result .result-pictures img{width:90px!important}.shp-night #result .result-species h3{overflow-wrap:normal}}

/* Keep the found specimen at its original position. Result is normal flow below the full playfield. */
.shp-night .scene{--playfield-height:max(520px,calc(100svh - 200px))}
.shp-night .scene.finished{height:auto!important;min-height:0}
.shp-night .finished .artwork{position:relative;inset:auto;height:var(--playfield-height)}
.shp-night #result.panel{position:relative;top:auto!important;bottom:auto;margin:0;height:auto;min-height:224px}
@media(min-width:1600px){.shp-night .scene{--playfield-height:max(730px,calc(100svh - 328px))}.shp-night #result.panel{min-height:248px}}
@media(max-width:640px){.shp-night .scene{--playfield-height:max(420px,calc(100svh - 202px))}.shp-night #result.panel{min-height:0}}

/* Fullscreen element must own scrolling; result stays below the full picture. */
body.shp-night:fullscreen{height:100dvh;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
