:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#243745;background:#112b39;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffb64c;outline-offset:3px}[hidden]{display:none!important}#app{min-height:100dvh}#title-screen{position:relative;height:100dvh;max-height:1100px;aspect-ratio:9/16;max-width:100%;margin:auto;overflow:hidden;background:#e8faff;box-shadow:0 0 90px #0008}#title-canvas{height:100%;width:100%;object-fit:cover}.title-top{position:absolute;top:max(18px,env(safe-area-inset-top));left:15px;right:15px;display:flex;justify-content:space-between;align-items:center;z-index:2}.build-label{font-size:9px;letter-spacing:1.1px;color:#294e64;background:#ffffffe0;padding:7px 9px;border-radius:3px}.title-top button,.title-about{background:#ffffffe8;border:1px solid #a2c9d5;border-radius:4px;padding:8px 12px;font-size:11px;color:#325466}.title-enter{position:absolute;inset:16% 0 12%;border:0;background:transparent}.title-about{position:absolute;left:16px;bottom:max(20px,env(safe-area-inset-bottom));z-index:2}.copyright{position:absolute;left:80px;right:10px;bottom:max(14px,env(safe-area-inset-bottom));text-align:right;font-size:9px;line-height:1.6;color:#295064;text-shadow:0 1px 2px white;pointer-events:none}#viewer{max-width:1080px;margin:auto;background:#f3f6f6;min-height:100dvh;padding-bottom:40px}.viewer-header{display:flex;align-items:center;gap:14px;background:#fff;border-bottom:4px solid #54c7ce;padding:20px 24px}.back{height:42px;width:40px;font-size:36px;color:#4eaab7;border:1px solid #c8e0e3;background:#fff;border-radius:5px;line-height:1}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#3ba9b5}h1{font-size:22px;margin:5px 0 0}h2{font-size:24px;line-height:1.5}.small-tag{margin-left:auto;font-size:11px;border:1px solid #b8dfe2;padding:6px 9px;border-radius:3px;color:#4f888d}.viewer-intro{padding:18px 24px 4px;line-height:1.6;font-size:14px}.viewer-intro p{margin:8px 0}.muted{color:#667d88;font-size:12px}.filter-bar{display:flex;gap:10px;padding:16px 24px 0}.search-label{display:flex;align-items:center;gap:12px;background:white;border:1px solid #c6d6da;border-radius:6px;flex:1;padding:0 12px}.search-label span{font-size:25px;color:#5c979f}.search-label input{border:0;outline:0;min-width:0;width:100%;height:44px;font-size:13px;background:transparent}select{background:white;border:1px solid #c6d6da;border-radius:6px;padding:0 12px;font-size:12px;max-width:130px}#result-count{font-size:12px;color:#627d86;padding:0 24px;margin:18px 0 12px}.asset-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:0 24px}.asset-card{padding:0;background:#fff;border:1px solid #d5e1e4;border-radius:6px;overflow:hidden;text-align:left;min-width:0}.asset-thumb{height:110px;width:100%;background-color:#ecf0f1;background-image:linear-gradient(45deg,#dce3e6 25%,transparent 25%),linear-gradient(-45deg,#dce3e6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dce3e6 75%),linear-gradient(-45deg,transparent 75%,#dce3e6 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.asset-card canvas{width:100%;height:100%;object-fit:contain}.asset-card .asset-caption{display:block;padding:10px 9px;font-size:10px;color:#58717a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.asset-card:hover{border-color:#35bac7;box-shadow:0 3px 12px #228c9820}.pagination{display:flex;justify-content:center;align-items:center;gap:24px;margin:24px}.pagination button{background:white;border:1px solid #c2d7dc;border-radius:5px;color:#376773;padding:9px 20px;font-size:13px}.pagination span{font-size:12px;color:#5d7a83}.empty{grid-column:1/-1;padding:50px;text-align:center;font-size:14px;color:#667d88}dialog{border:1px solid #d2e0e4;border-radius:8px;box-shadow:0 20px 90px #122f4480;padding:36px 28px;max-width:500px;width:calc(100% - 32px);color:#2a424e}dialog::backdrop{background:#0c2d43b8;backdrop-filter:blur(5px)}dialog p{font-size:14px;line-height:1.8}.close{position:absolute;right:12px;top:10px;font-size:25px;border:0;background:none;color:#728a94}.notice{background:#f0f6f7;padding:13px 15px;color:#58717b;border-radius:5px;font-size:12px!important}.primary{width:100%;padding:13px;border:0;border-bottom:3px solid #198c9c;border-radius:5px;background:#41bec9;color:white;font-weight:700;margin-top:12px}dl{display:grid;grid-template-columns:1fr auto;font-size:13px;line-height:2.3;padding:10px 0}dd{font-weight:700;color:#279aa7}.asset-preview{background:#e4edef;border-radius:5px;min-height:170px;display:grid;place-items:center;padding:20px}.asset-preview canvas{max-width:100%;max-height:55dvh;object-fit:contain}#asset-name{font-size:14px;overflow-wrap:anywhere;margin-top:20px}@media(max-width:600px){.asset-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:0 14px;gap:8px}.viewer-header{padding:16px 14px}.viewer-intro{padding:14px 16px 0}.filter-bar{padding:12px 14px 0;gap:6px}.search-label{padding:0 8px;gap:6px}.search-label input{font-size:11px}.asset-thumb{height:86px}#result-count{padding:0 16px}.small-tag{font-size:9px}.asset-card .asset-caption{font-size:9px;padding:8px 6px}}

/* World Flipper battle layout: 9:16, HUD over the full field. */
:root{background:#171c24}.title-top{justify-content:flex-end}.title-top button,.title-about{color:#454545;border:2px solid #fff;background:linear-gradient(#fff,#eee);box-shadow:0 1px 3px #0006;border-radius:3px}.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}
#training{height:100dvh;min-height:0;overflow:hidden;background:#171c24;color:white}#arena-region{position:relative;width:100%;height:100%;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#arena{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:360px;height:640px;overflow:hidden;background:#254f51;box-shadow:0 0 65px #0008;container-type:inline-size}#pinball-canvas{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none;outline-offset:-3px}.battle-hud{position:absolute;inset:0;pointer-events:none;color:#f5f5f5;font-family:Arial,sans-serif}.battle-time{position:absolute;right:1.65%;top:1.6%;height:3%;width:52%;padding:0 2.5%;display:flex;align-items:center;justify-content:space-between;gap:2%;white-space:nowrap;background:#181b1bdc;clip-path:polygon(5% 0,95% 0,100% 50%,95% 100%,5% 100%,0 50%);font-size:2.5cqw}.battle-time time{font-size:3.65cqw;font-variant-numeric:tabular-nums;font-weight:400}.score-label{border-left:1px solid #ddd9;padding-left:4%;font-size:2.15cqw}.score-unavailable{color:#92999a;font-size:3cqw;letter-spacing:-.05em}.party-hud{position:absolute;top:5.1%;left:16%;right:2.5%;display:flex;gap:4%;height:3%}.party-slot{display:flex;align-items:center;position:relative;flex:1;min-width:0;height:100%}.party-slot i{border:1.5px solid #eee;border-radius:50%;width:24%;aspect-ratio:1;background:#767c7a;z-index:1;text-align:center;font:normal 2.6cqw Arial;color:#c3c8c5;display:grid;place-items:center;box-shadow:0 1px 1px #0009}.party-slot>span{height:58%;flex:1;background:#424846;border:1.4px solid #f4f4f4;border-right:0;margin-left:-2%;}.party-slot em{height:58%;width:12%;background:#f4f4f4;color:#939e9a;font:normal 2.3cqw Arial;display:grid;place-items:center}.practice-label{position:absolute;right:2.5%;top:8.8%;font-size:2.2cqw;text-shadow:0 1px 2px #000;background:#172b2c75;padding:2px 5px}.fever-hud{position:absolute;left:27%;right:27%;top:61.6%;text-align:center;pointer-events:none;opacity:.5;color:#edf1d8}.fever-hud>span{font:bold 5.2cqw monospace;letter-spacing:.14em;text-shadow:1px 2px #66796b,-1px -1px #66796b}.fever-hud>div{height:2.65cqw;background:#667a6f;border:2px solid #e5edca;box-shadow:0 0 0 1.5px #778f75;margin-top:2px;clip-path:polygon(3% 0,97% 0,100% 50%,97% 100%,3% 100%,0 50%)}#arena-message{position:absolute;top:70.5%;left:3%;right:3%;pointer-events:none;display:flex;flex-direction:column;align-items:center;text-align:center;text-shadow:0 2px 2px #1c2927,1px 0 1px #1c2927,-1px 0 1px #1c2927;color:#fff}#arena-message strong{font-size:4.3cqw;font-weight:700;letter-spacing:.05em}#arena-message>span{font-size:2.65cqw;margin-top:6px}#field-error{position:absolute;top:45%;left:5%;right:5%;padding:12px;background:#fff;color:#333;font-size:12px;text-align:center}
#pause-layer{border-image:url("./assets/battle-ui/window.png") 10 fill / 10px / 0 stretch;width:min(340px,88vw);max-height:90dvh;margin:auto;padding:0;border:3px solid white;border-radius:7px;color:#424242;background:#f3f3f0;box-shadow:0 3px 5px #0008;overflow:auto}#pause-layer::backdrop{background:#0009;backdrop-filter:none}#pause-title{font-size:19px;text-align:center;line-height:1.3;margin:0;padding:13px;background:linear-gradient(#fff,#eaece7);border-bottom:2px solid #d0d6ce;color:#404641}.pause-content{padding:10px 20px 15px}.pause-guide{text-align:center;font-size:12px!important;line-height:1.7!important;margin:5px 0 9px}.practice-record{display:grid;grid-template-columns:1fr auto;margin:0;padding:8px 12px;background:#e4e8e2;border:1px solid #ced4cb;border-radius:3px;font-size:12px;line-height:1.8}.practice-record dd{color:#454f49;font-variant-numeric:tabular-nums}.pause-note{font-size:10px!important;line-height:1.6!important;color:#777;margin:9px 0 11px}.wf-button{width:100%;padding:10px 6px;margin-top:7px;border:2px solid #fff;border-radius:3px;color:#4c514e;font-weight:700;font-size:14px;box-shadow:0 0 0 1px #bec5be,0 2px 1px #8d958d;background:linear-gradient(#fff 0 45%,#e8ece6 46% 100%)}.wf-button.wf-blue{color:#fff;text-shadow:0 1px #3972a6;box-shadow:0 0 0 1px #7ba2c6,0 2px 1px #356d9b;background:linear-gradient(#75b4e2 0 45%,#4f9acf 46% 100%)}.wf-button:active{transform:translateY(1px)}.keyboard-guide{display:block;text-align:center;margin-top:13px;font-size:8px;color:#858e87}@media(pointer:coarse){.keyboard-guide{display:none}}@media(max-height:480px){#pause-layer{max-height:95dvh}.pause-content{padding:5px 15px 10px}.pause-guide,.pause-note,.keyboard-guide{display:none}.practice-record{grid-template-columns:1fr auto 1fr auto 1fr auto;gap:5px}.practice-record dd{margin:0}}
#party-health{--hp:100%;--hp-color:#86d632}#party-health[data-health=warning]{--hp-color:#ffb300}#party-health[data-health=danger]{--hp-color:#d53232}#party-health>span{overflow:hidden}#party-health b{display:block;height:100%;width:var(--hp);background:var(--hp-color);box-shadow:inset 0 1px #eaffb988;transition:width .18s linear}#party-health .training-ball-icon{background:#355c48 url('./assets/battle-ui/ball.png') center/75% no-repeat;image-rendering:pixelated}
#combo-hud{position:absolute;top:24%;right:7%;color:#fff7c5;text-align:center;pointer-events:none;text-shadow:2px 2px #55311d,-1px -1px #55311d;transform:skew(-6deg)}
#combo-hud strong{display:block;font-size:clamp(24px,6vh,42px);font-weight:900;line-height:1}
#combo-hud span{font-size:12px;font-weight:900;letter-spacing:1px}#combo-hud small{display:block;font-size:10px;margin-top:5px;color:#ffe374}
#combo-hud[data-level="2"] small{color:#a0ff75}#combo-hud[data-level="3"] small{color:#8be8ff}#combo-hud strong{font-size:8cqw}#combo-hud span{font-size:3cqw}#combo-hud small{font-size:2.5cqw}#training[data-phase=victory] #pause-title{color:#795321;background:linear-gradient(#fff9d9,#eee1aa)}

/* Reference IMG_5002(1): compact upper HUD, central yellow counter, small orange skill wedges. */
.battle-time{top:1.1%;right:1.7%;width:55%;height:3.1%;padding:0 1%;gap:1.5%;font-size:2cqw;background:#171b18a8;clip-path:none}
.battle-time time{font-size:3.4cqw}.score-label{border:0;padding-left:0;font-size:1.9cqw}#battle-score{font-size:3.1cqw;letter-spacing:-.04em;color:#eee;font-variant-numeric:tabular-nums;font-weight:400}
.party-hud{top:5.3%;left:14.7%;right:1.9%;gap:4.2%;height:2.6%}.party-slot i{width:6cqw;flex-shrink:0;border-width:1px}.party-slot>span{height:62%;border-width:1px}.party-slot em{font-size:0;width:9%;height:62%;clip-path:polygon(35% 0,100% 0,75% 100%,0 100%)}.party-slot em::after{content:'';width:30%;height:65%;background:#b7e899;transform:skew(-15deg)}
.practice-label{top:8.2%;font-size:1.9cqw;background:none;opacity:.8}
#training[data-mode] #combo-hud{top:68.2%;left:50%;right:auto;transform:translateX(-50%);color:#ffed38;text-shadow:1px 1px #69591e,-.5px 0 #69591e}
#combo-hud strong{font:400 8.9cqw Arial,sans-serif;line-height:1;letter-spacing:-.05em}#combo-hud span,#combo-hud small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#arena-message{top:61%}

.fever-hud{display:none}

/* Original combo glyphs animate in Canvas; retain the DOM count for accessibility. */
#training[data-mode] #combo-hud{top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);transform:none}

/* Original atlas HUD is painted on canvas; retain semantic values for readers. */

.battle-time,.party-hud,.practice-label,.fever-hud{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}


html.wf-battle-lock,body.wf-battle-lock{overflow:hidden;overscroll-behavior:none;height:100%}
body.wf-battle-lock{position:fixed;width:100%}
#training,#arena-region,#arena{touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#training img,#training canvas{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#pause-layer{touch-action:pan-y;overscroll-behavior:contain}

.apk-touch-feedback{position:fixed;inset:0;width:100%;height:100%;z-index:1000;pointer-events:none;user-select:none}

/* Native motion gallery; device-wide integer scaling remains a separate task. */
#unit-dialog{max-height:94dvh;overflow:auto}#unit-dialog h2{margin:0 0 12px}.unit-controls{display:flex;gap:16px;margin:12px 0}.unit-controls label{display:flex;flex:1;min-width:0;flex-direction:column;gap:6px;font-size:12px}.unit-controls select{height:38px;max-width:none;width:100%}#unit-canvas{display:block;width:100%;height:auto;max-height:38dvh;object-fit:contain;image-rendering:pixelated;background:#e5edf0}.unit-portrait{display:block;width:40px;height:40px;object-fit:contain;image-rendering:pixelated;margin:0 auto 8px}.unit-portrait[hidden]{display:none}.unit-seek{margin:12px 0}.unit-seek label{display:flex;justify-content:space-between;font-size:12px}.unit-seek input{width:100%;margin:10px 0;accent-color:#36b8c4}.unit-seek>div{display:flex;gap:8px}.unit-seek button{flex:1;min-height:36px;font-size:12px}

/* Fixed app shell: no page drag, text selection or native image lift. */
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;margin:0;height:100dvh}
#app{height:100%}
body,body *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
img,canvas,a{-webkit-user-drag:none}
input:not([type=range]),textarea,[contenteditable=true]{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}
#title-screen{touch-action:none;overscroll-behavior:none}
#viewer{height:100dvh;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
dialog{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
input[type=range]{touch-action:none}

/* Prologue field uses the full safe viewport, with controls in the pause menu. */
#castle{position:relative;height:100%;min-height:0;display:grid;place-items:center;overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#121724;color:#f4f2e9}
.castle-stage{position:relative;width:min(100%,calc((var(--wf-viewport-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom))*9/16));height:auto;aspect-ratio:9/16;min-height:0;min-width:0;overflow:hidden;background:#090c16}
#castle-canvas{display:block;width:100%;height:100%;touch-action:none;image-rendering:pixelated}
/* Research metadata is retained for assistive technology, outside gameplay. */
.castle-source{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

#castle-paused{position:absolute;inset:0;z-index:7;margin:0;padding:10% 8%;display:flex;flex-direction:column;align-items:stretch;justify-content:safe center;gap:10px;text-align:center;background:#000c;color:#f4f2e9;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
#castle-paused h2{font-size:20px;line-height:1.3;margin:0 0 5px}
#castle-paused .wf-button{width:100%;min-height:38px;margin:0;padding:9px 13px;font-size:12px;word-break:keep-all}
.castle-controls{display:grid;gap:10px}
@media(max-height:520px){#castle-paused{padding:12px 8%;gap:7px}#castle-paused h2{font-size:17px;margin:0}#castle-paused .wf-button{min-height:30px;padding:5px 9px}.castle-controls{gap:7px}}
#castle-result{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#111827e6;padding:20px}
#castle-result h2{font-size:22px;color:#fff5d0}#castle-result p{font-size:14px;line-height:1.8}
#castle [hidden]{display:none!important}
/* VisualViewport dimensions include browser chrome changes without page drag. */
html.wf-page-lock,body.wf-page-lock{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{height:var(--wf-viewport-height,100dvh)}
#app{height:100%;min-height:0;overflow:hidden}
#title-screen{height:100%;max-height:none}
#viewer,#training{height:100%;min-height:0}