:root{font-family:"Songti TC","Noto Serif TC","PMingLiU",serif;color:#263d35;background:#d9ddd0;--ink:#263d35;--paper:#e7e5d5;--red:#984a38;--line:#73827355}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid var(--red);outline-offset:5px}button:hover{color:var(--red)}[hidden]{display:none!important}#app{height:100svh;min-height:620px;position:relative;overflow:hidden}#scene{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;touch-action:none}.grain{position:absolute;inset:0;pointer-events:none;opacity:.1;z-index:1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E")}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#e3e4d5f0 0%,#e3e4d5cc 20%,#e3e4d555 41%,transparent 65%),linear-gradient(0deg,#d4dbcbfa,transparent 25%);transition:opacity .5s}header{height:98px;position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:0 4.2%;z-index:3;border-bottom:1px solid #73827323}.brand{display:flex;align-items:center;gap:15px;text-align:left}.brand>b{display:grid;place-items:center;background:var(--red);color:var(--paper);width:40px;height:45px;font-size:30px;font-weight:400;outline:1px solid var(--red);border:3px double var(--paper);transform:rotate(-3deg)}.brand>span{font-size:22px;letter-spacing:4px}.brand small{display:block;font:8px Arial;letter-spacing:3px;margin-top:5px}.top-chapter{font-size:11px;letter-spacing:4px;color:#52695b}nav{display:flex;align-items:center;gap:25px}nav button{font-size:12px;letter-spacing:2px}nav button span{border:1px solid var(--line);padding:3px 5px;font-size:10px;margin-left:5px}#fullscreen{font:25px Arial;padding:4px}.title-screen{position:absolute;left:8%;top:19%;z-index:2}.eyebrow{display:flex;align-items:center;gap:12px;font:9px Arial;letter-spacing:3px;color:#667462}.eyebrow i{height:1px;width:27px;background:var(--red)}h1{font-size:clamp(96px,10vw,155px);line-height:1.1;font-weight:500;letter-spacing:14px;margin:22px 0 0;text-shadow:1px 1px #263d35}h1>span{display:inline-block;transform:translateY(9px) rotate(-4deg)}h1>b{font-size:16px;line-height:1.6;letter-spacing:3px;border:1px solid var(--red);color:var(--red);padding:6px 6px 6px 9px;margin-left:12px;display:inline-block;vertical-align:middle;font-weight:400;transform:rotate(4deg);text-shadow:none}.title-sub{font-size:14px;letter-spacing:8px;margin:21px 0}.rule{height:1px;width:50px;background:#687c6255;margin:24px 0}.intro{font-size:14px;letter-spacing:2px;line-height:2;color:#5e7261}.primary{background:#293f36;color:#e8e7d6;display:inline-flex;align-items:center;gap:25px;padding:15px 24px;min-height:54px;font-size:19px;border:1px solid #293f36;transition:background .2s}.primary:hover{color:var(--paper);background:var(--red);border-color:var(--red)}.primary span{font-size:12px;letter-spacing:2px}.primary b{font:22px Arial;font-weight:400;margin-left:15px}.secondary-text{display:block;padding:18px 0 5px;font-size:13px;letter-spacing:2px}.secondary-text span{font-size:10px;color:#6c806b;margin-left:10px}.title-note{font-size:10px;letter-spacing:2px;color:#7b8a76;margin-top:20px}.scene-note{position:absolute;right:4%;top:23%;writing-mode:vertical-rl;display:flex;align-items:center;gap:20px;letter-spacing:7px;font-size:12px;color:#617463}.scene-note i{width:1px;height:65px;background:#6c806955}.roster{position:absolute;bottom:70px;left:4.2%;right:4.2%;display:flex;align-items:stretch;border-block:1px solid #5e765644;background:#e1e6d336;backdrop-filter:blur(6px);z-index:3;min-height:102px}.roster-label{width:24%;display:flex;flex-direction:column;justify-content:center;gap:12px;padding-left:25px}.roster-label small{font-size:13px;letter-spacing:4px}.roster-label>span{font:8px Arial;letter-spacing:3px;color:#7a8b72}.roster>button{flex:1;display:flex;text-align:left;align-items:center;gap:23px;border-left:1px solid #5e765633;padding:20px 24px;position:relative;transition:background .2s}.roster>button.selected{background:#c6cfba72}.roster>button.selected:before{content:"";height:2px;background:var(--red);position:absolute;bottom:0;left:15%;right:15%}.roster button i{font-size:30px;font-style:normal;color:#77866b}.roster button strong{display:block;font-size:20px;font-weight:400;letter-spacing:4px}.roster button small{display:block;font-size:10px;margin-top:10px;color:#718169;letter-spacing:1px}.roster button b{position:absolute;right:15px;top:18px;font:14px Arial;color:#78906e}footer{position:absolute;bottom:26px;left:4.2%;right:4.2%;display:flex;justify-content:space-between;pointer-events:none;font-size:9px;letter-spacing:2px;color:#6e8069}footer i{display:inline-block;background:var(--red);width:4px;height:4px;border-radius:50%;margin-right:8px}.playing .vignette{background:linear-gradient(0deg,#d5ddc8b0,transparent 24%),linear-gradient(180deg,#dce1d2bb,transparent 25%)}.playing .top-chapter{opacity:.5}.playing header{border:0;height:80px}.playing .brand{transform:scale(.8);transform-origin:left center}.playing footer{display:none}#hud{position:absolute;inset:0;pointer-events:none}.player-status{position:absolute;top:110px;left:4.5%;width:270px}.player-title{display:flex;align-items:center;justify-content:space-between;font-size:15px;letter-spacing:3px;margin-bottom:10px}.player-title small{font:10px Arial;letter-spacing:1px;color:#5d735c}.bar{background:#243e2d25;border:1px solid #40583c33;height:9px;padding:1px}.bar i{display:block;width:100%;height:100%;transition:width .12s}.health i{background:#8b4036}.stamina{margin-top:6px;height:6px;width:82%}.stamina i{background:#547552}.qi{height:3px;width:62%;margin-top:6px;padding:0;border:0}.qi i{width:0;background:#b18f4b}.resource-label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;margin-top:7px;color:#647b5c}.resource-label b{font:9px Arial}.battle-tools{position:absolute;top:115px;right:4.5%;display:flex;align-items:center;gap:18px;font-size:11px;letter-spacing:2px}.battle-tools button{pointer-events:auto;padding:10px 15px;border:1px solid #4d654240;font:19px Arial}.battle-tools kbd{margin-left:7px}kbd{font:9px Arial;border:1px solid #657b5444;padding:3px 5px;color:#536e4c}.item-slot{position:absolute;bottom:85px;left:4.5%;display:flex;align-items:center;gap:14px}.flask{border:1px solid #6d805666;width:57px;height:66px;display:grid;place-items:center;font-size:28px;background:#dee2ca66;transform:rotate(-4deg)}.item-slot>div>b{font:26px Georgia;display:block;margin-bottom:5px}.item-slot>div>span{font-size:11px;letter-spacing:2px}.item-slot small{display:block;font-size:9px;color:#78876c;margin-top:8px}.boss-status{position:absolute;bottom:87px;left:28%;right:20%}.boss-status>p{display:flex;align-items:baseline;gap:18px;margin-bottom:12px}.boss-status strong{font-size:22px;font-weight:400;letter-spacing:5px}.boss-status small{font-size:10px;letter-spacing:3px;color:#677b5e}.boss-status #boss-number{font:10px Arial;margin-left:auto;color:#5e7255}.boss{height:11px;background:#a5b19877;border-color:#55674855}.boss i{background:#8a4638}.posture{height:3px;width:60%;padding:0;border:0;margin-top:8px}.posture i{width:0;background:#b28a4b}.boss-caption{display:flex;justify-content:space-between;margin-top:7px;font-size:9px;letter-spacing:2px;color:#637453}.key-hints{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:22px;white-space:nowrap;font-size:10px;color:#5e7354}.key-hints span{display:flex;gap:6px;align-items:center}.reticle{position:absolute;width:25px;height:25px;transform:translate(-50%,-50%);border:1px solid #ede4c9bd;border-radius:50%;box-shadow:0 0 0 1px #24392e45;display:grid;place-items:center}.reticle i{width:4px;height:4px;border-radius:50%;background:#f5e8cb}.enemy-warning{position:absolute;top:26%;left:50%;transform:translateX(-50%);color:#8d3c2e;font-size:12px;letter-spacing:5px;text-shadow:0 1px 9px #f2e9cf}.message{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);font-size:clamp(25px,3vw,44px);letter-spacing:13px;color:#853b2b;text-shadow:0 2px 30px #ebe4ce,0 0 8px #f7edce;pointer-events:none;white-space:nowrap;transition:opacity .2s;z-index:4}.overlay{position:absolute;inset:0;background:#273e2f50;backdrop-filter:blur(6px);display:grid;place-items:center;z-index:8;padding:20px}.modal{width:min(580px,100%);max-height:90svh;overflow:auto;background:#e4e6d6f5;padding:36px 40px;text-align:center;border:1px solid #9ba991;box-shadow:0 20px 100px #1d332f30;position:relative}.modal .eyebrow{justify-content:center;color:var(--red);font-size:9px}.modal h2{font-size:38px;font-weight:400;letter-spacing:8px;margin:22px 0}.modal p{font-size:13px;line-height:2;letter-spacing:2px;color:#63725b}.close{position:absolute;top:14px;right:17px;font:25px Arial;color:#697a5c}.modal .primary{font-size:15px;margin:10px 5px 0;padding:12px 24px;min-height:44px}.modal .secondary{border:1px solid #9aa98c;padding:12px 20px;font-size:12px;margin:10px 5px 0}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0;text-align:left}.control-grid>div{display:flex;align-items:center;gap:10px;font-size:12px}.control-grid kbd{min-width:60px;text-align:center;padding:8px;font-size:10px}.control-grid span{font-size:11px;color:#5f7155}.result-stats{display:flex;justify-content:space-around;border-block:1px solid var(--line);padding:20px 0;margin:22px 0}.result-stats b{display:block;font:28px Georgia}.result-stats small{font-size:10px;display:block;margin-top:8px;letter-spacing:2px}.loading,.error{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#e0e3d4;gap:20px}.loading>b{font-size:38px;font-weight:400;letter-spacing:12px}.loading>span{font-size:12px;letter-spacing:3px;color:#718369}.error{padding:30px;text-align:center}.error p{max-width:600px;line-height:1.8}.error button{border:1px solid;padding:12px 24px}#touch{position:absolute;inset:0;pointer-events:none;z-index:5}#joystick{position:absolute;bottom:155px;left:6%;width:112px;height:112px;border:1px solid #61785966;border-radius:50%;background:#e1e3ca40;touch-action:none;pointer-events:auto}#joystick>i{position:absolute;left:34px;top:34px;width:44px;height:44px;border-radius:50%;background:#536c4d77;border:1px solid #e5e7d155;pointer-events:none}.touch-actions{position:absolute;right:4%;bottom:145px;display:grid;grid-template-columns:repeat(3,43px);gap:7px;pointer-events:auto}.touch-actions button{width:43px;height:43px;border-radius:50%;border:1px solid #60744d60;background:#e4e6cfad;font-size:16px;touch-action:none;user-select:none}.touch-actions .touch-light{background:#304e3bd9;color:#eae7d5}.touch-actions [data-action=special]{grid-column:2}
@media(max-height:800px) and (min-width:800px){header{height:78px}.title-screen{top:14%}h1{font-size:100px;margin-top:14px}.title-sub{margin:15px 0;font-size:12px}.rule{margin:17px 0}.intro{font-size:12px;margin:10px 0 15px}.primary{min-height:47px;padding:11px 20px}.title-note{margin-top:13px}.roster{bottom:55px;min-height:85px}.roster>button{padding:15px 22px}.roster button strong{font-size:17px}.roster button small{margin-top:8px}footer{bottom:21px}}
@media(max-width:1000px){.top-chapter{display:none}.roster-label{display:none}.roster>button{padding:18px}.roster button strong{font-size:17px}.roster button i{font-size:24px}.title-screen{left:6%}.key-hints{gap:11px;font-size:9px}.key-hints kbd{font-size:8px}.boss-status{left:30%;right:6%}.boss-status strong{font-size:19px}.boss-status small{font-size:9px}.player-status{width:230px}}
@media(max-width:650px){#app{min-height:650px}header{height:74px;padding:0 5%}.brand{gap:10px}.brand>b{width:30px;height:35px;font-size:23px}.brand>span{font-size:18px}.brand small{font-size:7px;letter-spacing:2px}nav{gap:13px}nav button{font-size:10px;letter-spacing:1px}#fullscreen{font-size:20px}.title-screen{top:14%;left:7%}.eyebrow{font-size:7px;letter-spacing:2px}h1{font-size:90px;letter-spacing:8px;margin-top:17px}h1>b{font-size:13px;margin-left:8px}.title-sub{font-size:11px;letter-spacing:4px;margin:16px 0}.rule{margin:17px 0}.intro{font-size:12px;letter-spacing:1px}.primary{font-size:16px;min-height:48px;padding:12px 20px;gap:20px}.primary span{font-size:11px}.primary b{margin-left:6px}.secondary-text{font-size:11px;padding-top:15px}.title-note{font-size:9px;letter-spacing:1px}.scene-note{display:none}.roster{left:5%;right:5%;bottom:58px;min-height:86px}.roster>button{padding:13px 8px;gap:7px;justify-content:center}.roster button i{font-size:18px}.roster button strong{font-size:13px;letter-spacing:1px}.roster button small{font-size:8px;letter-spacing:0;max-width:65px;line-height:1.7;margin-top:5px}.roster button b{display:none}footer{font-size:8px;letter-spacing:1px;bottom:22px}footer>span:last-child{display:none}.vignette{background:linear-gradient(90deg,#e3e4d5eb,#e3e4d588 50%,transparent),linear-gradient(0deg,#d4dbcb,transparent 30%)}.playing header{height:65px}.playing .brand{transform:scale(.85)}.player-status{top:82px;left:5%;width:185px}.player-title{font-size:12px;letter-spacing:2px}.player-title small{font-size:9px}.resource-label{font-size:8px;letter-spacing:1px}.battle-tools{top:81px;right:5%;gap:8px;font-size:9px;letter-spacing:0}.battle-tools button{padding:7px 11px;font-size:16px}.battle-tools kbd{margin-left:3px}.boss-status{left:5%;right:5%;bottom:42px}.boss-status>p{margin-bottom:8px;gap:10px}.boss-status strong{font-size:17px;letter-spacing:3px}.boss-status small{font-size:9px;letter-spacing:1px}.boss-status #boss-number{font-size:9px}.boss-caption{font-size:8px;letter-spacing:1px}.item-slot{left:5%;bottom:110px;gap:8px}.flask{width:30px;height:36px;font-size:20px}.item-slot>div>b{display:inline;font-size:20px;margin-right:8px}.item-slot>div>span{font-size:10px}.item-slot small{display:none}.key-hints{display:none}.enemy-warning{top:25%;font-size:10px;letter-spacing:3px}.message{font-size:25px;letter-spacing:6px}.modal{padding:30px 20px}.modal h2{font-size:29px;letter-spacing:6px}.modal p{font-size:12px;letter-spacing:1px}.control-grid{gap:10px}.control-grid>div{gap:7px}.control-grid span{font-size:10px}.control-grid kbd{min-width:52px;padding:7px 5px}.playing .vignette{background:linear-gradient(0deg,#d5ddc8cb,transparent 30%),linear-gradient(180deg,#dce1d2b0,transparent 25%)}}
@media(pointer:coarse){.key-hints{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Night temple palette. Keep the fighting area unobstructed and the HUD legible. */
:root{color:#e2d9c6;background:#111b21;--ink:#e2d9c6;--paper:#eee1c8;--red:#b95d43;--line:#c3ac7940}
.grain{opacity:.035}
.vignette{background:linear-gradient(90deg,#0b141be8 0%,#101a21c7 22%,#101a2140 46%,transparent 66%),linear-gradient(0deg,#0b131bf0,transparent 28%),linear-gradient(180deg,#0e17246b,transparent 18%)}
header{border-color:#b9ac8425;text-shadow:0 2px 8px #000}
.top-chapter,.eyebrow{color:#bcb7a9}h1{color:#f0e4cc;text-shadow:0 4px 26px #0007}h1>b{color:#d88766;border-color:#b76b4d}
.title-sub{color:#d1baa0}.rule{background:#b7a0726b}.intro{color:#b1b7b6;line-height:2.1}
.primary{background:linear-gradient(110deg,#773d30,#512b26);border:1px solid #b2835b8c;color:#f2e5cb;box-shadow:inset 0 0 22px #24131540,0 8px 30px #0003}
.primary:hover{background:#94533b;border-color:#d9b680}.secondary-text{color:#ddd1b7}.secondary-text span,.title-note{color:#a9afa9}.scene-note{color:#b6b6a7}.scene-note i{background:#aa9c6c66}
.roster{background:#111b23a8;border-color:#a7915e55;box-shadow:0 12px 40px #0003}.roster>button{border-color:#a7915e33}.roster>button.selected{background:linear-gradient(100deg,#a9823c29,#664c2b1a)}.roster>button.selected:before{background:#c9a367}.roster button:hover{background:#a9823c20;color:#f1ddb5}
.roster button i,.roster button b{color:#b29364}.roster button small,.roster-label>span,footer{color:#a5ada9}
.playing .vignette{background:linear-gradient(0deg,#080f19c9,transparent 24%),linear-gradient(180deg,#0a121cbb,transparent 25%)}
.playing .top-chapter{opacity:.75}.player-status,.battle-tools,.item-slot,.boss-status,.key-hints{filter:drop-shadow(0 2px 5px #000b)}
.player-title{color:#ece0c7}.player-title small,.resource-label,.item-slot small,.boss-status small,.boss-status #boss-number,.boss-caption,.key-hints{color:#c0c3b9}
.bar{background:#070e14c4;border-color:#bcb19957}.health i,.boss i{background:linear-gradient(90deg,#7f322d,#ba6955);box-shadow:0 0 7px #b65b3630}.stamina i{background:linear-gradient(90deg,#4a746c,#9cb7a1)}.qi i,.posture i{background:linear-gradient(90deg,#8c683c,#dcc087)}
.boss{background:#0b141cc9;border-color:#ad986a88}.boss-status strong{color:#efe0bd}.boss-status>p{margin-bottom:10px}.boss-status{bottom:82px}.boss-status .posture{width:72%;height:4px}
.battle-tools button,kbd{border-color:#b1aa8d55;color:#ddd4bf;background:#15222a80}.flask{color:#d3b77e;border-color:#b69b6266;background:#19262ca8}
.reticle{border-color:#f0dcafa6;box-shadow:0 0 12px #e8ba6333}.enemy-warning{color:#f1cda1;text-shadow:0 2px 10px #000,0 0 20px #000;font-size:13px;letter-spacing:4px}
.message{color:#e9c88c;text-shadow:0 2px 10px #000,0 0 40px #111;letter-spacing:9px}
.overlay{background:#070e1b80}.modal{background:linear-gradient(145deg,#202b30f7,#121b24fc);border-color:#8d7b55;box-shadow:0 20px 100px #0009}.modal p,.control-grid span{color:#b8bdb5}.modal .eyebrow{color:#c6a16c}.modal h2{color:#eee0c4}.modal .secondary{border-color:#8c8062}.close{color:#d2c6ae}
.loading,.error{background:#111b23;color:#e6d6b6}.loading>span{color:#aab7b8}.touch-actions button{color:#e6d8b9;background:#172630dc;border-color:#b9a47788}.touch-actions .touch-light{background:#7a3d2edc;color:#f2e6cb}#joystick{background:#17263077;border-color:#b9a47766}#joystick>i{background:#b2a27877;border-color:#e6d5b17a}
@media(max-width:650px){.vignette{background:linear-gradient(90deg,#0b141be6,#101a2166 65%,transparent),linear-gradient(0deg,#0b131bf0,transparent 30%)}.playing .vignette{background:linear-gradient(0deg,#080f19dd,transparent 28%),linear-gradient(180deg,#0a121ccc,transparent 26%)}.boss-status{bottom:42px}.enemy-warning{font-size:10px;letter-spacing:3px}}

/* Campaign information stays outside the combat center. */
#battle-map{position:absolute;right:4.5%;top:180px;width:180px;background:#101b23e8;border:1px solid #b59b6055;box-shadow:0 8px 30px #0005;color:#e3d2ae;padding:8px;}
#battle-map>div{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px;margin-bottom:5px}#battle-map>div span{font-size:9px;color:#aab6b7}#minimap{width:100%;height:210px;display:block}#battle-count{font:12px Arial;margin:8px 0}#battle-map small{font-size:9px;line-height:1.7;color:#a9b5b5}
#objective{position:absolute;left:50%;top:105px;transform:translateX(-50%);text-align:center;display:flex;flex-direction:column;gap:7px;min-width:240px;text-shadow:0 2px 8px #000}#objective small{font-size:9px;color:#b8a078;letter-spacing:4px}#objective strong{font-size:20px;font-weight:400;color:#ecd8b0;letter-spacing:3px}#objective span{font-size:11px;color:#b8c7c6}#combo-count{font-size:28px;font-weight:400;color:#f5ca7c;letter-spacing:3px;min-height:34px}.touch-actions [data-action=special]{grid-column:auto}.key-hints{gap:14px}
@media(max-width:900px){#battle-map{right:3%;top:165px;width:130px;padding:6px}#minimap{height:152px}#objective{top:85px;left:50%;min-width:180px}#objective strong{font-size:16px}.key-hints{gap:8px;font-size:9px}}
@media(max-width:600px){#battle-map{top:170px;width:104px;right:12px}#minimap{height:120px}#battle-map small{display:none}#battle-map>div{font-size:9px;letter-spacing:0}#battle-count{font-size:10px}#objective{top:163px;left:5%;width:62%;min-width:0;transform:none;text-align:left;gap:6px}#objective span{font-size:10px}#objective small{display:none}#combo-count{font-size:21px}.enemy-warning{top:37%}}

/* Small battlefield annotations share the game's bronze / vermilion palette. */
#combat-labels{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.troop-health{position:absolute;width:46px;height:4px;background:#111a20d9;border:1px solid #b8b0a16b;transform:translate(-50%,-100%);box-shadow:0 1px 5px #000}
.troop-health i{display:block;height:100%;background:#b9715b;transform-origin:left center;transition:transform .12s}
.troop-health.selected{width:58px;border-color:#edcf91}.troop-health.broken i{background:#e5c178}
.hit-number{position:absolute;font:600 18px Georgia,serif;color:#f6e6c7;transform:translate(-50%,-100%);text-shadow:0 2px 4px #000,1px 0 2px #000;white-space:nowrap}
.hit-number.strong{font-size:24px;color:#f5d591}.hit-number.received{color:#ffa68f;font-size:20px}
.combo-hint{position:absolute;bottom:190px;left:50%;transform:translateX(-50%);padding:7px 14px;border-bottom:1px solid #cda66b70;background:linear-gradient(90deg,transparent,#101b25c9,transparent);color:#f0d7a5;font-size:12px;letter-spacing:2px;text-shadow:0 2px 5px #000;white-space:nowrap}
@media(max-width:699px){.combo-hint{bottom:310px;font-size:10px;letter-spacing:1px}.troop-health{width:34px}.troop-health.selected{width:42px}.hit-number{font-size:16px}.hit-number.strong{font-size:20px}}

/* Both play modes are first-class entry points, including narrow screens. */
.mode-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:460px;max-width:84vw}
.mode-card{position:relative;text-align:left;display:flex;flex-direction:column;gap:8px;min-height:114px;padding:17px 20px;border:1px solid #b2835bb0;background:linear-gradient(115deg,#773d30ed,#432a26e6);color:#f2e5cb;box-shadow:0 8px 26px #0004;transition:background .15s,border-color .15s,transform .15s}
.mode-card.campaign{background:linear-gradient(115deg,#695334f2,#302c24eb);border-color:#d0b17dbb}
.mode-card small{font-size:10px;letter-spacing:2px;color:#c8b595}.mode-card strong{font-size:23px;letter-spacing:3px;font-weight:500}.mode-card span{font-size:11px;letter-spacing:1px;color:#d7c9b1}.mode-card b{position:absolute;top:17px;right:15px;font:22px Arial;font-weight:400;color:#ead3a5}
.mode-card:hover{border-color:#f4d097;color:#fff0ce;transform:translateY(-2px);background:#814c37}.mode-card.campaign:hover{background:#80683e}.mode-card:disabled{opacity:.45;cursor:wait;transform:none}
.audio-setting{display:grid;grid-template-columns:1fr auto;gap:12px;margin:24px 0;text-align:left}.audio-setting label{font-size:16px;letter-spacing:3px}.audio-setting output{font:13px Arial;color:#dec28f}.audio-setting input{grid-column:1/-1;width:100%;accent-color:#c39b62;cursor:pointer;height:22px}.audio-caption{font-size:12px!important;line-height:1.8}.audio-status{font-size:11px!important;color:#b8c4bd!important}.audio-credits{font-size:10px!important;line-height:1.7}.audio-credits a{color:#d9c39c;text-underline-offset:3px}
@media(max-width:600px){.title-screen{left:20px;right:20px}.mode-choices{width:100%;max-width:100%;gap:10px}.mode-card{padding:14px 12px;min-height:108px}.mode-card strong{font-size:20px;letter-spacing:2px}.mode-card small{font-size:9px;letter-spacing:1px}.mode-card span{font-size:9px;letter-spacing:0}.mode-card b{right:10px;top:12px;font-size:17px}}
/* Borrowed Names: a quiet dialogue layer above the live 3D scene. */
.story-dialog{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;justify-content:space-between;padding:5vh 7% 4vh;background:linear-gradient(180deg,#080e13e8,transparent 35%,#080e1388 62%,#080e13e8);color:#e9dfca;overflow-y:auto;overscroll-behavior:contain}
.story-heading p{color:#c79a69;font-size:12px;letter-spacing:.3em;margin:0 0 12px}.story-heading h2{font-size:clamp(28px,3.5vw,48px);letter-spacing:.18em;font-weight:400;margin:0;text-shadow:0 3px 18px #000}.story-paper{width:min(900px,100%);margin:24px auto 0;background:linear-gradient(115deg,#121b22f5,#1c2326ed);border-top:1px solid #b18a5f88;box-shadow:0 18px 70px #0005;padding:24px 32px 14px}.story-copy{min-height:118px}#story-speaker{font-size:14px;color:#e6b982;letter-spacing:.15em;margin:0 0 12px}#story-line{font-size:clamp(18px,2vw,24px);line-height:1.85;letter-spacing:.045em;margin:0;text-wrap:pretty}.story-bottom{display:flex;gap:24px;align-items:center;justify-content:space-between;margin-top:22px;padding-top:18px;border-top:1px solid #d2b98b25}.story-bottom>p{margin:0;line-height:1.7;font-size:13px;color:#c9c6bc}.story-bottom small{display:block;font-size:10px;color:#9d967e;letter-spacing:.2em}.story-actions{display:flex;gap:18px;align-items:center;flex-shrink:0}#story-progress{font:12px Georgia;color:#b7ad97;white-space:nowrap}#story-next{font-size:15px;min-height:46px;padding:10px 22px;background:#794932;border-color:#ae7552;white-space:nowrap}#story-next:hover{background:#9b6041}.story-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:12px;color:#a3a49a;font-size:10px}.story-foot button{font-size:12px;padding:10px 0 10px 12px;color:#c9c0ae}.story-foot kbd{margin-left:8px;border:1px solid #a3957a55;padding:2px 4px;font:10px Arial}.story-active #hud,.story-active #touch,.story-active header,.story-active #message{visibility:hidden}.story-bark{position:absolute;left:50%;bottom:25%;transform:translateX(-50%);max-width:min(680px,85%);z-index:5;pointer-events:none;padding:12px 24px;text-align:center;background:linear-gradient(90deg,transparent,#0a1018ed 15%,#0a1018ed 85%,transparent);color:#f1e4cf;text-shadow:0 2px 4px #000;font-size:16px;line-height:1.65}.story-bark strong{display:block;font-size:11px;letter-spacing:.15em;color:#d5ab75;font-weight:400}.journal-intro{line-height:1.9}.journal-pages details{border-top:1px solid #a3957a44;padding:14px 0}.journal-pages summary{cursor:pointer;color:#e5d1aa;padding:4px 0}.journal-pages summary small{font-size:10px;letter-spacing:.1em;margin-right:14px;color:#a99f89}.journal-pages summary b{font-size:17px;font-weight:400}.journal-pages details p{padding-left:14px;border-left:1px solid #a88b5b44;line-height:1.9}.journal-pages details p strong,.journal-lore strong{display:block;color:#d4ad78;font-size:12px;font-weight:400;margin-bottom:5px}.journal-pages .journal-purpose{color:#b6c2b3;font-size:12px}.journal-lore{border-top:1px solid #a3957a44;margin-top:20px;padding-top:10px}.journal-lore h3{font-size:17px;font-weight:400;color:#e5d1aa}.journal-lore p{font-size:12px;line-height:1.9}.journal-lore a{display:block;color:#c1ac80;font-size:11px;margin-top:8px}.journal-empty{color:#c0bba9}.journal-intro,.journal-pages p,.journal-lore p{color:#bfc3bf}
@media(max-width:700px){header nav{gap:10px}#journal{font-size:11px;letter-spacing:1px}header nav button span{display:none}.story-dialog{padding:24px 18px max(16px,env(safe-area-inset-bottom))}.story-heading p{font-size:10px}.story-heading h2{font-size:28px}.story-paper{padding:20px 18px 10px}.story-copy{min-height:145px}#story-line{font-size:18px;line-height:1.9}.story-bottom{gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:12px}.story-bottom>p{font-size:12px;flex:1 1 100%}.story-actions{width:100%;justify-content:space-between}#story-next{min-height:44px}.story-foot{font-size:9px;gap:4px}.story-foot kbd{display:none}.story-foot button{font-size:11px}.story-bark{bottom:39%;font-size:14px;max-width:92%;width:max-content;padding:10px 18px}.journal-pages summary small{display:block;margin:0 0 6px}.title-note{max-width:330px;line-height:1.8}}
@media(max-height:540px){.story-dialog{padding:16px 5%}.story-heading{display:flex;align-items:center;gap:18px}.story-heading p{margin:0;font-size:10px}.story-heading h2{font-size:24px}.story-paper{padding:14px 22px 6px;margin-top:16px}.story-copy{min-height:0}#story-speaker{margin-bottom:6px}#story-line{font-size:17px;line-height:1.7}.story-bottom{margin-top:12px;padding-top:10px;flex-wrap:nowrap}.story-bottom>p{flex:auto}.story-actions{width:auto}.story-foot{margin-top:4px}}

.journal-pages,.journal-lore{text-align:left}.journal-pages summary:focus-visible{outline:1px solid #d4ad78;outline-offset:5px}.modal{scrollbar-color:#81785f #192128;scrollbar-width:thin}
@media(max-width:650px){.boss-status small{max-width:34%;line-height:1.5}.boss-status strong{letter-spacing:2px}}
/* Three main actions, with deliberate healing and ultimate controls beside resources. */
.simple-guide{display:grid;gap:12px;text-align:left;margin:24px 0}.simple-guide>div{display:grid;grid-template-columns:110px 1fr;gap:6px 16px;padding:14px 0;border-top:1px solid #9e8d6944}.simple-guide kbd{grid-row:span 2;align-self:start;text-align:center;padding:10px 4px;font-size:12px;color:#e5cc9e}.simple-guide strong{font-size:19px;font-weight:400;color:#ead8b7}.simple-guide span{font-size:12px;line-height:1.9;color:#bdc1b8}.simple-utilities{display:flex;justify-content:center;gap:22px;font-size:12px;margin:20px 0}.advanced-controls{text-align:left;border-top:1px solid #9e8d6944;padding:18px 0 6px}.advanced-controls summary{cursor:pointer;color:#d9bb8b;font-size:13px}.advanced-controls p{font-size:12px!important;letter-spacing:1px!important}.combat-utilities{position:absolute;left:4.5%;bottom:82px;display:flex;gap:10px;pointer-events:auto}.combat-utilities button{border:1px solid #9b8a6566;border-radius:5px;background:#14202ae6;min-width:76px;padding:10px 12px;color:#dfd4be;touch-action:none;user-select:none}.combat-utilities button>span{display:block;font-size:12px}.combat-utilities small{display:block;font:11px Georgia;margin-top:7px;color:#abae9f}.combat-utilities button[aria-disabled=true]{opacity:.55}.combat-utilities button.ready{opacity:1;border-color:#e0b879;box-shadow:0 0 20px #c18f3e44;background:#493c26e6}.combat-utilities button.ready small{color:#f7db9d}.item-slot{display:none}.touch-actions{display:grid;grid-template-columns:58px 66px 84px;align-items:end;gap:10px;right:5%;bottom:158px}.touch-actions button{width:100%;height:58px;border-radius:50%;background:#172632e8;border:1px solid #9f9475a0;color:#ede0c5;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;position:relative;overflow:hidden}.touch-actions button[data-action=evade]{height:66px}.touch-actions button.touch-light{height:84px;background:#75452ce8;border-color:#d1a16b}.touch-actions b{font-weight:400;font-size:16px;pointer-events:none}.touch-actions small{font-size:8px;color:#c6bba4;pointer-events:none}.touch-actions .touch-light b{font-size:22px}.touch-actions .touch-light small{font-size:8px}.touch-actions .touch-light::after{content:'';position:absolute;bottom:0;left:0;width:var(--charge,0%);height:5px;background:#f3cc87}.touch-actions button:active,.touch-actions button.charging{border-color:#ffe2a1;background:#8c5a38}.key-hints{gap:20px}.combat-utilities kbd{color:#d2c4a6}
@media(max-width:700px){.combat-utilities{left:5%;bottom:114px;gap:8px}.combat-utilities button{padding:6px 10px;min-width:64px;min-height:44px}.combat-utilities button>span{font-size:11px}.combat-utilities small{font-size:10px;margin-top:4px}.combat-utilities kbd{display:none}#joystick{width:104px;height:104px;left:5%;bottom:185px}#joystick>i{left:30px;top:30px}.touch-actions{right:4%;bottom:185px;grid-template-columns:52px 58px 76px;gap:7px}.touch-actions button{height:52px}.touch-actions button[data-action=evade]{height:58px}.touch-actions button.touch-light{height:76px}.touch-actions b{font-size:14px}.touch-actions .touch-light b{font-size:20px}.touch-actions small{font-size:8px}.simple-guide>div{grid-template-columns:86px 1fr;gap:6px 12px}.simple-guide kbd{font-size:10px}.simple-guide span{font-size:11px}.simple-utilities{gap:14px;font-size:11px}.combo-hint{bottom:285px}.story-bark{bottom:42%}}

.story-audio-actions{display:flex;align-items:center;gap:12px}.story-audio-actions #story-voice{font-size:11px;color:#d7b98b}.story-foot>span{max-width:48%}@media(max-width:700px){.story-foot{flex-wrap:wrap}.story-foot>span{max-width:100%}.story-audio-actions{width:100%;justify-content:space-between;gap:8px}.story-audio-actions button{padding-left:0}.story-paper{padding-bottom:6px}}