*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#143e48;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif;color:#123843}body{touch-action:none;-webkit-user-select:none;user-select:none}button{font:inherit;cursor:pointer;touch-action:manipulation;border:0}button:focus-visible{outline:3px solid #ffba39;outline-offset:5px}button:hover{filter:brightness(1.06)}button:active{transform:translateY(2px)}[hidden]{display:none!important}#game{position:relative;width:100%;height:100%;overflow:hidden}canvas{display:block;width:100%;height:100%}.screen{position:absolute;inset:0;padding:max(30px,env(safe-area-inset-top)) max(5vw,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(5vw,env(safe-area-inset-left))}#menu{pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(90deg,rgba(243,250,235,.55),transparent 65%)}#menu button,.menu-links{pointer-events:auto}.eyebrow{font-size:10px;font-weight:900;letter-spacing:2px;display:block}.brand{margin-top:2vh;max-width:500px}.brand>.eyebrow{color:#39656b}h1{font-family:'Arial Rounded MT Bold','Trebuchet MS',sans-serif;font-size:clamp(65px,10vw,138px);font-weight:1000;letter-spacing:-7px;line-height:.84;margin:24px 0 20px;transform:rotate(-4deg);text-shadow:0 4px 0 #fff5d2,0 8px 0 #17434a16}h1>span{display:block}h1>span:first-child{color:#123e49}h1>span:nth-child(2){color:#ec6752}.title-dot{color:#efb23d}.brand p{font-size:clamp(14px,1.5vw,19px);font-weight:700;letter-spacing:.2px}.menu-bottom{max-width:360px;display:flex;flex-direction:column;gap:17px}.record{display:grid;grid-template-columns:1fr auto;align-items:end;gap:5px}.record .eyebrow{grid-column:1}.record b{font-size:34px;grid-column:2;grid-row:1/3;line-height:1}.record>#beltLabel{font-size:11px;font-weight:900;letter-spacing:1.5px}.primary{width:100%;padding:19px 23px;border-radius:15px;background:#ed6852;color:#fff9e9;font-size:15px;font-weight:1000;letter-spacing:1.2px;box-shadow:0 6px 0 #ae493e,0 12px 25px #12384321;display:flex;justify-content:space-between;align-items:center}.primary span{font-size:24px;line-height:15px}.menu-links{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700}.menu-links button,.text-button{background:none;color:#254d54;padding:10px 0}.edition{position:absolute;right:30px;bottom:30px;font-size:10px;letter-spacing:3px;font-weight:800;writing-mode:vertical-rl}#hud{position:absolute;inset:0;pointer-events:none;padding:max(20px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 0 max(24px,env(safe-area-inset-left));text-shadow:0 1px 0 #ffffff85}.hud-left{display:flex;flex-direction:column;gap:3px}#score{font-size:34px;font-weight:1000;letter-spacing:-1px}#score small{font-size:10px;letter-spacing:2px}#distance{font-size:12px;font-weight:800}.hud-right{position:absolute;right:max(24px,env(safe-area-inset-right));top:max(20px,env(safe-area-inset-top));display:flex;gap:18px;align-items:center}#hearts{color:#e65d54;letter-spacing:3px;font-size:24px}.round{pointer-events:auto;width:42px;height:42px;background:#fff7e0cf;color:#17424b;border-radius:50%;font-size:20px;box-shadow:0 3px 0 #12384315}#effects{display:flex;gap:7px;position:absolute;top:110px;left:24px;flex-wrap:wrap;max-width:80%}.effect{background:#fff8e9e8;padding:8px 10px;border-radius:20px;font-size:11px;font-weight:900}#hint{position:absolute;bottom:50px;left:50%;transform:translateX(-50%);background:#123843db;color:#fff6dc;padding:13px 21px;border-radius:30px;font-size:11px;font-weight:900;letter-spacing:1px;white-space:nowrap}.shade{background:#10343f79;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(7px);overflow:auto}.panel{width:min(500px,100%);max-height:100%;overflow:auto;background:#fff9e9;padding:34px;border-radius:24px;box-shadow:0 20px 80px #0e354944;text-align:center}.panel h2{font-size:35px;letter-spacing:-1px;margin:10px 0 20px}.panel p{font-size:14px;line-height:1.65}.panel .eyebrow{color:#668184;font-size:9px;line-height:1.6}.panel .primary{margin-top:22px}.panel .text-button{margin-top:14px;width:100%;font-size:12px}.instructions{text-align:left;display:grid;gap:12px}.instructions div{font-size:13px;line-height:1.5;border-bottom:1px solid #dce3d5;padding-bottom:10px}.instructions b{display:block;color:#d35c48}.big-score{font-size:75px;font-weight:1000;letter-spacing:-5px;color:#e36a50;line-height:1.1}.result-grid{display:flex;justify-content:space-around;padding:20px 0;border-top:1px solid #dce3d5;border-bottom:1px solid #dce3d5}.result-grid b{display:block;margin-top:8px}.subtle{color:#72817a;font-size:12px!important}#earned{background:#f9d87b;border-radius:12px;padding:13px;margin:16px 0;font-weight:900}#toast{position:absolute;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);background:#123e49ed;color:#fff8e7;padding:13px 23px;border-radius:30px;transition:transform .2s;font-size:13px;pointer-events:none;white-space:nowrap}#toast.show{transform:translateX(-50%) translateY(0)}#install{position:absolute;right:25px;top:25px;background:#fff8e9d9;color:#123843;padding:12px 15px;border-radius:30px;font-size:12px;font-weight:800}.story-art{font-size:40px;padding:13px;background:#e8f0d7;border-radius:16px}.story-count{font-size:10px;letter-spacing:2px;color:#73847c}.keyboard{font-size:11px!important;color:#6c807b}@media(max-width:600px){.screen{padding:25px 24px}.brand{margin-top:3vh}h1{font-size:83px;letter-spacing:-5px}.brand p{font-size:13px}.menu-bottom{max-width:none;width:100%;gap:12px}.edition{display:none}.panel{padding:25px 22px}.panel h2{font-size:29px}#hearts{font-size:20px}.hud-right{gap:9px}.eyebrow{font-size:8px;letter-spacing:1.5px}#hint{font-size:9px;bottom:35px;padding:12px 16px}.brand>.eyebrow{font-size:9px}#install{right:15px;top:12px;font-size:10px;padding:8px 10px}}@media(max-height:560px) and (min-width:600px){.screen{padding:22px 5vw}.brand{margin-top:0}h1{font-size:82px;margin:15px 0 12px}.brand p{font-size:13px}.menu-bottom{gap:7px;max-width:310px}.record b{font-size:25px}.primary{padding:14px 20px}.panel{padding:22px;max-width:500px}.panel h2{font-size:26px;margin:5px 0 8px}.panel p{font-size:12px}.big-score{font-size:52px}.result-grid{padding:12px 0}.panel .primary{margin-top:12px}.instructions{gap:6px}.instructions div{font-size:11px;padding-bottom:5px}}

/* Prevent focused menu controls from scrolling the game coordinate system. */
#game{overflow:clip}.shade,.panel{touch-action:pan-y;overscroll-behavior:contain}html,body{overscroll-behavior:none}
.defence-toggle{position:absolute;right:24px;top:24px;background:#fff7e2d9;color:#254d54;border-radius:20px;padding:10px 14px;font-size:11px;font-weight:800}#install:not([hidden])~.defence-toggle{top:65px}@media(max-width:600px){.defence-toggle{top:12px;right:12px;font-size:10px;padding:8px 11px}}
#game:has(#install:not([hidden])) .defence-toggle{top:65px}
.panel.story-panel{width:min(680px,100%);text-align:left;padding:25px}.story-panel>.eyebrow,.story-panel>.story-count{text-align:center}.story-image{width:100%;aspect-ratio:4/3;background-size:200% 400%;background-repeat:no-repeat;background-color:#f3e5c7;border-radius:12px;margin:12px 0 20px}.story-panel h2{font-size:28px;margin:10px 0}.story-panel>p:not(.story-count){margin:10px 0 18px}.story-nav{display:grid;grid-template-columns:1fr 2fr;gap:16px;align-items:center}.story-nav .primary{margin:0}.story-nav .text-button{margin:0;width:auto}.story-links{display:flex;justify-content:space-between;gap:12px}.story-links .text-button{width:auto}.story-nav button:disabled{opacity:.3;cursor:default}.whole-comic{display:block;width:100%;height:auto;border-radius:12px}@media(max-width:600px){.panel.story-panel{padding:20px}.story-panel h2{font-size:24px}.story-links .text-button{font-size:10px}.story-nav{gap:10px}.story-nav .primary{font-size:12px;padding:16px}.story-panel>.eyebrow{font-size:8px;letter-spacing:1px}}
.panel.picker-panel{width:min(760px,100%);text-align:left;padding:25px}.picker-top,.story-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.picker-top .text-button,.story-top .text-button{margin:0;width:auto;padding:5px;font-size:11px;white-space:nowrap}.picker-panel h2{margin:8px 0;font-size:32px}.picker-intro{margin:4px 0 15px;font-size:12px!important;color:#6d807c}.cast-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.cast-card{position:relative;background:#f0efdf;border:2px solid transparent;border-radius:15px;padding:7px 6px 10px;color:#21434b;text-align:center;transition:background .12s,border-color .12s}.cast-card.selected{border-color:var(--cast-accent);background:#fffdf5;box-shadow:0 3px 0 var(--cast-accent)}.cast-card.selected:after{content:'✓';position:absolute;right:7px;top:7px;background:var(--cast-accent);color:#fff;border-radius:50%;width:19px;height:19px;font-size:13px;line-height:19px}.cast-portrait{display:block;height:84px}.cast-portrait>svg{height:100%;width:100%;overflow:visible}.cast-portrait svg svg{overflow:hidden}.cast-name{display:block;font-weight:900;font-size:14px}.cast-name small{display:block;font-size:9px;font-weight:600;letter-spacing:.3px;color:#73847e;margin:3px 0}.cast-vibe{font-size:9px;display:block;color:#55716e;line-height:1.4}.cast-custom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:20px 0;font-size:12px;font-weight:800}.cast-swatches{display:flex;gap:8px}.cast-swatches button{width:27px;height:27px;border-radius:50%;color:white;font-size:15px;border:2px solid transparent}.cast-swatches button[aria-pressed=true]{border-color:#fff;outline:2px solid #264b53}.picker-actions{display:grid;grid-template-columns:1fr 2fr;gap:16px;align-items:center}.picker-actions .primary{margin:0}.picker-actions .text-button{width:auto;margin:0;font-size:12px}.picker-actions .primary:disabled{opacity:.5;cursor:default}.cast-forget{font-size:10px!important;opacity:.7}.story-pair{display:flex;align-items:center;justify-content:center;gap:10px;font-size:11px;font-weight:900;margin:8px 0}.story-pair>span:not(.pair-heart){border-bottom:3px solid var(--cast-accent);padding:3px 7px}.pair-heart{color:#e37d75}.cast-scene{position:relative;width:100%;background-repeat:no-repeat;background-color:#c1dace;overflow:hidden;border-radius:12px;isolation:isolate}.scene-person{position:absolute;transform-origin:center 60%;pointer-events:none;filter:drop-shadow(0 2px 1px #18374220)}.cast-figure{display:block;width:100%;height:auto;overflow:visible}.scene-heart{position:absolute;left:48%;top:24%;color:#ed8e82;font-size:24px;filter:drop-shadow(0 2px 0 #fff5de)}.scene-rope{position:absolute;inset:0;width:100%;height:100%;z-index:0}.story-panel>.cast-scene{margin:14px 0 18px}.personal-comic{display:grid;grid-template-columns:1fr 1fr;gap:13px}.comic-cell{background:#f2eedc;border-radius:10px;overflow:hidden;break-inside:avoid}.comic-cell .cast-scene{border-radius:0}.comic-caption{padding:10px 12px;font-size:11px;line-height:1.5}.comic-caption b{display:block;margin-bottom:5px}.story-top>.eyebrow{font-size:8px;letter-spacing:1px}.story-top .text-button{border:1px solid #d7dfce;border-radius:20px;padding:7px 10px}.personal-heading{text-align:center;font-size:25px!important}
@media(max-width:600px){.panel.picker-panel{padding:18px}.picker-panel h2{font-size:27px}.picker-intro{font-size:11px!important}.cast-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cast-portrait{height:65px}.cast-card{padding:5px 4px 7px}.cast-name{font-size:13px}.cast-vibe{font-size:9px}.cast-name small{margin:2px 0}.cast-custom{flex-direction:column;gap:9px;margin:15px 0}.cast-swatches{gap:11px}.cast-swatches button{width:28px;height:28px}.picker-actions{gap:9px}.picker-actions .primary{font-size:10px;padding:15px 12px}.picker-actions .text-button{font-size:10px}.cast-forget{margin-top:10px!important}.story-top>.eyebrow{font-size:7px}.story-top .text-button{font-size:9px;padding:7px}.story-pair{font-size:10px;margin:5px 0}.personal-comic{grid-template-columns:1fr}.comic-caption{font-size:12px}}
.cast-menu-summary{position:absolute;right:24px;top:67px;background:#fff7e2d9;color:#254d54;border-radius:20px;padding:10px 14px;font-size:11px;font-weight:800}#game:has(#install:not([hidden])) .cast-menu-summary{top:108px}@media(max-width:600px){.cast-menu-summary{top:47px;right:12px;font-size:9px;padding:7px 10px}}#modalContent:not(.story-panel):not(.picker-panel) .cast-scene{display:none}
.cast-card{padding:10px 6px}.cast-portrait{height:122px}@media(max-width:600px){.cast-card{padding:7px 4px}.cast-portrait{height:86px}}


/* Four anonymous portraits; complete comics replace all character layers. */
.cast-grid.four-cast{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.four-cast .cast-portrait{height:150px}.four-cast .cast-card{padding:0;overflow:hidden;background:#fff8e8}.picker-panel .picker-actions{margin-top:22px}.full-scene{background-repeat:no-repeat}.comic-missing{padding:30px;background:#f1e9d6;border-radius:12px;color:#754d45}@media(max-width:600px){.four-cast .cast-portrait{height:125px}.cast-grid.four-cast{gap:10px}.picker-panel .picker-actions{margin-top:18px}}

.four-cast .cast-card:disabled{opacity:.28;cursor:default;filter:grayscale(1)}.four-cast .cast-card:disabled:active{transform:none}

/* Six picture-only choices, and on-demand complete comic pages. */
.cast-grid.six-cast{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.six-cast .cast-card{padding:0;overflow:hidden;background:#fff8e8}.six-cast .cast-portrait{height:140px}.six-cast .cast-card:disabled{opacity:.28;cursor:default;filter:grayscale(1)}.six-cast .cast-card:disabled:active{transform:none}
.comic-load-probe{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.comic-load-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:25px;text-align:center;font-size:13px;line-height:1.6;background:#f4ecd8;color:#486065}.comic-failed{display:none}.full-scene[data-load=ready] .comic-load-status{display:none}.full-scene[data-load=failed] .comic-loading{display:none}.full-scene[data-load=failed] .comic-failed{display:block}
@media(max-width:600px){.cast-grid.six-cast{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}.six-cast .cast-portrait{height:105px}}
/* Flat animated belt bands and half-heart health. */
.belt-band{display:inline-block;width:34px;height:9px;margin-right:8px;border-radius:2px;vertical-align:middle;background:var(--belt-colour);border:1px solid #173e4920}.belt-band.dragon{background:linear-gradient(110deg,#eebc18,#fffbe0,#ffdf39,#fff);background-size:300% 100%;animation:belt-cycle 2.2s linear infinite}.belt-band.kitsune{background:linear-gradient(110deg,#3281ee,#d6faff,#558eff,#efffff);background-size:300% 100%;animation:belt-cycle 2.7s linear infinite}.belt-band.rainbow{background:linear-gradient(90deg,#ff6386,#ffc852,#83df8a,#56caff,#b28cff,#ff6386);background-size:300% 100%;animation:belt-cycle 3s linear infinite}.belt-band.rainbow.super-rainbow{animation-duration:1.5s}@keyframes belt-cycle{0%{background-position:0% 50%}100%{background-position:100% 50%}}#hearts{display:flex;gap:5px;letter-spacing:0}.heart{position:relative;display:inline-block;line-height:1.2;color:#e65d5480}.heart>span{position:absolute;inset:0;color:#e65d54}.heart.empty>span{display:none}.heart.half>span{clip-path:inset(0 50% 0 0)}.story-skip{margin:7px 0 0!important;padding:7px!important}

/* Lifetime progress stays separate from single-run belt records. */
.story-progress-card{padding:13px 15px;background:#fff8e8d9;border:1px solid #fff8df;border-radius:15px;box-shadow:0 4px 16px #17434a0b}.story-total{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.story-total .eyebrow{font-size:8px;letter-spacing:1px}.story-total b{font-size:23px;line-height:1}.story-progress-card>#storyProgressLabel{font-size:8px;letter-spacing:.8px}.story-progress-track{height:5px;margin-top:7px;background:#244e5520;border-radius:5px;overflow:hidden}.story-progress-track>span{display:block;height:100%;width:0;background:#ed6852;border-radius:5px}.story-progress-card p{font-size:11px;line-height:1.45;font-weight:700;margin:8px 0 0}.story-mode-line{display:flex;justify-content:center;align-items:center;gap:10px;font-size:10px;font-weight:800}.story-mode-line button{padding:0;background:none;color:#a24539;text-decoration:underline;font-size:10px}.chapter-tabs{display:flex;gap:8px;justify-content:center;margin:12px 0 0}.chapter-tabs .text-button{font-size:10px;padding:7px 9px;border-radius:20px;margin:0;background:#234c5310}.chapter-tabs button[aria-current=page]{background:#ed6852;color:#fff8e8}.chapter-tabs button:disabled{opacity:.4;cursor:default}.personal-comic+h2{margin-top:30px!important}
@media(max-width:600px){.story-progress-card{padding:11px 13px}.story-total{margin-bottom:9px}.story-total b{font-size:21px}.story-progress-card p{font-size:10px}.menu-bottom{gap:10px}.brand h1{font-size:76px}.chapter-tabs{gap:5px}.chapter-tabs .text-button{font-size:9px;padding:7px}.story-mode-line{font-size:9px}}
@media(max-height:680px) and (min-width:650px){#menu{flex-direction:row;align-items:center;gap:25px}.brand{width:52%;margin:0}.menu-bottom{width:40%;max-width:360px;gap:10px}.brand h1{font-size:clamp(65px,9vw,112px)}.edition{display:none}.story-progress-card{padding:10px 12px}.story-total{margin-bottom:8px}.story-progress-card p{margin-top:6px;font-size:10px}}
@media(max-height:700px) and (max-width:600px){#menu{padding-top:24px;padding-bottom:20px}.brand h1{font-size:60px;margin-top:17px;margin-bottom:15px}.brand p{margin:0;font-size:12px}.menu-bottom{gap:8px}.record b{font-size:28px}.story-progress-card{padding:9px 12px}.story-total{margin-bottom:7px}.menu-bottom .primary{padding:15px 20px}.menu-links button{padding:6px 0}}

@media(max-height:680px) and (min-width:650px){.menu-bottom .record{padding:8px 10px;background:#fff8e8e8;border-radius:12px}}

/* The hook tip is the precise click point. Touch keeps its normal interaction. */
@media(hover:hover) and (pointer:fine){#canvas{cursor:url('./grapple-cursor.svg') 15 5,crosshair}}
#devTools{position:absolute;right:24px;top:24px;padding:8px 12px;background:#fff8e8d9;border:1px solid #fff8e8;border-radius:20px;color:#31565d;font-size:11px;font-weight:800}#game:has(#install:not([hidden])) #devTools{top:65px}.dev-panel{text-align:left}.dev-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.dev-heading h2{margin:7px 0!important}.dev-heading img{flex:none}.dev-panel>p{font-size:12px;line-height:1.6}.dev-presets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}.dev-presets button,.dev-secondary{padding:11px 8px;background:#2a797b12;border:1px solid #2a797b30;color:#234f57;border-radius:10px;font-weight:800;font-size:11px}.dev-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px 12px}.dev-panel label{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:800;color:#36585c}.dev-panel input,.dev-panel select{width:100%;min-width:0;padding:11px 9px;border:1px solid #c3cbbb;border-radius:9px;background:#fffdf5;color:#123843;font:700 15px 'Trebuchet MS',sans-serif;box-sizing:border-box;user-select:text}.dev-panel input:focus,.dev-panel select:focus{outline:2px solid #59a8a1;outline-offset:1px}.dev-note{color:#5f7470;font-size:11px!important}.dev-test-run{display:grid;grid-template-columns:1fr 1.2fr;align-items:end;gap:12px;margin:22px 0 7px}.dev-secondary{min-height:43px}.dev-panel .text-button{width:100%;margin:0;font-size:11px}.dev-panel button:disabled{opacity:.4;cursor:default}
@media(max-width:600px){#devTools{right:12px;top:12px;font-size:10px;padding:7px 10px}.dev-fields{gap:12px 9px}.dev-panel{padding:22px 18px}.dev-panel select{font-size:12px;padding:12px 6px}.dev-panel .primary{font-size:12px}.dev-presets{margin:14px 0}.dev-test-run{margin-top:18px}}

#rotate-phone{display:none;position:fixed;inset:0;z-index:1000;align-items:center;justify-content:center;text-align:center;padding:24px;background:linear-gradient(135deg,#c4ede0,#fff4cb);touch-action:none}#rotate-phone h2{font-size:28px;margin:8px 0}#rotate-phone p{font-weight:700}.rotate-icon{display:block;font-size:64px;color:#ed6852;line-height:1}@media(any-pointer:coarse) and (orientation:landscape) and (max-height:600px){#rotate-phone{display:flex}}
#game.phone-letterbox{background:#143e48}.phone-letterbox #hud .hud-left{color:#fff7dc;text-shadow:0 1px 2px #092b35}.phone-letterbox #hud{padding-top:max(10px,env(safe-area-inset-top))}.phone-letterbox #score{font-size:26px}.phone-letterbox #hud .hud-right{top:max(12px,env(safe-area-inset-top))}.phone-letterbox #effects{top:72px;left:20px}.phone-letterbox .effect{padding:5px 8px;font-size:9px}.phone-letterbox #hint{bottom:4%;max-width:94%;white-space:normal;text-align:center}.phone-letterbox #distance{font-size:10px}