:root{color-scheme:light;--demo-bg:#f5f6f8;--demo-card:#fff;--demo-text:#20252d;--demo-muted:#596170;--demo-line:#dce0e7;--demo-accent:#234b8b}
.demo-public *,.demo-session-bar,.demo-about{box-sizing:border-box}.demo-public{margin:0;background:var(--demo-bg);color:var(--demo-text);font:1rem/1.6 system-ui,-apple-system,"Segoe UI",sans-serif}.demo-public a{color:var(--demo-accent);overflow-wrap:anywhere}.demo-public h1{overflow-wrap:anywhere;font-size:clamp(1.6rem,4vw,2rem);line-height:1.2;margin:1rem 0}.demo-public h2{overflow-wrap:anywhere;font-size:1.2rem;line-height:1.35}.demo-public p{margin:0 0 1rem}.demo-public button,.demo-public a{touch-action:manipulation}.demo-public button{font:inherit;cursor:pointer}.demo-public button:disabled{cursor:wait;opacity:.7}.demo-public :focus-visible,.demo-session-bar :focus-visible,.demo-about :focus-visible{outline:3px solid var(--demo-accent);outline-offset:4px}.demo-logo{display:inline-block;text-decoration:none}.demo-logo img{display:block;width:132px;height:auto}.demo-button{max-width:100%;display:inline-flex;justify-content:center;align-items:center;min-height:46px;background:var(--demo-accent);color:white;border:0;border-radius:8px;padding:11px 20px;font-weight:650;text-decoration:none;line-height:1.4}.demo-contact{width:min(100% - 32px,520px);margin:clamp(32px,12vh,130px) auto;padding:clamp(22px,5vw,40px);background:var(--demo-card);border:1px solid var(--demo-line);border-radius:16px}.demo-contact>.demo-button{margin:8px 0 22px}.demo-privacy{max-width:720px;width:min(100% - 32px,720px);margin:32px auto}.demo-privacy h2{margin-top:28px}.demo-frame{display:flex;min-height:100vh;user-select:none}.demo-frame aside{width:210px;padding:30px 22px;border-right:1px solid var(--demo-line);display:flex;flex-direction:column;gap:20px;background:var(--demo-card)}.demo-frame aside strong{margin-bottom:30px}.demo-frame main{flex:1;padding:24px 38px}.demo-frame header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--demo-line);margin-bottom:38px}.demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.demo-grid article,.demo-preview{padding:26px;background:var(--demo-card);border:1px solid var(--demo-line);border-radius:12px}.demo-grid strong{display:block;font-size:1.8rem}.demo-grid p,.demo-frame header span{color:var(--demo-muted);font-size:.9rem}.demo-preview{margin-top:24px;min-height:180px}#demo-welcome,.demo-about{color:var(--demo-text);background:var(--demo-card);border:1px solid var(--demo-line);border-radius:16px;padding:clamp(22px,5vw,40px);width:min(520px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 24px 80px #0002}#demo-welcome::backdrop,.demo-about::backdrop{background:#18253866;backdrop-filter:blur(3px)}.demo-close{position:absolute;right:12px;top:10px;background:none;border:0;color:var(--demo-muted);font-size:1.8rem;width:44px;height:44px}.demo-privacy-link{font-size:.85rem;color:var(--demo-muted)}#demo-start .demo-button{width:100%;margin:8px 0 12px}#demo-melding:empty{display:none}.demo-reopen{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;padding:14px 20px;background:var(--demo-card);border:1px solid var(--demo-line);border-radius:12px;width:max-content;max-width:calc(100% - 32px)}.demo-reopen a{font-size:.85rem}.demo-session-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;padding:8px 16px;background:var(--demo-card);border-bottom:1px solid var(--demo-line);font:13px/1.4 system-ui;color:var(--demo-text)}.demo-session-bar button{border:0;background:none;color:var(--demo-accent);text-decoration:underline;padding:6px;font:inherit}.demo-session-bar time{font-variant-numeric:tabular-nums}
/* Mørk drakt: husets grafitt fra 22.08, ikke en egen blåtone. Målt 11.09 sto
   flata #191e26 (B−R 13), kortet #222934 (18) og streken #424b5b (25) — over
   taket på 12, og demoen er det første en kjøper ser av flata. Fasiten er
   `:root[data-tema="dark"]` i static/css/stil.css. Knappen beholder den lyse
   flata si (den er en aksent, ikke en flate); bare teksten på den er flyttet
   fra marineblått #162c4e til husets --flate, som måler 11,7 mot 8,6.
   17.09: lys er standard i demoen (Jon), så drakta følger appens eget valg
   (`data-tema`/`.mork-auto`, satt av app.js og m.js) og ikke systemet. Sidene
   uten app — invitasjonen og personvernet — står lyse. */
:root[data-tema="dark"],:root.mork-auto{color-scheme:dark;--demo-bg:#0e0f15;--demo-card:#1f2026;--demo-text:#e9ecf2;--demo-muted:#a7b0be;--demo-line:#3a3b41;--demo-accent:#60a5fa}:root[data-tema="dark"] .demo-button,:root.mork-auto .demo-button{background:#b1ccf8;color:#0e0f15}
@media(max-width:700px){.demo-frame aside{display:none}.demo-frame main{padding:20px}.demo-frame header span{display:none}.demo-grid{grid-template-columns:1fr}.demo-grid article:nth-child(n+2){display:none}.demo-reopen{flex-direction:column;gap:8px}.demo-session-bar{padding:7px 10px;font-size:12px}}

#demo-welcome{width:min(740px,calc(100% - 32px));text-align:center;padding:clamp(28px,5vw,52px)}#demo-title{margin:24px 0;font-size:clamp(1.65rem,4vw,2.35rem)}#demo-intro{font-size:1.08rem}#demo-start .demo-button{max-width:480px;background:#1768ee;color:#fff}#demo-welcome .demo-privacy-link{color:var(--demo-accent)}.demo-about{font:1rem/1.6 system-ui}.demo-about h2{margin-top:0}
.demo-public a.demo-button{background:#1768ee;color:#fff}
#demo-welcome,.demo-about{max-width:calc(100% - 32px)}
/* G-172 (1): den nøytrale flaten bak velkomsten. Egen klasse, så den gamle
   skisseregelen står urørt og endringen kan snus med ett ord i markup. */
.demo-frame.demo-tom{align-items:center;justify-content:center}
.demo-frame.demo-tom .demo-logo{font-size:2rem;opacity:.45}
/* G-328 (L3): «Om Norenta» i demolinja er en lenke ved siden av knappen «Om
   demoen», og ser lik ut: aksentfarge og understrek, samme trykkflate. Siden
   den åpner (`/om-norenta`) står lys, som personvernet. */
.demo-session-bar .demo-om-lenke{color:var(--demo-accent);text-decoration:underline;padding:6px;font:inherit}
.demo-om-liste{margin:0 0 1rem;padding-left:1.25rem}.demo-om-liste li{margin:0 0 .25rem}
/* G-334 (N8): med «Om Norenta» gikk demolinja over to linjer på 390 px. Under
   560 px står «til 1. okt. 09:13» etter «Demo» (demo-context.js), mellomrommene
   er mindre, og den lange formen står bare for skjermlesere. Knappen og lenka
   beholder 6 px luft rundt teksten, altså minst 24 px høyde. Den lange formen
   trenger om lag 432 px med 12 px skrift (målt i Chromium på Windows); grensa
   på 560 gir rom for bredere skrifter på telefonene. */
.demo-til-kort{display:none}
@media(max-width:560px){.demo-session-bar{gap:4px 10px}.demo-til-lang{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.demo-til-kort{display:inline}}
.demo-velg{display:grid;gap:8px;margin:0 0 1rem}.demo-velg label{font-weight:600}.demo-velg select{width:100%;min-width:0;font:inherit;min-height:46px;max-width:100%;padding:8px 10px;border:1px solid var(--demo-line);border-radius:8px;background:var(--demo-card);color:var(--demo-text)}.demo-velg .demo-button{justify-self:start;margin-top:8px}.demo-honning{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}