/* Spilaspegill: blað liggur á næturbláu lestrarborði og skrefin fjögur birtast á því hvert af öðru. Spilin eru
   gömlu stokkarnir sjálfir, lögð á dökkan dúk eins og á borði lesarans. */
@font-face{font-family:Yuanmo;src:url('letur/yuanmo.woff2') format('woff2');font-display:swap}
@font-face{font-family:Yuanmo;src:url('letur/eth.ttf') format('truetype');font-display:swap;unicode-range:U+00F0}
:root{
 --nott:#1f1a2b;--nott2:#2b2440;--duk:#2f2746;--skuggi:#0d0b12;--a-nott:#f5efe1;--a-nott-dauft:#b9b1c6;
 --pappir:#fffbf0;--pappir2:#efe7d6;--blek:#2a2633;--blek-dauft:#625c6e;--gull:#f7d44c;--fokus:#6b4fd6;--raud:#b5412c;
 --hand:Yuanmo,'Comic Sans MS','Chalkboard SE',cursive;
 --texti:ui-rounded,'SF Pro Rounded',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
 --lestur:'Iowan Old Style','Palatino Linotype',Palatino,'Book Antiqua',Georgia,serif;
 --r:16px 11px 18px 10px;
 color-scheme:dark;font-synthesis:none;-webkit-text-size-adjust:100%;
}
*{box-sizing:border-box}
/* Árstíðaþemu líf.is lita síðuna með --page; borðið helst næturblátt. */
html{background:var(--nott)}
body{--page:var(--nott);margin:0;min-height:100%;display:flex;flex-direction:column;gap:18px;color:var(--a-nott);font:16px/1.5 var(--texti);
 padding-block:24px 32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
 background:radial-gradient(circle at 20% 30%,#ffffff1f 1px,transparent 1.6px) 0 0/97px 89px,radial-gradient(circle at 70% 60%,#ffffff16 1.2px,transparent 1.8px) 0 0/131px 117px,var(--nott)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--fokus);outline-offset:2px}
h1,h2,h3{font-family:var(--hand);font-weight:400;margin:0;line-height:1.15;text-wrap:balance}

/* ---------- Hausinn ---------- */
.haus{width:100%;max-width:1240px;margin:0 auto;display:flex;align-items:center;gap:clamp(12px,2.5vw,22px)}
.merki{flex:none;width:clamp(42px,6vw,58px);height:auto;overflow:visible}
.merki .skaft{stroke:var(--gull);stroke-width:5;stroke-linecap:round}
.merki .umgjord{fill:var(--nott2);stroke:var(--gull);stroke-width:3}
.merki .gler{fill:#f5efe11f;stroke:var(--a-nott-dauft);stroke-width:1.4}
.merki .stjarna{fill:var(--gull)}
.haus h1{font-size:clamp(40px,7.5vw,72px);letter-spacing:.02em;line-height:1;color:var(--a-nott);text-shadow:3px 3px 0 var(--nott2),5px 5px 0 #f7d44c8c}
.haus p{margin:6px 0 0;color:var(--a-nott-dauft);font-size:clamp(15px,1.9vw,17px);text-wrap:pretty}

/* ---------- Skrefin og blaðið ---------- */
.bord{width:100%;max-width:1240px;margin:0 auto;display:grid;gap:12px}
.skref{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0;padding:0;list-style:none;counter-reset:skref;scroll-margin-top:12px}
.skref li{counter-increment:skref;display:flex;align-items:center;gap:7px;padding:4px 12px 4px 5px;border:2px solid #ffffff3d;border-radius:999px;color:var(--a-nott-dauft);font-size:14.5px}
.skref li::before{content:counter(skref);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#ffffff1a;font-weight:700;font-size:13px}
.skref li.lokid{color:var(--a-nott);border-color:#ffffff66}
.skref li[aria-current]{color:var(--blek);background:var(--gull);border-color:var(--gull);font-weight:700}
.skref li[aria-current]::before{background:var(--blek);color:var(--gull)}
.blad{color-scheme:light;background:var(--pappir);color:var(--blek);border:3px solid var(--blek);border-radius:var(--r);box-shadow:8px 8px 0 var(--skuggi);min-height:min(520px,66vh);display:flex}
.rammi{flex:1;min-width:0;padding:clamp(18px,3.5vw,36px) clamp(14px,3.5vw,36px)}

/* Hnappar */
.hnappar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 18px}
.hnappar button,.bod>form button{min-width:112px;padding:8px 20px;background:var(--pappir2);color:var(--blek);border:2.5px solid var(--blek);border-radius:var(--r);box-shadow:3px 3px 0 var(--blek);font-weight:700;transition:transform .08s,box-shadow .08s}
.hnappar button.adal,.bod>form button{background:var(--gull)}
.hnappar button:hover,.bod>form button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--blek)}
.hnappar button:active,.bod>form button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--blek)}
input[type=radio],input[type=checkbox]{width:19px;height:19px;margin:0;flex:none;accent-color:var(--nott2)}
fieldset{margin:0;padding:0;border:0;min-width:0}
legend{padding:0;font-family:var(--hand);font-size:22px;margin-bottom:10px}
.skyring{margin:0;font-size:15px;color:var(--blek-dauft);text-wrap:pretty}
.skyring.abending{color:var(--raud);font-weight:600}

/* ---------- 1. Stokkur og lögn ---------- */
.val{display:grid;gap:28px}
.stokkar{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:14px}
.stokkur-val,.logn-val{position:relative;display:flex;gap:14px;align-items:center;padding:12px 14px;background:#fff;border:2.5px solid var(--blek);border-radius:var(--r);cursor:pointer;min-width:0}
.stokkur-val input,.logn-val input{position:absolute;opacity:0;pointer-events:none}
.stokkur-val:has(input:checked),.logn-val:has(input:checked){background:#fff7d1;box-shadow:4px 4px 0 var(--blek)}
.stokkur-val:has(input:focus-visible),.logn-val:has(input:focus-visible){outline:3px solid var(--fokus);outline-offset:2px}
.synis{flex:none;display:flex;padding-left:18px}
.synis img{width:62px;aspect-ratio:var(--hlutfall);object-fit:cover;border-radius:5px;border:1.5px solid var(--blek);margin-left:-18px;box-shadow:2px 2px 0 #0002;background:var(--pappir2)}
.synis img:nth-child(1){transform:rotate(-7deg)}.synis img:nth-child(3){transform:rotate(7deg)}
.stokkur-texti,.logn-texti{display:grid;gap:2px;min-width:0}
.stokkur-texti b,.logn-texti b{font-family:var(--hand);font-weight:400;font-size:20px}
.ar{color:var(--blek-dauft);font-size:14px}
.lysing{font-size:14.5px;line-height:1.4;color:var(--blek)}
.lagnir{display:grid;gap:16px}
.lagnaflokkur{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:10px}
.lagnaflokkur h3{grid-column:1/-1;font-size:17px;color:var(--blek-dauft)}
.smakort{flex:none;height:auto;max-height:64px}
.smakort rect{fill:var(--pappir2);stroke:var(--blek);stroke-width:1.2}
.smakort rect.thvers{fill:var(--gull)}
.smakort rect.summa{stroke-dasharray:2 1.5;fill:none}
.storu-val{margin-top:14px;font-size:15.5px}
.storu-val:has(input:disabled){color:var(--blek-dauft)}

/* ---------- 2. Spurningin ---------- */
.spurning{display:grid;gap:26px;align-content:start;max-width:760px;margin:0 auto}
.spurning-reitur{display:grid;gap:8px}
.spurning-reitur label{font-family:var(--hand);font-size:22px}
textarea{width:100%;padding:10px 12px;background:#fff;border:2.5px solid var(--blek);border-radius:12px 9px 13px 8px;font-size:17px;resize:vertical}
.akvordun{display:grid;gap:10px}
.akv-val{display:grid;gap:6px;padding:12px 14px;background:#fff;border:2px solid var(--blek);border-radius:12px}
.akv-val label{font-weight:600;font-size:15px;margin-top:4px}
select{padding:6px 8px;background:#fff;border:2px solid var(--blek);border-radius:9px;font-size:16px;max-width:100%}
.akv-spil{display:flex;align-items:center;gap:12px;margin-top:8px}
.akv-spil img{width:70px;border-radius:5px;border:1.5px solid var(--blek)}

/* ---------- 3. Spilin ---------- */
.spilin{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-content:start}
.spilin-hlid{display:grid;gap:14px;align-content:start}
@media (min-width:1080px){
 .spilin{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:start;column-gap:28px}
 .spilin .uppruni{grid-column:1/-1}
 .spilin-hlid{position:sticky;top:12px}
}
.uppruni{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding:10px 18px;border:2.5px solid var(--blek);border-radius:var(--r);background:#fff;justify-self:center}
.uppruni label,.akvordun>label,.storu-val{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:17px}
.spilin-stada{margin:0;text-align:center;font-weight:600;font-size:15.5px}
.bakhlid{border:2px solid var(--blek);border-radius:6px;
 background:radial-gradient(circle,var(--gull) 1.1px,transparent 1.7px) 0 0/9px 9px,var(--nott2);box-shadow:inset 0 0 0 3px var(--nott2),inset 0 0 0 4.5px var(--gull)}

/* ---------- Borðið ---------- */
.bordid{container-type:inline-size;min-width:0}
.logn{--bil:min(12px,2cqw);--merki:clamp(15px,3cqw,22px);--cw:min(112px,calc((100cqw - (var(--dalkar) + 1) * var(--bil)) / var(--dalkar)));--ch:calc(var(--cw) / var(--hlutfall));
 display:grid;justify-content:center;gap:0 var(--bil);padding:var(--bil);border-radius:var(--r);
 background:radial-gradient(circle at 30% 20%,#ffffff12 1px,transparent 1.5px) 0 0/43px 37px,var(--duk);border:3px solid var(--blek)}
.bordid.stort .logn{--cw:min(170px,calc((100cqw - 4 * var(--bil)) / 3))}
.stada{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;min-width:0}
.stada-heiti{position:relative;z-index:3;max-width:calc(var(--cw) * 1.3);min-height:var(--merki);text-align:center;font:calc(var(--merki) * .62)/1.1 var(--hand);color:var(--a-nott);hyphens:manual}
.spil{position:relative;display:block;width:var(--cw);height:var(--ch);padding:0;border:0;border-radius:calc(var(--cw) * .06);background:var(--pappir2);overflow:hidden;box-shadow:3px 3px 0 var(--skuggi)}
.spil img{display:block;width:100%;height:100%;object-fit:cover}
button.spil:hover{transform:translateY(-2px);box-shadow:4px 6px 0 var(--skuggi)}
.spil.tomt{background:#ffffff0d;border:2px dashed #ffffff4d;box-shadow:none}
.spil.tomt.naest{border-color:var(--gull);background:#f7d44c1a}
.spil.reiknad{border-style:dotted}
.velja-hnappur{display:grid;place-items:center;color:var(--a-nott);font-size:calc(var(--cw) * .13);font-weight:700}
.velja-hnappur:hover{background:#f7d44c26;border-color:var(--gull)}
.spil.nytt{animation:snua .5s cubic-bezier(.2,.8,.3,1)}
@keyframes snua{0%{transform:rotateY(90deg) translateY(-10px);filter:brightness(.4)}}
/* Spil 2 liggur þvert yfir spil 1, eins og Waite lýsir; spil 1 sést fyrir ofan og neðan. */
.stada.thvers{z-index:2;pointer-events:none}
.stada.thvers .spil{pointer-events:auto;transform:rotate(90deg) scale(.82)}
.stada.thvers button.spil:hover{transform:rotate(90deg) scale(.86)}
.stada.thvers .spil.tomt{background:#2f2746e6}
.thvers-heiti{display:none}
/* Krossinn: dálkabilið rúmar spil 2 sem liggur þvert, og fjórði dálkurinn er mjótt bil á undan stafnum. */
.logn.keltn{--cw:min(112px,calc((100cqw - 2 * var(--bil) - 6px) / 5.6));column-gap:calc(var(--cw) * .3)}
.akv-undir{position:absolute;bottom:0;left:50%;transform:translate(-64%,2%) rotate(-7deg);filter:brightness(.82);z-index:0}
.akv-undir+.spil{z-index:1}
.stada.summa .stada-heiti{color:var(--gull)}
.reikningur{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);z-index:3;padding:1px 6px;border-radius:6px;background:#1f1a2be0;font-size:calc(var(--merki) * .55);color:var(--a-nott);font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- Blævængurinn ---------- */
.vaengur{display:grid;justify-items:center;gap:6px;padding:4px 0 0}
.vaengur-spil{--bw:58px;--bh:96px;--snun:260%;position:relative;width:100%;max-width:640px;height:calc(var(--bh) * 2.25);overflow:hidden}
.bakhlid{position:absolute;left:50%;bottom:6px;width:var(--bw);height:var(--bh);margin-left:calc(var(--bw) / -2);padding:0;
 transform-origin:50% var(--snun);transform:rotate(var(--h));transition:transform .14s;box-shadow:-2px 1px 3px #0009}
.bakhlid:hover,.bakhlid:focus-visible{transform:rotate(var(--h)) translateY(-16px);z-index:2}
.bakhlid:disabled{visibility:hidden}
.breidist .bakhlid{animation:breida .6s cubic-bezier(.2,.8,.3,1) backwards;animation-delay:calc(var(--i,0) * 6ms)}
@keyframes breida{from{transform:rotate(0deg)}}
.vaengur p{margin:0;max-width:62ch;text-align:center;text-wrap:pretty}

/* ---------- 4. Lesturinn ---------- */
.lesturinn{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-content:start}
@media (min-width:1080px){
 .lesturinn{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start}
 .lesturinn .bordid{position:sticky;top:12px}
}
.lestur{min-width:0;display:grid;gap:22px;font:17.5px/1.6 var(--lestur);outline:none}
.lestur-haus{display:grid;gap:8px}
.yfirlina{margin:0;font:14px/1.3 var(--texti);letter-spacing:.04em;text-transform:uppercase;color:var(--blek-dauft)}
.spurningin{margin:0;font-family:var(--hand);font-size:clamp(22px,3vw,28px);line-height:1.25;color:var(--nott2)}
.an-spurningar{margin:0;color:var(--blek-dauft)}
.kafli{display:grid;gap:10px}
.kafli h2{font-size:24px;padding-bottom:4px;border-bottom:2px solid var(--blek)}
.kafli p{margin:0;max-width:68ch;text-wrap:pretty}
.kafli ul{margin:0;padding-left:1.1em;display:grid;gap:8px;max-width:68ch}
.spil-lestur{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;align-items:start;padding-top:6px}
.spil-lestur h3{font:20px/1.25 var(--hand);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:4px}
.stoduheiti{font-size:15px;font-family:var(--texti);font-weight:700;letter-spacing:.02em;color:var(--blek-dauft)}
.reikn{font:14px var(--texti);color:var(--blek-dauft)}
.smamynd{padding:0;border:1.5px solid var(--blek);border-radius:5px;overflow:hidden;background:var(--pappir2);box-shadow:2px 2px 0 var(--blek)}
.smamynd img{display:block;width:100%}
.spilnafn{display:inline;padding:0;border:0;background:none;font:inherit;color:var(--nott2);font-weight:700;text-decoration:underline;text-decoration-color:var(--gull);text-decoration-thickness:3px;text-underline-offset:3px}
.spil-lestur h3 .spilnafn{text-decoration-thickness:2px}
.saman{white-space:nowrap}
.ihugun{font-style:italic;color:var(--blek-dauft)}
.spil-lestur .ihugun{margin-top:6px}
.hnotskurn{padding:16px 18px;background:#fff7d1;border:2.5px solid var(--blek);border-radius:var(--r);box-shadow:4px 4px 0 var(--blek)}
.hnotskurn h2{border-bottom:0}
.bod-spilanna b{font-family:var(--texti)}
.fyrirvari{margin:0;font:14px/1.4 var(--texti);color:var(--blek-dauft)}
.lestur-hnappar{justify-content:flex-start;font-family:var(--texti)}

/* ---------- Gluggar ---------- */
.bod{width:min(480px,calc(100vw - 32px));padding:0;background:var(--pappir);color:var(--blek);border:3px solid var(--blek);border-radius:var(--r);box-shadow:8px 8px 0 var(--skuggi)}
.bod::backdrop{background:#0d0b12b3}
.bod-titill{padding:20px 22px 0;font-size:24px}
.glugga-haus{display:flex;align-items:center;gap:10px;padding:12px 12px 10px 20px;border-bottom:2px dashed var(--blek)}
.glugga-haus h2{flex:1;min-width:0;font-size:clamp(20px,2.6vw,25px);overflow-wrap:anywhere}
.glugga-haus form{display:contents}
.loka{flex:none;display:grid;place-items:center;width:36px;height:34px;padding:0;background:var(--pappir2);border:2.5px solid var(--blek);border-radius:9px 7px 10px 6px;box-shadow:2px 2px 0 var(--blek)}
.loka svg{width:20px;height:20px;fill:none;stroke:var(--blek);stroke-width:2.6;stroke-linecap:round}
.loka:hover{background:var(--gull)}
.bod-efni{padding:14px 22px 6px;white-space:pre-line;text-wrap:pretty}
.bod>form{display:flex;justify-content:center;padding:16px 22px 22px}
.afrit{width:100%;font:13px/1.4 ui-monospace,monospace}
.spilgluggi{width:min(860px,calc(100vw - 24px));max-height:calc(100dvh - 24px)}
.spil-efni{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:22px;padding:20px;overflow:auto;max-height:calc(100dvh - 90px)}
.stor-mynd{width:100%;border-radius:8px;border:2px solid var(--blek);box-shadow:4px 4px 0 var(--blek);align-self:start;position:sticky;top:0}
.spil-upplysingar{display:grid;gap:6px;align-content:start;font:16.5px/1.55 var(--lestur)}
.spil-upplysingar h3{font-size:18px;margin-top:8px}
.spil-upplysingar p{margin:0}
.kjarni{font-size:19px;line-height:1.45}
.i-lestri{font:600 14.5px/1.4 var(--texti);color:var(--nott2);padding:6px 10px;background:#fff7d1;border-radius:8px}
.lykilord{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0;padding:0;list-style:none;font:14px var(--texti)}
.lykilord li{padding:2px 10px;border:1.5px solid var(--blek);border-radius:999px;background:#fff}
.heimild{font:13px/1.4 var(--texti);color:var(--blek-dauft);margin-top:8px!important}
.velja{width:min(900px,calc(100vw - 24px))}
.velja-efni{display:grid;gap:12px;padding:16px}
.velja-efni input{padding:8px 12px;border:2px solid var(--blek);border-radius:10px;background:#fff;font-size:16px}
.velja-spil{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;max-height:min(62vh,640px);overflow:auto;padding:4px}
.velja-spil button{display:grid;gap:4px;padding:4px;background:#fff;border:1.5px solid var(--blek);border-radius:8px;font-size:12.5px;line-height:1.2;text-align:center}
.velja-spil button:hover{background:#fff7d1}
.velja-spil button:disabled{opacity:.35;cursor:not-allowed}
.velja-spil img,.smamynd img{width:100%;aspect-ratio:var(--hlutfall,.56);object-fit:cover;border-radius:4px}

/* ---------- Eftirmáli ---------- */
.eftirmali{width:100%;max-width:1240px;margin:8px auto 0;display:grid;gap:12px;font-size:15px;color:var(--a-nott-dauft)}
.eftirmali h2{font-size:22px;color:var(--a-nott);margin-bottom:4px}
.eftirmali p{margin:0;max-width:80ch;text-wrap:pretty}
.eftirmali a{color:var(--a-nott)}
.heimildir-listi summary{cursor:pointer;width:max-content;font:22px/1.2 var(--hand);color:var(--a-nott)}
.heimildir{margin:10px 0 0;padding-left:1.1em;display:grid;gap:8px;max-width:90ch}

/* ---------- Mjóir skjáir ---------- */
@media (max-width:640px){
 body{padding-block:16px 24px}
 .blad{min-height:0}
 .rammi{padding:16px 12px}
 .hnappar{gap:10px 12px}
 .hnappar button{min-width:96px;padding:8px 14px}
 .spil-efni{grid-template-columns:minmax(0,1fr)}
 .stor-mynd{position:static;max-width:240px;justify-self:center}
 .spil-lestur{grid-template-columns:56px minmax(0,1fr)}
 .lestur{font-size:17px}
 .logn{--bil:6px}
 .vaengur-spil{--bw:44px;--bh:74px;--snun:240%}
 .skref li{font-size:13.5px;padding-right:10px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}