#hq{position:fixed;inset:0;z-index:60;background:#0d1e2b;color:#daebe3;font:15px system-ui,sans-serif;touch-action:none}#hq[hidden],#hq [hidden]{display:none!important}#hq canvas{image-rendering:pixelated}#hq-scene{width:100%;height:100%;display:block}.hq-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:max(10px,env(safe-area-inset-top)) 16px 24px;background:linear-gradient(#102031ed,transparent);pointer-events:none}.hq-bar small,#hq-panel small{display:block;color:#8ad6ca;font:700 10px/1.5 monospace;letter-spacing:.12em}.hq-bar b{font-size:clamp(14px,2.8vw,22px)}#hq button{pointer-events:auto;cursor:pointer;color:#dcece8;border:1px solid #5e8e90;background:#203a49;border-radius:4px;min-height:44px;min-width:44px;padding:6px 12px;font-weight:650}#hq button:focus-visible{outline:3px solid #f4d697}#hq button:disabled{opacity:.48}#hq-coins{color:#f1d19b;font:700 15px monospace}#hq-sub{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:#0c1e2cea;color:#edf4e7;text-align:center;padding:8px 15px;border:1px solid #5c8e8c;max-width:90%;width:max-content;pointer-events:none}#hq-stick,#hq-use{display:none;position:absolute;bottom:max(54px,env(safe-area-inset-bottom));touch-action:none}#hq-stick{left:18px;width:78px;height:78px;border:2px solid #94b7bd99;border-radius:100%;background:#203e5099}#hq-stick i{display:block;width:28px;height:28px;margin:23px;border-radius:50%;background:#a4cee0aa}#hq-use{right:18px}.show-touch #hq-stick,.show-touch #hq-use{display:block}#hq-skip{display:none;position:absolute;right:20px;top:18px}.cinema #hq-skip{display:block}.cinema .hq-bar>div,.cinema #hq-stick,.cinema #hq-use,.dialog-open #hq-stick,.dialog-open #hq-use{display:none!important}.cinema #hq-sub{bottom:8%;width:min(670px,88%);font-size:clamp(13px,2vw,20px)}#hq-panel{position:absolute;inset:0;display:grid;place-items:center;background:#081523ab;touch-action:pan-y}#hq-panel article{color:#dcece4;padding:clamp(16px,3vw,28px);width:min(500px,94%);box-sizing:border-box;max-height:90%;overflow:auto;background:#172e3f;border:1px solid #71b0b1;box-shadow:0 6px 0 #0e202d}#hq-panel article>button{margin:3px}#hq-panel footer{margin-top:13px}#hq-panel canvas{width:100%;height:auto;max-height:120px;object-fit:contain}#hq-panel h2{font-size:23px;margin:.25em 0}.hq-diagram{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center}.hq-diagram span,.hq-diagram b{padding:9px 3px;background:#29464e}.hq-diagram b{grid-column:span 3;color:#a7dec6}#summon-list.bio-roster{display:flex!important;overflow-x:auto;justify-content:flex-start!important;scrollbar-width:thin}.bio-roster .summon-button{flex:0 0 max(64px,12%);min-width:64px}.bio-roster .summon-button[hidden]{display:none!important}#train-exit{position:fixed;z-index:16;top:64px;right:8px;min-height:44px}.menu .hq-replay{margin:6px 0}
#hq-skip{z-index:1}.cinema .hq-bar{max-width:74%;box-sizing:border-box}@media(max-height:430px){#hq-sub{font-size:12px}.hq-bar small{display:none}}

/* Thumb origins exist only while their own pointer is down. The ring may clip at an edge; its mathematical centre does not move. */
.show-touch #touch-controls .stick,.show-touch #hq-stick{position:absolute;pointer-events:none;touch-action:none;opacity:0;left:0;top:0;right:auto;bottom:auto;transform:translate(-50%,-50%);box-sizing:border-box;user-select:none}
.show-touch #touch-controls .stick.pressed,.show-touch #hq-stick.pressed{opacity:.95}.show-touch #hq-stick i{position:absolute;left:50%;top:50%;margin:0;transform:translate(calc(-50% + var(--sx,0px)),calc(-50% + var(--sy,0px)))}
.show-touch #placement-controls{bottom:5px}.show-touch.in-battle #battlefield{height:100%}.show-touch #touch-controls:before,.show-touch #touch-hint{display:none}#arena,#hq-scene{touch-action:none}#film-sound{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(148px,calc(env(safe-area-inset-right) + 148px));z-index:2}#hq:not(.cinema) #film-sound{display:none}.cinema .hq-bar{display:none}.cinema #hq-skip{right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));background:#122636e8}.cinema #hq-sub{box-sizing:border-box;bottom:max(4%,env(safe-area-inset-bottom));max-width:90%;width:max-content;padding:8px 18px 10px;background:#0b1724ed;border:0;border-left:3px solid #daba8d;text-align:left;line-height:1.4;word-break:keep-all;box-shadow:0 4px 20px #0005}.cinema #hq-sub:empty{display:none}.cinema #hq-sub small{display:block;letter-spacing:.15em;color:#eccaa0;font-size:.68em;font-weight:750}.cinema #hq-sub span{display:block}.home .home-actions{margin-top:26px}.home .home-actions button{min-height:46px}@media(orientation:portrait){.cinema #hq-sub{bottom:12%;width:88%;font-size:clamp(16px,4.3vw,20px)}}@media(max-height:440px){.cinema #hq-sub{bottom:2%;padding:4px 12px 5px;font-size:13px}}

@media(orientation:portrait){.home .home-actions{display:grid;grid-template-columns:1fr;width:min(310px,90vw)}.home .home-actions button{width:100%;text-align:center}}