:root{--bg:#0b151b;--panel:#101f26;--panel-line:#30434a;--mint:#54e4b0;--mint-dark:#238461;--white:#f4f1de;--muted:#b0c1bf;--pixel-font:'Press Start 2P',monospace;--body-font:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--mint-glow:#54e4b030}
*{box-sizing:border-box}html{scroll-padding-top:120px}body{margin:0;background:var(--bg);color:var(--white);font-family:var(--body-font)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #ffcf78;outline-offset:4px}button:disabled{opacity:.35;cursor:default}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);z-index:9999;background:var(--mint);color:var(--bg);padding:16px}.skip:focus{transform:none}
.quest-stage{position:relative;min-height:100svh;background:#0b151b}.quest-header{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 5%;border-bottom:1px solid #ffffff12}.quest-brand{font:clamp(13px,1.5vw,20px) var(--pixel-font);text-decoration:none;letter-spacing:-1px}.quest-brand span{color:var(--mint)}.quest-controls{display:flex;gap:10px}.quest-controls button{border:1px solid var(--panel-line);background:var(--panel);color:var(--white);min-height:44px;padding:8px 14px;font-size:13px}.quest-controls button:last-child{color:var(--mint);border-color:#54e4b060}.quest-nav{position:relative;z-index:3;display:flex;gap:clamp(8px,3vw,32px);padding:0 5%;border-bottom:1px solid #ffffff12;overflow:auto}.quest-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-size:12px;white-space:nowrap;color:var(--muted);border-bottom:2px solid transparent}.quest-nav a[aria-current]{color:var(--mint);border-color:var(--mint)}
#quest-canvas{display:none;position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}.quest-content{position:relative;z-index:2;max-width:1100px;margin:0 auto;padding:30px 5%}.quest-panel{padding:45px 0;border-bottom:1px solid var(--panel-line);scroll-margin-top:20px}.quest-eyebrow{font:10px/1.8 var(--pixel-font);color:#8aa09d;margin:0 0 20px}.quest-eyebrow span{color:var(--mint);margin-left:16px}.quest-copy h1,.quest-copy h2{font-family:var(--pixel-font);font-weight:400;font-size:clamp(19px,3vw,34px);line-height:1.6;letter-spacing:-1px;margin:0 0 18px;max-width:780px;text-wrap:balance}.quest-description{font-size:clamp(15px,1.4vw,18px);line-height:1.7;max-width:650px;margin:0;color:#c1d0cc}.quest-instruction{font-size:13px;color:var(--mint);margin-top:26px}.quest-instruction span{display:inline-block;margin-left:8px}.quest-link{display:inline-flex;align-items:center;gap:30px;min-height:44px;margin-top:16px;text-underline-offset:5px;font-size:14px;color:var(--mint)}.quest-price{font:clamp(18px,3vw,30px)/1.7 var(--pixel-font);color:var(--mint);margin:10px 0 20px}.quest-screen{margin-top:25px;max-width:440px;border:4px solid #455b60;box-shadow:0 0 0 3px #122329,8px 8px 0 #0004;background:#17262b;aspect-ratio:16/10;overflow:hidden}.quest-screen img{display:block;width:100%;height:100%;object-fit:cover}.retro8-btn{margin-top:24px;background:var(--mint);color:var(--bg);border:0;border-bottom:4px solid var(--mint-dark);font-weight:650;padding:14px 20px;min-height:48px}
.quest.is-playing .quest-stage{position:sticky;top:0;height:100svh;min-height:0;overflow:hidden}.quest.is-playing #quest-canvas{display:block}.quest.is-playing .quest-content{position:absolute;top:clamp(140px,19vh,190px);left:0;right:0;margin:auto;max-width:1100px;padding:0 5%;pointer-events:none}.quest.is-playing .quest-panel{padding:0;border:0;pointer-events:auto}.quest.is-playing .quest-panel--project{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:start}.quest.is-playing .quest-panel--project h2{font-size:clamp(18px,2.5vw,28px)}.quest.is-playing .quest-screen{margin:0;max-height:30vh}.quest-hud{position:absolute;z-index:2;bottom:18px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;font:9px/1.6 var(--pixel-font);color:#cbd8c2}.quest-coins{color:#ffcf78}.quest-paging{position:absolute;z-index:3;right:5%;bottom:calc(42% + 12px);display:flex;align-items:center;gap:14px;font:9px var(--pixel-font);color:var(--muted)}.quest-paging button{width:44px;height:44px;border:1px solid #425e59;background:#0b151bdd;color:var(--mint);font-size:20px}.quest.is-finished #quest-area{color:var(--mint)}.quest.is-reading .quest-instruction{display:none}
@media(hover:hover){.quest-controls button:hover,.quest-paging button:hover{border-color:var(--mint)}.quest-nav a:hover{color:var(--white)}.retro8-btn:hover{background:#86f2c8}}
@media(max-width:600px){.quest-header{padding:12px 16px;gap:8px}.quest-brand{font-size:12px}.quest-controls{gap:6px}.quest-controls button{font-size:11px;padding:8px}.quest-nav{padding:0 16px;justify-content:space-between;gap:12px}.quest-nav a{font-size:11px}.quest.is-playing .quest-content{top:132px;padding:0 22px}.quest-copy h1,.quest-copy h2{font-size:19px;line-height:1.6;letter-spacing:-.6px}.quest-eyebrow{font-size:8px;margin-bottom:14px}.quest-eyebrow span{margin-left:8px}.quest-description{font-size:14px;line-height:1.55}.quest-instruction{font-size:12px;max-width:260px;margin-top:18px}.quest.is-playing .quest-panel--project{display:flex;flex-direction:column;gap:10px}.quest.is-playing .quest-panel--project h2{font-size:16px;margin-bottom:8px}.quest.is-playing .quest-panel--project .quest-description{display:none}.quest.is-playing .quest-screen{width:180px;max-height:112px;order:2;align-self:flex-end;margin-top:-38px}.quest.is-playing .quest-panel--project .quest-link{max-width:140px;font-size:12px;margin-top:8px;gap:8px}.quest-price{font-size:20px;margin:8px 0}.quest-paging{bottom:calc(33% + 4px);gap:10px;right:22px}.quest-hud{left:16px;right:16px;font-size:7px;bottom:16px}.retro8-btn{font-size:14px;margin-top:18px}.quest-content{padding:10px 22px}}
@media(max-height:620px){.quest.is-playing .quest-content{top:132px}.quest-copy h1,.quest-copy h2{font-size:18px;margin-bottom:10px}.quest-eyebrow{margin-bottom:8px}.quest-description{font-size:13px;line-height:1.5;max-width:560px}.quest-instruction{margin-top:12px}.quest.is-playing .quest-screen{max-height:110px}.quest-paging{bottom:110px}.quest-price{font-size:18px;margin:8px 0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.term-close{min-width:44px;min-height:44px;display:grid;place-items:center}.term-title{font-size:10px}.term-field input,.term-field textarea{font-size:16px;min-height:44px}.contact-modal{max-height:90svh;overflow:auto}.contact-services label{min-height:44px}.term-submit{line-height:1.6;min-height:44px}
.contact-modal {
	border: none; padding: 0; max-width: min(90vw, 32rem); width: 100%;
	background: transparent; opacity: 0; transform: translateY(12px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}
.contact-modal[open] { opacity: 1; }
.contact-modal.is-open { opacity: 1; transform: translateY(0); }
.contact-modal::backdrop { background: rgba(0,0,0,0.7); }

.term-window { background: var(--panel); border: 3px solid var(--mint); box-shadow: 8px 8px 0 rgba(0,0,0,0.5); }
.term-bar {
	display: flex; align-items: center; gap: 0.4rem; background: #0B0E12; color: var(--white);
	padding: 0.6rem 0.75rem; font-family: var(--pixel-font); font-size: 0.6rem;
	border-bottom: 2px solid var(--panel-line);
}
.term-dot { width: 8px; height: 8px; background: var(--mint-dark); display: inline-block; }
.term-title { margin-left: 0.5rem; flex: 1; color: var(--mint); }
.term-close { background: none; border: none; color: var(--white); cursor: pointer; padding: 0.15rem; }
.term-close svg { width: 16px; height: 16px; }

.contact-body { padding: 1.25rem; }
.kodelig-contact-form { display: flex; flex-direction: column; gap: 0.9rem; font-family: var(--body-font); }
.contact-fields-row { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.term-field { flex: 1 1 10rem; display: flex; flex-direction: column; gap: 0.3rem; }
.term-field label { font-size: 0.75rem; font-weight: 600; color: var(--white); }
.term-field input, .term-field textarea {
	border: 2px solid var(--panel-line); padding: 0.55rem 0.6rem; font-family: var(--body-font);
	font-size: 0.9rem; background: var(--bg); color: var(--white);
}
.term-field input:focus, .term-field textarea:focus { outline: none; border-color: var(--mint); }
.contact-services { border: 2px solid var(--panel-line); padding: 0.6rem; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.contact-services legend { font-size: 0.75rem; font-weight: 600; padding: 0 0.25rem; color: var(--white); }
.contact-services label { display: flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; color: var(--muted); }
.contact-form-footer { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.term-submit {
	font-family: var(--pixel-font); font-size: 0.75rem; color: var(--bg);
	background: var(--mint); border: 3px solid var(--mint-dark); padding: 0.7rem 1.1rem; cursor: pointer;
}
.term-submit:disabled { opacity: 0.6; cursor: default; }
.contact-status { font-size: 0.8rem; margin: 0; color: var(--white); }
.contact-status[data-state="error"] { color: #FF6B6B; }
.contact-status[data-state="loading"] { color: var(--muted); }
.contact-success { font-family: var(--pixel-font); font-size: 0.7rem; line-height: 1.8; }
.contact-success .term-ok { color: var(--mint); }

.term-close{min-width:44px;min-height:44px;display:grid;place-items:center}.term-title{font-size:10px}.term-field input,.term-field textarea{font-size:16px;min-height:44px}.contact-modal{max-height:90svh;overflow:auto}.contact-services label{min-height:44px}.term-submit{line-height:1.6;min-height:44px}
.quest-result{color:var(--mint);font-size:13px;margin-top:18px}.quest-controls button:disabled{opacity:.6}

/* Keep scenery behind long copy from competing with the text. The backing
   follows the text height without moving the existing content or controls. */
.quest.is-playing .quest-copy {
 position: relative;
 isolation: isolate;
}
.quest.is-playing .quest-copy::before {
 content: "";
 position: absolute;
 inset: -14px -18px;
 z-index: -1;
 background: rgba(5, 12, 17, 0.76);
 border: 1px solid rgba(176, 193, 191, 0.08);
 pointer-events: none;
}
@media (max-width: 600px) {
 .quest.is-playing .quest-copy::before { inset: -10px -12px; }
}
.quest-items{display:flex;gap:14px;align-items:center}.quest-item{display:inline-flex;align-items:center;gap:5px}.quest-item img{width:16px;height:16px;object-fit:contain;image-rendering:pixelated}
@media(max-width:600px){.quest-hud{flex-wrap:wrap;gap:8px}.quest-hud #quest-area{flex-basis:100%;font-size:6px}.quest-items{gap:10px}.quest-item img{width:14px;height:14px}}

/* Give the collectible silhouettes enough pixels to remain recognisable,
   without dwarfing the rest of the HUD on desktop. Mobile gets its own,
   larger value: at that width the HUD is compact enough that the previous
   size read as a dot instead of a star/heart. */
.quest-item:has(#quest-star) img,
.quest-item:has(#quest-heart) img { width: 20px; height: 20px; }
@media(max-width:600px) {
 .quest-item:has(#quest-star) img,
 .quest-item:has(#quest-heart) img { width: 28px; height: 28px; }
}

/* ===================================================================
   2.0 — "helt bananas": real platformer polish, sound, transitions,
   level select, pause screen and sub-page levels.
   =================================================================== */
:root{--gold:#ffcf78;--gold-dark:#6b3d16;--box:#101f26;--box-line:#30434a;--ink:#050c11}
/* Pixel-notched box, the classic console dialog frame. */
.k8-box{background:var(--box);box-shadow:0 -4px 0 0 var(--box-line),0 4px 0 0 var(--box-line),-4px 0 0 0 var(--box-line),4px 0 0 0 var(--box-line),8px 8px 0 0 #00000055;margin:4px;padding:22px 22px 24px}

/* ---------- Boot: the first panel is already in its game position ---------- */
.quest.is-booting .quest-panel:not(:first-child){display:none}
#quest-fx{display:none;position:absolute;left:0;top:0;z-index:4;pointer-events:none;image-rendering:pixelated}
.quest.is-playing #quest-fx{display:block}
#quest-canvas{image-rendering:pixelated;image-rendering:crisp-edges}
.quest.is-playing #quest-canvas{inset:auto;left:0;top:0}

/* ---------- Pause screen (reading mode and reduced motion) ---------- */
html.js .quest:not(.is-playing) .quest-stage{display:flex;flex-direction:column}
html.js .quest:not(.is-playing) .quest-header{order:0}
html.js .quest:not(.is-playing) .quest-navrow{order:1}
html.js .quest:not(.is-playing) #quest-canvas{display:block;position:relative;order:2;inset:auto;width:100%;height:228px;margin:0 auto;border-bottom:4px solid #1d2e2a;background:#0b151b}
html.js .quest:not(.is-playing) .quest-content{order:3;width:100%}
html.js .quest:not(.is-playing) .quest-hud,html.js .quest:not(.is-playing) .quest-paging{order:4}
@media(max-width:600px){html.js .quest:not(.is-playing) #quest-canvas{height:168px}}

/* ---------- Nav row with level select ---------- */
.quest-navrow{position:relative;z-index:3;display:flex;align-items:center;gap:8px;border-bottom:1px solid #ffffff12;padding-right:5%}
.quest-navrow .quest-nav{border-bottom:0;flex:1;min-width:0}
.k8-menu{position:relative;flex:none}
.k8-menu summary{list-style:none;display:inline-flex;align-items:center;gap:8px;min-height:40px;min-width:44px;padding:6px 12px;border:1px solid var(--panel-line);background:var(--panel);color:var(--white);cursor:pointer;font-size:12px}
.k8-menu summary::-webkit-details-marker{display:none}
.k8-menu summary svg{color:var(--mint)}
.k8-menu[open] summary{border-color:var(--mint)}
.k8-menu-panel{position:fixed;z-index:2147483100;right:16px;min-width:270px;max-width:calc(100vw - 24px);background:var(--box);padding:16px 18px;box-shadow:0 -4px 0 0 var(--mint),0 4px 0 0 var(--mint),-4px 0 0 0 var(--mint),4px 0 0 0 var(--mint),10px 10px 0 0 #000a}
.k8-menu-title{font:10px/1.6 var(--pixel-font);color:var(--gold);margin:0 0 10px}
.k8-menu-panel ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.k8-menu-panel a{display:flex;align-items:center;gap:12px;min-height:44px;padding:4px 8px;text-decoration:none;color:var(--white);font-size:14px}
.k8-menu-panel a:hover,.k8-menu-panel a:focus-visible{background:#1b3a33}
.k8-menu-panel a[aria-current]{color:var(--mint)}
.k8-menu-panel a[aria-current]::after{content:"◀";margin-left:auto;font-size:10px;color:var(--gold)}
.k8-world{font:9px/1 var(--pixel-font);color:var(--gold);min-width:3.4em}

/* ---------- Sound toggle ---------- */
.k8-sound{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;justify-content:center}
html:not(.js) .k8-sound{display:none}
.quest-controls .k8-sound,.k8-bar .k8-sound{border:1px solid var(--panel-line);background:var(--panel);color:var(--muted);padding:8px 12px;font-size:13px}
.k8-sound .k8-sound-waves{display:none}
.k8-sound[aria-pressed="true"]{color:var(--gold);border-color:#ffcf7880}
.k8-sound[aria-pressed="true"] .k8-sound-waves{display:inline}
.k8-sound[aria-pressed="true"] .k8-sound-mute{display:none}
.quest-controls button.k8-sound:last-child{color:inherit}

/* ---------- HUD bonus blocks ---------- */
.quest-qblock{display:inline-grid;place-items:center;width:16px;height:16px;background:var(--gold);color:var(--gold-dark);font:8px/1 var(--pixel-font);box-shadow:inset -2px -2px 0 #e8a855,0 0 0 2px var(--gold-dark)}
.quest-power{color:var(--gold)}

/* ---------- Page transitions and toast ---------- */
.k8-veil{position:fixed;inset:0;z-index:2147483600;pointer-events:none;display:none;overflow:hidden}
.k8-veil canvas{display:block;image-rendering:pixelated}
html.k8-wipe-in .k8-veil{display:block;background:var(--bg);animation:k8-veil-failsafe 0s linear 1.2s forwards}
.k8-veil.is-js{display:block;background:transparent;animation:none}
@keyframes k8-veil-failsafe{to{visibility:hidden}}
.k8-toast{position:fixed;left:50%;bottom:24px;z-index:2147483500;transform:translateX(-50%);margin:0;max-width:calc(100vw - 32px);padding:14px 18px;background:var(--ink);color:#fff275;font:10px/1.8 var(--pixel-font);text-align:center;box-shadow:0 -4px 0 0 #fff275,0 4px 0 0 #fff275,-4px 0 0 0 #fff275,4px 0 0 0 #fff275;transition:opacity .4s steps(4)}
.k8-toast.is-gone{opacity:0}
@keyframes k8-rainbow{0%{color:#ff5f6d}17%{color:#ffb347}33%{color:#fff275}50%{color:#6cff8a}67%{color:#57c7ff}83%{color:#b78cff}}
html.k8-konami .quest-brand span,html.k8-konami .k8-world-card,html.k8-konami .quest-eyebrow span{animation:k8-rainbow 1.2s steps(1) infinite}

/* ---------- Front page mobile header ---------- */
@media(max-width:600px){
 .quest-controls .k8-sound{padding:8px}
 .k8-sound-label,.k8-menu-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .quest-navrow{padding-right:12px}
 .quest-navrow .quest-nav{gap:10px}
 .k8-menu summary{padding:6px 10px}
}
@media(max-width:360px){.quest-brand{font-size:10px}.quest-controls button{padding:8px 6px;font-size:10px}.quest-controls{gap:4px}.quest-header{padding:10px 12px}}

/* ---------- Sub pages: levels in the same world ---------- */
.k8-bar{position:relative;z-index:5;display:flex;align-items:center;gap:16px;padding:14px 5%;border-bottom:1px solid #ffffff12;background:var(--bg)}
.k8-bar-nav{display:flex;gap:4px;margin-left:auto}
.k8-bar-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;text-decoration:none;color:var(--muted);font-size:13px;border-bottom:2px solid transparent}
.k8-bar-nav a[aria-current]{color:var(--mint);border-color:var(--mint)}
.k8-bar-controls{display:flex;align-items:center;gap:8px;margin-left:auto}
.k8-bar-nav+.k8-bar-controls{margin-left:12px}
.k8-bar .k8-menu{display:none}
.k8-contact-btn{border:1px solid #54e4b060;background:var(--panel);color:var(--mint);min-height:44px;padding:8px 14px;font-size:13px}
@media(max-width:899px){.k8-bar-nav{display:none}.k8-bar .k8-menu{display:block}.k8-bar-controls{margin-left:auto}}
@media(max-width:600px){.k8-bar{padding:10px 16px;gap:8px}.k8-bar .quest-brand{font-size:12px}.k8-contact-btn{font-size:11px;padding:8px}.k8-bar-controls{gap:6px}.k8-bar .k8-sound{padding:8px}}
@media(max-width:360px){.k8-bar .quest-brand{font-size:10px}}
@media(hover:hover){.k8-bar-nav a:hover{color:var(--white)}.k8-contact-btn:hover,.k8-menu summary:hover,.k8-sound:hover{border-color:var(--mint)}}

.k8-level-banner{position:relative;height:228px;overflow:hidden;background:linear-gradient(#060f15 0 55%,#163039 55% 85%,#3a4231 85% 87%,#26352c 87%);border-bottom:4px solid #1d2e2a}
.k8-level-banner canvas{position:absolute;left:0;top:0;display:block;image-rendering:pixelated}
.k8-world-card{position:absolute;z-index:1;left:50%;top:24px;transform:translateX(-50%);margin:0;padding:10px 14px;background:#050c11e6;font:12px/1.4 var(--pixel-font);color:var(--white);white-space:nowrap;box-shadow:0 0 0 3px #1d2e2a}
.k8-world-card span{color:var(--mint)}
@media(max-width:600px){.k8-level-banner{height:168px}.k8-world-card{top:14px;font-size:10px}}

.k8-main{max-width:1100px;margin:0 auto;padding:0 5% 24px}
.k8-hero{padding:48px 0 18px}
.k8-crumb{font-size:13px;color:var(--muted);margin:0 0 22px;display:flex;gap:10px;flex-wrap:wrap}
.k8-crumb a{color:var(--mint);text-underline-offset:4px}
.k8-title{font-family:var(--pixel-font);font-weight:400;font-size:clamp(20px,3.4vw,36px);line-height:1.55;letter-spacing:-1px;margin:0 0 22px;max-width:900px;text-wrap:balance}
.k8-lede{font-size:clamp(16px,1.4vw,18px);line-height:1.7;color:#c1d0cc;max-width:700px}
.k8-lede p{margin:0 0 14px}
.k8-section{margin:34px 0 56px}
.k8-label{font:10px/1.8 var(--pixel-font);color:var(--mint);margin:0 0 18px}
.k8-h2{font-family:var(--pixel-font);font-weight:400;font-size:clamp(16px,2.3vw,24px);line-height:1.6;margin:0 0 26px;max-width:820px;text-wrap:balance}
.k8-h3{font-family:var(--pixel-font);font-weight:400;font-size:13px;line-height:1.8;margin:0 0 14px}
.k8-grid{list-style:none;margin:0;padding:0;display:grid;gap:30px}
.k8-grid--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.k8-grid--3{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.k8-grid--prices{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));align-items:stretch}
.k8-box h3{font-family:var(--pixel-font);font-weight:400;font-size:13px;line-height:1.8;margin:14px 0 12px;color:var(--white)}
.k8-box p{font-size:15px;line-height:1.7;color:#c1d0cc;margin:0 0 12px}
.k8-picon{display:block;width:32px;height:32px}
.k8-textlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--mint);font-size:14px;text-underline-offset:5px}
.k8-steps{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.k8-step{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start}
.k8-step h3{margin-top:2px}
.k8-step-no{font:20px/1 var(--pixel-font);color:var(--gold);padding-top:10px}
.k8-prose{line-height:1.75;color:#d3dfdb}
.k8-prose--tight p,.k8-prose--tight li{font-size:15px}
.k8-prose ul{padding-left:1.2em;margin:0 0 12px}.k8-prose li{margin-bottom:6px}
.k8-prose li::marker{content:"▸ ";color:var(--mint)}
.k8-prose a{color:var(--mint);text-underline-offset:4px}
.k8-prose--page{max-width:780px;padding:28px 30px}
.k8-prose--page h2{font-family:var(--pixel-font);font-weight:400;font-size:15px;line-height:1.7;margin:30px 0 14px;color:var(--white)}
.k8-prose--page h3{font-size:17px;margin:24px 0 10px}
.k8-prose--page p,.k8-prose--page li{font-size:16px}

.k8-price{position:relative;display:flex;flex-direction:column}
.k8-price .retro8-btn{margin-top:auto;align-self:flex-start}
.k8-price .k8-prose{margin-bottom:18px}
.k8-price-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;color:var(--muted)}
.k8-price-amount{font-size:14px;color:var(--muted);margin:0 0 14px}
.k8-price-amount strong{font:20px/1.4 var(--pixel-font);color:var(--mint);font-weight:400}
.k8-price-badge{position:absolute;top:-16px;right:14px;background:var(--gold);color:var(--gold-dark);font:9px/1 var(--pixel-font);padding:8px 10px;box-shadow:0 0 0 3px var(--gold-dark)}
.k8-price--featured{box-shadow:0 -4px 0 0 var(--gold),0 4px 0 0 var(--gold),-4px 0 0 0 var(--gold),4px 0 0 0 var(--gold),8px 8px 0 0 #00000055}

.k8-project{display:flex;flex-direction:column;height:calc(100% - 8px);text-decoration:none;color:inherit;padding:16px 16px 18px}
.k8-project-screen{display:block;aspect-ratio:16/10;background:#17262b;border:4px solid #455b60;box-shadow:0 0 0 3px #122329;overflow:hidden;margin-bottom:16px}
.k8-project-screen img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:auto}
.k8-project-tag{font:9px/1.6 var(--pixel-font);color:var(--gold)}
.k8-project h3{margin-top:8px}
.k8-project .k8-textlink{margin-top:auto;text-decoration:underline}
@media(hover:hover){.k8-project:hover{background:#13272e}.k8-project:hover .k8-project-screen{border-color:var(--mint)}}

.k8-versus{margin:0 0 40px;overflow:hidden}
.k8-versus table{width:100%;border-collapse:separate;border-spacing:0 6px}
.k8-versus caption{text-align:left;font:11px/1.8 var(--pixel-font);color:var(--mint);margin-bottom:16px}
.k8-versus thead th{font:10px/1.8 var(--pixel-font);font-weight:400;text-align:left;padding:10px 14px;color:var(--white);vertical-align:bottom}
.k8-versus tbody th{font:10px/1.8 var(--pixel-font);font-weight:400;text-align:left;color:var(--gold);padding:14px;background:#0d1a20;width:22%;vertical-align:top}
.k8-versus td{padding:14px;font-size:15px;line-height:1.6;color:#c1d0cc;background:var(--box);vertical-align:top}
.k8-versus tbody td:last-child{background:#13302a;color:#e2f3ec}
.k8-p1,.k8-p2{display:inline-block;padding:4px 6px;margin-right:6px;font-size:8px;background:#30434a;color:var(--white)}
.k8-p2{background:var(--mint);color:var(--bg)}
.k8-plus{color:var(--mint)}
.k8-mobile-label{display:none}
.k8-details{margin-bottom:40px}
.k8-takeaway{font:clamp(12px,1.6vw,16px)/2 var(--pixel-font);color:var(--mint);text-align:center;margin:20px auto 0;max-width:760px}
.k8-takeaway strong{font-weight:400}
@media(max-width:700px){
 .k8-versus thead{display:none}
 .k8-versus table,.k8-versus caption,.k8-versus tbody,.k8-versus tr,.k8-versus th,.k8-versus td{display:block;width:100%}
 .k8-versus tbody th{width:auto;padding:12px 14px}
 .k8-versus tr{margin-bottom:18px}
 .k8-mobile-label{display:block;font:8px/1.6 var(--pixel-font);color:var(--muted);margin-bottom:6px}
 .k8-versus tbody td:last-child .k8-mobile-label{color:var(--mint)}
}

.k8-levelnav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:56px 0 72px;padding-top:28px;border-top:4px dotted #30434a}
.k8-levelnav a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--white);text-decoration:none;font-size:14px}
.k8-levelnav a:hover,.k8-levelnav a:focus-visible{color:var(--mint)}
.k8-levelnav-next{margin-left:auto}
@media(prefers-reduced-motion:reduce){.k8-veil{display:none!important}.k8-toast{transition:none}}

/* Bonus stages (B-1 Gratis demo, B-2 Nettsjekk): the two free tools as a
   separate group under the levels in "Velg nivå" and at the end of the sub
   page bar - gold, like coins, so they read as extras, not as levels. */
.k8-menu-title--bonus{margin-top:14px;padding-top:12px;border-top:2px dashed var(--panel-line)}
.k8-menu-panel button{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:4px 8px;border:0;background:none;color:var(--white);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.k8-menu-panel button:hover,.k8-menu-panel button:focus-visible{background:#1b3a33}
.k8-world--bonus{color:var(--mint)}
.k8-bar-bonus{display:inline-flex;gap:2px;margin-left:6px;padding-left:8px;border-left:2px dashed var(--panel-line)}
.k8-bar-bonus a,.k8-bar-bonus button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;border:0;border-bottom:2px solid transparent;background:none;color:var(--gold);font:inherit;font-size:13px;text-decoration:none;cursor:pointer}
.k8-bar-bonus span{font-size:10px}
.k8-bar-bonus a[aria-current]{color:var(--mint);border-color:var(--mint)}
@media(hover:hover){.k8-bar-bonus a:hover,.k8-bar-bonus button:hover{color:var(--white)}}
/* 900-1023px: with the bonus pair the bar got tight and "Lyd av" / "Ta
   kontakt" wrapped to two lines - tighter items there instead. */
@media(min-width:900px) and (max-width:1023px){.k8-bar-nav{gap:0}.k8-bar-nav a,.k8-bar-bonus a,.k8-bar-bonus button{padding:0 7px}.k8-bar-bonus{margin-left:2px;padding-left:4px}.k8-bar-nav+.k8-bar-controls{margin-left:8px}}
/* Front page: the open "Velg nivå" panel (now taller with the bonus group)
   must sit above the panel pager (.quest-paging, same z-index, later in DOM). */
.quest-navrow:has(.k8-menu[open]){z-index:5}
@media(min-width:900px) and (max-width:959px){.k8-bar .k8-sound-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.k8-bar .k8-sound{padding-inline:10px}}