:root{--navy:#061630;--navy2:#0b2a55;--blue:#65c8ff;--pale:#dff7ff;--gold:#f4c65d;--gold2:#c48923;--cream:#fff6dc;--green:#376f47;--red:#8e2e35;--shadow:rgba(0,0,0,.52);--control-scale:1}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#020713;color:var(--cream);font-family:Georgia,'Times New Roman',serif;overscroll-behavior:none}button,select,input{font:inherit}button{cursor:pointer}.screen{display:none;min-height:100dvh}.screen.active{display:flex}.centered{align-items:center;justify-content:center;padding:20px}.snowy-bg{background:radial-gradient(circle at 50% 0,#1b5595,#061630 50%,#020713)}.snowy-bg:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle,#fff 1px,transparent 1px);background-size:42px 42px;opacity:.12;pointer-events:none}.panel{position:relative;background:linear-gradient(155deg,rgba(6,22,52,.98),rgba(12,48,91,.96));border:3px solid var(--gold);border-radius:24px;box-shadow:0 22px 70px var(--shadow);padding:26px}.panel h1,.panel h2{color:var(--gold);margin-top:0}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--pale);font-size:.82rem;font-weight:800}.gold-btn,.ice-btn,.dark-btn,.club-btn,.danger-btn,.tiny-btn{border:2px solid var(--gold);border-radius:999px;padding:12px 20px;font-weight:900;box-shadow:0 6px 16px rgba(0,0,0,.28)}.gold-btn{background:linear-gradient(#ffe08a,#c98f26);color:#07152c}.ice-btn{background:linear-gradient(#e7fbff,#63b9ec);color:#061630;border-color:#86dcff}.dark-btn{background:#0a1d3e;color:#fff;border-color:#72c8f7}.club-btn{background:linear-gradient(#79a93a,#376a43);color:white}.danger-btn{background:#671f28;color:white;border-color:#ff9c96}.tiny-btn{padding:7px 12px;background:rgba(3,13,34,.8);color:#fff;border-color:#6ab7e4;font-size:.8rem}.button-row{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px}.stacked-actions{display:grid;gap:10px}.loading-panel{width:min(650px,94vw);text-align:center}.crest-mark{width:88px;height:88px;border:4px solid var(--gold);border-radius:50%;display:grid;place-items:center;margin:0 auto 15px;font-size:3.5rem;color:var(--gold);box-shadow:0 0 30px rgba(244,198,93,.5)}.load-track{height:20px;border:2px solid var(--blue);border-radius:999px;background:#020713;overflow:hidden;margin:20px 0}.load-track div{height:100%;width:0;background:linear-gradient(90deg,#55bdf5,#ffe084);transition:width .18s}.title-screen{position:relative;align-items:center;justify-content:flex-end;padding:30px;background:url('assets/art/backgrounds/north_peak_village_rooftops_1920x1080.png') center/cover}.title-shade,.journey-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,7,19,.2),rgba(2,7,19,.76))}.title-card{width:min(580px,95vw);text-align:center}.title-card h1{font-size:clamp(2.2rem,5vw,4.3rem);line-height:.92}.title-card h1 span{font-size:.74em;color:#fff}.title-copy{line-height:1.55}.title-toggles{display:flex;gap:8px;justify-content:center;margin-top:12px}.warning-bg{background:url('assets/art/backgrounds/ice_cavern_platforms_and_tunnels_1920x1080.png') center/cover}.warning-panel{width:min(1020px,96vw)}.mode-cards,.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mode-card,.preset-card{padding:18px;border-radius:16px;border:2px solid #66bce9;background:rgba(255,255,255,.06);color:white;text-align:left}.mode-card strong,.preset-card strong{display:block;color:var(--gold);font-size:1.08rem;margin-bottom:7px}.mode-card span,.preset-card span{display:block;line-height:1.4}.mode-card.selected,.preset-card.selected{border-color:var(--gold);box-shadow:0 0 24px rgba(244,198,93,.35);background:rgba(244,198,93,.1)}.check-row{display:flex!important;align-items:center;gap:10px;margin:14px 0}.check-row input{width:22px;height:22px}.info-panel,.settings-panel{width:min(1100px,96vw);max-height:94vh;overflow:auto}.how-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.how-grid article{padding:16px;border:1px solid #5cb7e8;border-radius:16px;background:rgba(255,255,255,.06)}.how-grid h2{font-size:1.15rem;margin-bottom:7px}.how-grid p{margin:0;line-height:1.45}.settings-columns{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}.settings-columns label{display:block;margin:12px 0}.settings-columns select,.settings-columns input[type=range]{width:100%;padding:10px;border-radius:10px}.key-guide{margin-top:15px;padding:14px;border-radius:14px;border:1px solid #5db9e8;background:rgba(0,0,0,.2);line-height:1.55}.journey-screen{position:relative;align-items:center;justify-content:center;padding:24px;background:url('assets/art/backgrounds/slippery_mountain_and_frozen_bridge_1920x1080.png') center/cover fixed}.journey-panel{width:min(1120px,96vw)}.journey-stages{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stage-card{display:grid;grid-template-columns:55px 1fr auto;align-items:center;gap:12px;padding:14px;border-radius:16px;border:2px solid #63bdeb;background:rgba(4,18,45,.92);color:#fff;text-align:left}.stage-card:not(:disabled):hover{border-color:var(--gold);transform:translateY(-2px)}.stage-card:disabled{opacity:.45;cursor:not-allowed}.stage-card .stage-number{width:50px;height:50px;border-radius:50%;background:#163e70;display:grid;place-items:center;color:var(--gold);font-weight:900}.stage-card strong{display:block;color:var(--gold)}.stage-card small{display:block;margin-top:4px}.stage-card .status{font-size:.8rem;color:var(--pale)}.inventory-summary{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;padding:12px;border-radius:14px;background:rgba(0,0,0,.25)}.inventory-chip{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #62b8e6;border-radius:999px}.inventory-chip img{width:28px;height:28px;object-fit:contain}.game-screen{flex-direction:column;background:#020713;height:100dvh;overflow:hidden}.hud{min-height:78px;display:grid;grid-template-columns:minmax(220px,1.2fr) auto minmax(160px,.7fr) minmax(220px,1fr) auto;align-items:center;gap:10px;padding:8px 12px;background:linear-gradient(#0b2a55,#061630);border-bottom:3px solid var(--gold);z-index:10}.hud-left{display:flex;flex-direction:column;min-width:0}.hud-left strong{color:var(--gold);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-left span{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spark-lives{display:flex;gap:2px}.spark-life{width:34px;height:34px;object-fit:contain}.hud-meter span{font-size:.72rem}.meter{height:12px;border:1px solid #ffe08a;border-radius:999px;background:#020713;overflow:hidden}.meter div{height:100%;width:0;background:linear-gradient(90deg,#f6b62d,#fff49a);transition:width .2s}.hud-inventory{display:flex;gap:5px;justify-content:center}.hud-item{position:relative;width:42px;height:42px;border:1px solid #67bce8;border-radius:10px;background:rgba(255,255,255,.07);display:grid;place-items:center}.hud-item img{width:34px;height:34px;object-fit:contain}.hud-item b{position:absolute;right:1px;bottom:0;font-size:.66rem;background:#07152d;border-radius:999px;padding:1px 4px}.hud-actions{display:flex;gap:5px;align-items:center}.hud-actions button{border:1px solid #75c9f5;border-radius:999px;background:#102f5b;color:white;padding:7px 10px;font-size:.7rem;font-weight:900}.round-btn{width:42px;height:42px;padding:0!important;border-color:var(--gold)!important}.game-screen #canvasShell{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#020713;overflow:hidden}.game-screen canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;touch-action:none;background:#07162e;outline:none}.caption-box,.message-box{position:absolute;left:50%;transform:translateX(-50%);z-index:18;text-align:center;pointer-events:none}.caption-box{bottom:12px;max-width:80%;padding:10px 18px;border-radius:12px;background:rgba(0,0,0,.8);border:2px solid var(--gold);font-weight:900}.message-box{top:16px;padding:9px 15px;border-radius:999px;background:rgba(2,9,25,.9);border:2px solid #67c2f3;font-weight:900}.hidden{display:none!important}.overlay-card{position:absolute;z-index:16;width:min(680px,92%);text-align:center}.goal-line{color:var(--gold);font-weight:900}.full-overlay{position:absolute;inset:0;z-index:25;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px}.modal-panel{display:flex;flex-direction:column;gap:10px;text-align:center;width:min(430px,94vw)}.reward-panel{text-align:center;width:min(650px,94vw)}.reward-panel #rewardFriendImage{width:min(380px,80%);height:270px;object-fit:contain}.reward-panel #rewardItemImage{width:120px;height:120px;object-fit:contain}.result-panel{text-align:center;width:min(760px,94vw)}.stage-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stage-stats div{padding:12px;border:1px solid #64bbe9;border-radius:12px;background:rgba(255,255,255,.06)}.controls-bar{min-height:126px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom));background:linear-gradient(#061630,#020713);border-top:2px solid #285f96;transform-origin:bottom center}.movement-pad,.action-pad,.item-strip{display:flex;gap:7px;align-items:center}.movement-pad button,.action-pad button,.item-strip button{touch-action:none;user-select:none;border:2px solid #67c1f2;border-radius:15px;background:#102f5b;color:white;font-weight:900;min-width:62px;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center}.movement-pad button{font-size:1.35rem}.movement-pad button span,.action-pad button span,.item-strip button span{font-size:.68rem}.item-strip{justify-content:center;flex-wrap:wrap}.item-strip button{min-width:54px}.item-strip img{width:31px;height:31px;object-fit:contain}.item-strip button.selected{border-color:var(--gold);box-shadow:0 0 13px rgba(244,198,93,.55)}.action-pad{display:grid;grid-template-columns:repeat(3,minmax(60px,1fr));grid-template-rows:repeat(2,54px)}.action-pad button{min-height:50px}.action-pad .major-action{background:linear-gradient(#ffe07f,#c78c21);color:#07152c;border-color:#fff0ad;transform:scale(1.08)}.action-pad .spark-action{background:radial-gradient(circle,#fff7ac,#e6a72d 60%,#7a3a13);color:#07152c;border-color:#fff0a7}.controls-bar.left-layout .movement-pad{order:3}.controls-bar.left-layout .action-pad{order:1}.controls-bar.left-layout .item-strip{order:2}.controls-bar.compact-layout{gap:5px}.controls-bar.compact-layout button{min-width:54px}.controls-bar.keyboard-only{display:none}.controls-bar.mouse-only{}.ending-screen{position:relative;align-items:center;justify-content:center;background:#020713}.ending-screen canvas{width:100%;height:100dvh;object-fit:contain}.ending-caption{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);max-width:82%;padding:13px 22px;border-radius:15px;background:rgba(0,0,0,.82);border:2px solid var(--gold);font-size:clamp(1rem,2vw,1.5rem);font-weight:900;text-align:center}.ending-actions{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.pressed{transform:scale(.94)!important;filter:brightness(1.25)}@media(max-width:1050px){.hud{grid-template-columns:1fr auto 1fr auto}.hud-inventory{display:none}.settings-columns{grid-template-columns:1fr}.preset-grid,.mode-cards{grid-template-columns:1fr}.journey-stages{grid-template-columns:1fr}}@media(max-width:760px){.title-screen{justify-content:center;padding:12px}.title-shade{background:rgba(2,7,19,.65)}.how-grid{grid-template-columns:1fr}.hud{min-height:68px;grid-template-columns:1fr auto auto;padding:5px}.hud-meter{display:none}.hud-actions button:not(.round-btn){display:none}.spark-life{width:28px;height:28px}.controls-bar{min-height:112px;grid-template-columns:auto 1fr auto;gap:5px;padding:5px}.item-strip{display:none}.movement-pad button,.action-pad button{min-width:49px}.action-pad{grid-template-columns:repeat(3,48px);grid-template-rows:repeat(2,46px);gap:4px}.movement-pad{gap:4px}.movement-pad button{min-width:52px;min-height:50px}.journey-panel,.settings-panel,.info-panel{padding:17px}.stage-stats{grid-template-columns:1fr}.caption-box{max-width:94%;bottom:5px}}@media(max-width:470px){.controls-bar{grid-template-columns:auto auto}.item-strip{display:none}.movement-pad button{min-width:46px}.action-pad{grid-template-columns:repeat(3,44px)}.action-pad button{min-width:42px}.hud-left span{display:none}.title-card h1{font-size:2.35rem}}@media(pointer:fine) and (min-width:900px){.controls-bar{min-height:105px}.movement-pad button,.action-pad button,.item-strip button{min-height:46px}.action-pad{grid-template-rows:repeat(2,45px)}}


/* Version 2: easier rooftops, clearer chapter goals, and expanded controls */
kbd{display:inline-block;min-width:1.8em;padding:.12em .38em;margin:.08em;border:1px solid #9bdcff;border-bottom-width:3px;border-radius:6px;background:#071b39;color:#fff7dc;font-family:system-ui,sans-serif;font-weight:900;text-align:center}
.control-choice-note{padding:12px 14px;border-left:5px solid var(--gold);border-radius:10px;background:rgba(244,198,93,.09);line-height:1.45}
.expanded-presets{grid-template-columns:repeat(2,minmax(0,1fr))}
.expanded-presets .preset-card:first-child{grid-column:1/-1;background:rgba(244,198,93,.12)}
.chapter-intro{width:min(720px,94%);max-height:90%;overflow:auto}
.chapter-goal-box,.chapter-control-reminder{margin:14px 0;padding:13px 16px;border-radius:14px;text-align:left}
.chapter-goal-box{border:2px solid var(--gold);background:rgba(244,198,93,.12)}
.chapter-control-reminder{border:2px solid #6bc5f2;background:rgba(72,165,225,.12)}
.chapter-goal-box strong,.chapter-control-reminder strong{display:block;color:var(--gold);font-size:.78rem;letter-spacing:.12em}
.chapter-goal-box p,.chapter-control-reminder p{margin:6px 0 0;line-height:1.45}
.quick-controls-panel{width:min(850px,95vw);max-height:92vh;overflow:auto;text-align:center}
.quick-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:15px 0}
.quick-preset-grid button{padding:14px;border:2px solid #64bce9;border-radius:14px;background:#0b2a52;color:#fff;text-align:left}
.quick-preset-grid button strong,.quick-preset-grid button span{display:block}.quick-preset-grid button strong{color:var(--gold);margin-bottom:5px}.quick-preset-grid button.selected{border-color:var(--gold);box-shadow:0 0 18px rgba(244,198,93,.4);background:#203b55}
.controls-bar.wide-layout{gap:16px}.controls-bar.wide-layout .action-pad{column-gap:13px}.controls-bar.wide-layout button{min-width:70px}
@media(max-width:760px){.expanded-presets,.quick-preset-grid{grid-template-columns:1fr}.expanded-presets .preset-card:first-child{grid-column:auto}.chapter-intro{max-height:88%}}


/* Version 3 rooftop readability */
#objectiveText{line-height:1.25}
