:root{--ink:#15191b;--panel:#19252bea;--cream:#fff4dc;--green:#62dc88;--cyan:#5ceaff;--red:#ef4e45;--gold:#ffcc4d;--wood:#84512e}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#121719;color:#fff;font-family:Tahoma,"Noto Sans Thai",system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}#game-shell{position:relative;width:100vw;height:100vh;min-height:560px;overflow:hidden;background:#dce6e4;image-rendering:pixelated}#viewport,#viewport canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.panel{background:linear-gradient(145deg,rgba(22,33,38,.95),rgba(32,48,51,.9));border:3px solid #11191c;box-shadow:inset 0 0 0 2px #799094,0 4px 0 #0b1113;border-radius:7px}.hud{position:absolute;z-index:5;inset:15px 18px auto;display:grid;grid-template-columns:minmax(230px,1fr) minmax(410px,1.55fr) minmax(250px,1fr);gap:15px;pointer-events:none;text-shadow:2px 2px #0b1113}.status-card{padding:12px 16px;font:800 clamp(15px,1.25vw,21px)/1.25 monospace}.hp-row{display:flex;align-items:center;gap:10px}.heart{color:#63dc7c;font-size:1.15em;margin-right:3px;-webkit-text-stroke:2px #101719}.heart.empty{color:#ddd}.stat-row{display:flex;justify-content:space-between;margin-top:4px}.stat-row>span{color:#bdccd0;font-size:.75em}.coin-value{color:var(--gold)}.coin-value i,.skill-dock i{display:inline-grid;place-content:center;width:19px;height:19px;margin-right:4px;border-radius:50%;background:var(--gold);border:2px solid #6a4711;color:#2e4d36;font:900 11px sans-serif;font-style:normal;text-shadow:none}.status-card>small{display:block;margin-top:5px;color:#8eeaa8;font:10px sans-serif;text-shadow:none}.mission-card{text-align:center}.mission-card h1{margin:0 0 7px;font-size:clamp(20px,2vw,32px);color:#fff}.noc{height:88px;display:flex;align-items:center;justify-content:center;gap:18px;padding:8px 12px;background:#0e3436ed;border-color:#50cad5;box-shadow:0 0 18px #42ccda66,inset 0 0 0 2px #183c40}.noc>div:nth-child(2){display:grid;gap:4px}.noc b{font-size:21px}.noc small{font:10px monospace;color:#81e899;text-shadow:none}.noc-pulse{display:flex;align-items:end;gap:4px;height:30px}.noc-pulse i{width:8px;background:#66e38a;animation:pulse 1s steps(3) infinite}.noc-pulse i:nth-child(1){height:13px}.noc-pulse i:nth-child(2){height:27px;animation-delay:.2s}.noc-pulse i:nth-child(3){height:19px;animation-delay:.4s}@keyframes pulse{50%{height:7px}}#ai-button{pointer-events:auto;display:grid;min-width:145px;padding:8px;border:2px solid #5a241c;border-radius:5px;background:linear-gradient(#df5244,#a52922);color:#fff;text-shadow:2px 2px #57120e;box-shadow:inset 0 0 0 2px #ff8c79}#ai-button span{position:absolute}#ai-button small{color:#ffe9d6}#ai-button.active{border-color:#16753a;background:linear-gradient(#54e77f,#168749);box-shadow:0 0 16px #4bf47a,inset 0 0 0 2px #a0ffb9}.map-card{padding:8px 10px;text-align:center}.map-card canvas{width:100%;height:74px;border:2px solid #7c999e;background:#0e2221}.map-card div{margin-top:4px;color:#ffd869;font-weight:900;font-size:13px}#version-badge{position:absolute;z-index:4;right:20px;bottom:106px;color:#d8e6e7;font:10px monospace;text-shadow:1px 1px #000}#mode-banner{position:absolute;z-index:4;left:50%;top:137px;transform:translateX(-50%);padding:5px 14px;border:2px solid #7f9596;border-radius:4px;background:#121b1ddd;font:700 11px monospace;letter-spacing:1px}#mode-banner.ai{color:#87ffa4;border-color:#4ee67a;box-shadow:0 0 14px #40e86c}#boss-hud{position:absolute;z-index:6;top:178px;left:50%;transform:translateX(-50%);width:min(610px,65vw);padding:9px 15px;text-align:center;color:#ff786c;text-shadow:2px 2px #111}#boss-hud[hidden]{display:none}#boss-hud>div:first-child{display:flex;justify-content:space-between;font:900 13px monospace}.boss-meter{height:17px;margin:6px 0;background:#111;border:2px solid #080808}.boss-meter i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#a20d1c,#f04b3c,#ffc34c);box-shadow:0 0 12px #ef342e;transition:width .12s}#boss-hp{font:11px monospace}#aim-indicator{position:absolute;z-index:4;left:20px;bottom:181px;padding:4px 9px;background:#10191cdd;border:2px solid #6b9299;color:#b8f7ff;font:700 11px monospace;border-radius:4px}#combo{position:absolute;z-index:5;right:4%;top:34%;color:#fff266;font:900 clamp(26px,4vw,58px) monospace;text-shadow:4px 4px #b53620;transform:rotate(-5deg)}#toast{position:absolute;z-index:9;left:50%;top:48%;transform:translate(-50%,-50%) scale(.8);opacity:0;color:#fff;font:900 clamp(25px,4vw,54px) monospace;text-align:center;text-shadow:4px 4px #111;transition:.18s;pointer-events:none}#toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.skill-dock{position:absolute;z-index:6;left:50%;bottom:95px;transform:translateX(-50%);display:flex;align-items:stretch;gap:5px;padding:6px;pointer-events:auto}.skill-heading{display:grid;place-content:center;padding:0 9px;text-align:center;color:#73efff;font:900 12px monospace}.skill-heading small{color:#a9c0c4;font-size:8px}.skill-dock button{display:grid;min-width:132px;padding:5px 8px;border:2px solid #315057;border-radius:4px;background:linear-gradient(#24444b,#162e34);color:#fff;text-align:left}.skill-dock button kbd{color:#7defff;font:9px monospace}.skill-dock button b{font:900 12px sans-serif}.skill-dock button small{color:#ffda68;font:9px monospace}.skill-dock button.locked{filter:grayscale(1);opacity:.55}.skill-dock button.ready{border-color:#64e9ff;box-shadow:0 0 10px #4deaff}.skill-dock button.shield-on{background:#1d6683;animation:skillPulse .45s steps(2) infinite}@keyframes skillPulse{50%{box-shadow:0 0 16px #5befff}}footer{position:absolute;z-index:5;left:18px;right:18px;bottom:14px;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:end;pointer-events:none}.dialogue{justify-self:center;width:min(750px,62vw);padding:11px 18px;text-align:center;font-size:clamp(13px,1.15vw,19px)}.dialogue span{color:#8cf3a0;font-weight:900}.controls{padding:8px 11px;color:#dbe7e4;font-size:clamp(9px,.8vw,12px);line-height:1.5}
#cover-screen{position:absolute;z-index:30;inset:0;background:url('assets/cover-v2.png') center/cover no-repeat;image-rendering:auto}.cover-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,14,.92) 0%,rgba(7,14,16,.72) 35%,rgba(8,12,14,.06) 66%,rgba(8,10,12,.26) 100%)}.cover-copy{position:absolute;z-index:1;left:clamp(30px,7vw,130px);top:50%;transform:translateY(-50%);width:min(610px,49vw);text-shadow:4px 4px #101415}.eyebrow{display:inline-block;padding:6px 12px;border:2px solid #74e89a;background:#163824cc;color:#8bffad;font:800 clamp(10px,1vw,15px) monospace;letter-spacing:2px}.cover-copy h2{margin:13px 0 7px;font-size:clamp(42px,5.3vw,88px);line-height:.93}.cover-copy h2 em{color:#ffcf4c;font-style:normal}.cover-copy p{font-size:clamp(14px,1.4vw,22px);color:#e8f1e6}.cover-actions{display:flex;gap:11px;margin:24px 0 13px}.cover-actions button,.primary{padding:13px 27px;border:3px solid #192024;border-radius:6px;background:linear-gradient(#eef5ef,#aebcb8);box-shadow:inset 0 0 0 2px #fff,0 5px 0 #182125;color:#182025;font-weight:900;font-size:17px}.cover-actions .primary,.primary{background:linear-gradient(#ffd967,#ee9f27);box-shadow:inset 0 0 0 2px #fff1a5,0 5px 0 #6a3512}.cover-copy>small{color:#d8e3df;font:11px monospace}.cover-version{position:absolute;right:20px;bottom:18px;padding:5px 10px;background:#101719cc;border:1px solid #819197;color:#fff;font:10px monospace}#settings-screen,#result-screen{position:absolute;z-index:40;inset:0;display:grid;place-items:center;background:#071012dc;backdrop-filter:blur(6px)}#settings-screen[hidden],#result-screen[hidden]{display:none}.settings-card{width:min(520px,92vw);padding:22px 25px}.settings-title{display:flex;align-items:center;justify-content:space-between}.settings-title h2{margin:0;color:#ffda61;font-size:28px}.settings-title button{border:0;background:transparent;color:#fff;font-size:22px}.settings-card label{display:grid;grid-template-columns:1fr auto;gap:7px;margin:18px 0;font-weight:800}.settings-card input,.settings-card select{grid-column:1/-1;width:100%}.settings-card input{accent-color:#54df86}.settings-card select{padding:9px;background:#eaf2ed;border:2px solid #172225}.settings-help{padding:10px 13px;background:#0d262add;border-left:4px solid #5ceaff;font-size:12px}.settings-help b{color:#74f1ff}.settings-help p{margin:3px 0 8px;color:#d8e4e2}.settings-card>.primary{display:block;width:100%;margin-top:17px}.result-card{width:min(570px,91vw);padding:28px;text-align:center}.result-crown{font-size:48px;color:#ffcf4c}.result-card h2{margin:0;font-size:clamp(30px,5vw,52px);color:#fff}.result-card p{color:#9af0a7}.result-stats{display:flex;justify-content:center;gap:35px;margin:17px 0;font:700 14px monospace}.result-stats b{display:block;color:#ffdb5c;font-size:24px}.result-card>.primary{margin-top:10px}
@media(max-width:900px){.hud{grid-template-columns:1fr 1.4fr}.map-card{display:none}.status-card{font-size:13px}.mission-card h1{font-size:18px}.noc{height:75px}.noc-pulse{display:none}.skill-dock{bottom:88px}.skill-heading{display:none}.skill-dock button{min-width:105px}.skill-dock button b{font-size:10px}.controls{display:none}.dialogue{width:90vw}.cover-copy{width:73vw}.cover-shade{background:rgba(6,12,14,.7)}}@media(max-height:680px){.hud{top:7px}.status-card{padding:7px 11px}.status-card>small{display:none}.mission-card h1{font-size:17px}.noc{height:65px}#mode-banner{top:104px}#boss-hud{top:138px}.skill-dock{bottom:72px}.dialogue{padding:7px 12px}footer{bottom:7px}#aim-indicator{bottom:137px}.cover-copy h2{font-size:48px}.cover-copy p{margin:7px 0}.cover-actions{margin:15px 0}}