:root{color-scheme:dark;--gold:#c4a371;--paper:#e8e1d3;--muted:#a4acb0;--ink:#0b1115;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:#05080a;color:var(--paper);overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button{border:0;background:none}#shell{position:absolute;inset:0;overflow:hidden;background:#0b151c}canvas{width:100%;height:100%;display:block;object-fit:cover}.grain{position:absolute;inset:0;pointer-events:none;opacity:.055;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='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E");z-index:3}.topbar{position:absolute;left:4.2%;right:4.2%;top:3.5%;height:32px;display:flex;align-items:center;gap:25px;z-index:10}.wordmark{font-family:Georgia,serif;font-weight:700;font-size:22px;letter-spacing:-2px;text-decoration:none;color:var(--paper);display:flex;align-items:center;gap:4px}.mark-line{width:15px;height:1px;transform:rotate(-60deg);background:var(--gold)}.top-caption{font-size:9px;letter-spacing:2.5px;color:#b4babe}.top-right{margin-left:auto;display:flex;gap:16px;align-items:center}.connection{font-size:8px;letter-spacing:1.6px;color:#bdc6c7}.connection::before,.status-dot{content:"";display:inline-block;border-radius:50%;background:#adbea0;width:4px;height:4px;margin-right:9px;vertical-align:middle}.icon-btn{font-size:22px;padding:3px 5px;color:#d4d8d5}.screen{position:absolute;inset:0;z-index:5}.title-screen{background:linear-gradient(90deg,rgba(3,9,13,.87),rgba(6,12,16,.45) 40%,transparent 78%),linear-gradient(0deg,#071015de,transparent 35%)}.title-copy{position:absolute;left:9%;top:22%;width:360px}.eyebrow{font-size:9px;letter-spacing:2.5px;color:var(--gold);font-weight:500;line-height:1.6}.eyebrow>span{display:inline-block;width:22px;height:1px;background:var(--gold);margin:0 10px 3px 0}h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(68px,7.8vw,142px);font-weight:400;letter-spacing:-5px;line-height:.95;margin:24px 0 12px;color:#ece6d9;text-shadow:0 3px 28px #03080b80}.subtitle{letter-spacing:10px;font-size:13px;margin:0 0 30px 5px;color:#d0baa0;white-space:nowrap}.gold-rule{height:1px;width:44px;background:var(--gold);margin-bottom:21px}.intro{font-family:Georgia,serif;line-height:1.7;font-size:15px;color:#adb4b4}.menu{display:flex;flex-direction:column;gap:0;margin-top:24px;width:275px}.menu button{display:flex;align-items:center;gap:20px;width:100%;border-bottom:1px solid #c4a37122;font-size:10px;letter-spacing:2.5px;text-align:left;padding:16px 12px;color:#aeb7b9;transition:.2s}.menu button:hover,.menu button:focus-visible{color:#fff;background:#c4a37120;padding-left:19px}.menu button.primary{color:#101a1e;background:#c8ad7f;border:1px solid #e0cba1}.menu button.primary:hover{background:#e4d1ac}.button-index{opacity:.45;letter-spacing:0;font-size:9px}.arrow{margin-left:auto;font-size:17px;opacity:.8}.start-hint{font-size:8px;letter-spacing:1.4px;color:#849092;margin-top:20px}.pad-a,.pad-b,.pad-x{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;border:1px solid #82a982;color:#a4c59a;font-size:9px;font-style:normal;font-weight:500;letter-spacing:0}.pad-b{color:#e2a79c;border-color:#b17672}.pad-x{color:#97b8de;border-color:#6888b5}.hint-divider{margin:0 14px;opacity:.4}.chapter-preview{position:absolute;right:7%;bottom:20%;width:245px;text-shadow:0 2px 12px #000}.vertical-rule{position:absolute;left:-20px;top:0;width:1px;height:130px;background:linear-gradient(var(--gold),transparent)}.chapter-preview h2{font-family:Georgia,serif;font-size:32px;font-weight:400;line-height:1.15;margin:12px 0 18px}.chapter-preview>p{font-size:8px;letter-spacing:2.2px;color:#c1c5c2}.preview-line{border-top:1px solid #ffffff30;margin-top:20px;padding-top:15px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1px;color:#8a969b}.title-footer{position:absolute;bottom:4%;left:4.2%;right:4.2%;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.7px;color:#8b969b}.title-footer b{margin-left:10px;color:#bdc3c2;font-weight:400}.hidden{display:none!important}#hud{position:absolute;top:12%;left:4.2%;right:4.2%;display:flex;align-items:flex-start;justify-content:space-between;z-index:4;text-shadow:0 2px 5px #000}.player-hud{width:255px}.player-hud p{display:flex;align-items:center;gap:18px;margin:0 0 12px}.player-hud strong{font-family:Georgia,serif;font-size:21px;font-weight:400;letter-spacing:4px}.player-hud p span{font-size:8px;letter-spacing:1.5px;color:#b2b4ab}.health-track{height:5px;background:#c4c4b01c;position:relative}.health-track div{height:100%;width:100%;position:absolute;left:0;top:0}#health-fill{background:#d9c69d;transition:width .16s}#health-trail{background:#9b5546;transition:width .8s}.health-number{display:block;font-size:8px;letter-spacing:1px;color:#a1aaa9;margin-top:8px}.stage-hud{text-align:center;font-size:9px;letter-spacing:2px;color:#d0baa0}.stage-hud p{margin:7px 0 12px}.stage-hud div{font-size:7px;letter-spacing:10px;opacity:.7}.score-hud{text-align:right;width:255px}.score-hud p{font-size:8px;letter-spacing:2px;margin:4px 0 8px}.score-hud strong{font-family:Georgia,serif;font-size:24px;font-weight:400;margin-left:18px;letter-spacing:2px;color:#e6d6b8}.score-hud>span{font-size:12px;color:#b9c0bd;letter-spacing:2px}.score-hud button{font-size:12px;margin-left:17px}#boss-hud{position:absolute;z-index:4;top:23%;width:42%;left:29%;text-shadow:0 2px 4px #000}#boss-hud>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}#boss-hud span{font-size:7px;letter-spacing:1.3px;color:#bd9581}#boss-hud strong{font-size:11px;letter-spacing:3px;font-weight:400}.boss-track{height:4px;background:#ffffff18}#boss-fill{height:100%;background:#b45e43;transition:width .15s}#callout{position:absolute;z-index:4;left:20%;right:20%;top:29%;text-align:center;pointer-events:none;text-shadow:0 3px 20px #000}#callout p{color:var(--gold);font-size:9px;letter-spacing:4px}#callout h2{font-family:Georgia,serif;font-weight:400;font-size:38px;letter-spacing:2px;margin:12px}#callout>span{font-size:10px;letter-spacing:1.8px;color:#c3c8c5}#combo{position:absolute;right:5%;top:39%;display:flex;align-items:center;gap:12px;color:var(--gold)}#combo strong{font:italic 55px Georgia,serif}#combo span{font-size:8px;letter-spacing:2px}#combat-notice{position:absolute;bottom:28%;left:25%;right:25%;text-align:center;font-size:12px;letter-spacing:2px;color:#e4ba83;text-shadow:0 2px 6px #000;z-index:4}#objective{position:absolute;bottom:12.5%;left:4.2%;right:4.2%;font-size:8px;letter-spacing:2px;display:flex;gap:12px;align-items:center;color:#c0c3b9}.objective-line{width:24px;height:1px;background:var(--gold)}.objective-arrow{margin-left:auto;font-size:23px;color:var(--gold)}#play-footer{position:absolute;bottom:4%;left:4.2%;right:4.2%;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:8px;letter-spacing:1.1px;color:#9aa9ab;z-index:4}kbd{border:1px solid #b7c1bd50;padding:2px 4px;font:9px Arial;border-radius:2px;margin-right:3px}#quality-label{color:#64777d;font-size:7px}#quality-label i{margin:0 8px}.modal{background:#050b10be;backdrop-filter:blur(14px);z-index:20;display:flex;align-items:center;justify-content:center}.modal-card{width:min(620px,86vw);max-height:86vh;overflow:auto;padding:32px 25px}.modal h2{font:400 48px Georgia,serif;letter-spacing:-1px;margin:12px 0 30px}.modal p{line-height:1.7}.back-btn{display:flex;justify-content:space-between;margin-top:35px;border-top:1px solid #c4a37144;width:100%;padding:20px 0 4px;font-size:9px;letter-spacing:2px;color:var(--gold)}.back-btn span{color:#66787d}.control-row{display:grid;grid-template-columns:1fr 1fr 1fr;padding:13px 0;border-bottom:1px solid #ffffff12;font-size:11px;color:#c5cbc8}.control-row.header{font-size:8px;letter-spacing:2px;color:#8b999d}.note{font:13px Georgia,serif;color:#97a6ab;line-height:1.8!important}.settings-choice{padding:20px 0;display:flex;justify-content:space-between;border-bottom:1px solid #ffffff1c;gap:10px;width:100%;text-align:left;font-size:13px;letter-spacing:2px}.settings-choice small{display:block;font-size:10px;letter-spacing:0;color:#8e9ea3;line-height:1.6;margin-top:9px}.settings-choice.active{color:var(--gold)}.settings-choice>span:last-child{font-size:18px}.result-values{display:flex;gap:35px;margin:28px 0}.result-values span{font-size:9px;letter-spacing:2px;color:#9baaad}.result-values strong{display:block;font:30px Georgia,serif;letter-spacing:1px;color:#e4d4b4;margin-top:10px}.wide-btn{padding:18px;background:var(--gold);color:#081114;width:100%;font-size:10px;letter-spacing:2px;margin-top:10px}.secondary-btn{background:#ffffff0a;color:#a5b2b4}.score-row{display:grid;grid-template-columns:30px 1fr 70px 90px;padding:16px 0;border-bottom:1px solid #ffffff14;font-size:12px}.score-row span:nth-child(2){color:var(--gold)}.score-row span:last-child{text-align:right;font-variant-numeric:tabular-nums}#loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0b1115;z-index:50}#loading p{font-size:9px;letter-spacing:3px;color:var(--gold)}#loading>span:last-child{color:#6d7f86;font-size:11px}.loader-mark{font:60px Georgia;color:var(--gold);animation:breath 2s infinite}@keyframes breath{50%{opacity:.35}}#touch-controls{position:absolute;bottom:8%;left:3%;right:3%;display:flex;justify-content:space-between;z-index:6}#touch-controls button{height:48px;width:48px;border:1px solid #dbc79a55;background:#07131977;border-radius:50%;margin:3px;touch-action:none}body.playing .top-caption{opacity:.5}body.playing .wordmark{opacity:.6}@media(max-height:820px){.title-copy{top:18%}.title-copy h1{margin:16px 0 10px}.subtitle{margin-bottom:22px}.intro{font-size:13px}.menu{margin-top:16px}.menu button{padding:12px}.start-hint{margin-top:13px}.gold-rule{margin-bottom:14px}}@media(max-width:800px){.title-copy{left:8%;width:280px;top:19%}h1{font-size:76px}.chapter-preview{right:5%;width:170px}.chapter-preview h2{font-size:25px}.top-caption,.title-footer>span:last-child,.preview-line,.score-hud p>strong{letter-spacing:1px}.top-caption{display:none}.title-footer{font-size:7px}.player-hud,.score-hud{width:180px}.stage-hud{font-size:7px}.player-hud p span{display:none}#play-footer>span:first-child{display:none}.modal h2{font-size:36px}.subtitle{letter-spacing:7px;font-size:11px}}@media(max-width:580px){.chapter-preview{display:none}.title-copy{top:21%}.top-right{gap:10px}.title-footer>span:last-child{display:none}#hud{top:12%}.player-hud{width:120px}.score-hud{width:120px}.stage-hud{width:100px;line-height:1.5}.stage-hud div{letter-spacing:5px}.score-hud strong{font-size:18px;margin-left:4px}.player-hud strong{font-size:17px}#play-footer{font-size:6px}#quality-label{display:none}#boss-hud{left:15%;width:70%}#boss-hud span{font-size:6px}#callout{left:8%;right:8%}#callout h2{font-size:28px}}
#dev-profiler{position:fixed;right:14px;top:65px;z-index:100;pointer-events:none;margin:0;padding:14px 17px;border:1px solid #c4a37155;background:#050b10ed;color:#d5d4ba;font:11px/1.55 Consolas,monospace;max-height:80vh;overflow:hidden;contain:content}#dev-profiler[hidden]{display:none}

/* Daylight temple: warm paper menus and compact jade plates keep text legible. */
:root{--gold:#ffd47e;--paper:#fff3d5}
.grain{opacity:.012}
.topbar{background:#164d50e8;border-bottom:2px solid #e8b559;padding:8px 14px;height:42px;border-radius:3px}
.top-caption,.connection{color:#f6e8c5}
.title-screen{background:linear-gradient(90deg,#fff1d9f5 0%,#fff1d9e6 22%,#fff1d973 44%,#fff1d900 67%)}
.title-copy{color:#174e52}
.title-copy h1{color:#a9313e;text-shadow:0 3px 0 #fff7df;letter-spacing:-4px}
.title-copy .eyebrow,.title-copy .subtitle{color:#8c414b}
.title-copy .eyebrow>span,.title-copy .gold-rule{background:#c04f48}
.title-copy .intro{color:#315c5d}
.title-copy .menu button{color:#234f52;border-bottom-color:#21625b30;background:#fff3d566}
.title-copy .menu button:hover,.title-copy .menu button:focus-visible{background:#ffe4a9;color:#8b2e3b}
.title-copy .menu button.primary{background:#bc3f47;color:#fff4d4;border-color:#e78b67}
.title-copy .menu button.primary:hover{background:#a52c3a}
.title-copy .start-hint{color:#2c625c}
.title-copy .pad-a{color:#276a46;border-color:#41834f}
.chapter-preview{background:#164d50e6;padding:22px;border:1px solid #f1ca7999;border-radius:3px;text-shadow:none}
.chapter-preview .vertical-rule{display:none}
.chapter-preview>p,.chapter-preview .preview-line{color:#f3deaf}
.title-footer,#play-footer{background:#164d50ed;color:#f6e8c5;padding:12px 15px;border-top:2px solid #e8b559;border-radius:3px}
.title-footer b,#quality-label{color:#f6e8c5}
#hud{background:#164d50e8;padding:14px 18px;border:1px solid #f0c977aa;border-radius:3px;text-shadow:none}
.stage-hud,.health-number,.player-hud p span,.score-hud>span{color:#ffe6ad}
.score-hud strong{color:#fff5da}
#health-fill{background:#7ee0a5}
.health-track{background:#092f34}
#boss-hud{background:#52354be8;padding:10px 15px;border:1px solid #eeb96c;border-radius:3px}
#boss-hud span{color:#ffe1b2}
#boss-fill{background:#fa8a65}
#callout{background:#184e50e8;padding:12px 18px 20px;border:1px solid #e9bc70;border-radius:3px;text-shadow:none}
#callout>span{color:#fff0c9}
#objective{width:fit-content;max-width:91.6%;background:#184e50ed;color:#fff0c9;padding:8px 12px;border:1px solid #e9bc7070;border-radius:3px}
#objective .objective-arrow{margin-left:20px}
#combo{color:#842e4a;text-shadow:0 1px 2px #fff3cf}
#combat-notice{color:#fff2c7;text-shadow:0 1px 3px #154b50,0 0 8px #154b50}
body.playing .top-caption,body.playing .wordmark{opacity:1}
@media(max-width:580px){#hud{padding:12px 10px}.topbar{padding:8px 10px}.title-copy{width:270px}.title-screen{background:linear-gradient(90deg,#fff1d9ee,#fff1d9aa 65%,#fff1d930)}}
.title-copy{top:20%}.title-copy .menu button{padding-top:11px;padding-bottom:11px}
.outfit-options{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.outfit-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 12px 20px;background:#153b40;border:2px solid #416160;border-radius:5px;text-align:center}
.outfit-card.active{border-color:#ffd47e;background:#205052}
.outfit-card strong{font:23px Georgia,serif}.outfit-card small{font-size:11px;color:#c8dcce;line-height:1.5}.outfit-card>span:last-child{font-size:9px;letter-spacing:1.5px;color:#ffda91}
.outfit-portrait{display:block;width:150px;height:160px;background-image:url('assets/karate/source-rigs.png');background-size:650px auto;background-position:-38px 0;background-repeat:no-repeat}
.outfit-portrait.casual{background-image:url('assets/karate/source-casual.png')}
@media(max-height:720px){.title-copy{top:17%}.title-copy .intro{margin-top:8px;margin-bottom:8px}.title-copy .menu{margin-top:10px}.title-copy .menu button{padding-top:8px;padding-bottom:8px}.title-copy .start-hint{margin-top:10px}}
@media(max-width:580px){.outfit-options{gap:10px}.outfit-card{padding:12px 5px}.outfit-portrait{width:120px;background-position:-47px 0}.outfit-card strong{font-size:19px}.outfit-card small{font-size:10px}}
/* Multi-touch controls leave the centre of the fight clear. */
#touch-controls{bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));pointer-events:none;align-items:end;user-select:none;-webkit-user-select:none}
#touch-controls>div{display:grid;gap:8px;pointer-events:auto}
#touch-controls .touch-move{grid-template-columns:repeat(2,58px)}
#touch-controls .touch-move button:last-child{grid-column:1/3;width:124px;height:44px;border-radius:14px;font-size:10px}
#touch-controls .touch-actions{grid-template-columns:repeat(2,62px)}
#touch-controls button{width:58px;height:58px;margin:0;font:700 11px Arial,sans-serif;background:#101b24d9;border:1px solid #c4aa72aa;color:#fff;touch-action:none;-webkit-touch-callout:none}
#touch-controls .touch-move button{font-size:25px}
#touch-controls .touch-actions button{width:62px}
#touch-controls button.held{background:#a78040;color:#fff;border-color:#ffe0a0}
body:has(#modal:not(.hidden)) #touch-controls{visibility:hidden}
@media(any-pointer:coarse){
 html,body{overscroll-behavior:none;touch-action:manipulation}#shell{height:100dvh}
 .playing #play-footer,.playing #objective{display:none}
 .topbar{top:max(10px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right))}
 .title-screen{overflow-y:auto}.title-copy{position:relative;top:auto;left:auto;margin:90px 7% 55px;width:86%}.title-footer,.chapter-preview,.start-hint{display:none}
 .menu button{min-height:44px}.modal-card{max-height:85dvh;overflow:auto}
 #boss-hud{bottom:155px}.playing .topbar .wordmark,.playing .connection,.playing .top-caption{display:none}
}
@media(any-pointer:coarse) and (orientation:landscape) and (max-height:600px){
 .title-copy{margin:55px 7% 20px;max-width:520px}.title-copy h1{font-size:58px}.title-copy .intro,.title-copy .gold-rule,.title-copy .eyebrow{display:none}.subtitle{margin-bottom:12px}.menu{display:grid;grid-template-columns:1fr 1fr;gap:5px}.menu button{padding:10px;font-size:10px}.menu .primary{grid-column:1/3}
 .playing #hud{top:14px}.stage-hud{display:none}.player-hud{width:170px}.score-hud{margin-right:88px}#boss-hud{width:35%;left:32.5%;bottom:12px}
}
@media(any-pointer:coarse){.playing .topbar{left:auto;width:auto;background:transparent;border:0;padding:0;box-shadow:none}.playing #hud{top:12px}.playing .top-right{gap:4px}.playing #callout{pointer-events:none}.playing #callout h2{font-size:clamp(22px,5vw,42px)}}
@media(any-pointer:coarse) and (orientation:portrait){.playing #hud{left:12px;right:12px;padding:12px;top:55px}.player-hud{width:140px}.stage-hud{display:none}.score-hud{margin:0}.playing #callout{top:32%;width:90%;left:5%;transform:none}}
/* The boss health strip must not stretch between the desktop top and mobile bottom. */
@media(any-pointer:coarse){
 #boss-hud{top:auto;bottom:145px;height:auto;min-height:0;padding:7px 10px;pointer-events:none}
 #boss-hud>div:first-child{margin-bottom:5px}
}
@media(any-pointer:coarse) and (orientation:landscape){
 #boss-hud{top:auto;bottom:max(12px,env(safe-area-inset-bottom));left:32.5%;width:35%}
 #boss-hud span{display:none}
}
@media(any-pointer:coarse) and (orientation:portrait){
 #boss-hud{top:155px;bottom:auto;left:12px;right:12px;width:auto}
}
/* Explicit touch-device class also covers phones reporting a fine primary pointer. */
.mobile-ui #boss-hud{position:absolute;top:auto;bottom:max(12px,env(safe-area-inset-bottom));left:32.5%;right:auto;width:35%;height:34px;min-height:0;max-height:34px;overflow:hidden;background:transparent;border:0;box-shadow:none;padding:4px 8px;pointer-events:none}
.mobile-ui #boss-hud>div:first-child{margin:0 0 4px;line-height:12px}
.mobile-ui #boss-hud span{display:none}
.mobile-ui #boss-hud strong{font-size:10px;text-shadow:0 1px 3px #000}
@media(orientation:portrait){.mobile-ui #boss-hud{top:145px;bottom:auto;left:12px;right:12px;width:auto}}
@media(orientation:landscape){.mobile-ui .playing #hud{padding:8px 12px}.mobile-ui .player-hud p{margin:0 0 5px}.mobile-ui .health-number{margin-top:4px}.mobile-ui .player-hud p span{display:none}.mobile-ui .score-hud p{margin:0 0 4px}}

/* Keep the defeat celebration visible until the retry dialog appears. */
body.defeated #hud,body.defeated #boss-hud,body.defeated #touch-controls,body.defeated #callout,body.defeated #objective,body.defeated #play-footer,body.defeated #combat-notice,body.defeated #combo{display:none!important}
.camera-zoom-label{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;margin:18px 0 8px}#camera-zoom{display:block;width:100%;height:44px;accent-color:#bd5750;touch-action:pan-x}#camera-reset{margin:0 0 20px}