/* vit-tokens.css - delt kanonisk token-kilde. Lastes etter (foer vit-shell.css). Sidene beholder kun tokens som AVVIKER (per-token dedup, verdi-bevarende). Semantiske status-tokens styres av vit-shell.css. */ /* ============================================================ 🚫 ABSOLUTT REGEL — INGEN DEKORATIVE AKSENTLINJER (Kenneth, gjentatt) ------------------------------------------------------------ ALDRI border-left / border-top / inset-stripe (box-shadow: inset Npx 0 0) i brand-farge som dekor paa kort, paneler, rader, overskrifter eller uthevinger. Det er STRENGT FORBUDT i Vitin. RIKTIG utheving = bakgrunns-tint (color-mix brand) + HEL haarlinje-ramme (box-shadow: inset 0 0 0 1px var(--brand-line)) — evt. puls paa bakgrunn. Tillatt: funksjonelle streker (graf-akse, tabell-separator i --line, liste-bullets, maalstrek paa maaler). Alt annet brand-stripe = FJERN. ============================================================ */ .vit-uthev { background: color-mix(in srgb, var(--brand) 8%, transparent); box-shadow: inset 0 0 0 1px var(--brand-line); border-radius: 10px; } :root, [data-theme="lys"] { --bad: var(--ink-3); --bad-soft: var(--surface-2); --border: #e7e7e4; --border-faint: #f1f1ee; --border-soft: #ededea; --border-strong: #d8d8d4; --brand: #7132f5; --brand-2: #5b1ecf; /* Læremargens FASTE bredde — ÉN kilde (Kenneth 07.07: fast, «fit + litt»). Endre KUN her for å justere margen på HELE appen. */ --learn-w: 500px; /* Fade-standard (GLOBAL — endre ÉN verdi, alt endrer seg, Kenneth 24.07): grafer 1,9s, læremarg kortere, KPI-bokser INGEN fade (0). */ --fade-graf: 1.9s; --fade-marg: 0.5s; --fade-kpi: 0s; /* Sidemarg / «ramme» rundt innholdet i main — luft på alle kanter (Kenneth 22.07: ~1 cm+, aldri klint i hjørnet). Standard for modulsider. */ --vit-ramme: 44px; --brand-dark: #5b1ecf; --brand-line: rgba(113,50,245,.28); --brand-soft: rgba(113,50,245,.10); --brand-warm: #9d7bff; --bransje: #5a6573; --bransje-cap: #2a323d; --bransje-line: rgba(90,101,115,.40); --bransje-soft: rgba(90,101,115,.10); /* B-pakka (Kenneth 12.07): to-tone lerret — canvas et HAKK under hvitt (kjølig, jf. design-loven) så hvite flater løfter seg mykt UTEN skygge. Justert 12.07: #f1f0f6 ga for stor kontrast → #f8f8fb (mye mykere). Justert 16.07 (Kenneth: «fremdeles heilt hvit» — f8f8fb var målt korrekt på live, men tonen er for nær hvit til å synes): ett hakk dypere, midt mellom forkastede f1f0f6 (for sterk) og f8f8fb (usynlig). */ --canvas: #f5f4f9; --crit: #b3261e; --crit-bg: rgba(179,38,30,.10); --up: #2d8c5c; --up-soft: rgba(45,140,92,.12); --dn: #c62828; --dn-soft: rgba(198,40,40,.10); --ds-stack-1: #4a4d55; --ds-stack-2: #6b6f78; --ds-stack-3: #8a8e96; --ds-stack-4: #b0b3ba; --ds-stack-edge: rgba(0,0,0,0.10); --ease: cubic-bezier(.2,.7,.2,1); --font-body: 'Poppins', sans-serif; --font-display: 'Poppins', sans-serif; /* ÉN FONT I HELE APPEN (Kenneth 24.07, «for 150. gang»): mono-tokenet peker nå på Poppins — alt som brukte JetBrains Mono (etiketter, tall, formler) blir samme font som resten. Sifferjustering ivaretas av font-variant-numeric: tabular-nums der det trengs, ikke av egen fontfamilie. */ --font-mono: 'Poppins', system-ui, sans-serif; /* Typografi-skala — px-tokens (Kenneth 22.07: aldri hardkod fontstørrelser lokalt). Semantiske trinn: 2xs = mono-etiketter, base = brødtekst, lg = framhevet lesetekst, xl = underoverskrift, 2xl = stor. Lesetekst i Poppins. */ --fs-2xs: 10.5px; --fs-xs: 12px; --fs-sm: 13.5px; --fs-base: 15px; --fs-md: 16px; --fs-lg: 17.5px; --fs-xl: 19px; --fs-2xl: 26px; --lh-base: 1.55; --gold: #e4b86e; --gold-line: rgba(228,184,110,.32); --gold-soft: rgba(228,184,110,.12); --grad-mid: #8b5cf6; /* midtstopp i brand-gradienten */ --grad-end: #b9a1fb; /* sluttstopp i brand-gradienten */ --grad-tail: #ede9ff; /* lys hale (SVG-flater i om/min side) — NB: --grad-soft er opptatt (flate-gradient) */ --grad: linear-gradient(135deg, var(--brand) 0%, var(--grad-mid) 50%, var(--grad-end) 100%); --grad-soft: linear-gradient(135deg, rgba(113,50,245,.06), rgba(139,92,246,.06)); --high: #c2410c; --high-bg: rgba(194,65,12,.10); --idle: #9a9a9f; --idle-soft: rgba(154,154,159,.12); --ink: #101114; --ink-2: #23242c; --ink-3: #5b5b60; --ink-4: #71717a; --ink-5: #c4c3c5; --line: #dedee5; --line-hair: rgba(14,14,16,.09); --line-mid: #e1e1dd; --line-soft: #ebebf1; --low: #3f6212; --low-bg: rgba(63,98,18,.10); --maja-base: 160ms; --maja-ease: cubic-bezier(.2,.8,.2,1); --maja-fast: 140ms; --med: #a16207; --med-bg: rgba(161,98,7,.10); --mira-dur-base: 240ms; --mira-dur-fast: 180ms; --mira-dur-slow: 420ms; --mira-dur-soft: 320ms; --mira-ease-out: cubic-bezier(0.16, 1, 0.3, 1); --mira-ease-soft: cubic-bezier(0.25, 0.46, 0.45, 0.94); --neg-line: rgba(244,162,148,.32); --pastel: #9d7bff; --pastel-soft: #ede9ff; --pending: var(--brand); --pending-soft: var(--brand-soft); --pos-line: rgba(132,204,148,.32); --rad-lg: 14px; --rad-md: 10px; --scholar: var(--brand-2); --scholar-soft: var(--brand-soft); --scrollbar-thumb: #c4c3c5; /* B-pakka (Kenneth 12.07): elevasjons-skygger AVVIKLET — to-tone lerret + hårlinjer bærer dybden. Tokenene beholdes som eneste lovlige kanal (flat-vakt nekter rå literaler) og står som none. Fokus-/hårlinje-ringer (0 0 0 / inset 0 0 0) er IKKE skygger og består. */ --sh-1: none; --sh-2: none; --sh-card: none; --shadow-md: none; --shadow-sm: none; --surface: #ffffff; --surface-2: #fbfbf9; --surface-3: #f0f0ed; --surface-deep: #f0f0ed; --surface-muted: #fbfbf9; --top-alpha: .85; --top-bg: 246, 246, 244; --top-bg-rgb: 246, 246, 244; --vit-fg: #14161B; --vit-fg-2: #4A4D55; --vit-fg-3: #7A7E88; --vit-fg-4: #B8BAC1; --vit-neg: #c62828; --vit-rule: #e2e2df; --vsb-closed: 64px; --vsb-open: 240px; --warn-line: rgba(228,184,110,.32); /* Font: Poppris er appens kanoniske font (satt øverst i blokka). Tidligere Space Grotesk/Inter Tight-overstyring fjernet 21.06 — sidene forente til ÉN kilde. */ } /* ===== NY STANDARD (Kraken, 10.06) — semantiske tokens for de nye flatene. ÉN kilde: flatene skal IKKE redeklarere palett lokalt. Overstyrer eldre verdier over. ===== */ :root, [data-theme="lys"] { --surface-2: #f5f4fa; --surface-3: #edecf5; --menu-bg: var(--surface-2); --olive: #686b82; --stone: #9497a9; --chart-start: #b9a1fb; --chart-prev: #e2e1ea; /* «i fjor»-serie i grafer (tidligere hardkodet i ECharts-tema) */ --sim-turkis: #0fb5ac; /* simulert «med din endring»-serie i Framover — turkis, tydelig distinkt fra brand-lilla (basis-anslag) og pos-grønn (Kenneth 23.07) */ --brand-tint: color-mix(in srgb, var(--brand) 30%, transparent); --brand-warm: color-mix(in srgb, var(--brand) 58%, #ffffff); --pos: #149e61; --pos-soft: rgba(20,158,97,.12); --neg: #d23d52; --neg-soft: color-mix(in srgb, #d23d52 12%, transparent); --warn: #b45309; --warn-soft: rgba(180,83,9,.12); --vit-ok: var(--pos); --vit-pos: var(--pos); --vit-warn: var(--brand); --vit-warn-soft: rgba(180,83,9,.10); --up: #149e61; --dn: #d23d52; --deep: #1d1640; --cost: #c9c3b8; --on-brand: #ffffff; /* tekst/ikon på brand-flate (knapper, slider-thumb-kant) */ --scrim: rgba(20,22,28,.45); /* modal/overlay-bakgrunn */ --r: 12px; /* kort-radius (alias for sidene som brukte --r) */ --r-sm: 9px; --r-pill: 999px; --marker-valgt: 0 0 0 2px var(--brand-soft); /* overordnet valg-markering (ring) — brukes på KPI-/valgkort */ --kort-overskrift: var(--brand-2); /* overskrift/etikett på KPI-kort og kort generelt — brand, ALDRI svak grå (Kenneth 25.06) */ --display: var(--font-display); --body: var(--font-body); --mono: var(--font-mono); } /* === SCROLLBAR — lilla pill (global standard, Kenneth 11.06) === */ *{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--brand,#7132f5) 35%,transparent) transparent} ::-webkit-scrollbar{width:8px;height:8px} ::-webkit-scrollbar-track{background:transparent} ::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--brand,#7132f5) 32%,transparent);border-radius:999px} ::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--brand,#7132f5) 50%,transparent)}