:root{
  --bg:#f4efe6;--bg2:#e6d3b0;--ink:#2b2118;--muted:#6f5f4e;--card:rgba(255,250,242,.86);--line:rgba(128,128,128,.28);
  --accent:#b4531f;--accent2:#d9902f;--ok:#3f7d4e;--warn:#c07a12;--bad:#b03a2e;--photo-op:.24;--radius:18px;
  --head:Georgia,"Times New Roman",serif;--body:system-ui,-apple-system,"Segoe UI",sans-serif;
}
[data-saeson=vinter]{--bg:#0f1b2d;--bg2:#1b2d4a;--ink:#f1f5fb;--muted:#a9b9d0;--card:rgba(20,36,62,.78);--accent:#c8362f;--accent2:#e8c36a;--ok:#6fcf97;--warn:#f2c94c;--bad:#ff8a80;--photo-op:.2}
[data-saeson=foraar]{--bg:#f3f8ec;--bg2:#dcecc9;--ink:#26331f;--muted:#5d7050;--card:rgba(255,255,255,.84);--accent:#d65a8a;--accent2:#7fb35a;--ok:#3f8a4a;--warn:#c18a1b;--bad:#b3392f;--photo-op:.26}
[data-saeson=sommer]{--bg:#fff7e0;--bg2:#ffe3a3;--ink:#1d3447;--muted:#4c6477;--card:rgba(255,255,255,.82);--accent:#ef6c3c;--accent2:#1fa3c4;--ok:#2f9a62;--warn:#d98a0b;--bad:#c63d2f;--photo-op:.3}
[data-saeson=efteraar]{--bg:#f4efe6;--bg2:#e6d3b0;--ink:#2b2118;--muted:#6f5f4e;--card:rgba(255,250,242,.86);--accent:#b4531f;--accent2:#d9902f}

*{box-sizing:border-box}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--bg);min-height:100vh;transition:background .5s,color .5s}
a{color:var(--accent2)}
h1,h2,h3{font-family:var(--head)}
h2{margin:30px 0 10px}
.muted{color:var(--muted)}

.kollage{position:fixed;inset:0;z-index:0;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:22vh;gap:6px;opacity:var(--photo-op);pointer-events:none;overflow:hidden}
.kollage i{display:block;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent2)) center/cover}
.kollage i:nth-child(3n){background-image:linear-gradient(200deg,var(--accent2),var(--bg2))}
.kollage i:nth-child(4n+1){grid-row:span 2}
.kollage i.foto{filter:saturate(.85)}
@media(max-width:700px){.kollage{grid-template-columns:repeat(3,1fr)}}
.slor{position:fixed;inset:0;z-index:1;background:radial-gradient(ellipse at 50% 0%,transparent 0,var(--bg) 90%);pointer-events:none}
.deko{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.deko span{position:absolute;top:-10%;font-size:var(--s,18px);opacity:.55;animation:fald var(--d,14s) linear infinite;animation-delay:var(--w,0s)}
@keyframes fald{to{transform:translate(var(--dx,30px),115vh) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.deko{display:none}}

nav.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 16px;background:var(--card);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav.top a{text-decoration:none;color:var(--ink)}
nav.top .logo{font-family:var(--head);font-weight:700;font-size:1.1rem}
nav.top .sp{flex:1}
nav.top form{margin:0}
.saeson button{font:inherit;border:1px solid var(--line);background:transparent;color:var(--ink);width:34px;height:30px;border-radius:99px;cursor:pointer}
.saeson button[aria-pressed=true]{background:var(--accent);border-color:var(--accent)}
.lnk{font:inherit;background:none;border:0;color:var(--accent2);cursor:pointer;text-decoration:underline;padding:0}

.skal{position:relative;z-index:2;max-width:1000px;margin:0 auto;padding:0 16px 60px}
.hero{text-align:center;padding:48px 0 12px}
.emoji{font-size:44px}
.hero h1,.login h1{font-size:clamp(28px,6vw,48px);margin:8px 0 6px}
.kort{background:var(--card);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.besked{background:var(--card);border-left:4px solid var(--accent2);border-radius:12px;padding:10px 14px;margin:16px 0}
.besked.fejl{border-color:var(--bad)}

.fliser{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.person{text-align:center;text-decoration:none;color:var(--ink);padding:16px 12px;transition:transform .2s;display:block}
.person:hover{transform:translateY(-3px)}
.avatar{width:54px;height:54px;border-radius:50%;margin:0 auto 8px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#fff;font-weight:700;font-size:20px}
.person small{color:var(--muted);display:block}

.login{max-width:380px;margin:0 auto;padding-top:60px;text-align:center}
.form{display:grid;gap:12px;text-align:left}
.form.smal{max-width:420px}
.form label{display:grid;gap:4px;font-size:.9rem;color:var(--muted)}
.raekke{display:grid;grid-template-columns:1fr 1fr;gap:12px}
input,select{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.9);color:#222;width:100%}
.knap{font:inherit;border:0;border-radius:99px;padding:9px 16px;background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap}
.knap.sek{background:transparent;color:var(--ink);border:1px solid var(--line)}

.tilbage{display:inline-block;margin-top:20px;text-decoration:none}
details.ny{margin:14px 0}
details.ny summary{cursor:pointer;font-weight:600}
details.ny .form{margin-top:12px}
.onske{display:grid;grid-template-columns:80px 1fr auto;gap:14px;align-items:center;margin-bottom:10px}
.onske .bill{width:80px;height:80px;border-radius:12px;background:linear-gradient(135deg,var(--bg2),var(--accent2)) center/cover}
.onske h3{margin:0 0 2px;font-size:1.05rem}
.onske h3 a{color:var(--ink)}
.onske .note{margin:4px 0;font-size:.9rem}
.onske .handl{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.onske .handl form{margin:0}
.res{font-size:.9rem}
.status{display:inline-flex;font-size:.82rem;padding:2px 10px;border-radius:99px;border:1px solid currentColor;margin-top:6px}
.ok{color:var(--ok)}.advar{color:var(--warn)}.ude{color:var(--bad)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line)}
code{background:rgba(128,128,128,.2);padding:2px 6px;border-radius:6px}
@media(max-width:600px){.onske{grid-template-columns:60px 1fr}.onske .bill{width:60px;height:60px}.onske .handl{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}.raekke{grid-template-columns:1fr}}
.alt{margin-top:8px;font-size:.88rem}
.alt ul{margin:4px 0 0;padding-left:18px}