:root{--ink:#18334a;--navy:#294b63;--coral:#ef6758;--hot:#ff9d72;--mint:#61c9ae;--cool:#dff6ed;--yellow:#f4c95d;--paper:#fff8e8;--sky:#79cbe4;--hair:#9fb5ae;--button-shadow:0 6px 0 var(--ink)}
*{box-sizing:border-box}html{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--paper);color:var(--ink)}body{margin:0;min-height:100dvh;background:radial-gradient(circle at 10% 0,#ffd6b4 0,transparent 30%),var(--paper)}button,a{font:inherit}.site-head{height:60px;padding:0 clamp(13px,4vw,42px);display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #18334a26;background:#fff8e8e8;position:relative;z-index:30}.brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-weight:950;text-decoration:none}.brand img{width:31px;height:31px}.head-tools{display:flex;align-items:center;gap:14px}.track,.eyebrow{font-weight:950;font-size:.72rem;letter-spacing:.12em;color:#b44339}.locale,.news-links a{color:var(--ink);font-weight:850;text-underline-offset:4px}.game-shell{width:min(1180px,100%);margin:0 auto;padding:clamp(12px,3vw,34px)}.screen{min-height:calc(100dvh - 86px)}[hidden]{display:none!important}.intro,.result{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);align-items:center;gap:clamp(22px,4vw,55px)}
.hero-stage,.result-art{position:relative;border:5px solid var(--ink);background:#ffd7b5;overflow:hidden;box-shadow:12px 12px 0 #18334a24}.office-art{display:block;width:100%;height:100%;object-fit:cover}.hero-stage{aspect-ratio:16/10}.hero-stage .office-art{position:absolute;inset:0}.hero-worker{position:absolute;width:42%;height:83%;object-fit:contain;right:7%;bottom:-4%;filter:drop-shadow(0 8px 0 #18334a28)}.intro h1,.result h2{font-size:clamp(3rem,7vw,6rem);line-height:.92;letter-spacing:-.055em;margin:0;overflow-wrap:anywhere}.intro[lang=ja] h1{overflow-wrap:normal}.dek{font-size:clamp(1.1rem,2vw,1.45rem);font-weight:900;margin:12px 0;color:#a23d35}.news-brief,.rule-paper{margin:15px 0;padding:14px 16px;background:#fffdf7;border-left:5px solid var(--mint);border-radius:4px;box-shadow:none}.news-brief b,.rule-paper>b{font-size:.76rem;letter-spacing:.08em}.news-brief p,.rule-paper p{margin:6px 0 0;line-height:1.48}.rule-paper{border-left-color:var(--coral);background:#ffedcf}.primary,.secondary{border:3px solid var(--ink);border-radius:12px;font-weight:950;cursor:pointer;min-height:52px;transition:transform .1s,box-shadow .1s,filter .1s}.primary{padding:13px 19px;background:var(--yellow);color:var(--ink);box-shadow:var(--button-shadow)}.secondary{padding:12px 16px;background:var(--mint);color:var(--ink);box-shadow:0 5px 0 var(--ink)}.primary:hover,.secondary:hover{filter:brightness(1.05);transform:translateY(-1px)}.primary:active,.secondary:active{transform:translateY(5px);box-shadow:none}.primary:focus-visible,.secondary:focus-visible,.garment:focus-visible,.locale:focus-visible,.brand:focus-visible,.news-links a:focus-visible{outline:4px solid #27a995;outline-offset:4px}.key-help{font-size:.78rem;color:#567083;font-weight:750}
.play{position:relative;max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:8px}.play-head{height:52px;display:flex;align-items:center;justify-content:space-between}.score-status,.clock{display:flex;align-items:baseline;gap:8px;font-weight:950}.score-status span,.clock span{font-size:.67rem;letter-spacing:.11em;color:#7a5140}.score-status b,.clock b{font-size:2rem;font-variant-numeric:tabular-nums}.clock b.urgent{color:var(--coral)}.timeline{position:relative;height:82px;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);background:#fffdf7;overflow:hidden}.now-gate{position:absolute;z-index:5;left:22%;top:0;bottom:0;width:5px;background:var(--ink)}.now-gate::after{content:"";position:absolute;left:-7px;bottom:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:12px solid var(--ink)}.now-gate span{position:absolute;top:4px;left:9px;font-size:.65rem;font-weight:950;letter-spacing:.07em}.scene-card{position:absolute;top:16px;width:86px;height:58px;transform:translateX(-50%);will-change:left;pointer-events:none;display:grid;grid-template-columns:54px 1fr;align-items:center}.scene-card svg{width:78px;height:58px}.scene-card small{position:absolute;left:0;right:0;bottom:1px;text-align:center;font-size:.55rem;font-weight:950;text-shadow:0 1px #fff}.scene-card.judged{opacity:.25}.threshold{min-height:28px;text-align:center;font-weight:950;font-size:.85rem;letter-spacing:.03em;color:#8f3f38}.world{position:relative;aspect-ratio:16/9;min-height:340px;max-height:480px;border:5px solid var(--ink);overflow:hidden;background:#fff4db;touch-action:none}.world>.office-art{position:absolute;inset:0}.worker{position:absolute;z-index:3;right:20%;bottom:-4%;height:86%;width:37%;object-fit:contain;filter:drop-shadow(0 7px 0 #18334a25);pointer-events:none}.garments{position:absolute;inset:0;z-index:8}.garment{position:absolute;border:0;background:transparent;padding:0;cursor:grab;touch-action:none;filter:drop-shadow(0 4px 0 #18334a35);transition:left .16s,top .16s,width .16s,transform .1s,filter .1s;user-select:none}.garment svg{display:block;width:100%;height:100%;overflow:visible}.garment:hover{filter:drop-shadow(0 7px 0 #18334a55) brightness(1.05)}.garment:active,.garment.dragging{cursor:grabbing;transition:none;z-index:20;filter:drop-shadow(0 12px 5px #18334a55);transform:scale(1.05)}.garment.selected{outline:4px solid var(--yellow);outline-offset:4px}.garment[data-garment=jacket].worn{left:53%;top:28%;width:25%;height:44%}.garment[data-garment=tie].worn{left:62.7%;top:29%;width:7.5%;height:34%}.garment[data-garment=shoes].worn{left:53%;top:73%;width:25%;height:22%}.garment.hung{width:12%;height:20%}.garment[data-slot="0"].hung{left:5%;top:30%}.garment[data-slot="1"].hung{left:9%;top:48%}.garment[data-slot="2"].hung{left:4%;top:65%}.hanger-drop{left:1.5%;top:18%;width:21%;height:70%}.body-drop{right:15%;top:18%;width:42%;height:76%}.drop-zone{position:absolute;z-index:6;border:4px dashed transparent;border-radius:18px;pointer-events:none}.world.drag-from-body .hanger-drop,.world.drag-from-hanger .body-drop{border-color:var(--yellow);background:#f4c95d24;box-shadow:inset 0 0 0 4px #fff8e899}.tutorial{position:absolute;z-index:25;max-width:160px;padding:8px 10px;background:var(--yellow);border-left:5px solid var(--ink);font-size:.75rem;font-weight:950;pointer-events:none;left:20%;top:16%}.tutorial::after{content:"";position:absolute;left:-16px;top:16px;border-top:9px solid transparent;border-bottom:9px solid transparent;border-right:12px solid var(--ink)}.world-flash{position:absolute;z-index:12;inset:0;pointer-events:none;opacity:0}.world.good .world-flash{background:linear-gradient(90deg,transparent,#61c9ae88,transparent);animation:breeze .5s}.world.bad .world-flash{background:#ef675844;animation:flash .45s}.world[data-cool="2"] .office-art{filter:saturate(.9) hue-rotate(4deg)}.world[data-cool="3"] .office-art,.world[data-cool="4"] .office-art{filter:saturate(.78) hue-rotate(12deg) brightness(1.05)}.wall-progress{position:absolute;z-index:7;right:9%;top:37%;width:24%;height:12%;display:flex;gap:3px;align-items:center;justify-content:center;pointer-events:none}.progress-mark{width:25px;height:25px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);display:grid;place-items:center}.progress-mark svg{width:20px;height:20px}.feedback{margin:0;min-height:44px;padding:8px 11px;border-left:5px solid var(--sky);background:#fffdf7;font-weight:850}.feedback.good{border-left-color:var(--mint);background:#dff6ed}.feedback.bad{border-left-color:var(--coral);background:#ffe1d8}.flat-stats{display:flex;gap:22px;padding:4px 8px;font-size:.72rem;font-weight:850;color:#526979}.flat-stats b{color:var(--ink);font-size:1rem}.resume-layer{position:absolute;z-index:50;inset:0;background:#fff8e8ed;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.resume-layer p{font-weight:950}
.result{padding:3vh 0}.result-art{background:var(--cool)}.result-art img{display:block;width:100%;height:auto}.result h2{font-size:clamp(2.15rem,5vw,4.3rem)}.score-line{display:flex;align-items:baseline;margin-top:14px}.score-line strong{font-size:clamp(5.4rem,12vw,8.5rem);line-height:.8;color:#b44339}.score-line span{font-weight:950;font-size:1.25rem}.rank-line{font-weight:950}.rank-line b{font-size:2rem;color:#1b9e86}.rank-line span{margin-left:8px;color:#7d4037}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:14px 0}.result-stats p{margin:0;padding:9px 11px;background:#fffdf7;border-left:4px solid var(--mint);font-weight:780}.result-actions{display:flex;flex-wrap:wrap;gap:10px}.news-links{display:flex;flex-wrap:wrap;gap:16px;margin-top:18px}.disclaimer{font-size:.72rem;line-height:1.45;color:#576d78}
@keyframes breeze{0%{opacity:0;transform:translateX(-40%)}50%{opacity:1}100%{opacity:0;transform:translateX(40%)}}@keyframes flash{50%{opacity:1}}@media(max-width:760px){.game-shell{padding:8px}.intro,.result{grid-template-columns:1fr;align-items:start;gap:13px}.hero-stage,.result-art{max-height:34vh}.intro h1{font-size:clamp(3rem,15vw,5rem)}.hero-worker{width:36%}.news-brief,.rule-paper{margin:9px 0;padding:10px 12px;font-size:.88rem}.play{max-width:600px}.world{min-height:300px}.result{padding-top:8px}.result-art img{margin-top:-3%}.result h2{font-size:clamp(2.1rem,9vw,3.3rem)}}
@media(max-width:430px){.site-head{height:54px;padding:0 11px}.brand span{font-size:.87rem}.track{display:none}.game-shell{padding:6px}.screen{min-height:calc(100dvh - 60px)}.intro{gap:8px}.hero-stage{max-height:27vh}.intro h1{font-size:clamp(2.85rem,14vw,4rem);line-height:.94}.dek{font-size:1rem;margin:7px 0}.news-brief,.rule-paper{font-size:.81rem;margin:7px 0}.primary{width:100%}.key-help{display:none}.play{gap:5px}.play-head{height:43px}.score-status b,.clock b{font-size:1.65rem}.timeline{height:69px}.scene-card{top:11px;width:72px;height:51px}.scene-card svg{width:68px;height:51px}.world{min-height:0;aspect-ratio:1.22/1;max-height:430px}.worker{right:11%;width:49%;height:84%}.garment[data-garment=jacket].worn{left:50%;top:29%;width:34%;height:43%}.garment[data-garment=tie].worn{left:63%;top:30%;width:10%;height:33%}.garment[data-garment=shoes].worn{left:50%;top:72%;width:34%;height:22%}.garment.hung{width:17%;height:20%}.garment[data-slot="0"].hung{left:4%;top:29%}.garment[data-slot="1"].hung{left:8%;top:48%}.garment[data-slot="2"].hung{left:3%;top:67%}.hanger-drop{width:25%}.body-drop{right:6%;width:52%}.tutorial{left:25%;top:12%;max-width:140px}.feedback{min-height:40px;font-size:.8rem}.flat-stats{justify-content:space-between;gap:5px}.result-art{max-height:28vh}.result-stats{grid-template-columns:1fr}.score-line strong{font-size:5.2rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene-card{will-change:auto}}
.garment[data-garment=tie]{min-width:52px}
@media(max-width:430px){.garment[data-garment=tie].worn{left:60.5%;width:17%}}

/* Headline Games house-art v1.1: simulation-scene mode. */
.intro{min-height:0}
:root{--ink:#071323;--navy:#28527a;--coral:#d9563f;--hot:#f36f45;--mint:#67c7b5;--cool:#e4f4ef;--yellow:#f8c35a;--paper:#fffaf0;--sky:#ffad7a;--button-shadow:0 6px 0 var(--ink)}
.hero-stage,.result-art{background:var(--paper);border-color:var(--ink);border-radius:16px;box-shadow:7px 7px 0 #07132338}.hero-stage{aspect-ratio:16/9}.hero-worker{right:6%;bottom:-8%;width:44%;height:88%;filter:drop-shadow(4px 4px 0 #17324d26)}
.world{border:5px solid var(--ink);border-radius:16px;box-shadow:7px 7px 0 #07132338;background:var(--paper)}.worker{filter:drop-shadow(4px 4px 0 #17324d26)}
.garment{filter:drop-shadow(3px 3px 0 #17324d38)}.garment:hover{filter:drop-shadow(5px 5px 0 #17324d45) brightness(1.04)}.garment:active,.garment.dragging{filter:drop-shadow(7px 7px 0 #17324d50)}
.timeline{border:3px solid var(--ink);border-radius:12px;background:#fff}.scene-card small{text-shadow:none;color:var(--ink);background:#fffaf0dd;border-radius:3px}.threshold{color:var(--coral)}
.progress-mark{background:#fff;border-color:var(--ink);border-radius:8px}.progress-mark.is-success{background:var(--yellow)}.progress-mark.is-warning{background:#fff}.progress-mark svg{width:21px;height:21px}
.tutorial{background:var(--yellow);border:3px solid var(--ink);border-left-width:7px;border-radius:8px;box-shadow:4px 4px 0 #07132333}.feedback{border-left-color:var(--navy);background:#fff}.feedback.good{border-left-color:var(--mint);background:#e4f4ef}.feedback.bad{border-left-color:var(--hot);background:#fff0e9}
.result-art{aspect-ratio:16/9;min-height:0}.result-art>img{position:absolute;display:block;margin:0!important}.result-office-bg{inset:0;width:100%!important;height:100%!important;object-fit:cover}.result-worker{z-index:2;left:13%;bottom:-10%;width:37%!important;height:88%!important;object-fit:contain;filter:drop-shadow(4px 4px 0 #17324d26)}.result-overlay{z-index:3;inset:0;width:100%!important;height:100%!important;object-fit:cover}
@media(max-width:430px){.hero-worker{right:3%;width:42%;height:85%}.result-worker{left:8%;width:40%!important}.hero-stage,.result-art{max-height:none}.world{border-radius:12px;box-shadow:5px 5px 0 #07132338}}
@media(max-width:430px){html:lang(ja) .intro h1{font-size:clamp(2.45rem,11.5vw,3.2rem);line-height:1.05}}

/* Fitted wardrobe states share the worker coordinate system instead of scaling loose inventory art. */
.garment[data-garment].worn{left:auto;top:auto;right:20%;bottom:-4%;width:37%;height:86%;min-width:0}
.garment[data-garment=jacket].worn{clip-path:polygon(8% 36%,29% 34%,43% 31%,50% 36%,57% 31%,72% 34%,92% 60%,78% 66%,75% 70%,25% 70%,22% 66%)}
.garment[data-garment=tie].worn{clip-path:polygon(38% 35%,62% 35%,61% 62%,50% 66%,39% 62%)}
.garment[data-garment=shoes].worn{clip-path:polygon(20% 88%,86% 88%,90% 98%,18% 98%)}
.garment[data-garment].hung{clip-path:none}
@media(max-width:430px){.garment[data-garment].worn{right:11%;width:49%;height:84%}}

/* Keep populated status marks inside the cooling-unit rail and outside the worker's face safe zone. */
.wall-progress{right:4%;top:4%;width:30%;height:13%;justify-content:flex-end}
@media(max-width:430px){.wall-progress{right:2%;top:3%;width:34%;height:14%}.progress-mark{width:22px;height:22px}.progress-mark svg{width:18px;height:18px}}