:root{--ink:#24334c;--paper:#fdf8ef;--cream:#faf6ed;--gold:#ffc644;--blue:#70b0cc;--coral:#bb5033}
*{box-sizing:border-box}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.game-main{width:min(100%,1180px);margin:auto}
.hero-stage{width:100%;aspect-ratio:16/9;border-width:0!important;border-radius:0!important;box-shadow:none!important}
.hero-stage img{width:100%;height:100%;display:block;object-fit:cover}
.intro-copy{text-align:center}.feature-preview{margin:0;color:var(--coral);font-size:.75rem;font-weight:950;letter-spacing:.1em}.eyebrow{margin:6px 0 0}.intro-copy h1{max-width:900px;margin:10px auto 0;font-size:clamp(2rem,6vw,4.6rem);line-height:1.06}.dek{margin:10px auto 16px;font-size:clamp(1rem,2.4vw,1.35rem);font-weight:900}.intro-copy #start{display:block;width:min(100%,420px);margin:18px auto 4px}
#play{width:min(100% - 12px,520px);margin:6px auto 24px;scroll-margin-top:60px}
.play-panel{padding:7px;background:var(--paper);border:3px solid var(--ink);border-radius:18px;box-shadow:0 6px 0 rgba(36,51,76,.18);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.play-hud{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:6px}
.hud-ticket{min-width:0;padding:4px 5px;color:var(--ink);background:#fff;border-left:4px solid var(--blue);font-size:.66rem;font-weight:850;line-height:1.15;text-align:center}
.hud-ticket b{display:block;margin-top:2px;font-size:.92rem;white-space:nowrap}
.board-frame{box-shadow:none!important;border-width:3px!important;border-radius:12px!important}
.board{position:relative;width:100%;aspect-ratio:430/470;overflow:hidden;background:var(--cream)}
.room-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.calendar{position:absolute;z-index:4;top:3.5%;left:5%;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;width:42%;padding:3px;background:rgba(253,248,239,.94);border:2px solid var(--ink)}
.calendar i{aspect-ratio:1;display:grid;place-items:center;background:var(--paper);border:1px solid var(--ink);font-style:normal;font-size:.46rem;font-weight:950}
.calendar i.done{background:var(--gold)}.calendar i.follow::after{content:"×";color:var(--coral);font-size:.75rem}
.target-zone{position:absolute;z-index:5;top:24.5%;left:40.5%;width:19%;height:9%;display:grid;place-items:center;color:var(--ink);background:rgba(255,198,68,.27);border:3px dashed var(--coral);transition:left .16s ease-out}
.target-zone img{position:absolute;left:50%;bottom:78%;width:78%;height:auto;transform:translateX(-50%);filter:drop-shadow(2px 3px 0 rgba(36,51,76,.16))}.target-zone span{padding:1px 5px;background:var(--paper);font-size:.58rem;font-weight:950}
.incidents{position:absolute;inset:0;z-index:6;pointer-events:none}.incident{position:absolute;width:12%;aspect-ratio:1;transform:translate(-50%,-50%);filter:drop-shadow(2px 3px 0 rgba(36,51,76,.18))}.incident::before{content:"";position:absolute;inset:7%;background:var(--paper);border:4px solid var(--coral);outline:3px solid var(--ink);transform:rotate(45deg)}.incident img{position:absolute;z-index:1;inset:18%;width:64%;height:64%;object-fit:contain}.incident::after{content:"!";position:absolute;z-index:2;right:-8%;top:-8%;display:grid;place-items:center;width:34%;aspect-ratio:1;color:#fff;background:var(--coral);border:2px solid var(--ink);border-radius:50%;font-size:.62rem;font-weight:950}.incident.moving::after{content:"↔";width:48%;border-radius:3px;font-size:.55rem}.incident.moving{transition:none}
.tray{position:absolute;z-index:8;left:12%;top:78%;width:76%;height:11px;background:var(--ink);transform-origin:center;will-change:top,transform}
.tray-holder{position:absolute;z-index:7;height:29%;width:auto;transform:translate(-50%,-6%);transform-origin:50% 8%;will-change:top,transform;filter:drop-shadow(2px 3px 0 rgba(36,51,76,.12));pointer-events:none}.tray-holder-left{left:12%;--holder-lean:4deg;transform:translate(-50%,-6%) rotate(var(--holder-lean))}.tray-holder-right{left:88%;--holder-lean:-4deg;transform:translate(-50%,-6%) rotate(var(--holder-lean))}.tray-holder.lifting{filter:drop-shadow(2px 3px 0 rgba(36,51,76,.12)) saturate(1.12)}
.glass{position:absolute;z-index:9;width:7%;aspect-ratio:3/4;transform-origin:50% 100%;will-change:left,top,transform}
.glass::before{content:"";position:absolute;inset:0;background:var(--blue);border:3px solid var(--ink);clip-path:polygon(4% 0,96% 0,83% 100%,17% 100%)}
.glass i{position:absolute;z-index:2;left:17%;right:17%;top:-31%;height:38%;background:var(--paper);border:2px solid var(--ink);border-bottom:0}
.glass.near::after{content:"!";position:absolute;right:-16px;top:-16px;display:grid;place-items:center;width:23px;height:23px;color:#fff;background:var(--coral);border:2px solid var(--ink);border-radius:50%;font-weight:950}
.catch-arm{position:absolute;z-index:10;width:30%;height:auto;transform:translate(-50%,-15%)}
.feedback-panel{min-height:34px;margin:6px 0;padding:6px 9px;display:grid;grid-template-columns:22px 1fr;align-items:center;gap:6px;color:var(--ink);background:rgba(255,255,255,.92);border:0;border-left:5px solid var(--blue);border-radius:5px;box-shadow:0 2px 0 rgba(36,51,76,.12);font-size:.73rem;font-weight:850;line-height:1.25;pointer-events:none}
.feedback-panel[data-kind="success"]{border-left-color:#208537}.feedback-panel[data-kind="danger"]{border-left-color:var(--coral)}.feedback-panel[data-kind="near"]{border-left-color:#b26b00}
.tray-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tray-controls button{min-height:61px;padding:8px;color:var(--ink);background:var(--gold);border:3px solid var(--ink);border-radius:10px;box-shadow:0 5px 0 var(--ink);font:inherit;font-size:.95rem;font-weight:950;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.tray-controls button[aria-pressed="true"]{transform:translateY(4px);box-shadow:0 1px 0 var(--ink);background:#ffd86b}.tray-controls button:disabled{opacity:.5;box-shadow:none;cursor:not-allowed}.tray-controls button:focus-visible{outline:4px solid #0086ff;outline-offset:3px}
#result{width:min(100% - 12px,780px);margin:8px auto 28px}.result-card{padding:18px;color:var(--ink);background:var(--paper);border:4px solid var(--ink);border-radius:22px;box-shadow:0 8px 0 rgba(36,51,76,.18);text-align:center}.result-art{box-shadow:none!important}.result-art img{display:block;width:100%}.result-month{margin:14px 0 0;font-weight:900}.result-month strong{font-size:2rem}.rank-line{margin:8px 0 0}.rank-line strong{display:inline-grid;place-items:center;width:52px;height:52px;margin-left:10px;color:#fff;background:var(--coral);border:3px solid var(--ink);font-size:1.6rem}.result-title{margin:8px 0 0;font-size:1.25rem;font-weight:950}.final-score{margin:4px 0;font-size:1.6rem;font-weight:950}.result-message,.shift-line{font-weight:800}.shift-line{padding:9px;background:var(--gold);border-left:6px solid var(--coral)}
.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.result-stats div{padding:8px;background:#fff;border:1px solid #a9b8c5}.result-stats dt{font-size:.72rem}.result-stats dd{margin:2px 0 0;font-weight:950}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}.news-card{text-align:left}.news-card h2{margin-bottom:4px}
#editorial{width:min(100% - 28px,860px);margin:32px auto 64px;color:#18273c;-webkit-user-select:text;user-select:text}#editorial section{margin:0;padding:18px 0;border-bottom:1px solid #9fb0be}#editorial h2{margin:0 0 7px;font-size:1.2rem}#editorial p{margin:0;line-height:1.8}#editorial a{color:#003f87}
@media(max-width:680px){.wide-only{display:none}.intro-copy h1{font-size:2rem}.game-main{width:100%}#play{margin-top:4px}.play-panel{padding:5px}.board{max-height:calc(var(--hg-visual-viewport-height) - 230px);min-height:318px}.feedback-panel{margin:5px 0}.tray-controls button{min-height:58px}.result-card{padding:12px}.result-stats{gap:4px}.result-stats div{padding:6px 3px}.result-actions{grid-template-columns:1fr}.calendar i{font-size:.42rem}}
@media(max-width:340px){.board{min-height:300px}.hud-ticket{font-size:.6rem}.tray-controls button{font-size:.86rem}.target-zone span{display:none}.tray-holder{height:27%}.incident{width:12.5%}}
@media(max-height:590px) and (orientation:portrait){.board{min-height:285px}.tray-controls button{min-height:52px}.feedback-panel{min-height:30px}}
@media(prefers-reduced-motion:reduce){.target-zone{transition:none}.tray-holder{transition:none}}
