@import url('night-kit/night.css');
body{margin:0;font-synthesis:none}button,select{font:inherit}.shp-night #screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100svh;min-height:0;max-width:2560px;padding:clamp(24px,3vw,64px);gap:clamp(18px,2vh,32px)}.shp-night .shp-header{padding:0 140px 0 0;min-height:72px}.shp-night .shp-logo{height:clamp(56px,7vh,88px);max-width:45%;object-fit:contain}.shp-night #progress{font-size:clamp(17px,1.4vw,30px);white-space:nowrap}#stage{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,3vw,64px);align-items:stretch;min-height:0}.scene{position:relative;overflow:hidden;border-radius:32px;min-height:0}.scene img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center}.content{align-self:center;min-width:0}.shp-night h1{font-size:clamp(44px,5vw,100px);margin:0}.shp-night h2{font-size:clamp(32px,3.2vw,66px);margin:0}.shp-night .intro p,.shp-night .end p{font-size:clamp(24px,2vw,42px);line-height:1.4;margin:24px 0 0}.shp-night .intro .instruction{font-size:clamp(20px,1.5vw,30px);color:var(--shp-muted);padding-top:24px;border-top:2px solid var(--shp-option-border)}.options{list-style:none;padding:0;margin:24px 0 0}.shp-night .option{font-size:clamp(22px,2vw,40px);line-height:1.2;padding:12px 20px}.shp-night .number{width:1.65em;height:1.65em;font-size:.85em}.option-body{flex:1;min-width:0}.mark{width:1.2em;height:1.2em;flex:none;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.shp-night .option.incorrect{border-style:dashed;border-color:var(--shp-accent)}.shp-night .option.correct{border-color:var(--shp-success)}.shp-night .option.correct .mark{color:var(--shp-surface)}.shp-night .option:disabled{cursor:default}.shp-night .explanation{font-size:clamp(21px,1.55vw,32px);line-height:1.35;margin:16px 0 0;padding:12px 18px;max-width:none}.shp-night .explanation:empty{display:none}.revealed .explanation{border-color:var(--shp-success)}footer{display:flex;align-items:center;gap:24px}#phase{flex:1;color:var(--shp-muted);font-size:clamp(17px,1.3vw,28px)}.shp-night footer .shp-button{font-size:clamp(20px,1.5vw,30px);min-height:64px}.primary{flex-shrink:0}.tools{position:absolute;right:12px;top:clamp(24px,3vw,64px);display:flex;gap:6px}.tools button{width:64px;height:64px;padding:18px;border:2px solid var(--shp-border);border-radius:999px;background:var(--shp-surface);color:var(--shp-text);cursor:pointer}.tools svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.shp-night dialog.shp-dialog{width:720px;max-width:min(760px,94vw);max-height:90svh;overflow:auto;border:2px solid var(--shp-border);font-size:20px}.shp-night dialog h2{font-size:32px;clear:both;margin:0 0 20px}.shp-night dialog p{font-size:20px;margin:14px 0}.close{float:right;margin-bottom:20px}dl{margin:24px 0}dt{font-weight:700;margin-top:16px}dd{margin:4px 0 0}select{width:100%;min-height:56px;padding:12px;background:var(--shp-deep);color:var(--shp-text);border:2px solid var(--shp-border);border-radius:20px;margin:8px 0 14px}#goto,#restart{margin-bottom:12px}.shp-night #offlineStatus,.shp-night .source{font-size:16px;color:var(--shp-muted)}.confirm-actions{display:flex;gap:16px;flex-wrap:wrap}.end strong{display:block;margin-top:24px}
@media(min-width:761px) and (max-height:850px){.shp-night #screen{padding:24px 32px;gap:18px}.shp-night h2{font-size:34px}.shp-night .option{font-size:26px;padding:9px 16px;min-height:64px}.shp-night .explanation{font-size:23px;padding:10px 16px}.shp-night .shp-header{min-height:64px}.tools{top:24px}.shp-night h1{font-size:64px}}
@media(max-width:760px){.shp-night #screen{height:auto;min-height:100svh;padding:22px;gap:24px}.shp-night .shp-header{padding:0 100px 0 0;flex-wrap:wrap;gap:12px;min-height:70px}.shp-night .shp-logo{height:56px;max-width:100%}.shp-night #progress{font-size:15px}.tools{top:22px;right:8px}.tools button{width:48px;height:48px;padding:11px}#stage{grid-template-columns:1fr;gap:24px}.scene{height:30vh;min-height:210px}.shp-night h2{font-size:30px}.shp-night h1{font-size:44px}.shp-night .intro p,.shp-night .end p{font-size:24px}.shp-night .option{font-size:21px;gap:12px;padding:12px;min-height:64px}.shp-night .explanation{font-size:21px}.shp-night footer{flex-wrap:wrap;gap:12px}#phase{font-size:15px;text-align:right}.shp-night footer .shp-button{font-size:18px}#next{width:100%;order:3}.shp-night .shp-dialog{padding:24px}.confirm-actions .shp-button{width:100%}}