:root{--paper:#e2ddc7;--dim:#9ba79f;--amber:#d4af78;--ink:#111e20;--line:rgba(208,211,189,.22)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#10191a;color:var(--paper);font-family:Arial,Helvetica,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none}button,select,input{font:inherit}button{color:inherit;cursor:pointer;border:0}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--amber);outline-offset:5px}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#loading{position:fixed;inset:0;background:#152325;z-index:100;display:grid;place-content:center;text-align:center;transition:opacity .6s}#loading.off{opacity:0;pointer-events:none}#loading .wordmark{font:52px Georgia,serif;letter-spacing:.12em}#loading p{font-size:10px;letter-spacing:.3em;color:#8faaa9;margin-top:24px}#loading .rule{width:210px;height:1px;background:#3c5152;margin:12px auto;overflow:hidden}#loading .rule:after{content:'';display:block;height:1px;width:70%;background:#c4a470;animation:loading 1.5s ease-in-out infinite}@keyframes loading{from{transform:translateX(-140%)}to{transform:translateX(240%)}}#error{display:none;position:fixed;inset:0;z-index:105;background:#142124;padding:9vw;place-content:center}#error h2{font:36px Georgia,serif}#error p{max-width:660px;line-height:1.7;color:#a9b5ab}#error pre{white-space:pre-wrap;font:12px monospace;max-width:780px;color:#e1b28c}
#title{position:fixed;inset:0;z-index:20;display:flex;align-items:center;transition:opacity .5s;background:linear-gradient(90deg,rgba(11,23,25,.90),rgba(11,23,25,.70) 32%,rgba(11,23,25,.08) 70%)}#title.hidden{opacity:0;pointer-events:none}.title-content{margin-left:8vw;width:470px;max-width:80vw}.kicker{font-size:10px;letter-spacing:.32em;color:#b4c3b4;text-transform:uppercase;line-height:1.8}.kicker::before{content:'';display:inline-block;height:1px;width:30px;background:var(--amber);vertical-align:middle;margin-right:15px}h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(68px,7.4vw,110px);letter-spacing:-.035em;font-weight:400;line-height:.87;margin:31px 0 30px;text-shadow:0 2px 30px rgba(0,0,0,.2)}h1 span{color:#d9bd90}#title .lede{font:italic 21px/1.35 Georgia,serif;color:#c4cbbb;max-width:400px;margin:0 0 26px}#title .description{font-size:12px;line-height:1.8;color:#9caaa1;max-width:340px}.begin{background:var(--paper);color:#1d2c2c;min-width:230px;text-align:left;font-size:11px;font-weight:700;letter-spacing:.20em;padding:20px 22px;margin-top:25px;transition:background .2s,transform .2s}.begin:hover{background:#f5e6c5;transform:translateX(4px)}.begin .arrow{float:right;font-size:18px;line-height:11px;margin-left:35px}.text-button{background:none;color:#aab9ad;font-size:10px;letter-spacing:.15em;padding:17px 0;text-align:left;margin-right:24px}.text-button:hover{color:#f4dcaf}.title-bottom{position:absolute;bottom:28px;left:8vw;right:5vw;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.17em;color:#7e948e;line-height:1.8}.title-bottom .credit{text-align:right}#continue{display:none}.chapter-mark{position:absolute;right:4vw;bottom:18vh;color:#d2d6c0;font:italic 14px Georgia;opacity:.5;writing-mode:vertical-rl;letter-spacing:.09em}
#hud{position:fixed;inset:0;pointer-events:none;opacity:0;z-index:5;transition:opacity .5s}body.playing #hud{opacity:1}.top-left{position:absolute;top:30px;left:35px;text-shadow:0 1px 10px #101b1c}.zone-code{font-size:9px;letter-spacing:.25em;color:#c1bc9f;margin-bottom:8px}.zone-name{font:18px Georgia,serif;letter-spacing:.08em;color:#ebead5}.objective{font-size:10px;letter-spacing:.04em;color:#c3cabc;margin-top:8px}.top-right{position:absolute;top:32px;right:35px;text-align:right}.health{display:flex;gap:5px;justify-content:flex-end}.health i{display:block;width:20px;height:4px;background:#dddbc1;box-shadow:0 1px 5px rgba(0,0,0,.5)}.health i.lost{background:#465653;opacity:.65}.hud-meta{font-size:9px;letter-spacing:.15em;margin-top:10px;color:#ccd0ba;text-shadow:0 1px 6px #111}#pauseButton{pointer-events:auto;background:rgba(11,24,25,.35);color:#c6ccbb;font-size:10px;padding:9px 11px;position:absolute;right:32px;top:78px;border:1px solid rgba(219,225,201,.15);letter-spacing:.12em}.bottom-help{position:absolute;bottom:24px;left:35px;font-size:9px;color:#d6d8c4;letter-spacing:.055em;text-shadow:0 1px 8px #000;transition:opacity .5s}.key{display:inline-block;border:1px solid rgba(211,218,196,.40);padding:4px 5px;min-width:20px;text-align:center;font-size:9px;margin-right:5px;color:#e8e7d3;background:rgba(12,25,25,.26)}.help-gap{margin-right:18px}#combo{position:absolute;right:35px;top:42%;text-align:right;opacity:0;transition:opacity .25s}#combo .num{font:44px Georgia;line-height:1;color:#e7d0a5}#combo .label{font-size:9px;letter-spacing:.20em;margin-top:7px;color:#c8c7ae}#combo .streak{height:1px;background:#c3a170;margin-top:10px;transform-origin:right;opacity:.6}#sector{position:absolute;left:0;right:0;top:23%;text-align:center;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s;text-shadow:0 2px 15px #102526;pointer-events:none}#sector.show{opacity:1;transform:none}#sector .small{font-size:9px;letter-spacing:.4em;color:#c6ccbb;margin-bottom:12px}#sector .name{font:32px Georgia;letter-spacing:.15em}#toast{position:absolute;bottom:85px;left:50%;transform:translateX(-50%) translateY(10px);font-size:11px;letter-spacing:.07em;padding:12px 20px;background:rgba(15,30,30,.83);border-top:1px solid var(--line);white-space:nowrap;opacity:0;transition:opacity .3s,transform .3s;text-align:center;color:#e4dfc4}#toast.show{opacity:1;transform:translateX(-50%)}#save{position:absolute;bottom:25px;right:34px;font-size:9px;letter-spacing:.20em;color:#d8ddca;opacity:0;transition:opacity .4s}#boss{position:absolute;left:35%;right:35%;top:31px;display:none;text-align:center}#boss .label{font-size:9px;letter-spacing:.3em;color:#dfd3b6}.boss-track{height:3px;background:rgba(25,31,28,.70);margin-top:9px}.boss-fill{height:3px;background:#c59b65;transform-origin:left}#waypoint{position:absolute;left:50%;top:50%;display:none;transform:translate(-50%,-50%);font-size:17px;color:#e3d4aa;text-shadow:0 1px 8px #102525}#waypoint small{display:block;font-size:8px;letter-spacing:.1em;text-align:center;margin-top:2px}#reticle{position:fixed;width:17px;height:17px;display:none;border:1px solid rgba(232,220,188,.6);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:6}#reticle:after{content:'';position:absolute;inset:6px;border-radius:50%;background:#e7d5af}
#panel{position:fixed;inset:0;z-index:30;display:none;place-items:center;background:rgba(10,24,26,.74);backdrop-filter:blur(9px);padding:25px}.panel-card{max-width:470px;width:100%;border-top:1px solid rgba(215,215,187,.38);padding:30px 20px 20px}.panel-card h2{font:44px Georgia;font-weight:400;margin:8px 0 16px;letter-spacing:-.025em}.panel-card p{font-size:12px;color:#a8b8ac;line-height:1.7}.panel-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.panel-buttons button{padding:15px 18px;border:1px solid var(--line);background:rgba(16,35,35,.6);color:#d8dfc9;font-size:10px;letter-spacing:.12em}.panel-buttons button.primary{background:var(--paper);color:#192a29}.setting{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:14px 0;font-size:11px;color:#cbd2bf;gap:15px}.setting select{background:#223737;border:1px solid #526661;color:#d9ddcb;padding:7px 10px;font-size:11px}.setting input{accent-color:#c7b17f;width:18px;height:18px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:23px 0;margin:22px 0}.stats strong{display:block;font:25px Georgia;color:#e4d7b8}.stats small{display:block;font-size:8px;letter-spacing:.18em;color:#a3b1a0;margin-top:7px}.controls-note{font-size:11px!important;line-height:1.9!important}.resume-hint{font-size:10px;color:#7b9790;letter-spacing:.16em;margin-top:15px}#performance{display:none;position:absolute;right:20px;bottom:65px;color:#ebdfbb;background:rgba(0,0,0,.55);font:10px monospace;white-space:pre;padding:7px}
#touch{display:none;position:fixed;inset:0;z-index:9;pointer-events:none}body.touch.playing #touch{display:block}.pad{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(17,34,35,.38),rgba(17,34,35,.12));border:1px solid rgba(212,224,200,.28);pointer-events:auto;touch-action:none}.pad.left{left:25px}.pad.right{right:25px}.pad .knob{position:absolute;width:44px;height:44px;left:42px;top:42px;border-radius:50%;border:1px solid rgba(229,227,202,.50);background:rgba(180,194,175,.10);pointer-events:none}.pad .tag{position:absolute;left:0;right:0;bottom:17px;text-align:center;font-size:8px;letter-spacing:.15em;color:rgba(214,222,200,.65);pointer-events:none}.touch-action{position:absolute;bottom:176px;pointer-events:auto;width:68px;height:44px;border:1px solid rgba(211,221,196,.32);background:rgba(20,37,37,.50);font-size:9px;letter-spacing:.12em;border-radius:22px;touch-action:none}.touch-action.reverse{right:42px}.touch-action.dash{left:54px}body.touch .bottom-help{display:none}body.touch #save{bottom:12px;right:14px}body.touch #toast{bottom:220px;max-width:90vw;white-space:normal;line-height:1.6}body.touch #combo{top:26%;right:16px}body.touch #pauseButton{right:17px;top:63px}body.touch .top-left{left:17px;top:20px}body.touch .top-right{right:17px;top:23px}body.touch .health i{width:13px;height:4px}
@media(max-width:650px){.title-content{margin-left:8vw;width:80vw}.kicker{font-size:8px;letter-spacing:.23em}h1{font-size:70px;margin:22px 0}.title-content .lede{font-size:18px!important}.description{font-size:11px!important;max-width:285px!important}.begin{padding:18px 20px;margin-top:14px;min-width:210px}.title-bottom{bottom:21px;left:8vw;font-size:7px;right:6vw}.title-bottom .credit{max-width:105px}.chapter-mark{display:none}.top-left .zone-name{font-size:12px;letter-spacing:.07em}.zone-code{font-size:7px}.objective{font-size:8px;max-width:210px;line-height:1.6}.hud-meta{font-size:7px}#boss{left:23%;right:23%;top:106px}#boss .label{font-size:8px}#sector .name{font-size:21px;letter-spacing:.08em}#sector{top:27%}#combo .num{font-size:31px}#combo .label{font-size:7px}.panel-card h2{font-size:37px}.panel-card{padding-top:18px}.panel-card p{font-size:11px}#title{background:linear-gradient(90deg,rgba(11,23,25,.83),rgba(11,23,25,.42) 70%,rgba(11,23,25,.1))}.pad{width:112px;height:112px}.pad .knob{left:34px;top:34px;width:42px;height:42px}.pad .tag{bottom:12px}.pad.left{left:22px}.pad.right{right:22px}.touch-action{bottom:157px}.touch-action.reverse{right:43px}.touch-action.dash{left:43px}}
@media(max-height:500px){.title-content{margin-left:6vw}h1{font-size:53px;margin:12px 0}.title-content .lede{font-size:17px!important;margin-bottom:12px!important}.description{display:none}.begin{margin-top:10px;padding:15px 20px}.title-bottom{bottom:12px}.pad{bottom:13px;width:104px;height:104px}.pad .knob{left:30px;top:30px}.touch-action{bottom:129px}.panel-card{padding:10px;max-width:700px}.panel-card h2{font-size:28px;margin:4px 0 7px}.setting{padding:7px 0}.panel-buttons{margin-top:10px}.stats{padding:12px 0;margin:12px 0}body.touch #toast{bottom:135px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Settings remain reachable on short displays and after rotation. */
#panel{overflow-y:auto;overscroll-behavior:contain}.panel-card{max-height:calc(100dvh - 50px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#526661 transparent}

#game{outline:none}

/* Direct control: a quiet, stable frame and a gesture guide only while gripping. */
#swingGuide{display:none;position:fixed;border:1px solid rgba(232,220,186,.17);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:4}
#swingGuide i{position:absolute;left:50%;top:50%;width:5px;height:5px;border:1px solid rgba(232,220,186,.3);border-radius:50%;transform:translate(-50%,-50%)}
body.playing #game{cursor:crosshair}body.looking #game{cursor:grabbing}
.bottom-help{line-height:2.15;background:linear-gradient(90deg,#0c191ca1,transparent);padding:8px 12px;left:23px;bottom:12px}
#sector{top:16%;transition:opacity .4s;transform:none}#sector .name{font-size:22px;letter-spacing:.10em}
#toast{bottom:94px;white-space:normal;max-width:80vw;line-height:1.55}
.touch-camera{position:absolute;top:79px;pointer-events:auto;border:1px solid var(--line);background:#14252599;color:var(--paper);width:42px;height:42px;border-radius:3px;font-size:28px;touch-action:none}
.camera-left{right:69px}.camera-right{right:20px}
body.touch .bottom-help{display:none}.controls-note b{color:#e2d5ba;font-weight:600}

/* A new escape is a state change, not overlapping title/game layers. */
#title.hidden{display:none;opacity:0;visibility:hidden;transition:none}body.playing #hud{opacity:1;transition:none}

.setting input[type=range]{width:150px;height:auto;accent-color:#c7b17f;}

/* Outdoor sky cannot wash out the encounter and health labels. */
.top-left,#boss .label,.hud-meta{ text-shadow:0 1px 3px #000c,0 0 10px #0008; }

/* Mobile look is a scenery gesture, not a full-screen overlay that steals swing touches. */
.camera-left,.camera-right{display:none}
.touch-camera.camera-centre{top:max(63px,calc(env(safe-area-inset-top) + 43px));right:max(66px,calc(env(safe-area-inset-right) + 66px));width:65px;height:34px;font-size:9px;letter-spacing:.08em}
#touchLookHint{display:none;position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:6;font:8px Arial,sans-serif;letter-spacing:.1em;color:#e2ddc7b3;text-shadow:0 1px 5px #000;pointer-events:none;white-space:nowrap}
body.touch.playing #touchLookHint{display:block;animation:look-hint 10s both}
@keyframes look-hint{0%,70%{opacity:.85}100%{opacity:0}}
.graphics-note{font-size:10px!important;line-height:1.6!important;color:#a8b8ac}
.setting input[type=range]{width:120px;height:24px;touch-action:pan-x}
body.touch .pad.left{left:max(22px,env(safe-area-inset-left))}body.touch .pad.right{right:max(22px,env(safe-area-inset-right))}
@media(max-height:500px){body.touch #title .description{display:block;line-height:1.45;font-size:10px!important;margin:6px 0}body.touch #title h1{font-size:45px;margin:10px 0}.camera-centre{top:63px}body.touch #title .lede{font-size:15px!important}}
@media(prefers-reduced-motion:reduce){body.touch.playing #touchLookHint{animation:none;opacity:.75}}

/* Mobile objectives wrap instead of crossing the health/menu area. */
body.touch .objective{max-width:min(62vw,440px);line-height:1.5;white-space:normal}

/* Portrait-first touch revision. One large primary action within the right thumb arc. */
body.touch:not(.advanced-touch) #touchReverse,body.touch:not(.advanced-touch) #touchDash{display:none}
#touchWhip{right:29px;bottom:176px;width:118px;height:62px;border-radius:25px;
background:linear-gradient(145deg,#5e452dce,#252d2ada);border:1px solid #d6b981a0;
font-size:12px;font-weight:700;letter-spacing:.19em;box-shadow:0 5px 16px #0003;touch-action:none}
#touchWhip.pressed,#touchWhip.armed{background:#a67d48d9;transform:scale(.97)}
#touchWhip.cooling:not(.pressed){opacity:.60}
body.touch.advanced-touch #touchReverse{right:159px;bottom:171px;width:61px;height:46px;font-size:8px}
body.touch.advanced-touch #touchDash{left:46px;bottom:176px;width:68px;height:46px}
@media(max-width:650px){#touchWhip{right:22px;bottom:156px;width:112px;height:58px}
body.touch.advanced-touch #touchReverse{right:143px;bottom:155px;width:56px;height:44px}
body.touch.advanced-touch #touchDash{left:42px;bottom:156px}}
@media(max-height:500px){#touchWhip{right:25px;bottom:129px;width:104px;height:52px}
body.touch.advanced-touch #touchReverse{right:140px;bottom:129px}
body.touch.advanced-touch #touchDash{bottom:129px;left:43px}}