*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#15242c;color:#fff;font-family:Arial,sans-serif;touch-action:none}canvas{display:block;width:100%;height:100%}button{font:inherit;color:inherit;cursor:pointer}#hud{position:absolute;top:max(18px,env(safe-area-inset-top));left:max(22px,env(safe-area-inset-left));right:22px;display:flex;align-items:center;gap:12px;text-shadow:0 2px 5px #000}.brand{font-size:21px;font-weight:900;letter-spacing:-1px}.brand small{display:block;font-size:10px;letter-spacing:4px;color:#f4bf66;margin-top:3px}#stats{flex:1;font-size:14px;font-weight:bold}#hud button{background:#17262ca6;border:1px solid #ffffff30;border-radius:6px;padding:8px}#sound{font-size:10px}#overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:7vw;background:linear-gradient(90deg,#091b25ed,#14242c83 55%,transparent)}.eyebrow{font-size:15px;letter-spacing:4px}.eyebrow span{display:block;font-size:10px;letter-spacing:2px;color:#aaa;margin:5px 0 14px}.episode{color:#ffc56e;font-size:11px;letter-spacing:3px;margin-top:30px}h1{font-size:clamp(52px,10vw,140px);font-weight:1000;letter-spacing:-.06em;margin:0;line-height:.95;color:#fff1d6;text-shadow:4px 5px 0 #9e3f29}h2{font-size:clamp(15px,2vw,26px);letter-spacing:.4em;margin:15px 0}.intro{font-size:16px;line-height:1.6;color:#e4d8c8}#start{background:#efb65b;color:#15242c;border:0;padding:17px 30px;font-weight:900;letter-spacing:1px;border-radius:3px;margin-top:12px}.keys{font-size:12px;line-height:1.8;color:#bdc7c9}.slice{font-size:10px;letter-spacing:3px;color:#b5b4a9}#caption{position:absolute;bottom:43%;left:15%;right:15%;text-align:center;font-size:clamp(15px,2vw,24px);font-weight:bold;pointer-events:none;text-shadow:0 2px 8px #000;background:#12222a90;border-radius:4px;padding:10px;opacity:0;transition:opacity .2s}#boss{display:none;position:absolute;top:75px;left:30%;right:30%;font-size:11px;letter-spacing:3px;text-align:center}#boss i{display:block;height:7px;margin:8px 0;background:#ec6840;box-shadow:0 0 0 2px #ffffff30;transform-origin:left}#touch{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:24px;right:24px;display:none;justify-content:space-between;align-items:end;pointer-events:none}#stick{width:115px;height:115px;border-radius:50%;background:#ffffff0b;border:1px solid #ffffff40;pointer-events:auto;position:relative}#stick i{position:absolute;width:48px;height:48px;left:33px;top:33px;border-radius:50%;background:#ffffff30;border:1px solid #fff6}.actions{display:grid;grid-template-columns:60px 72px 82px;gap:10px;align-items:end}.actions button{pointer-events:auto;width:64px;height:64px;border-radius:50%;background:#14283270;border:1px solid #fff6;font-size:10px;font-weight:bold}.actions .fire{height:82px;width:82px;background:#e9ad4740;border-color:#edbb69}.actions .use{height:40px;width:60px;grid-column:3}.actions button.active{background:#efb65bd9;color:#142832}#hint{display:none;position:absolute;bottom:6px;width:100%;text-align:center;font-size:11px;color:#d4c8ae}@media(pointer:coarse){#touch{display:flex}.keys{display:none}}@media(max-width:600px) and (orientation:portrait){#hint{display:block}#overlay{padding:8vw}#stats{font-size:11px}.brand{font-size:16px}#hud{gap:7px;left:12px;right:12px}#sound{display:none}#boss{left:20%;right:20%}#caption{bottom:30%;left:8%;right:8%}#stick{width:95px;height:95px}#stick i{left:23px;top:23px}.actions{gap:5px;grid-template-columns:50px 58px 65px}.actions button{width:52px;height:52px}.actions .fire{width:65px;height:65px}#touch{left:12px;right:12px}}

.environment-layer{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;background-position:45% center;opacity:0;pointer-events:none}#game{position:relative;z-index:1}#hud,#overlay,#boss,#caption,#touch,#hint{z-index:2}

@media(max-aspect-ratio:1/1){.environment-layer{background-size:auto 72%;background-color:#d4d3c8}#hud{display:grid;grid-template-columns:1fr auto auto;gap:5px}#stats{grid-row:2;grid-column:1/-1;font-size:11px;padding-top:4px}.brand small{font-size:9px}#caption{font-size:14px}}

/* Touch controls: action buttons on the left, movement on the right. */
#touch{flex-direction:row-reverse}
.actions{grid-template-columns:82px 72px 64px}
.actions .fire{grid-column:1;grid-row:1}
.actions [data-key="jump"]{grid-column:2;grid-row:1}
.actions [data-key="dash"]{grid-column:3;grid-row:1}
.actions .use{grid-column:1;grid-row:2}
@media(max-width:600px) and (orientation:portrait){.actions{grid-template-columns:65px 58px 52px}}

.environment-layer{transition:opacity .9s ease}#journey{position:absolute;z-index:2;top:74px;left:22px;display:flex;gap:5px;pointer-events:none}#journey span{font-size:9px;letter-spacing:1px;padding:6px 8px;border-top:2px solid #ffffff30;color:#ffffff85;text-shadow:0 1px 3px #000;background:#17242b40}#journey .current{border-color:#f0bb65;color:#ffe5bb}#journey .complete{border-color:#e2c698;color:#d3c4ab}.brand small{letter-spacing:1.5px}#boss{top:118px}@media(max-width:600px) and (orientation:portrait){#journey{left:12px;right:12px;top:84px;gap:3px}#journey span{font-size:8px;padding:5px;flex:1;text-align:center;letter-spacing:.3px}}

/* Cinematic arcade interface — Demo 07 */
#hud{gap:10px;align-items:center;padding:10px 12px;background:linear-gradient(110deg,#10232de8,#12252abb);border:1px solid #e6c89433;border-radius:10px;box-shadow:0 8px 30px #07162035;backdrop-filter:blur(10px);top:max(12px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right))}
.brand{font-size:18px;letter-spacing:-.8px;min-width:116px}.brand small{font-size:9px;letter-spacing:1.5px;margin-top:5px}
#stats{display:flex;align-items:center;gap:22px;min-width:0;flex:1;text-shadow:none}#stats>div{min-width:0}.stat-label{font-size:9px;font-weight:700;letter-spacing:1.5px;color:#a7b6b7;display:block;margin-bottom:5px}#stats b{font-size:16px;color:#f5e3bc;line-height:1;letter-spacing:.5px;display:block}#stats .stat-label b{display:inline;float:right;font-size:11px;color:#ead8ad}.health-stat{width:120px}.health-track{height:5px;background:#ffffff1c;border-radius:4px;overflow:hidden}.health-track i{display:block;height:100%;width:100%;background:#e9be76;transform-origin:left;transition:transform .2s}.weapon-stat{position:relative}.weapon-stat b{font-size:12px!important}.weapon-stat i{position:absolute;right:-20px;top:15px;font-style:normal;font-size:10px;color:#e6b655}#combo-value{color:#f2c66f;font-size:12px;font-weight:bold;letter-spacing:1px}#hud button{height:38px;min-width:38px;border:1px solid #ffffff22;border-radius:7px;background:#ffffff09;font-size:15px;text-shadow:none}#hud #sound{font-size:9px}#journey{top:90px;left:18px;gap:6px}#journey span{background:#15252ac4;border-radius:0 0 4px 4px;font-size:9px;letter-spacing:1px;padding:6px 10px}#boss{top:128px;left:28%;right:28%;padding:9px 14px;border-radius:8px;background:#14262be6;border:1px solid #c47b4a66}#boss i{height:5px;background:linear-gradient(90deg,#a43a26,#f0ac5b);border-radius:3px}#caption{background:#142830e8;border:1px solid #dabb7e3d;box-shadow:0 6px 24px #0002;font-size:15px;line-height:1.4;font-weight:500;left:22%;right:22%;padding:12px 18px;border-radius:8px}
#overlay{background:linear-gradient(90deg,#091b25f5,#10232dc9 45%,#14242c10 85%);padding:6vw}#overlay h1{font-size:clamp(48px,9vw,120px);text-shadow:3px 4px 0 #8f4430;letter-spacing:-.055em}#overlay h2{font-size:clamp(12px,1.4vw,20px);letter-spacing:.35em;color:#e4c38a}#overlay .intro{font-size:15px;line-height:1.65;max-width:340px}#start,#resume{background:linear-gradient(135deg,#f3cf8b,#d8a451);color:#10232b;border:1px solid #ffe4b177;border-radius:6px;font-weight:800;font-size:13px;letter-spacing:1.4px;padding:18px 28px;box-shadow:0 8px 24px #0003}#start:active,#resume:active{transform:translateY(2px)}#overlay .episode{letter-spacing:2px;font-size:10px}#overlay .eyebrow{font-size:12px;letter-spacing:3px}#overlay .keys{font-size:11px;color:#9fafb2}#overlay .slice{letter-spacing:2px;font-size:9px;margin-top:12px}#touch{bottom:max(24px,env(safe-area-inset-bottom));opacity:.82}#stick{border-color:#f9e2b84a;background:radial-gradient(circle,#213b4345,#10252e55);box-shadow:inset 0 0 20px #03192440}#stick i{background:linear-gradient(135deg,#f1dfbb65,#d3bb8650);border-color:#efddb899;box-shadow:0 4px 15px #0003}.actions button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#142c37b0;border:1px solid #d9c6a15c;box-shadow:0 5px 16px #0002;transition:background .1s,transform .1s;backdrop-filter:blur(6px)}.actions button svg{width:23px;height:23px;fill:none;stroke:#ecd9b7;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.actions button span{font-size:8px;letter-spacing:.6px}.actions .fire{background:radial-gradient(circle,#bf8a4660,#422e2180);border:1.5px solid #e0ba76aa}.actions .fire svg{width:29px;height:29px}.actions .use{border-radius:18px;height:38px;flex-direction:row;gap:5px}.actions .use svg{width:17px;height:17px}.actions button.active{background:#e5b966;transform:scale(.95);box-shadow:0 0 24px #e5b96640}.actions button.active svg{stroke:#18313a}#context-action{position:absolute;z-index:3;bottom:22%;left:20%;right:20%;text-align:center;color:#ffe0a0;font-size:11px;letter-spacing:1px;font-weight:bold;text-shadow:0 2px 6px #000;pointer-events:none}#damage-flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(ellipse,transparent 45%,#b6423566 100%)}#combat-feedback{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}#combat-feedback span{position:absolute;font-size:16px;font-weight:900;text-shadow:0 2px 3px #17262b;transform:translate(-50%,-50%)}#pause-screen{position:absolute;inset:0;z-index:10;display:grid;place-items:center;background:#091b25b8;backdrop-filter:blur(7px)}#pause-screen[hidden]{display:none}.pause-card{padding:36px;text-align:center;border:1px solid #d9b57655;background:#132932e8;border-radius:12px;box-shadow:0 20px 70px #0005}.pause-card h3{font-size:36px;letter-spacing:-1px;color:#ffe5b3;margin:15px 0}.pause-card p{font-size:15px;color:#c4cdca}.pause-card .pause-controls{font-size:11px;line-height:1.8;color:#96a9ab;margin-top:22px}body[data-state="title"] #touch,body[data-state="title"] #hud,body[data-state="title"] #journey,body[data-state="title"] #hint,body[data-state="dead"] #touch,body[data-state="won"] #touch{visibility:hidden}body[data-state="dead"] #overlay h1{font-size:clamp(38px,7vw,90px)}body[data-state="paused"] #touch{opacity:.15}
@media(max-width:600px) and (orientation:portrait){#hud{display:grid;grid-template-columns:1fr 38px 38px;gap:6px;padding:10px;left:12px;right:12px}.brand{font-size:18px}#stats{grid-column:1/-1;grid-row:2;gap:12px;width:100%;padding-top:4px;justify-content:space-between}#stats b{font-size:14px}.stat-label{font-size:8px;letter-spacing:1px}.health-stat{width:85px}.weapon-stat b{font-size:10px!important}#combo-value{position:absolute;left:12px;right:auto;top:101px;font-size:10px;pointer-events:none}#journey{top:118px;left:12px;right:12px;gap:4px}#journey span{font-size:8px;padding:6px 3px}#boss{top:155px;left:15%;right:15%}#caption{left:10%;right:10%;bottom:29%;font-size:13px;padding:10px 13px}#context-action{bottom:23%;left:10%;right:10%;font-size:10px}#overlay{padding:8vw}#overlay h1{font-size:15vw}#overlay h2{font-size:10px;letter-spacing:3px}#overlay .intro{font-size:14px}#overlay .episode{font-size:9px;letter-spacing:1.4px}.actions button svg{width:20px;height:20px}.actions .fire svg{width:26px;height:26px}.actions button span{font-size:7px}.pause-card{margin:20px;padding:26px}}
@media(orientation:landscape) and (max-height:480px){#hud{top:9px;padding:7px 10px}.brand{font-size:15px;min-width:95px}#stats{gap:16px}.health-stat{width:88px}#journey{top:76px}#boss{top:111px}.eyebrow span{margin:4px 0 6px}.episode{margin-top:12px}#overlay{padding:3vw 6vw}#overlay h1{font-size:17vh}#overlay h2{margin:8px 0;font-size:10px}#overlay .intro{font-size:12px;line-height:1.4;margin:8px 0}#start{padding:12px 23px;margin-top:5px}#overlay .keys{margin:7px 0;font-size:9px}.actions button{width:54px;height:54px}.actions .fire{width:68px;height:68px}.actions{grid-template-columns:68px 58px 54px;gap:7px}#stick{width:98px;height:98px}#stick i{left:24px;top:24px}#touch{bottom:16px}#caption{bottom:33%;font-size:12px;padding:8px 12px}#context-action{bottom:19%;font-size:10px}}

#timpa.episode-button{margin-top:10px;padding:12px 24px;background:rgba(24,38,36,.65);border:1px solid rgba(235,201,142,.6);color:#f1dcaf;font-size:12px;letter-spacing:.14em;box-shadow:none}.story-note{display:inline-block;margin:14px 0 8px;color:#f8dba6;font-size:clamp(16px,2.4vw,24px);line-height:1.45}@media(max-height:500px){#timpa.episode-button{margin-top:5px;padding:8px 20px}.story-note{margin:6px 0}}
/* Mobile touch layout: safe areas and independent multi-touch zones. */
@media(pointer:coarse){
 #touch{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));opacity:1}
 .actions{grid-template-columns:76px 68px 60px;gap:12px;align-items:center}
 .actions .fire{width:76px;height:76px}.actions [data-key="jump"]{width:68px;height:68px}.actions [data-key="dash"]{width:60px;height:60px}.actions .use{width:68px;height:44px}
 .actions button{opacity:.55;backdrop-filter:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.actions button.active{opacity:1}
 #stick{width:112px;height:112px;opacity:.6;touch-action:none}#stick.active{opacity:1}#stick i{left:31px;top:31px;width:48px;height:48px;pointer-events:none}
 #hud{backdrop-filter:none}#caption{pointer-events:none}
}
#auto-fire.setting{display:block;margin:18px auto 0;padding:13px 18px;border:1px solid #e6c58b66;background:#213b42;color:#efd8ae;border-radius:6px;font-size:12px;min-height:44px}
@media(pointer:coarse) and (orientation:landscape){
 #journey{top:69px}#journey span{padding:4px 8px;font-size:8px}#hud{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));padding:6px 9px}#boss{top:96px}
 #caption{bottom:auto;top:94px;left:25%;right:25%;font-size:11px;padding:7px 10px}#context-action{bottom:12%;left:33%;right:27%}
 .keys{display:none}#overlay{overflow-y:auto;justify-content:safe center}
}
@media(pointer:coarse) and (orientation:portrait){
 .actions{grid-template-columns:66px 58px 50px;gap:7px}.actions .fire{width:66px;height:66px}.actions [data-key="jump"]{width:58px;height:58px}.actions [data-key="dash"]{width:50px;height:50px}.actions .use{width:60px;height:44px}
 #stick{width:98px;height:98px}#stick i{left:24px;top:24px}#touch{left:12px;right:12px}#hint{font-size:10px;bottom:2px}
}

#stick .stick-up,#stick .stick-down{position:absolute;left:0;right:0;text-align:center;font-size:7px;letter-spacing:1px;color:#eedbbb99;pointer-events:none}#stick .stick-up{top:8px}#stick .stick-down{bottom:8px}
/* Dedicated phone landscape composition. */
@media(orientation:landscape) and (pointer:coarse), (orientation:landscape) and (max-height:540px){
 html,body{height:100dvh}#game{height:100dvh}
 #hud{top:max(6px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));height:47px;padding:5px 9px;gap:7px;border-radius:7px}
 .brand{font-size:14px;min-width:86px}.brand small{font-size:8px;margin-top:3px}#stats{gap:12px}#stats b{font-size:13px}.stat-label{font-size:7px;letter-spacing:.7px;margin-bottom:3px}.health-stat{width:78px}.weapon-stat b{font-size:10px!important}.weapon-stat i{font-size:8px;top:12px;right:-16px}#hud button{height:32px;min-width:32px;padding:5px}#hud #sound{font-size:8px}
 #journey{top:57px;left:max(14px,env(safe-area-inset-left));right:auto;gap:4px}#journey span{padding:3px 7px;font-size:7px;letter-spacing:.5px}
 #boss{top:57px;left:37%;right:24%;padding:5px 10px;font-size:9px}#boss i{margin:5px 0 0;height:4px}
 #caption{top:87px;bottom:auto;left:26%;right:22%;padding:6px 9px;font-size:11px;max-height:60px;overflow:hidden}
 #context-action{bottom:max(10px,env(safe-area-inset-bottom));left:27%;right:22%;font-size:9px;letter-spacing:.6px}
 #touch{left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));align-items:end}
 .actions{grid-template-columns:76px 58px;grid-template-rows:54px 76px;gap:8px;align-items:center;justify-items:center}
 .actions .fire{grid-column:1;grid-row:2;width:76px;height:76px}.actions [data-key="jump"]{grid-column:2;grid-row:1;width:58px;height:58px}.actions [data-key="dash"]{grid-column:2;grid-row:2;width:56px;height:56px}.actions .use{grid-column:1;grid-row:1;width:70px;height:44px}
 #stick{width:108px;height:108px}#stick i{left:29px;top:29px;width:48px;height:48px}.actions button span{font-size:7px}.actions button svg{width:21px;height:21px}
 #hint{display:none}
 #overlay:not([style*="display: none"]){display:grid!important;grid-template-columns:1.1fr .9fr;grid-template-rows:repeat(6,min-content);column-gap:6vw;row-gap:5px;align-content:center;align-items:center;padding:max(14px,env(safe-area-inset-top)) max(32px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(32px,env(safe-area-inset-left));overflow-y:auto}
 #overlay .eyebrow{grid-column:1;grid-row:1;font-size:10px;letter-spacing:2px}#overlay .eyebrow span{display:inline;font-size:8px;margin:0 6px;letter-spacing:.5px}
 #overlay .episode{grid-column:1;grid-row:2;font-size:8px;margin:4px 0;letter-spacing:1px}
 #overlay h1{grid-column:1;grid-row:3;font-size:clamp(40px,8.8vw,90px);line-height:.95;overflow-wrap:anywhere}
 #overlay h2{grid-column:1;grid-row:4;font-size:10px;letter-spacing:2px;margin:6px 0}
 #overlay .intro{grid-column:2;grid-row:1/span 3;font-size:12px;line-height:1.5;max-width:340px;margin:0}
 #overlay #start{grid-column:2;grid-row:4;margin:4px 0 0;width:100%;min-height:46px;padding:12px;font-size:12px}
 #overlay #timpa{grid-column:2;grid-row:5;margin:4px 0 0;width:100%;min-height:44px;padding:10px;font-size:10px}
 #overlay .keys{display:none}#overlay .slice{grid-column:1;grid-row:6;font-size:7px;margin:4px 0;letter-spacing:.8px}
 .story-note{font-size:15px;margin:6px 0;line-height:1.35}
 .pause-card{max-height:calc(100dvh - 24px);overflow-y:auto;padding:16px 28px}.pause-card h3{font-size:26px;margin:6px 0}.pause-card p{font-size:12px;margin:6px 0}.pause-card .pause-controls{margin-top:10px}#auto-fire.setting{margin-top:9px}#resume{padding:12px 22px}
}
@media(orientation:landscape) and (max-height:350px){#overlay h1{font-size:clamp(36px,7.8vw,70px)}#overlay .intro{font-size:11px}#overlay:not([style*="display: none"]){row-gap:2px}.actions{grid-template-rows:44px 68px}.actions .fire{width:68px;height:68px}#caption{top:81px;font-size:10px}}

/* Controls stay legible over bright stone, foliage and water. */
@media(pointer:coarse){
 #touch{z-index:6;opacity:1}
 .actions button,.actions .fire{opacity:1;background:#132a36eb;border:2px solid #f5ddb1;box-shadow:0 3px 12px #0008;text-shadow:0 1px 2px #000;touch-action:none}
 .actions .fire{background:#735025f2;border-color:#ffd58b}
 .actions button span{font-size:10px;font-weight:800;color:#fff1d6;letter-spacing:.5px}
 .actions button svg{stroke:#fff1d6;stroke-width:2.2;pointer-events:none}.actions button span{pointer-events:none}
 .actions button.active{background:#f4c978;color:#122a35;box-shadow:0 0 0 3px #ffe4b366}.actions button.active span{color:#122a35;text-shadow:none}
 #stick{opacity:1;background:#102936df;border:2px solid #f5ddb1;box-shadow:0 3px 16px #0008;touch-action:none}
 #stick i{background:#f1d5a0;border:2px solid #fff5df;box-shadow:0 3px 8px #0007}
 #stick .stick-up,#stick .stick-down{color:#fff3db;font-size:8px;font-weight:800;letter-spacing:.4px;line-height:10px;text-shadow:0 1px 2px #000}
 #stick .stick-up{top:4px}#stick .stick-down{bottom:4px}#stick span b{display:block;font-size:17px;line-height:15px}
 #stick .stick-left,#stick .stick-right{position:absolute;top:50%;transform:translateY(-50%);color:#fff3db;font-size:28px;line-height:1;pointer-events:none}#stick .stick-left{left:7px}#stick .stick-right{right:7px}
 #stick.up .stick-up,#stick.down .stick-down{color:#ffbf55}
}
@media(orientation:landscape) and (pointer:coarse){
 #touch{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom))}
 .actions{grid-template-columns:82px 62px;grid-template-rows:50px 82px;gap:8px}
 .actions .fire{width:82px;height:82px}.actions [data-key="jump"],.actions [data-key="dash"]{width:60px;height:60px}.actions .use{width:76px;height:44px}
 #stick{width:124px;height:124px}#stick i{width:44px;height:44px;left:38px;top:38px}
 #hud{height:43px}.brand{min-width:80px}#stats{gap:10px}#journey{top:53px}#journey span:not(.current){display:none}
 #caption{top:77px}#context-action{background:#122934d9;padding:5px 8px;border-radius:5px;left:32%;right:23%}
 #context-action:empty{display:none}
}
@media(pointer:fine){#stick .stick-left,#stick .stick-right{display:none}}

#night-shade{position:absolute;inset:0;z-index:2;background:#08111f;opacity:0;pointer-events:none;transition:opacity .25s}
#night.episode-button{margin-top:8px;padding:12px 24px;background:#142639e8;border:1px solid #8fadc477;border-radius:5px;color:#e0d0a5;font-size:11px;letter-spacing:.08em;min-height:44px}
@media(orientation:landscape) and (pointer:coarse),(orientation:landscape) and (max-height:540px){#overlay #night{grid-column:2;grid-row:6;width:100%;padding:10px;margin:4px 0 0;min-height:44px;font-size:10px}#overlay .slice{grid-row:6;max-width:280px;line-height:1.5}}

body[data-episode=night] .environment-layer{background-color:#102030}

#hud,#journey,#boss,#caption{z-index:3}#overlay{z-index:5}

/* Final polish: keep the result screen cinematic and prevent episode shortcuts from
   crowding the victory/defeat card on narrow phones. */
body[data-state="won"] #overlay,body[data-state="dead"] #overlay{background:linear-gradient(90deg,#081923f7,#10262fd9 62%,#14242c66);padding-left:clamp(24px,8vw,130px);padding-right:clamp(24px,8vw,130px)}
body[data-state="won"] #overlay .episode-button,body[data-state="dead"] #overlay .episode-button{display:none}
body[data-state="won"] #overlay #home-from-result,body[data-state="dead"] #overlay #home-from-result{display:block;margin-top:8px;background:#162e39;color:#f6dba9;border:1px solid #d7b77a;border-radius:6px;min-height:44px;padding:12px 20px;font-weight:800;letter-spacing:.08em}
body[data-state="won"] #overlay #run-summary,body[data-state="dead"] #overlay #run-summary{display:block;margin:8px 0 2px;color:#f0cf8e;font-size:12px;letter-spacing:.04em}
.orientation-tip{display:none;color:#e3c58d;font-size:11px;letter-spacing:.04em;margin:12px 0 0;opacity:.85}
.orientation-tip span{display:inline-grid;place-items:center;width:20px;height:20px;margin-right:5px;border:1px solid #e3c58d88;border-radius:50%;font-size:15px;vertical-align:middle}
.slice::after{content:'  ·  ↻ RUOTA IL TELEFONO PER UNA VISUALE PIÙ AMPIA';display:block;color:#e3c58d;font-size:10px;letter-spacing:.08em;margin-top:8px;opacity:.85}
@media (orientation:portrait) and (max-width:760px){.orientation-tip{display:block}}
@media (orientation:landscape) and (max-height:540px){body[data-state="won"] #overlay,body[data-state="dead"] #overlay{padding-left:clamp(22px,6vw,90px);padding-right:clamp(22px,6vw,90px)}}

#boss-status{display:block;margin-top:5px;font-size:10px;letter-spacing:.5px;color:#a6d4ff}#boss[data-mode=recover]{border-color:#a7ed93;background:#183323ee}#boss[data-mode=recover] #boss-status{color:#c4ffac}#boss[data-mode=rush] #boss-status{color:#ffd083}#boss-status:empty{display:none}#victory-flash{position:absolute;inset:0;z-index:4;pointer-events:none;background:#fff2c3;opacity:0}body[data-state=cinematic] #touch{visibility:hidden}

#fortino.episode-button{margin-top:8px;padding:11px 24px;background:#483425e8;border:1px solid #d2a56a99;border-radius:5px;color:#ffe0ae;font-size:12px;letter-spacing:.08em;min-height:44px}body[data-episode=fortino] .environment-layer{background-color:#704c3a}#boss[data-mode=slam] #boss-status,#boss[data-mode=tell] #boss-status{color:#ffd083}
@media(max-height:500px){#fortino.episode-button,#night.episode-button{padding:7px 20px;margin-top:5px;min-height:34px}#overlay .slice{margin-top:8px}}

@media(orientation:landscape) and (pointer:coarse),(orientation:landscape) and (max-height:540px){#overlay #fortino{grid-column:2;grid-row:7;width:100%;padding:10px;margin:4px 0 0;min-height:44px;font-size:10px}#overlay .slice{grid-row:7}}

#zialisa.episode-button{margin-top:8px;padding:11px 24px;background:#233742e8;border:1px solid #9da8ac99;border-radius:5px;color:#e1dbcd;font-size:12px;letter-spacing:.08em;min-height:44px}body[data-episode=zialisa] .environment-layer{background-color:#243544}#boss[data-mode=barrage] #boss-status{color:#ffd083}
@media(orientation:landscape) and (pointer:coarse),(orientation:landscape) and (max-height:540px){#overlay #zialisa{grid-column:2;grid-row:8;width:100%;padding:10px;margin:4px 0 0;min-height:44px;font-size:10px}#overlay .slice{grid-row:8}#overlay:not([style*="display: none"]){grid-template-rows:repeat(8,min-content)}}

#overlay{align-content:safe center}

#playa.episode-button{margin-top:8px;padding:11px 24px;background:#1c5055e8;border:1px solid #b0d7c599;border-radius:5px;color:#e2efe0;font-size:12px;letter-spacing:.08em;min-height:44px}body[data-episode=playa] .environment-layer{background-color:#57939c}
@media(orientation:landscape) and (pointer:coarse),(orientation:landscape) and (max-height:540px){#overlay #playa{grid-column:2;grid-row:9;width:100%;padding:9px;margin:4px 0 0;min-height:40px;font-size:10px}#overlay .slice{grid-row:9}#overlay:not([style*="display: none"]){grid-template-rows:repeat(9,min-content)}}

#fontanarossa.episode-button{min-height:44px;padding:10px 16px;font-size:12px;background:rgba(28,43,47,.85);color:#edd59c;border:1px solid #9e8658}
@media(orientation:landscape) and (pointer:coarse),(max-height:540px){#overlay #fontanarossa{grid-column:2;grid-row:10;width:100%;margin:0;min-height:40px}#overlay:not([style*="display: none"]){grid-template-rows:repeat(10,min-content)}}

#loading-screen{position:fixed;inset:0;z-index:100;background:#15232a;display:grid;place-items:center;text-align:center;padding:24px;color:#f4d190}#loading-screen[hidden]{display:none}#loading-screen h2{font-size:clamp(32px,8vw,70px);margin:12px}#loading-screen p{color:#e7e1d4}#loading-screen progress{display:block;width:min(320px,70vw);height:8px;margin:24px auto;accent-color:#e7b65a}

#campaign-ending{position:fixed;inset:0;z-index:15;pointer-events:none;color:#f3ead9;font-family:inherit;text-shadow:0 2px 10px #0009;box-shadow:inset 0 5vh #080e12,inset 0 -5vh #080e12;background:linear-gradient(0deg,#070e1280,transparent 26%);transition:background .45s}#campaign-ending[hidden]{display:none}#campaign-ending[data-stage="2"]{background:#080e12}#campaign-ending[data-stage="6"]{background:#080e12e8}.ending-chapter{position:absolute;left:8vw;bottom:15vh}.ending-chapter small,.ending-location small,.ending-dialogue small,.ending-credits small{display:block;font-size:clamp(9px,1vw,12px);letter-spacing:.18em;color:#d6b677}.ending-chapter strong{display:block;font-size:clamp(24px,3.4vw,44px);font-weight:600;margin-top:10px}.ending-location{position:absolute;top:11vh;left:7vw}.ending-location strong{display:block;font-size:clamp(11px,1.4vw,16px);letter-spacing:.12em;font-weight:500;margin-top:8px}.ending-dialogue{position:absolute;bottom:10vh;left:10vw;right:10vw;text-align:center}.ending-dialogue p{font-size:clamp(16px,2.4vw,25px);margin:7px 0;color:#fff9ee}.ending-credits{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.ending-credits strong{font-size:clamp(30px,6vw,68px);letter-spacing:.18em;margin-top:14px}.ending-credits p{font-size:clamp(11px,1.6vw,18px);letter-spacing:.3em;margin:7px 0 20px}.ending-credits span{font-size:11px;letter-spacing:.16em;color:#d6b677}.ending-credits button{pointer-events:auto;margin-top:25px;min-height:48px;padding:12px 24px;border:1px solid #d6b67788;border-radius:5px;color:#f3ead9;background:#172125;font-family:inherit;font-size:11px;letter-spacing:.14em;touch-action:manipulation}.ending-chapter,.ending-location,.ending-dialogue,.ending-credits{animation:ending-reveal .55s ease both}@keyframes ending-reveal{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}body[data-state=cinematic] #hud,body[data-state=cinematic] #journey,body[data-state=cinematic] #caption,body[data-state=cinematic] #hint{visibility:hidden}@media(prefers-reduced-motion:reduce){.ending-chapter,.ending-location,.ending-dialogue,.ending-credits{animation:none}}

#run-summary{color:#f1c775;font-size:clamp(12px,1.5vw,16px);margin:8px 0 14px;font-variant-numeric:tabular-nums}#run-summary[hidden]{display:none}

/* Light moving sheen is confined to the Amenano water, behind gameplay. */
.environment-layer.amenano-water::after{content:'';position:absolute;left:var(--water-left);top:var(--water-top);width:var(--water-width);height:var(--water-height);pointer-events:none;background:repeating-linear-gradient(174deg,transparent 0 7px,#fff8df 9px,transparent 12px 24px);opacity:.16;mask-image:linear-gradient(90deg,transparent,#000 10% 90%,transparent);animation:amenano-flow 1.4s linear infinite}
@keyframes amenano-flow{to{background-position:0 48px}}
@media(prefers-reduced-motion:reduce){.environment-layer.amenano-water::after{animation:none}}
