/* Life OS - lyst, skandinavisk designsprog. Den visuelle sandhed er
   docs/LIFE-OS-DESIGN-LYS.html og reglerne docs/LIFE-OS-DESIGN-SPEC.md.
   Varmt papir, salvie til liv, ler kun til det der kraever dig. Stemme foerst.
   Afhaengigheds-fri: skrifter self-hostes i /static/fonts (ingen ekstern CDN). */

@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/space-grotesk-400.woff2') format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/space-grotesk-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/jetbrains-mono-400.woff2') format('woff2')}

:root{
  color-scheme: light;
  --paper:#F3F2EC; --paper-2:#FBFBF8; --paper-3:#ECEAE1;
  --line:rgba(38,36,30,.10); --line-2:rgba(38,36,30,.06);
  --ink:#21231F; --text-2:#6E6F68; --text-3:#A4A39B;
  --sage:#6F9E8C; --sage-soft:#8FB3A3; --sand:#E3C7A8; --clay:#BE7E5D;
  --sage-ink:#16241E; --sage-deep:#2C4A3F; --clay-deep:#9A5E3E;
  --display:'Space Grotesk',sans-serif; --ui:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
  --top-h:58px; --dock-h:88px; --rail-w:248px;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0}
/* iOS-robust grundlag: laas ALDRIG viewporten. Dokumentet ruller frit som en
   normal side, saa pinch-zoom, URL-bjaelken der folder sig, og overscroll virker
   som de skal. Top og dock goeres sticky laengere nede i stedet for at laase body
   med overflow:hidden + fast 100dvh (det gav hvidt bagved og forsvindende skaerm). */
html{
  -webkit-text-size-adjust:100%; background:var(--paper);
  overflow-x:hidden;                 /* aldrig vandret scroll (WCAG 2.2 reflow). html er
                                        sidens scroller, saa sticky + zoom virker stadig. */
  overscroll-behavior-y:none;
  scroll-padding-top:var(--top-h); scroll-padding-bottom:var(--dock-h);
}
body{
  min-height:100vh; min-height:100dvh; display:flex; flex-direction:column;
  background:radial-gradient(130% 100% at 72% 12%, #FBFAF6 0%, var(--paper) 52%, #EFEDE4 100%);
  color:var(--ink); font-family:var(--ui); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* Tilgaengelighed */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:.5rem;top:-3rem;z-index:100;background:var(--sage);color:var(--sage-ink);padding:.6rem 1rem;border-radius:.7rem;font-weight:500;text-decoration:none}
.skip:focus{top:.5rem}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px;border-radius:8px}

/* ---------- Topbjaelke ---------- */
.top{
  position:sticky; top:0; z-index:20; min-height:var(--top-h); flex:0 0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 22px; padding-top:env(safe-area-inset-top);
  border-bottom:1px solid var(--line-2);
  background:rgba(243,242,236,.82);
  backdrop-filter:saturate(1.2) blur(12px); -webkit-backdrop-filter:saturate(1.2) blur(12px);
}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:500;letter-spacing:.34em;font-size:13px;color:var(--ink);background:none;border:0;padding:0;cursor:pointer}
.rail .rlabel.sub{margin-top:18px}
.heart{position:relative;width:8px;height:8px;border-radius:50%;background:var(--sage);flex:0 0 auto}
.heart::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--sage);opacity:.5;animation:halo 3.4s ease-out infinite}
.clock{font-family:var(--mono);font-size:12px;color:var(--text-3);letter-spacing:.05em}
.top-right{display:flex;align-items:center;gap:16px}
.listen{display:none;align-items:center;gap:9px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-2)}
body[data-state="listening"] .listen{display:flex}
.bars{display:flex;align-items:flex-end;gap:2px;height:13px}
.bars i{width:2px;height:5px;background:var(--sage);border-radius:2px;animation:eq 1.1s ease-in-out infinite}
.bars i:nth-child(2){animation-delay:.18s}.bars i:nth-child(3){animation-delay:.36s}
.bars i:nth-child(4){animation-delay:.1s}.bars i:nth-child(5){animation-delay:.28s}
.me{width:30px;height:30px;min-height:0;padding:0;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:12px;color:var(--text-2);background:var(--paper-2);cursor:pointer}
.me:hover{border-color:var(--sage)}

/* ---------- Rolig menu under initialen ---------- */
.menu{
  position:absolute; top:calc(var(--top-h) - 4px); right:18px; z-index:60;
  min-width:210px; padding:8px; border-radius:16px;
  background:var(--paper-2); border:1px solid var(--line);
  box-shadow:0 24px 60px -30px rgba(46,42,34,.45);
  display:flex; flex-direction:column; gap:2px;
}
.menu button{
  justify-content:flex-start; text-align:left; width:100%;
  background:transparent; border:none; border-radius:10px; min-height:42px;
  padding:.5rem .7rem; color:var(--ink); font-size:14.5px; cursor:pointer;
}
.menu button:hover{background:var(--paper-3)}
.menu button[aria-current="page"]{background:rgba(111,158,140,.12);color:var(--sage-deep)}
.menu .sep{height:1px;background:var(--line-2);margin:6px 4px}

/* ---------- Hovedomraade + visninger ---------- */
#main{position:relative;flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
/* Visninger ruller med dokumentet (ingen indre overflow-laas). Een scroller paa
   siden = zoom og scroll slaas ikke ihjel af hinanden paa iOS. min-width:0 hele
   vejen ned, saa intet barn kan tvinge siden bredere end skaermen (vandret scroll). */
.view{flex:1 1 auto;width:100%;min-width:0}
/* Panel-skaerme (ikke hjem): roligt papir, rigeligt luft, aldrig en taet formular-stak */
.view-panel{max-width:760px;margin:0 auto;padding:40px 24px 48px}
.view-panel h2{font-family:var(--display);font-weight:500;font-size:26px;letter-spacing:-.01em;margin:0 0 6px}
.view-panel > .lead{color:var(--text-2);font-size:15px;margin:0 0 26px;max-width:62ch}
.view-panel h3{font-family:var(--display);font-weight:500;font-size:15px;letter-spacing:.01em;color:var(--ink);margin:30px 0 12px}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-3);margin:0 0 12px}

/* ---------- Hjem: kanter + scene + dock ---------- */
.view-home{display:grid;grid-template-columns:var(--rail-w) minmax(0,1fr) var(--rail-w)}
.rail{padding:26px 22px;overflow-y:auto}
.rail.left{border-right:1px solid var(--line-2)}
.rail.right{border-left:1px solid var(--line-2)}
.rlabel{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--text-3);margin-bottom:20px}
.rail-empty{font-size:13px;color:var(--text-3);line-height:1.5}

/* I DAG tidslinje */
.tl{position:relative;padding-left:20px}
.tl::before{content:"";position:absolute;left:4px;top:5px;bottom:6px;width:1px;background:var(--line)}
.ev{position:relative;margin-bottom:22px}
.ev .dot{position:absolute;left:-20px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--paper);border:1px solid var(--text-3)}
.ev.now .dot{left:-21px;width:11px;height:11px;border:none;background:var(--sage);box-shadow:0 0 0 4px rgba(111,158,140,.16)}
.ev.flag .dot{border-color:var(--clay);box-shadow:0 0 0 3px rgba(190,126,93,.14)}
.ev .t{font-family:var(--mono);font-size:11px;color:var(--text-3);letter-spacing:.04em}
.ev .ti{font-size:13.5px;color:var(--ink);margin-top:2px}
.ev.free .ti{color:var(--text-3)}
.ev.now .ti{color:var(--sage-deep)}
.ev .meta{font-size:11.5px;color:var(--text-2);margin-top:1px}
.ev.flag .meta{color:var(--clay)}

/* TRAADE konstellation + aflaesninger */
.threads-viz{width:100%;height:auto;display:block;margin-bottom:8px}
.reads{margin-top:14px;display:flex;flex-direction:column;gap:9px}
.stat{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--text-2);display:flex;gap:8px;align-items:center}
.stat b{color:var(--ink);font-weight:500}
.stat .pip{width:5px;height:5px;border-radius:50%;background:var(--text-3);flex:0 0 auto}
.stat.warn .pip{background:var(--clay)}

/* Scene */
.stage{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 40px}
/* Tilstedeværelsen er nu den levende Canvas-orb (orb.js) i den flydende #orb. Dens tilstande
   (aande/arbejde) styres af LifeOrb.setBusy() fra setState(), ikke af CSS-animationer. */

.reading{max-width:600px}
.read{font-family:var(--display);font-weight:500;font-size:32px;letter-spacing:-.012em;color:var(--ink);line-height:1.2}
.read .dim{color:var(--text-2)}
.sub{font-family:var(--ui);color:var(--text-2);font-size:16px;margin-top:15px;max-width:470px;margin-left:auto;margin-right:auto}
.talk{margin-top:28px;display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:999px;border:1px solid rgba(111,158,140,.4);background:rgba(111,158,140,.08);color:var(--sage-deep);font-size:15px;font-family:var(--ui);cursor:pointer;min-height:44px}
.talk:hover{background:rgba(111,158,140,.14)}
.talk .mic{width:16px;height:16px;color:var(--sage)}

/* Samtale i scenen */
.conversation{width:100%;max-width:640px;min-width:0;display:flex;flex-direction:column;gap:10px;text-align:left;margin-top:4px}
.msg{width:-webkit-fit-content;width:fit-content;max-width:88%;padding:.65rem .9rem;border-radius:14px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;font-size:15px;line-height:1.5}
.msg.me{align-self:flex-end;background:rgba(111,158,140,.14);color:var(--ink)}
.msg.bot{align-self:flex-start;background:var(--paper-2);border:1px solid var(--line)}
.msg.note{align-self:center;color:var(--text-2);font-size:13px;border:1px dashed var(--line);background:transparent}

/* ---------- Mikrofon-knap (genbruges i chat-composeren) ---------- */
.mic-btn{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;min-height:0;padding:0;border:none;background:transparent;color:var(--sage);border-radius:9px;cursor:pointer}
.mic-btn:hover{background:var(--paper-3)}
.mic-btn[aria-pressed="true"]{background:rgba(111,158,140,.16)}

/* ---------- Knapper ---------- */
.btn{min-height:44px;min-width:44px;padding:.55rem 1.05rem;font-size:15px;font-family:var(--ui);border-radius:12px;border:1px solid var(--line);background:var(--paper-2);color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.45rem}
.btn:hover{border-color:var(--sage)}
.btn-primary{background:var(--sage);color:var(--sage-ink);border-color:var(--sage);font-weight:500}
.btn-primary:hover{background:#67978a;border-color:#67978a}
.btn-ghost{background:transparent;border-color:transparent;color:var(--text-2)}
.btn-ghost:hover{background:var(--paper-3);border-color:transparent}
.btn-icon{padding:0;width:44px;color:var(--sage);background:transparent;border-color:transparent}
.btn-icon:hover{background:var(--paper-3)}
.btn[aria-pressed="true"]{border-color:var(--sage);background:rgba(111,158,140,.12)}
.btn-danger{color:var(--clay-deep);border-color:rgba(190,126,93,.4)}

/* ---------- Felter ---------- */
.field-block{display:flex;flex-direction:column;gap:.35rem;margin:0 0 1rem}
.field-block > label{font-size:13px;color:var(--text-2)}
.field-block.check{flex-direction:row;align-items:center;gap:.55rem}
.field-block.check > label{color:var(--ink)}
input[type="text"],input[type="email"],input[type="password"],input:not([type]),textarea{min-height:46px;padding:.65rem .85rem;font-size:16px;font-family:var(--ui);background:var(--paper-2);color:var(--ink);border:1px solid var(--line);border-radius:12px;width:100%}
textarea{resize:vertical;line-height:1.5}
input:focus-visible,textarea:focus-visible{border-color:var(--sage);outline-offset:0}
input[type="checkbox"]{width:24px;height:24px;min-height:0;accent-color:var(--sage)}
.hint{color:var(--text-2);font-size:14px}

/* Lister + flader */
.list{list-style:none;padding:0;margin:.4rem 0;display:flex;flex-direction:column;gap:.5rem}
.list li{border:1px solid var(--line);border-radius:13px;padding:.7rem .9rem;background:var(--paper-2);display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:14.5px}
.list li.hint{border-style:dashed;color:var(--text-3);background:transparent}
.result{margin-top:1rem;padding:.9rem;border:1px solid var(--line);border-radius:13px;background:var(--paper-2);word-break:break-word}
/* Admin v2 (Maal 14 del 2d): stakket panel pr. bruger, mobil-foerst, ingen vandret overloeb */
.admin-sec{width:100%;margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--line)}
.admin-sec:first-child{margin-top:0;padding-top:0;border-top:0}
.admin-sec-title{margin:0 0 .45rem;font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3)}
.admin-sec>.hint{margin:.35rem 0 0}
.admin-sec select.tw-field{max-width:22rem}
.admin-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.4rem}
#userList>li{align-items:flex-start}
#userList>li>div:first-child{overflow-wrap:anywhere}
.list.audit li{display:block;font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--text-2);overflow-wrap:anywhere}
/* LinkedIn-kø (spec 0046 del 15e): stakket opslag med handlinger + feedback, mobil-foerst */
.li-post{flex-direction:column;align-items:stretch;gap:.4rem}
.li-post .prose{margin:.2rem 0;white-space:pre-wrap;overflow-wrap:anywhere}
.li-post .brief-actions{flex-wrap:wrap;flex-shrink:1}
.li-fb{margin-top:.2rem}
.li-fb input{flex:1 1 12rem;min-width:0}
.prose{white-space:pre-wrap;word-wrap:break-word;font-family:var(--ui);line-height:1.6;margin:.6rem 0;color:var(--ink)}
.card{border:1px solid var(--line);border-radius:18px;padding:22px;background:var(--paper-2)}
code{font-family:var(--mono);color:var(--sage-deep);word-break:break-all;background:var(--paper-3);padding:1px 6px;border-radius:6px}
.msg-ok{color:var(--sage-deep)}
.msg-err,.msg[role="alert"]{color:var(--clay-deep);min-height:1.2em}
.msg[role="alert"]:empty{min-height:0}

/* QR til 2-faktor */
#twofa img{background:#fff;padding:10px;border-radius:12px;width:184px;height:184px;border:1px solid var(--line)}
#twofa .field-block,#twofa .btn{margin-top:.7rem}
/* Recovery-koder (spec 0055): laesbar boks der ombryder, aldrig vandret overloeb ned til 320px. */
#twofa .recovery{margin-top:.9rem;padding:.8rem .9rem;background:var(--paper-2);border:1px solid var(--line);border-radius:12px}
#twofa .recovery h4{margin:0 0 .35rem;font-family:var(--display);font-size:15px;font-weight:600;color:var(--ink)}
#twofa .recovery p{margin:0}
#twofa .recovery ul{list-style:none;margin:.55rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
#twofa .recovery li{font-family:var(--mono);font-size:14px;letter-spacing:.02em;color:var(--sage-deep);background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:.25rem .5rem}

/* Rundvisning som modal */
/* Rundvisning: et ikke-blokerende bund-kort, saa man SER appen (og det fremhaevede element) bag det. */
.tour{position:fixed;left:0;right:0;bottom:0;z-index:80;display:flex;justify-content:center;padding:0 14px calc(14px + env(safe-area-inset-bottom));pointer-events:none}
.tour-card{pointer-events:auto;background:var(--paper-2);border:1px solid var(--line);border-radius:20px;padding:20px 22px;max-width:30rem;width:100%;box-shadow:0 24px 70px -26px rgba(46,42,34,.55)}
/* Det aktuelle trins element fremhaeves med en salvie-ring (uden at aendre dets position). */
.tour-spot{outline:3px solid var(--sage);outline-offset:4px;border-radius:14px;box-shadow:0 0 0 7px rgba(111,158,140,.16)}
.tour-card h2{font-family:var(--display);font-weight:500;font-size:19px;margin:0 0 .5rem}
.tour-card p{color:var(--text-2);margin:0}
.tour-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:1.2rem}
.tour-actions{display:flex;gap:.5rem}

/* ---------- Simpel tilstand: kun tilstedevaerelse, laesning og en knap ---------- */
body[data-mode="simple"] .rail,
body[data-mode="simple"] .dock,
body[data-mode="simple"] .stage .conversation{display:none !important}
body[data-mode="simple"] .view-home{grid-template-columns:minmax(0,1fr)}
body[data-mode="simple"] .stage{padding-bottom:48px}
.talk-simple{display:none;margin-top:30px;width:100%;max-width:320px;padding:15px;border-radius:16px;border:none;font-family:var(--ui);font-size:16px;font-weight:500;color:var(--sage-ink);background:var(--sage);align-items:center;justify-content:center;gap:9px;cursor:pointer;min-height:52px}
.talk-simple .mic{width:18px;height:18px}
body[data-mode="simple"] .talk{display:none}
body[data-mode="simple"] .talk-simple{display:inline-flex}

/* ---------- Responsiv: telefon. Kanterne skjules, kun midten ---------- */
@media (max-width:860px){
  :root{--rail-w:0px}
  .view-home{grid-template-columns:minmax(0,1fr)}  /* minmax(0,..) - ellers har 1fr et
                                                       min-content-gulv der kan tvinge siden
                                                       bredere end skaermen (vandret scroll) */
  .rail{display:none}
  .read{font-size:25px}
}
@media (max-width:520px){
  .top{padding:0 16px}
  .clock{display:none}
  .view-panel{padding:28px 18px 40px}
}

/* Tesla: bred, lav, berorings-let. Kun midten, minimal bevaegelse. */
@media (min-aspect-ratio:2/1) and (max-height:820px){
  .rail{display:none}
  .view-home{grid-template-columns:1fr}
  .read{font-size:30px}
}

/* ---------- Respekter reduceret bevaegelse: frys alt ---------- */
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}

@keyframes halo{0%{transform:scale(1);opacity:.5}100%{transform:scale(2.4);opacity:0}}
@keyframes eq{0%,100%{height:4px}50%{height:13px}}
@keyframes drift{0%,100%{opacity:.55}50%{opacity:.9}}

/* ---------- Hukommelse: knowledge-graph-skaerm ---------- */
.view-graph{display:flex;flex-direction:column;max-width:none;padding:0;overflow:hidden}
.graph-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:22px 26px 14px;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.graph-head h2{font-family:var(--display);font-weight:500;font-size:24px;letter-spacing:-.01em;margin:0}
.graph-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.graph-tools input[type="search"]{min-width:0;width:100%;min-height:44px;padding:.6rem .85rem;font-size:16px;font-family:var(--ui);background:var(--paper-2);color:var(--ink);border:1px solid var(--line);border-radius:12px}
.graph-tools input[type="search"]:focus-visible{border-color:var(--sage)}
.graph-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 340px}
.graph-canvas{position:relative;overflow:hidden}
.graph-canvas svg{width:100%;height:100%;display:block;animation:fadein .5s ease both}
.gv-edge{stroke:var(--line);stroke-width:1}
.gv-node{cursor:pointer}
.gv-node circle{fill:rgba(255,255,255,.6);stroke:var(--text-3);stroke-width:1.2;transition:opacity .2s,stroke-width .2s}
.gv-node.person circle{fill:rgba(111,158,140,.3);stroke:var(--sage)}
.gv-node.project circle{fill:rgba(255,255,255,.75);stroke:var(--sage)}
.gv-node.note circle{fill:rgba(255,255,255,.6);stroke:var(--text-3)}
.gv-node.ghost circle{fill:transparent;stroke:var(--text-3);stroke-dasharray:3 3}
.gv-node.flag circle{stroke:var(--clay);fill:rgba(190,126,93,.14)}
.gv-node text{font-family:var(--mono);font-size:9px;fill:var(--text-2);pointer-events:none}
.gv-node.hot circle{stroke-width:2.2}
.graph-canvas.dim .gv-node:not(.hot) circle{opacity:.22}
.graph-canvas.dim .gv-node:not(.hot) text{opacity:.12}
.graph-canvas.dim .gv-edge:not(.hot){opacity:.1}
.gv-empty{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--text-3);font-size:14px;line-height:1.6;padding:30px}
.graph-panel{border-left:1px solid var(--line-2);padding:22px;overflow-y:auto;background:var(--paper-2)}
.graph-panel h3{font-family:var(--display);font-weight:500;font-size:18px;margin:0 0 6px}
.graph-panel .chip-kind{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:14px}
.graph-panel .note-body{font-size:14.5px;line-height:1.6;color:var(--ink);white-space:pre-wrap;word-wrap:break-word}
.graph-panel .backlinks{margin-top:20px;border-top:1px solid var(--line-2);padding-top:14px}
.graph-panel .backlinks .rlabel{margin-bottom:10px}
.wikilink{font-family:inherit;font-size:inherit;color:var(--sage-deep);background:rgba(111,158,140,.12);border:none;border-radius:6px;padding:1px 7px;margin:0 1px;cursor:pointer;min-height:0}
.wikilink:hover{background:rgba(111,158,140,.2)}
.wikilink.ghost{color:var(--text-3);background:var(--paper-3)}
.gv-results{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.gv-results li{border:1px solid var(--line);border-radius:11px;padding:.55rem .7rem;background:var(--paper);font-size:13px}
.gv-results li.hit{cursor:pointer}
.gv-results li.hit:hover{border-color:var(--sage)}
.gv-results .where{font-family:var(--mono);font-size:10px;color:var(--text-3);display:block;margin-bottom:2px}
@media (max-width:820px){
  .graph-body{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .graph-panel{border-left:none;border-top:1px solid var(--line-2);max-height:44%}
}
@keyframes fadein{from{opacity:0}to{opacity:1}}

/* ---------- Briefing (stabschef) ---------- */
.brief-tabs{display:flex;gap:6px;margin:4px 0 18px}
.brief-tab{min-height:40px;padding:.4rem 1.1rem;border-radius:999px;border:1px solid var(--line);background:var(--paper-2);color:var(--text-2);font-size:14px;font-family:var(--ui);cursor:pointer}
.brief-tab[aria-pressed="true"]{background:rgba(111,158,140,.14);border-color:var(--sage);color:var(--sage-deep)}
.brief-greeting{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:-.01em;color:var(--ink);margin:0 0 22px}
.brief-sec{border:1px solid var(--line);border-radius:16px;background:var(--paper-2);padding:14px 18px;margin-bottom:14px}
.brief-sec > h3{font-family:var(--display);font-weight:500;font-size:15px;margin:0 0 8px;color:var(--ink)}
.brief-sec.warn{border-color:rgba(190,126,93,.4)}
.brief-sec.warn > h3{color:var(--clay-deep)}
.brief-item{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-top:1px solid var(--line-2);font-size:14.5px;color:var(--ink)}
.brief-item:first-of-type{border-top:none}
.brief-item .txt{flex:1;min-width:0;line-height:1.5}
.brief-actions{display:flex;gap:6px;flex-shrink:0}
.brief-actions .btn{min-height:34px;min-width:0;padding:.25rem .65rem;font-size:12.5px;border-radius:9px}
.brief-empty{color:var(--text-3);font-size:14px;padding:18px 0}
.brief-config{margin-top:22px;border-top:1px solid var(--line-2);padding-top:6px}
.brief-config summary{cursor:pointer;color:var(--text-2);font-size:14px;padding:8px 0}
.brief-config h3{font-family:var(--display);font-weight:500;font-size:14px;margin:16px 0 8px}
.brief-inline{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.brief-inline input[type="text"]{flex:1;min-width:140px;width:auto}
.brief-inline select{min-height:46px;padding:.5rem .7rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-2);color:var(--ink);font-family:var(--ui)}
.brief-inline .check{margin:0}
@media (max-width:620px){.brief-item{flex-direction:column}.brief-actions{align-self:flex-start}}

/* --- Maal 4: madplan familie-bevidst, mail-kladder, capture-typer --- */
.btn-mini{min-height:34px;min-width:0;padding:.28rem .7rem;font-size:12.5px;border-radius:9px}
.btn-row{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0}

/* Forbindelser-hub: et kort pr. forbindelse + en aerlig "saadan gaar vi live"-note. */
.connect-card{margin:0 0 18px;border:1px solid var(--line);border-radius:16px;background:var(--paper-2);padding:18px 20px}
.connect-card h3{font-family:var(--display);font-weight:500;font-size:17px;margin:0 0 8px}
.connect-card h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin:14px 0 6px}
.connect-card #gActions{margin-top:10px}

/* Datadrevet hub (spec 0038): kortene stakker mobil-foerst. Mono-etiket til kind
   (OAUTH/TOKEN/WEBHOOK), salvie til liv (forbundet), aldrig alarm for en manglende kobling. */
.connector-cards{display:flex;flex-direction:column;min-width:0}
.connector-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;min-width:0}
.connector-head h3{min-width:0;overflow-wrap:anywhere}
.connector-kind{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap;flex:0 0 auto}
.connector-status{overflow-wrap:anywhere}
.connector-status.is-on{color:var(--sage-deep)}
.connector-actions{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}
.connector-actions:empty{margin-top:0}
/* Connector-handling (spec 0039): fritekst-felt + knap + svar, stakket og fuld bredde. */
.connector-action{flex:1 1 100%;display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:6px;min-width:0}
.connector-action textarea{min-width:0}
.connector-reply{width:100%;min-width:0;margin:0;padding:.7rem .9rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-3)}
.connect-note{background:rgba(111,158,140,.06);border-color:rgba(111,158,140,.28)}
.connect-note .list{margin:8px 0}
/* Aula-fornyelse (spec 0054): capture-knap + bookmarklet. Ler KUN naar handlingen kraeves
   (udløbet session); ellers stille. Ingen vandret overloeb: bookmarklet-koden ligger i et felt
   med width:100% + min-width:0, saa den ruller inde i feltet frem for at skubbe kortet. */
.aula-forny{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);width:100%;min-width:0}
.aula-forny h4{margin:0 0 4px;font-family:var(--display);font-weight:500;font-size:15px;letter-spacing:.01em}
.aula-forny-btn{display:inline-flex;margin-top:6px;text-decoration:none;background:var(--sage);color:var(--sage-ink);border-color:var(--sage);font-weight:500}
.aula-forny-btn:hover{background:#67978a;border-color:#67978a}
.aula-forny-urgent{background:var(--clay);border-color:var(--clay);color:#fff}
.aula-forny-urgent:hover{background:var(--clay-deep);border-color:var(--clay-deep)}
.aula-bookmarklet{display:inline-block;margin-top:10px;max-width:100%;padding:.5rem .9rem;border:1px dashed var(--clay);border-radius:11px;color:var(--clay-deep);text-decoration:none;font-family:var(--ui);font-size:14px;font-weight:500;cursor:grab;overflow-wrap:anywhere}
.aula-bm-copy input{font-family:var(--mono);font-size:14px}
.connect-note li{margin:.35rem 0;color:var(--text-2)}

.sub-connect,.family-editor{margin:.8rem 0;border:1px solid var(--line);border-radius:14px;background:var(--paper-2);padding:.4rem .9rem}
.sub-connect summary,.family-editor summary{cursor:pointer;color:var(--ink);font-size:14.5px;font-weight:500;padding:8px 0}
.sub-connect[open],.family-editor[open]{padding-bottom:1rem}

.member{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0}
.member input{flex:1 1 9rem;min-width:0;padding:.5rem .7rem;border:1px solid var(--line);border-radius:11px;background:var(--paper);font-family:var(--ui);font-size:14px;color:var(--ink)}
.member .m-del{flex:0 0 auto}

.madplan-days{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem;margin:1rem 0}
.day{border:1px solid var(--line);border-radius:15px;background:var(--paper-2);padding:.9rem 1rem}
.day-head{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}
.day-name{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.who{font-size:12px;color:var(--sage-deep)}
.day-dish{font-family:var(--display);font-size:17px;color:var(--ink);margin:.35rem 0 .7rem}
.fb-row{display:flex;gap:.4rem}
.fb-hit[aria-pressed="true"]{background:rgba(111,158,140,.16);border-color:var(--sage)}
.fb-miss[aria-pressed="true"]{background:rgba(190,126,93,.16);border-color:var(--clay)}

.shopping{margin-top:1rem}
.shopping .dept{margin:.6rem 0}
.shopping .dept h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin:.4rem 0}

.mail-toggle{margin:.6rem 0 1rem}
.switch{display:inline-flex;align-items:center;gap:.55rem;cursor:pointer;font-size:14.5px;color:var(--ink)}
.mail-line{flex:1 1 auto}

/* ============ Spec 0024: levende Canvas-orb (orb.js) + chat direkte på forsiden ============ */
/* Orben er ét fast flydende lag over indholdet (under menu). Selve visualet tegnes i et
   <canvas> af orb.js (perlemor-kugle + solkorona, aander/vandrer/arbejder). JS (placeOrb)
   sætter dens STØRRELSE og position: stor hero i midten på hjem, lille hjørne-boble ellers,
   og clamper den ALDRIG ud af skærmen. Blød glød fra canvas, ingen hårde ringe. */
.orb-fab{
  position:fixed; left:0; top:0; width:120px; height:120px; z-index:40;
  transform-origin:0 0; transform:translate(-300px,-300px);  /* JS overskriver; start uden for skærm */
  padding:0; border:0; background:transparent; cursor:grab;
  -webkit-tap-highlight-color:transparent; overflow:visible;
  touch-action:none;   /* vi ejer gestussen: traek scroller ikke siden (mus/touch/pen) */
  transition:transform .9s cubic-bezier(.4,.04,.2,1), width .9s cubic-bezier(.4,.04,.2,1), height .9s cubic-bezier(.4,.04,.2,1);
}
.orb-fab:active{ cursor:grabbing }
.orb-fab:focus-visible{outline:2px solid var(--sage); outline-offset:6px; border-radius:50%}
.orb-canvas{ width:100%; height:100%; display:block; pointer-events:none }
/* Et blødt løft kun når orben er den lille hjørne-boble (hero har sin egen canvas-glød). */
.orb-fab:not(.orb-hero){ filter:drop-shadow(0 6px 14px rgba(44,74,63,.22)) }

/* Hero-orben er position:fixed og centreret midt på skærmen, så den ligger OVENPÅ siden. På hjem
   reserverer vi derfor lodret plads, så første linje (læsning/samtale) sidder UNDER orben. Spaceren
   (--orb-spacer = vh/2 + heroSize*0.32) udledes af SAMME vh som orben og genberegnes på resize. */
body[data-orbhero="on"] .stage{
  justify-content:flex-start;
  padding-top:calc(var(--orb-spacer, 50vh) - var(--top-h));
}
/* Under en samtale skjules landings-hilsenen, saa beskederne ligger rent UNDER den centrerede orb. */
body[data-chatting="on"] .reading{ display:none }
.composer{
  position:sticky; bottom:0; z-index:30; flex:0 0 auto;
  display:flex; align-items:center; gap:10px; width:100%; max-width:760px; margin:0 auto;
  padding:12px 16px; padding-bottom:calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line-2);
  background:rgba(243,242,236,.92); backdrop-filter:saturate(1.2) blur(12px); -webkit-backdrop-filter:saturate(1.2) blur(12px);
}
.composer input[type="text"]{ flex:1 1 auto; min-width:0; width:auto; min-height:44px; border:none; background:transparent; color:var(--ink); font-family:var(--ui); font-size:16px }
.composer input[type="text"]:focus{ outline:none }

/* ===== Chat-overlay: KUN væk fra hjem. Orben åbner det oven på den side man står på. ===== */
.chat-overlay{
  position:fixed; inset:0; z-index:70; display:flex; align-items:flex-end; justify-content:center;
  background:rgba(33,35,31,.30); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
  animation:overlayIn .2s ease both;
}
@keyframes overlayIn{ from{opacity:0} to{opacity:1} }
.chat-sheet{
  width:100%; max-width:560px; height:min(86dvh,760px);
  display:flex; flex-direction:column; min-height:0;
  background:var(--paper-2); border:1px solid var(--line);
  border-radius:22px 22px 0 0; box-shadow:0 -24px 70px -30px rgba(46,42,34,.55);
  animation:sheetUp .28s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes sheetUp{ from{transform:translateY(16px)} to{transform:translateY(0)} }
@media (min-width:560px){
  .chat-overlay{ align-items:center; padding:22px }
  .chat-sheet{ border-radius:22px; height:min(80dvh,720px) }
}
.chat-head{ flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; padding:13px 18px; padding-top:calc(13px + env(safe-area-inset-top)); border-bottom:1px solid var(--line-2) }
.chat-title{ display:flex; align-items:center; gap:9px; font-family:var(--display); font-weight:500; letter-spacing:.18em; font-size:13px; color:var(--ink) }
.chat-close{ width:40px; height:40px; min-height:0; padding:0; border:none; background:transparent; color:var(--text-2); font-size:17px; border-radius:10px; cursor:pointer }
.chat-close:hover{ background:var(--paper-3) }
.chat-overlay .conversation{ flex:1 1 auto; min-height:0; max-width:none; margin:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; padding:16px; gap:10px }
.chat-composer{ flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:12px 14px; padding-bottom:calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--line-2) }
.chat-composer input[type="text"]{ flex:1 1 auto; min-width:0; width:auto; min-height:44px; border:none; background:transparent; color:var(--ink); font-family:var(--ui); font-size:16px }
.chat-composer input[type="text"]:focus{ outline:none }

/* --- Mål 19: orb-styrede boards. Roligt, papir, salvie, mono-etiketter. Mobil-først. --- */
.board-proposal{border:1px solid var(--sage-soft);background:var(--paper-2);border-radius:14px;padding:.9rem 1rem;margin:.2rem 0 1rem}
.board-proposal-title{font-family:var(--display);font-weight:500;font-size:17px;margin:0 0 .2rem}
.board-w-line{display:flex;align-items:center;gap:.5rem}
.board-widget-type{font-size:11px;color:var(--sage-deep);background:rgba(111,158,140,.14);border-radius:6px;padding:.1rem .4rem;flex:0 0 auto;text-transform:lowercase}
.board-list{margin:.4rem 0}
.board-card{display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.board-open{flex:1 1 auto;min-width:0;text-align:left;background:none;border:0;padding:0;cursor:pointer;font-family:var(--display);font-weight:500;font-size:15.5px;color:var(--ink);overflow-wrap:anywhere}
.board-count{flex:0 0 auto}
.board-detail{margin-top:1rem;display:flex;flex-direction:column;gap:.7rem}
.board-detail>h3{margin:.2rem 0}
.board-widgets{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:.7rem}
.board-widget{border:1px solid var(--line);background:var(--paper-2);border-radius:13px;padding:.75rem .85rem;min-width:0}
.board-widget-head{display:flex;align-items:center;gap:.5rem;margin:0 0 .25rem;flex-wrap:wrap}
.board-widget-title{font-weight:500;font-size:14.5px;overflow-wrap:anywhere}
.board-widget-src{font-family:var(--mono);font-size:11.5px;color:var(--text-3);overflow-wrap:anywhere;margin:0 0 .35rem}
.board-widget-lines{margin:.2rem 0}
.board-widget-lines li{border:0;background:transparent;padding:.12rem 0;font-size:13.5px;overflow-wrap:anywhere;display:block}
.board-widget-text{font-size:14px;overflow-wrap:anywhere}
.board-widget-metric{font-family:var(--display);font-weight:500;font-size:26px;color:var(--sage-deep);margin:.1rem 0}