:root{color-scheme:dark;--ink:#f4fffd;--muted:#acd4d4;--deep:#041f27;--panel:#083943;--panel2:#0d4b55;--teal:#45e6d3;--coral:#ff8d7e;--gold:#ffd363;--line:#3b8490;--danger:#ff7b86;font-family:Inter,"Noto Sans TC",system-ui,sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html,body{margin:0;min-height:100%;background:#031a21;color:var(--ink)}body{overflow-x:hidden;background:radial-gradient(circle at 50% 12%,#12525a,#031a21 64%)}button,select{font:inherit}button{cursor:pointer}.primary-action{border:0;border-radius:14px;background:linear-gradient(#ffe67f,#f5b62d);color:#332300;font-weight:900;box-shadow:0 5px 0 #9d6a12}.primary-action:disabled,button:disabled{cursor:not-allowed;filter:grayscale(.65);opacity:.58;box-shadow:none}
.loading-panel{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:#041f27}.loading-card{display:grid;justify-items:center;gap:14px}.loading-card img{width:140px;height:140px;object-fit:cover;border:2px solid #82fff1;border-radius:28px}.loading-track{width:200px;height:8px;overflow:hidden;border-radius:99px;background:#1a5057}.loading-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--teal),var(--gold));animation:load 1s forwards}@keyframes load{to{width:100%}}
#mainGroup{width:min(100%,920px);margin:auto}.main-screen{min-height:min(844px,100svh);padding:18px;background:linear-gradient(#041f27e6,#041f27f2),url("../../assets/animal-carnival-claw-background.webp") center/cover}.main-header{height:62px;display:grid;grid-template-columns:112px minmax(0,1fr) 150px;align-items:center;gap:12px}.main-header>strong{text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.main-return{display:flex;width:78px;height:52px;align-items:center;justify-content:center;gap:7px;border-radius:14px;background:#f7faf9;color:#11649a;text-decoration:none;font-size:23px;font-weight:900}.main-return img{width:27px;height:27px;object-fit:contain}.locale-control{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.locale-control select{width:100%;min-width:0;padding:9px;border:1px solid var(--line);border-radius:10px;background:#0b343b;color:#fff}.main-hero{display:grid;grid-template-columns:minmax(280px,1.12fr) minmax(250px,.88fr);gap:28px;align-items:center;min-height:720px;padding:28px}.main-poster{width:100%;aspect-ratio:1;object-fit:cover;border:3px solid #6ef4e5;border-radius:30px;box-shadow:0 22px 55px #0009}.main-copy small{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--coral);color:#32120f;font-weight:900}.main-copy h1{margin:18px 0;font-size:clamp(34px,5vw,62px);line-height:1}.main-copy p{font-size:20px;line-height:1.5;color:#d4f0ed}.main-progress{margin:20px 0;color:var(--teal);font-weight:800}.main-copy .primary-action{width:100%;height:52px;font-size:20px}.game-page-info{color:#163439}.guide-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.guide-grid article{min-width:0}.guide-grid p,.guide-grid li,.guide-grid dd{line-height:1.55}
.stage-screen,.battle-screen{width:100%;min-height:100svh}.stage-canvas,.battle-canvas{position:relative;width:min(100%,920px);height:calc(100svh - 56px);margin:auto;overflow:hidden}.stage-ad-reserve,.battle-ad-reserve{width:min(100%,920px);height:56px;margin:auto;background:#021218}.stage-canvas{display:grid;grid-template-rows:72px minmax(0,1fr) 56px;gap:8px;padding:12px;background:linear-gradient(#031d26dc,#031d26f2),var(--wp-stage-art) center/cover}.stage-header,.battle-header{display:grid;align-items:center;border:1px solid var(--line);border-radius:15px;background:#062832ed}.stage-header{grid-template-columns:58px minmax(0,1fr) 54px;padding:7px}.stage-header button,.battle-header>button{width:48px;height:48px;border:0;border-radius:12px;background:#f6faf8;color:#1575a8;font-weight:900;font-size:24px}.stage-header>div{display:grid;min-width:0;padding:0 10px}.stage-header strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage-header span{color:var(--muted);font-size:13px}.stage-workspace{position:relative;min-height:0;overflow:hidden}.stage-panel{display:grid;grid-template-rows:110px minmax(0,1fr) 50px;height:100%;gap:8px}.chapter-panel{align-self:start;max-width:620px;margin:auto;padding:12px 18px;text-align:center;border:1px solid var(--line);border-radius:16px;background:#062832e8}.chapter-panel small,.chapter-panel strong{display:block}.chapter-panel strong{font-size:20px;color:var(--gold)}.chapter-panel p{margin:5px 0 0;color:var(--muted);font-size:13px}.stage-rail{display:flex;align-items:center;gap:22px;min-height:0;overflow-x:auto;overflow-y:hidden;padding:14px calc(50% - 132px);scroll-snap-type:x mandatory;touch-action:pan-x;scrollbar-width:none}.stage-rail::-webkit-scrollbar{display:none}.stage-card{position:relative;flex:0 0 264px;height:190px;overflow:hidden;padding:0;border:2px solid #4b8189;border-radius:22px;background:#0b3a43;color:#fff;text-align:left;scroll-snap-align:center;box-shadow:0 12px 24px #0007}.stage-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.46)}.stage-card>span{position:absolute;inset:auto 14px 14px;z-index:1;text-shadow:0 2px 5px #000}.stage-card strong{display:block;font-size:22px}.stage-card small{display:block;margin-top:5px}.stage-card.locked{filter:grayscale(.72)}.stage-card.is-centered,.stage-card.wp-stage-centered{border-color:#69ffed;box-shadow:0 0 0 3px #e2fffb,0 0 30px #2bffe2}.enter-button{width:min(100%,420px);height:46px;justify-self:center}.stage-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.stage-tabs button{border:1px solid var(--line);border-radius:12px;background:#082f38;color:#c6e5e4;font-weight:900}.stage-tabs button.active{background:var(--gold);color:#372500}.management-panel{height:100%;overflow:auto;padding:16px;border:1px solid var(--line);border-radius:16px;background:#052630ed}.panel-heading{text-align:center}.panel-heading h2{margin:0;color:var(--gold)}.panel-heading p{margin:6px;color:var(--muted)}.cabinet-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:680px;margin:14px auto}.cabinet-item{display:grid;justify-items:center;gap:5px;padding:8px;border:1px solid var(--line);border-radius:14px;background:#0b3a43}.cabinet-item.locked{filter:grayscale(1);opacity:.42}.cabinet-sprite{width:82px;aspect-ratio:1;background-repeat:no-repeat;background-size:200% 200%}.cabinet-item strong{font-size:12px;text-align:center}.upgrade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:720px;margin:18px auto}.upgrade-card{padding:14px;border:1px solid var(--line);border-radius:14px;background:#0b3a43}.upgrade-card p{min-height:50px;color:var(--muted);font-size:13px}.upgrade-card button{width:100%;min-height:44px;border:0;border-radius:10px;background:var(--teal);color:#05282b;font-weight:900}#workshopFeedback{text-align:center;color:var(--gold)}
.battle-canvas{padding:10px;background:#041c24}.battle-live{display:grid;grid-template-rows:70px 42px minmax(0,1fr) 74px;gap:8px;height:100%}.battle-header{grid-template-columns:54px minmax(120px,1fr) 78px 78px 48px;padding:7px}.battle-title{display:grid;min-width:0;padding:0 8px}.battle-title small{color:var(--muted)}.battle-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.battle-stat{display:grid;text-align:center;border-left:1px solid #2d6971}.battle-stat small{color:var(--muted);font-size:11px}.battle-stat strong{color:var(--gold)}.utility-button{background:#164b54!important;color:#fff!important}.target-strip{display:flex;align-items:center;gap:9px;min-width:0;padding:6px 12px;border:1px solid var(--line);border-radius:12px;background:#062832}.target-strip>strong{font-size:12px;color:var(--muted)}#targetList{display:flex;gap:7px;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}#targetList::-webkit-scrollbar{display:none}.target-chip{display:flex;align-items:center;gap:5px;flex:0 0 auto;padding:2px 8px 2px 3px;border-radius:99px;background:#174b54;color:#fff;font-size:12px;font-weight:800}.target-chip b{white-space:nowrap}.target-thumb{width:28px;height:28px;flex:0 0 28px;border:2px solid #65ffe1;border-radius:50%;background-color:#052c35;background-repeat:no-repeat;background-size:200% 200%}.target-chip.done{text-decoration:line-through;background:#1b6954;color:#c6ffe6;opacity:.72}.machine-wrap{position:relative;min-height:0;overflow:hidden;border:2px solid #4c9ca4;border-radius:18px;background:#0b3039}.machine-wrap canvas{display:block;width:100%;height:100%;touch-action:none}.steer-action{position:absolute;top:10px;left:50%;transform:translateX(-50%);max-width:92%;padding:8px 14px;border:3px solid #fff;border-radius:14px;background:#ffdb68;color:#08252b;font-size:16px;font-weight:950;text-align:center;box-shadow:0 5px 16px #0009;pointer-events:none}.steer-action[data-steer="correct"]{background:#65ffe1;color:#063b35}.steer-action[data-steer="wrong"]{background:#ff6978;color:#2e080d}.phase-hint{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);max-width:90%;padding:7px 12px;border-radius:99px;background:#041b21e8;color:#fff;font-size:13px;font-weight:800;pointer-events:none}.phase-hint[data-steer="correct"]{background:#0a604e;color:#e6fff8}.phase-hint[data-steer="wrong"]{background:#7b2730;color:#fff2f3}.battle-controls{display:grid;grid-template-columns:minmax(160px,1fr) 190px 110px;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:#062832}.battle-controls button{height:48px;border:1px solid var(--line);border-radius:12px;background:#103f47;color:#fff;font-weight:900}.stability-meter{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px}.stability-meter span{color:var(--muted);font-size:12px}.stability-meter i{position:relative;height:16px;overflow:hidden;border:1px solid #4b7277;border-radius:99px;background:#4b1820}.stability-meter i::before{position:absolute;top:0;bottom:0;left:var(--timing-start,35%);width:calc(var(--timing-end,65%) - var(--timing-start,35%));background:#39d9a7;box-shadow:-5px 0 #e9bd3f,5px 0 #e9bd3f;content:""}.stability-meter b{display:none;position:absolute;top:-2px;bottom:-2px;left:calc(var(--timing-position,0%) - 4px);width:8px;height:auto;border:2px solid #fff;border-radius:5px;background:#09252d;box-shadow:0 0 8px #fff}.stability-meter.timing-active b{display:block}
.modal-layer{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:#01141bdc}.dialog-card,.result-card{width:min(100%,560px);max-height:100%;overflow:auto;padding:24px;border:1px solid #5faeb3;border-radius:24px;background:#07343d;text-align:center;box-shadow:0 24px 70px #000b}.dialog-card h2,.result-card h2{margin:8px 0;color:#fff}.dialog-card ol{text-align:left;line-height:1.6}.dialog-card>.primary-action{width:100%;min-height:48px}.modal-actions{display:grid;gap:10px;margin-top:18px}.modal-actions.two{grid-template-columns:1fr 1fr}.modal-actions button{min-height:48px;border:1px solid var(--line);border-radius:12px;background:#f2fbfa;color:#17413e;font-weight:900}.result-actions{grid-template-columns:repeat(3,1fr)}.result-medal{min-height:48px;color:var(--gold);font-size:38px;letter-spacing:7px}.best-text{color:var(--teal);font-weight:900}.sprite-cell{background-image:url("../../assets/animal-carnival-claw-atlas.webp");background-repeat:no-repeat;background-size:200% 200%}.tutorial-nori,.result-rux{width:112px;aspect-ratio:1;margin:auto}.atlas-nori{background-position:0 0}.atlas-rux{background-position:100% 0}
#dropBtn{touch-action:none}
  @media(max-width:680px){
  .main-screen{min-height:844px;padding:10px}.main-header{height:58px;grid-template-columns:82px minmax(0,1fr) 54px;gap:6px}.main-header>strong{font-size:18px}.main-return{width:76px;height:48px}.main-hero{display:flex;min-height:756px;flex-direction:column;gap:12px;padding:10px 18px 18px}.main-poster{width:min(100%,420px);max-height:420px;border-radius:24px}.main-copy{width:min(100%,420px);text-align:center}.main-copy small,.main-copy h1{display:none}.main-copy p{display:-webkit-box;min-height:66px;margin:0;font-size:16px;line-height:1.35;overflow:hidden;-webkit-line-clamp:3;-webkit-box-orient:vertical}.main-progress{margin:8px}.main-copy .primary-action{height:52px}.guide-grid{grid-template-columns:1fr}
  .stage-canvas{padding:8px;grid-template-rows:64px minmax(0,1fr) 56px}.stage-header{grid-template-columns:52px minmax(0,1fr) 48px}.stage-panel{grid-template-rows:96px minmax(0,1fr) 48px}.chapter-panel{padding:8px 12px}.chapter-panel p{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical}.stage-card{flex-basis:264px;height:190px}.cabinet-grid{grid-template-columns:repeat(3,1fr)}.cabinet-sprite{width:64px}.upgrade-grid{grid-template-columns:1fr}.upgrade-card p{min-height:0}
  .battle-canvas{padding:6px}.battle-live{grid-template-rows:62px 38px minmax(0,1fr) 70px;gap:6px}.battle-header{grid-template-columns:50px minmax(95px,1fr) 57px 57px 44px;padding:4px}.battle-header>button{width:44px;height:44px}.battle-stat{font-size:12px}.battle-title{font-size:12px}.target-strip{padding:3px 7px}.target-chip{padding:1px 7px 1px 2px}.target-thumb{width:26px;height:26px;flex-basis:26px}.battle-controls{grid-template-columns:minmax(90px,1fr) 134px 80px;gap:6px;padding:8px}.battle-controls button{height:46px;font-size:13px}.stability-meter{grid-template-columns:1fr}.stability-meter span{display:none}.dialog-card,.result-card{padding:18px}.result-rux{width:84px}.result-actions button{font-size:13px;padding:4px}
}
@media(max-height:500px) and (orientation:landscape){
  .main-screen{min-height:100svh;padding:8px}.main-header{height:52px}.main-hero,.wp-standard-main-composition{min-height:0;height:calc(100svh - 68px);grid-template-columns:300px minmax(300px,1fr)!important;gap:18px!important;padding:6px 22px!important}.main-screen .wp-standard-main-poster{width:300px!important;min-width:300px!important;max-width:300px!important;height:300px!important;min-height:300px!important;max-height:300px!important}body .main-screen .main-poster.wp-standard-main-poster-media{width:300px!important;min-width:300px!important;max-width:300px!important;height:300px!important;min-height:300px!important;max-height:300px!important;justify-self:center;border-radius:20px}.wp-standard-main-copy{height:300px!important;min-height:300px!important;max-height:300px!important}.main-copy small{display:none}.main-copy h1{margin:0 0 8px;font-size:30px}.main-copy p{margin:0;font-size:15px;line-height:1.35}.main-progress{margin:8px 0}.main-copy .primary-action{height:48px}
  .stage-canvas,.battle-canvas{min-width:min(100%,760px)}.stage-canvas{padding:6px;grid-template-rows:56px minmax(0,1fr) 48px}.stage-header{grid-template-columns:48px minmax(0,1fr) 44px;padding:3px}.stage-header button{width:44px;height:44px}.stage-panel{grid-template-columns:180px minmax(0,1fr) 150px;grid-template-rows:1fr;align-items:center;gap:6px}.chapter-panel{max-height:100%;overflow:hidden}.stage-rail{height:100%;padding:4px calc(50% - 132px)}.stage-card{height:150px}.enter-button{width:142px}.cabinet-grid{grid-template-columns:repeat(8,1fr)}.cabinet-sprite{width:58px}.upgrade-grid{grid-template-columns:repeat(3,1fr);margin:6px auto}.upgrade-card{padding:8px}.upgrade-card p{margin:5px;font-size:11px}.management-panel{padding:8px}
  .battle-canvas{padding:4px}.battle-live{grid-template-rows:54px 34px minmax(0,1fr) 56px;gap:4px}.battle-header{grid-template-columns:46px minmax(110px,1fr) 56px 56px 42px;padding:2px}.battle-header>button{width:42px;height:42px}.target-strip{padding:2px 8px}.target-thumb{width:24px;height:24px;flex-basis:24px}.battle-controls{grid-template-columns:minmax(120px,1fr) 150px 90px;padding:4px}.battle-controls button{height:44px}.steer-action{top:4px;padding:4px 9px;font-size:13px}.phase-hint{bottom:4px;padding:4px 8px}.dialog-card,.result-card{max-width:560px;padding:12px}.result-rux{display:none}.dialog-card ol{margin:6px}.modal-actions{margin-top:8px}.modal-actions button{min-height:44px}
}
.battle-controls{grid-template-columns:minmax(160px,1fr) 190px 140px}
.battle-controls button{min-width:0;padding:4px 7px;line-height:1.05;overflow-wrap:anywhere;white-space:normal}
@media(max-width:680px){.battle-controls{grid-template-columns:minmax(74px,.9fr) minmax(112px,1.3fr) minmax(84px,1fr)}}
@media(max-height:500px) and (orientation:landscape){.battle-controls button{padding:2px 5px;font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
