:root{--ink:#111432;--yellow:#ffe83f;--cyan:#35daed;--pink:#ff5e77;--purple:#7357f5;--paper:#fffdf3}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif}button,input{font:inherit;color:inherit}button{cursor:pointer}.opening{position:fixed;inset:0;z-index:100;background:var(--yellow);overflow:hidden}.opening.done{transform:translateY(-105%);visibility:hidden;transition:.7s cubic-bezier(.75,0,.2,1)}.opening:not(.started) .op-frame,.opening:not(.started) .op-hero,.opening:not(.started) .op-final,.opening:not(.started) .op-bar{animation-play-state:paused}.op-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(17,20,50,.08) 50%),linear-gradient(transparent 49.8%,rgba(17,20,50,.08) 50%);background-size:38px 38px;transform:skew(-10deg) scale(1.2)}.power{position:absolute;z-index:30;left:50%;top:50%;translate:-50% -50%;display:flex;align-items:center;gap:14px;border:4px solid var(--ink);background:#fff;padding:14px 24px;box-shadow:10px 10px 0 var(--ink);font-weight:900;transition:.3s}.power.gone{opacity:0;scale:1.4;pointer-events:none}.power b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--pink);color:#fff}.power span{text-align:left}.power small{display:block;font-size:10px;margin-top:3px}.skip{position:absolute;z-index:40;right:3vw;top:3vh;background:#fff;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:9px 14px;font-size:12px;font-weight:900}.op-frame{position:absolute;inset:0;display:grid;place-content:center;text-align:center;opacity:0}.op-frame b,.op-frame strong{display:block;font-size:clamp(3rem,10vw,9rem);line-height:.9}.op-frame span{font-weight:900;margin-top:14px}.f1{animation:f1 6.5s both}.f1 i{width:70px;height:70px;margin:0 auto 24px;border:8px solid #fff;border-top-color:var(--pink);border-radius:50%;animation:spin .7s linear infinite}.f2{background:var(--pink);color:#fff;animation:f2 6.5s both}.f2 strong{-webkit-text-stroke:3px var(--ink);text-shadow:8px 8px 0 var(--ink)}.f3{background:var(--cyan);animation:f3 6.5s both}.f3 b{font-size:clamp(2rem,6vw,5rem)}.f3 strong{color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:8px 8px 0 var(--pink)}.op-hero{position:absolute;z-index:6;height:115vh;right:-2%;bottom:-17%;opacity:0;filter:drop-shadow(20px 20px 0 rgba(17,20,50,.15));animation:opHero 6.5s both}.op-final{position:absolute;z-index:8;left:6vw;top:16vh;opacity:0;transform:rotate(-4deg);animation:opFinal 6.5s both}.op-final small{background:var(--ink);color:#fff;padding:5px 10px;font-weight:900;letter-spacing:.2em}.op-final b,.op-final strong{display:block;font-size:clamp(3.4rem,9vw,8rem);line-height:.86;letter-spacing:-.1em}.op-final strong{color:#fff;-webkit-text-stroke:4px var(--ink);text-shadow:8px 8px 0 var(--pink)}.op-final em{display:inline-block;margin-top:18px;background:#fff;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:8px 14px;font-style:normal;font-weight:900}.op-bar{position:absolute;z-index:20;bottom:0;height:7px;background:var(--pink);animation:bar 6.5s linear both}@keyframes spin{to{rotate:360deg}}@keyframes f1{0%,4%{opacity:0}8%,20%{opacity:1}24%,100%{opacity:0}}@keyframes f2{0%,22%{opacity:0;transform:scale(2)}25%,39%{opacity:1;transform:none}43%,100%{opacity:0}}@keyframes f3{0%,40%{opacity:0;transform:translateX(-100%)}44%,57%{opacity:1;transform:none}61%,100%{opacity:0}}@keyframes opHero{0%,57%{opacity:0;transform:translateX(100%) rotate(12deg)}64%,100%{opacity:1;transform:none}}@keyframes opFinal{0%,61%{opacity:0;transform:translateX(-100%) rotate(-8deg)}68%,100%{opacity:1;transform:rotate(-4deg)}}@keyframes bar{from{width:0}to{width:100%}}
.app{height:100%;position:relative;overflow:hidden;background:linear-gradient(145deg,#45d9ed 0 58%,#fff0a4 58%);opacity:0;transition:.4s}.app.ready{opacity:1}.app:before{content:"";position:absolute;inset:0;background:radial-gradient(#fff 1.5px,transparent 1.5px);background-size:28px 28px;opacity:.2}header{height:64px;position:relative;z-index:50;display:flex;align-items:center;gap:26px;padding:8px 3vw;background:rgba(255,255,255,.94);border-bottom:3px solid var(--ink)}.brand{border:0;background:none;text-align:left;font-weight:900}.brand b{font-size:21px}.brand span{display:block;font-size:9px;letter-spacing:.15em}.status{font-size:12px;font-weight:900}.status i{display:inline-block;width:9px;height:9px;background:#43d879;border:2px solid var(--ink);border-radius:50%;margin-right:6px}.tools{margin-left:auto;display:flex;gap:8px}.tools button{width:38px;height:38px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);box-shadow:3px 3px 0 var(--ink);font-weight:900}.home{position:absolute;inset:64px 0 0}.copy{position:absolute;z-index:15;left:5vw;top:6vh;width:43vw}.kicker{display:inline-block;background:var(--ink);color:#fff;padding:5px 9px;font-size:10px;font-weight:900;letter-spacing:.12em}.copy h1{font-size:clamp(3.3rem,7.2vw,7.4rem);line-height:.83;letter-spacing:-.1em;margin:18px 0;text-shadow:6px 6px 0 #fff}.copy h1 span{display:block;color:#fff;-webkit-text-stroke:4px var(--ink);text-shadow:7px 7px 0 var(--pink)}.copy p{font-size:16px;font-weight:800;line-height:1.7}.copy p strong{background:var(--yellow);padding:2px 5px}.stamp{display:inline-block;border:3px solid var(--pink);color:var(--pink);padding:5px 12px;font-weight:900;transform:rotate(-5deg)}.hero-wrap{position:absolute;z-index:3;right:0;top:0;width:58%;height:100%}.hero{position:absolute;z-index:2;height:105%;right:0;bottom:-12%;filter:drop-shadow(18px 18px 0 rgba(17,20,50,.12));cursor:pointer}.burst{position:absolute;right:1%;top:4%;width:72%;aspect-ratio:1;background:var(--yellow);clip-path:polygon(50% 0,59% 35%,85% 15%,67% 42%,100% 50%,67% 58%,85% 85%,59% 65%,50% 100%,41% 65%,15% 85%,33% 58%,0 50%,33% 42%,15% 15%,41% 35%);animation:slowspin 26s linear infinite}.speech{position:absolute;z-index:5;right:3%;top:8%;max-width:190px;background:#fff;border:3px solid var(--ink);border-radius:50%;padding:18px;font-size:13px;font-weight:900;box-shadow:5px 5px 0 var(--ink);transform:rotate(4deg)}.speech b{color:var(--pink)}@keyframes slowspin{to{rotate:360deg}}
.clinic{position:absolute;z-index:25;right:4vw;top:9vh;width:min(410px,39vw);background:var(--paper);border:4px solid var(--ink);box-shadow:13px 13px 0 var(--ink);transform:rotate(1deg)}.clinic-head{padding:14px 18px;border-bottom:3px solid var(--ink);background:var(--yellow)}.clinic-head span{float:right;background:var(--pink);color:#fff;padding:4px 8px;font-size:10px;font-weight:900}.clinic-head b,.clinic-head small{display:block}.clinic-head b{font-size:20px}.clinic-head small{font-size:11px}.station{width:100%;min-height:82px;display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;padding:12px 16px;border:0;border-bottom:2px dashed #b9bad0;background:#fff;text-align:left}.station .num{font:900 23px/1 monospace;color:var(--pink)}.station b,.station small,.station span{display:block}.station b{font-size:15px}.station small,.station>div>span{font-size:11px;opacity:.7}.station label{grid-column:1/-1;display:flex;gap:7px}.station input{min-width:0;flex:1;border:2px solid var(--ink);padding:8px 10px;background:#f6f6ff}.station label button{border:2px solid var(--ink);background:var(--pink);color:#fff;padding:7px 10px;font-weight:900;box-shadow:3px 3px 0 var(--ink)}.action{grid-template-columns:42px 1fr auto;transition:.2s}.action:hover{background:#ecfbff;padding-left:21px}.action em{font-size:11px;font-style:normal;font-weight:900;border:2px solid var(--ink);padding:7px;background:var(--yellow)}.bin-station .num{color:var(--purple)}.danger{position:absolute;right:-23px;bottom:-67px;width:150px;background:var(--pink);color:#fff;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:8px;transform:rotate(-4deg)}.danger span,.danger b,.danger i{display:block}.danger span{font-size:10px}.danger b{font-size:20px}.danger i{font-size:9px;font-style:normal}.mascot{position:absolute;z-index:18;width:120px;touch-action:none;user-select:none;cursor:grab;filter:drop-shadow(7px 8px 0 rgba(17,20,50,.16));will-change:transform}.mascot img{width:100%;pointer-events:none}.mascot span{position:absolute;left:50%;bottom:-2px;translate:-50%;white-space:nowrap;background:#fff;border:2px solid var(--ink);padding:3px 7px;font-size:8px;font-weight:900}.mascot .prop{position:absolute;z-index:3;left:50%;top:45%;translate:-50% -50%;font-size:0}.mascot.perform .prop{font-size:50px;animation:pop .35s}.mascot.perform img{animation:bounce .4s infinite alternate}@keyframes pop{from{scale:0;rotate:-20deg}}@keyframes bounce{to{transform:translateY(-8px) rotate(4deg)}}
.result{position:fixed;z-index:80;left:5vw;bottom:70px;width:min(430px,88vw);background:#fff;border:4px solid var(--ink);box-shadow:11px 11px 0 var(--pink);padding:20px;transform:translateX(-130%) rotate(-3deg);transition:.4s cubic-bezier(.2,1.3,.3,1)}.result.show{transform:translateX(0) rotate(-1deg)}.result small,.result b,.result p,.result em{display:block}.result small{font-size:10px;letter-spacing:.15em}.result b{font-size:24px;margin:4px 0}.result p{margin:6px 0;font-weight:800}.result em{font-size:11px;font-style:normal}.result button{position:absolute;right:8px;top:4px;border:0;background:none;font-size:22px}.meter{position:absolute;z-index:28;left:5vw;bottom:50px;font-size:11px;font-weight:900}.meter i{display:inline-block;width:120px;height:9px;margin-left:8px;border:2px solid var(--ink);background:#fff;vertical-align:middle}.meter span{display:block;width:0;height:100%;background:var(--pink);transition:.5s}.ticker{position:absolute;z-index:30;bottom:0;left:0;right:0;height:31px;display:flex;align-items:center;background:var(--ink);color:#fff;overflow:hidden;font-size:10px;font-weight:900}.ticker>span{height:100%;display:grid;place-items:center;background:var(--pink);padding:0 20px;white-space:nowrap}.ticker div{white-space:nowrap;animation:ticker 20s linear infinite}@keyframes ticker{from{transform:translateX(70vw)}to{transform:translateX(-100%)}}
.toast{position:fixed;z-index:90;top:84px;left:50%;translate:-50%;background:var(--ink);color:#fff;border:3px solid #fff;outline:3px solid var(--ink);padding:10px 18px;font-weight:900;opacity:0;transform:translateY(-20px);transition:.25s}.toast.show{opacity:1;transform:none}.serious{position:fixed;z-index:110;inset:0;background:#111;color:#fff;display:grid;place-content:center;text-align:center;opacity:0;visibility:hidden}.serious.show{animation:serious 3.8s both}.serious>*{display:block}.serious b{font-size:clamp(2rem,7vw,6rem)}.serious span{font-size:50px}.serious strong{font-size:clamp(3rem,11vw,9rem);color:var(--pink)}.serious em{font-style:normal;font-weight:900}.chaos{animation:chaos .18s steps(2) infinite}@keyframes serious{0%{opacity:0;visibility:visible}10%,85%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes chaos{50%{filter:hue-rotate(40deg) saturate(1.8)}}.particle{position:fixed;z-index:120;pointer-events:none;font-size:28px}.chip{position:fixed;z-index:100;background:#fff;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--pink);padding:5px 9px;font-size:12px;font-weight:900}.modal-close{position:absolute;right:8px;top:5px;border:0;background:none;font-size:24px}dialog{border:4px solid var(--ink);box-shadow:10px 10px 0 var(--ink);max-width:500px;background:var(--paper)}dialog::backdrop{background:rgba(17,20,50,.7);backdrop-filter:blur(5px)}#modalBody{padding:28px;text-align:center;line-height:1.7}#modalBody h3{color:var(--pink);font-size:26px}#secret{position:fixed;z-index:60;right:12px;bottom:40px;border:0;background:none;color:#fff;text-shadow:2px 2px 0 var(--ink);font-size:21px}
@media(max-width:850px){header{height:56px}.status{display:none}.home{inset:56px 0 0;overflow-y:auto;overflow-x:hidden;padding-bottom:100px}.copy{position:relative;left:auto;top:auto;width:auto;padding:28px 18px 10px}.copy h1{font-size:15vw;line-height:.88;margin:14px 0}.copy h1 span{-webkit-text-stroke:2px var(--ink);text-shadow:5px 5px 0 var(--pink)}.copy p{font-size:13px}.hero-wrap{top:95px;width:100%;height:430px;opacity:.82}.hero{height:84%;right:-22%;bottom:0}.speech{right:3%;top:0;font-size:10px;padding:11px}.clinic{position:relative;right:auto;top:auto;width:calc(100% - 32px);margin:255px 16px 150px;transform:none}.clinic-head b{font-size:18px}.station{min-height:82px;padding:10px 12px}.station label{display:grid;grid-template-columns:1fr auto}.action{grid-template-columns:35px 1fr auto}.action em{font-size:9px}.danger{right:5px;bottom:-62px}.mascot{width:92px}.result{left:5vw;bottom:110px}.meter{position:fixed;left:12px;bottom:68px;background:#fff;border:2px solid var(--ink);padding:5px;z-index:55}.ticker{position:fixed;bottom:0;height:28px}.op-hero{right:-58%;height:90vh}.op-final{left:6vw;top:14vh;max-width:85vw}.op-final b,.op-final strong{font-size:14vw}.op-final strong{-webkit-text-stroke:2px var(--ink);text-shadow:5px 5px 0 var(--pink)}.op-final em{font-size:9px}.power{width:82vw;justify-content:center}.serious strong{font-size:16vw}}
/* v7: calmer hierarchy and reliable touch targets */
.hero{z-index:22}.speech{z-index:30}.mascot{z-index:36}.result p:empty,.result em:empty{display:none}
.hero-talk{position:fixed;z-index:92;left:50%;top:21%;width:min(390px,88vw);padding:22px 46px 22px 22px;background:#fff;border:4px solid var(--ink);border-radius:22px 22px 22px 5px;box-shadow:9px 9px 0 #7657ff;transform:translate(-50%,-20px) rotate(-1deg) scale(.9);opacity:0;pointer-events:none;transition:.25s cubic-bezier(.2,1.4,.3,1)}.hero-talk:after{content:"";position:absolute;right:22px;bottom:-17px;width:25px;height:25px;background:#fff;border-right:4px solid var(--ink);border-bottom:4px solid var(--ink);transform:skewY(35deg)}.hero-talk.show{opacity:1;transform:translate(-50%,0) rotate(-1deg) scale(1);pointer-events:auto}.hero-talk b{display:block;font-size:19px;line-height:1.55}.hero-talk button{position:absolute;right:9px;top:6px;border:0;background:none;font-size:22px}
.meter{left:auto;right:5vw;top:14px;bottom:auto;padding:5px 8px;background:rgba(255,255,255,.92);border:2px solid var(--ink);font-size:10px;box-shadow:3px 3px 0 #7657ff;transform:rotate(1deg)}.meter i{width:76px;height:7px;margin-left:5px}.meter span{background:linear-gradient(90deg,#45d9ed,#7657ff)}
.brand span{display:inline-block!important;margin-top:1px;padding:1px 6px;background:#fff0a4;color:#5b3fd9;font-size:12px!important;letter-spacing:.08em;border-radius:8px}.op-brand b{background:#fff!important;color:#5b3fd9!important;border:3px solid var(--ink);box-shadow:4px 4px 0 #35daed;padding:6px 11px!important}.kicker{font-size:12px}.clinic{box-shadow:9px 9px 0 #7357f5}.clinic-head span{font-size:12px}.station b{font-size:16px}.action em{font-size:12px;border-radius:8px}.wang-station{border-left:7px solid #ff5e77}.ying-station{border-left:7px solid #35daed}.bin-station{border-left:7px solid #7357f5}.mascot span{font-size:11px}.result small,.result em{font-size:12px}.ticker{font-size:11px}
@media(max-width:850px){header{padding:6px 12px;gap:10px}.brand{flex:0 0 auto}.tools{flex:0 0 auto}.speech{display:none}.hero{z-index:22}.mascot{z-index:36;width:88px}.hero-talk{top:23%}.copy h1{font-size:12.8vw;letter-spacing:-.06em}.copy p{font-size:14px}.action em{font-size:12px}.meter{position:fixed;left:auto;right:8px;top:61px;bottom:auto;z-index:56;padding:4px 6px;font-size:10px}.meter i{width:54px;height:6px}.result{z-index:85}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important}.opening{display:none}.app{opacity:1}}
.op-brand{position:absolute;z-index:24;left:3vw;top:3vh;display:flex;align-items:center;gap:3px;transform:rotate(-3deg)}.op-brand i{display:grid;place-items:center;width:38px;height:42px;border:3px solid var(--ink);background:#fff;font-style:normal;font-size:23px;font-weight:900;box-shadow:3px 3px 0 var(--ink)}.op-brand i:nth-child(1){color:var(--pink)}.op-brand i:nth-child(2){color:#11baca}.op-brand i:nth-child(3){color:var(--purple)}.op-brand b{margin-left:8px;background:var(--ink);color:#fff;padding:8px 11px;font-size:15px}.op-brand span{color:var(--pink);font-size:27px}.brand b{display:flex;align-items:center;gap:1px}.brand b i{font-style:normal;font-size:23px}.brand b i:nth-child(1){color:var(--pink)}.brand b i:nth-child(2){color:#10b9c9}.brand b i:nth-child(3){color:var(--purple)}.brand b em{font-style:normal;color:var(--pink);font-size:15px;margin-left:3px}.op-hero{opacity:.35}.station{min-height:72px}@keyframes opHero{0%{opacity:.48;transform:translateX(10%) rotate(3deg)}15%,57%{opacity:.38;transform:translateX(6%) rotate(2deg)}64%,100%{opacity:1;transform:none}}@media(max-width:850px){.op-brand{left:4vw;top:3vh}.op-brand i{width:30px;height:34px;font-size:18px}.op-brand b{font-size:11px;padding:7px}.op-brand span{display:none}.op-hero{right:-35%;opacity:.55}}