/* perla — sami handteiknaði stíll og líf.is: Yuanmo, blekrammar og litaðir skuggar. */
@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{
 --ink:#2a2633;--soft:#6a6475;--paper:#fffbf0;--page:#f6f1e3;
 --gul:#f7d44c;--graen:#8fd18b;--bleik:#f6a5c9;--bla:#8ccaf2;--raud:#f07a63;--skogur:#6fb38a;--fjola:#b9a3e8;
 --gul-t:#fff3c4;--graen-t:#e2f5dc;--bleik-t:#fde3ef;--bla-t:#ddf0fc;--raud-t:#fde0d8;--skogur-t:#dcefe2;--fjola-t:#ece5fb;
 --hand:'Yuanmo','KN Yuanmo SC','Comic Sans MS','Chalkboard SE',cursive;
 --body:ui-rounded,'SF Pro Rounded',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
 --rudur:repeating-conic-gradient(#e9e3d3 0 25%,#fffbf0 0 50%) 0 0/22px 22px;
 color:var(--ink);font-family:var(--body);font-synthesis:none;-webkit-text-size-adjust:100%;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--page);overflow-x:hidden;line-height:1.45}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation}
:focus-visible{outline:3px dashed var(--ink);outline-offset:3px}
[hidden]{display:none!important}
.defs{position:absolute;width:0;height:0}
.c-gul{--c:var(--gul);--t:var(--gul-t)}.c-graen{--c:var(--graen);--t:var(--graen-t)}.c-bleik{--c:var(--bleik);--t:var(--bleik-t)}.c-bla{--c:var(--bla);--t:var(--bla-t)}.c-raud{--c:var(--raud);--t:var(--raud-t)}.c-fjola{--c:var(--fjola);--t:var(--fjola-t)}
.smatt{font-size:13.5px;color:var(--soft);margin:8px 0 0}

/* Haus */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:10px max(16px,3vw);background:color-mix(in oklab,var(--page) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.top::after{content:'';position:absolute;left:0;right:0;bottom:-3px;height:6px;background:var(--ink);clip-path:polygon(0 30%,8% 55%,19% 25%,33% 60%,47% 30%,61% 58%,74% 28%,88% 62%,100% 35%,100% 70%,88% 90%,74% 62%,61% 92%,47% 64%,33% 94%,19% 60%,8% 88%,0 66%)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);flex-shrink:0}
.brand img{width:42px;height:42px;transform:rotate(-10deg)}
.brand-text{display:grid;line-height:.84;transform:rotate(-3deg)}
.brand-name{font-family:var(--hand);font-size:40px;letter-spacing:-1px}
.brand-name b{font-weight:400;color:var(--fjola)}
.brand-kicker{font-family:var(--hand);font-size:13px;color:var(--soft);margin-left:3px}
/* Uppi í horni: perlur og spjald, og A4-blaðið */
.horn{margin-left:auto;display:flex;align-items:center;gap:8px}
.grunn-takki,.horn-takki{display:inline-flex;align-items:center;gap:7px;font-family:var(--hand);font-size:17px;line-height:1;text-decoration:none;color:var(--ink);padding:7px 12px 5px;border:2.5px solid var(--ink);border-radius:14px 9px 15px 8px;background:var(--paper);box-shadow:2px 2px 0 var(--ink);white-space:nowrap}
.grunn-takki[aria-expanded=true]{background:var(--gul);transform:rotate(-2deg)}
.grunn-takki .or{font-size:12px;color:var(--soft)}
.grunn-perla{--d:15px;width:var(--d);height:var(--d);border-radius:50%;border:2px solid var(--ink);background:radial-gradient(circle,var(--paper) 0 26%,var(--raud) 28%)}
.grunn-takki[data-perla=mini] .grunn-perla{--d:10px}.grunn-takki[data-perla=maxi] .grunn-perla{--d:20px}
body[data-nuna=heim] .fara-heim,body[data-nuna=blad] .fara-blad,body[data-nuna=blad] .grunn-takki{display:none}
.grunn-val{position:absolute;top:calc(100% + 8px);right:max(16px,3vw);z-index:30;width:min(400px,calc(100vw - 32px));max-height:calc(100vh - 110px);overflow:auto;display:grid;gap:8px;padding:16px 16px 14px;background:var(--paper);border:3px solid var(--ink);border-radius:20px 13px 22px 12px;box-shadow:6px 7px 0 var(--fjola)}
.grunn-val h3{margin:4px 0 0;font-family:var(--hand);font-weight:400;font-size:20px}
#grunn-perla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
#grunn-perla .flipi{justify-items:center;text-align:center}
.grunn-val .eigin-staerd{margin-top:2px}
.grunn-val .smatt{margin:4px 0 0}
.grunn-athugasemd{margin:0;padding:7px 10px;background:var(--gul-t);border:2px dashed var(--ink);border-radius:10px 7px 11px 6px;font-size:14px}
main{padding:16px max(16px,3vw) 60px;max-width:1320px;margin:0 auto}

/* Takkar */
.takki{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;color:var(--ink);border:2.5px solid var(--ink);background:var(--c,var(--paper));font-family:var(--hand);font-size:19px;line-height:1.1;padding:8px 15px 5px;border-radius:16px 10px 18px 9px;box-shadow:3px 3px 0 var(--ink);transition:transform .12s}
@media(hover:hover){.takki:not([disabled]):hover{transform:rotate(-2deg) scale(1.04)}}
.takki:active{transform:translate(3px,3px);box-shadow:none}
.takki.hljodur{background:var(--paper);box-shadow:2px 2px 0 var(--ink);font-size:16px;padding:6px 11px 4px}
.takki.litill{font-size:14px;padding:4px 9px 3px}
.takki[disabled]{opacity:.45;cursor:default}
.flipar{display:flex;flex-wrap:wrap;gap:7px}
.flipi{display:inline-flex;align-items:center;gap:6px;border:2.5px solid var(--ink);background:var(--paper);border-radius:13px 8px 14px 7px;padding:5px 11px 3px;font-family:var(--hand);font-size:16px;box-shadow:2px 2px 0 var(--ink)}
.flipi[aria-pressed=true]{background:var(--gul);transform:rotate(-2deg)}
.flipi .punktur{width:13px;height:13px;border-radius:50%;background:var(--punktur);border:2px solid var(--ink)}
.litur-takki{width:40px;height:40px;border-radius:12px 8px 13px 7px;border:2.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);padding:0}
.litur-takki.litill{width:30px;height:30px;border-radius:50%}
.litur-takki[aria-pressed=true]{transform:scale(1.12) rotate(-4deg);outline:3px dotted var(--ink);outline-offset:3px}

.leynd{margin:20px 0 0;font-size:15px;color:var(--soft)}
.sleppa{display:grid;place-items:center;text-align:center;aspect-ratio:1;border:3px dashed #2a263355;border-radius:30px 20px 34px 18px;color:var(--soft);font-family:var(--hand);font-size:20px;transition:background .15s}
.sleppa span{font-size:80px;line-height:1;transform:rotate(-20deg)}
.sleppa.yfir{background:var(--bleik-t);border-color:var(--ink)}
.kafli>header{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;margin-bottom:18px}
.kafli>header h2{font-family:var(--hand);font-weight:400;font-size:clamp(32px,4vw,44px);line-height:1;margin:0;transform:rotate(-1.5deg)}
.kafli>header p{margin:0;color:var(--soft)}
.safn-takkar{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.safn{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px}
.safn-hlutur{display:grid;justify-items:center;gap:6px;padding:12px 10px 10px;background:var(--rudur);border:2.5px solid var(--ink);border-radius:18px 12px 20px 10px;box-shadow:4px 4px 0 var(--ink)}
.safn-hlutur:nth-child(odd){border-radius:12px 20px 10px 18px}
.safn-hlutur img{width:100%;height:120px;object-fit:contain}
.safn-hlutur b{font-family:var(--hand);font-weight:400;font-size:18px;background:var(--paper);border-radius:8px;padding:2px 8px 0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.safn-adgerdir{display:flex;gap:4px}
.safn-adgerdir button{width:36px;height:34px;border:2px solid var(--ink);border-radius:10px 7px 11px 6px;background:var(--paper);font-size:16px;padding:0}
.safn-tomt{grid-column:1/-1;padding:30px;text-align:center;color:var(--soft);border:3px dashed #2a263333;border-radius:20px}

/* Spjaldið */
.ritill{--rymi:200px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.spjald-dalkur{display:grid;gap:12px;justify-items:center;min-width:0}
.spjald-svid{--hlutfall:1;position:relative;width:min(100%,calc((100vh - var(--rymi)) * var(--hlutfall)));width:min(100%,calc((100svh - var(--rymi)) * var(--hlutfall)));aspect-ratio:var(--hlutfall);min-width:120px;background:var(--rudur);border:3px solid var(--ink);border-radius:22px 14px 24px 13px;box-shadow:6px 7px 0 var(--fjola);overflow:hidden}
#hanna-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}
.tolasla{display:grid;gap:14px;position:sticky;top:90px}
.sjalfvirkt{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sjalfvirkt .takki{font-size:17px;padding:10px 8px 7px}
.galdur{background:linear-gradient(135deg,var(--fjola),var(--bleik))}
.tol-rod{display:flex;gap:8px}
.tolin{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.saga-takkar{display:flex;gap:6px}.saga-takkar .tol{width:44px;align-content:center}.saga-takkar .tol span{font-size:24px}
.tol[disabled]{opacity:.4;cursor:default}
.ospart{opacity:.35;pointer-events:none}
.tol{display:grid;justify-items:center;gap:2px;padding:7px 2px 5px;border:2.5px solid var(--ink);background:var(--paper);border-radius:13px 8px 14px 7px;font-family:var(--hand);font-size:12.5px;box-shadow:2px 2px 0 var(--ink)}
.tol span{font-size:22px;line-height:1}
.tol[aria-pressed=true]{background:var(--gul);transform:translateY(-3px) rotate(-2deg);box-shadow:3px 4px 0 var(--ink)}
.tol-hjalp{margin:0;min-height:42px;padding:8px 12px;background:var(--paper);border:2px dashed var(--ink);border-radius:12px 8px 13px 7px;font-size:14.5px}
.stillingar{display:grid;gap:10px}
.renna{display:grid;gap:4px;font-size:14px;font-weight:600}
.renna input{width:100%;accent-color:var(--raud)}
.saga{display:flex;flex-wrap:wrap;gap:7px}
.ritill-lok{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

/* Bið og skilaboð */
.bid{position:fixed;inset:0;z-index:70;display:grid;place-content:center;justify-items:center;gap:12px;background:#f6f1e3cc;backdrop-filter:blur(3px)}
.snuningur{font-size:64px;animation:klippa 1s ease-in-out infinite}
@keyframes klippa{0%,100%{transform:rotate(-25deg)}50%{transform:rotate(15deg) scale(1.1)}}
.bid p{margin:0;font-family:var(--hand);font-size:22px;background:var(--paper);border:2.5px solid var(--ink);border-radius:14px 9px 15px 8px;padding:8px 16px 5px;box-shadow:3px 3px 0 var(--ink)}
.toast{position:fixed;left:50%;top:82px;z-index:80;transform:translate(-50%,-30%);opacity:0;pointer-events:none;background:var(--ink);color:var(--paper);padding:10px 18px;border-radius:14px 9px 15px 8px;font-size:15px;transition:transform .25s cubic-bezier(.2,1.4,.4,1),opacity .2s;max-width:calc(100vw - 32px)}
.toast.syna{transform:translate(-50%,0);opacity:1}

@media(max-width:980px){
 .ritill,.blad-rammi{grid-template-columns:minmax(0,1fr)}
 .tolasla{position:static}
}
@media(max-width:640px){
 .brand-name{font-size:32px}.brand img{width:34px;height:34px}
 .grunn-takki,.horn-takki{font-size:15px;padding:6px 9px 4px;gap:5px}
 .horn{gap:6px}.horn-ord{display:none}
 .safn{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}
@media print{
 @page{size:A4;margin:0}
 body{background:#fff;margin:0}
 body>*:not(#prent-svaedi){display:none!important}
 .prent-svaedi{display:block!important}
 .prent-blad{display:block;width:210mm;height:297mm;break-after:page;page-break-after:always}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Perla: safnið */
.advorun{color:#a83b31}
.hopar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.hopur-flipi{display:inline-flex;align-items:center;gap:7px;border:2.5px solid var(--ink);background:var(--paper);border-radius:14px 9px 15px 8px;padding:5px 10px 3px;font-family:var(--hand);font-size:17px;box-shadow:2px 2px 0 var(--c,var(--ink))}
.hopur-flipi[aria-pressed=true]{background:var(--gul);transform:rotate(-2deg)}
.hopur-flipi.yfir{background:var(--graen-t);transform:scale(1.08)}
.hopur-punktur{width:13px;height:13px;border-radius:50%;background:var(--c);border:2px solid var(--ink)}
.hopur-eyda{margin-left:2px;padding:0 4px;border-radius:50%;color:var(--soft);font-family:var(--body);font-size:15px}
.hopur-eyda:hover{background:var(--raud-t);color:var(--ink)}
.nyr-hopur input{border:2.5px dashed var(--ink);background:transparent;border-radius:14px 9px 15px 8px;padding:6px 10px;font-family:var(--hand);font-size:16px;width:190px}
.valdar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px;padding:8px 12px;background:var(--gul-t);border:2px dashed var(--ink);border-radius:12px 8px 13px 7px;font-family:var(--hand);font-size:18px}
.valdar select{padding:6px 8px;border:2px solid var(--ink);border-radius:9px;background:var(--paper);font-size:14px}
.honnun{position:relative;display:grid;justify-items:center;gap:4px;padding:12px 10px 10px;background:var(--paper);border:2.5px solid var(--ink);border-radius:18px 12px 20px 10px;box-shadow:4px 4px 0 var(--c,var(--ink));cursor:grab}
.honnun:nth-child(odd){border-radius:12px 20px 10px 18px}
.honnun.valin{background:var(--gul-t);outline:3px dotted var(--ink);outline-offset:3px}
.honnun .velja{position:absolute;top:8px;left:8px}
.honnun .velja input{width:20px;height:20px;accent-color:var(--fjola)}
.honnun-mynd{border:0;background:none;padding:0;width:100%;display:grid;place-items:center}
.smamynd{width:100%;max-width:150px;height:auto;aspect-ratio:auto;border-radius:8px;image-rendering:auto}
.honnun b{font-family:var(--hand);font-weight:400;font-size:19px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.honnun small{color:var(--soft);font-size:12.5px;text-align:center}
.honnun-hopur{max-width:100%;padding:4px 6px;border:2px solid var(--ink);border-radius:9px;background:var(--paper);font-size:13px}
.honnun-adgerdir{display:flex;gap:4px}
.honnun-adgerdir button{width:34px;height:32px;border:2px solid var(--ink);border-radius:10px 7px 11px 6px;background:var(--paper);font-size:15px;padding:0}

/* Perla: teikna */
.nafn-rod{display:flex;align-items:center;gap:10px}
.nafn-rod input{flex:1;min-width:0;padding:8px 10px;border:2.5px solid var(--ink);border-radius:12px 8px 13px 7px;background:var(--paper);font-family:var(--hand);font-size:20px}
.vistad{font-size:13px;color:var(--soft);white-space:nowrap}
.valinn-litur{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:0;font-family:var(--hand);font-size:18px;line-height:1.2}
.valinn-litur i{width:22px;height:22px;border-radius:50%;border:2.5px solid var(--ink)}
.visir{font-family:var(--body);font-size:13px;color:var(--soft)}
.talning-rammi summary{cursor:pointer;font-family:var(--hand);font-size:18px}
.talning{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px;font-size:14px;max-height:220px;overflow:auto}
.talning li{display:flex;align-items:center;gap:8px}
.talning i{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--ink)}
.talning b{margin-left:auto}
.talning-alls{font-weight:700}

/* Perla: A4 */
.blad-haus{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;margin-bottom:16px}
.blad-haus h2{font-family:var(--hand);font-weight:400;font-size:clamp(30px,4vw,42px);margin:0;transform:rotate(-1.5deg)}
.blad-haus p{margin:0;font-family:var(--hand);font-size:19px}
.blad-rammi{display:grid;grid-template-columns:330px minmax(0,1fr);gap:26px;align-items:start}
.blad-hlid h3{margin:0 0 8px;font-family:var(--hand);font-weight:400;font-size:21px}
.blad-listi{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-height:70vh;overflow:auto}
.blad-hlutur{display:grid;grid-template-columns:60px 1fr auto;gap:10px;align-items:center;padding:6px 10px 6px 6px;background:var(--paper);border:2px solid var(--ink);border-radius:12px 8px 13px 7px}
.blad-hlutur.valin{background:var(--graen-t);box-shadow:3px 3px 0 var(--graen)}
.blad-hlutur .smamynd{width:60px}
.blad-nafn{display:grid;min-width:0}
.blad-nafn b{font-family:var(--hand);font-weight:400;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blad-nafn small{color:var(--soft);font-size:12.5px}
.fjoldi{display:flex;align-items:center;gap:6px}
.fjoldi button{width:30px;height:30px;border:2px solid var(--ink);border-radius:50%;background:var(--paper);font-size:18px;line-height:1;padding:0}
.fjoldi b{min-width:20px;text-align:center;font-family:var(--hand);font-size:19px;font-weight:400}
.blad-takkar{display:flex;flex-wrap:wrap;gap:10px}
.hvatning{margin:10px 0 0;padding:8px 12px;background:var(--gul-t);border:2px dashed var(--ink);border-radius:12px 8px 13px 7px;font-size:15px}
.blad-forsyn{display:flex;flex-wrap:wrap;gap:24px;margin-top:16px}
.blad-mynd{width:min(100%,430px);height:auto;background:#fff;border:2px solid var(--ink);box-shadow:6px 7px 0 var(--ink)}

/* Gluggi: ný hönnun */
dialog.gluggi{border:0;padding:0;background:none;max-width:min(620px,calc(100vw - 24px));width:100%;color:var(--ink)}
dialog.gluggi::backdrop{background:#2a263399;backdrop-filter:blur(3px)}
.gluggi-innan{position:relative;isolation:isolate;display:grid;gap:14px;padding:24px 22px 20px;max-height:calc(100vh - 40px);overflow:auto}
.gluggi-innan::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--paper);border:3px solid var(--ink);border-radius:24px 14px 28px 12px;box-shadow:7px 8px 0 var(--fjola)}
.gluggi-innan h2{font-family:var(--hand);font-weight:400;font-size:34px;margin:0}
.valkostir .flipi{display:grid;justify-items:start;gap:0;padding:7px 12px 5px;text-align:left}
.valkostir .flipi b{font-weight:400;font-size:18px}
.valkostir .flipi small{font-family:var(--body);font-size:12px;color:var(--soft)}
.eigin-staerd{display:flex;align-items:end;gap:8px;margin-top:10px;font-size:14px}
.eigin-staerd input{width:76px;padding:7px 8px;border:2.5px solid var(--ink);border-radius:10px;background:var(--paper);font-size:16px;display:block}
.haka{display:flex;gap:8px;align-items:center;font-size:15px}
.haka input{width:20px;height:20px}
.reitur select{padding:9px 10px;border:2.5px solid var(--ink);border-radius:12px 8px 13px 7px;background:var(--paper);font-size:16px}
.gluggi-takkar{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:640px){.nyr-hopur input{width:150px}}

/* Perla: spjaldið á forsíðunni */
.byrja-rod{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.byrja-rod .takki{font-size:18px;padding:10px 8px 7px}
.myndavel{font-size:22px;line-height:1}
.visbending{position:absolute;left:50%;bottom:14px;transform:translateX(-50%) rotate(-1.5deg);margin:0;padding:6px 14px 4px;background:var(--paper);border:2px dashed var(--ink);border-radius:12px 8px 13px 7px;font-family:var(--hand);font-size:17px;white-space:nowrap;pointer-events:none}
.safn-kafli{margin-top:46px}
.honnun .nuna-merki{display:none;position:absolute;top:-12px;right:10px;padding:2px 9px 0;background:var(--gul);border:2px solid var(--ink);border-radius:9px 6px 10px 5px;font-family:var(--hand);font-size:14px;transform:rotate(3deg)}
.honnun.nuna{box-shadow:4px 4px 0 var(--c,var(--ink)),0 0 0 3px var(--gul)}
.honnun.nuna .nuna-merki{display:block}

/* Gluggi: mynd í perlur */
.mynd-kostir{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.mynd-kostur{display:grid;justify-items:center;gap:4px;padding:12px 10px 10px;background:var(--paper);border:2.5px solid var(--ink);border-radius:18px 12px 20px 10px;box-shadow:4px 4px 0 var(--bla);text-align:center}
.mynd-kostur:nth-child(2){box-shadow:4px 4px 0 var(--bleik)}
@media(hover:hover){.mynd-kostur:hover{transform:rotate(-1.5deg) scale(1.02)}}
.mynd-kostur b{font-family:var(--hand);font-weight:400;font-size:20px}
.mynd-kostur small{color:var(--soft);font-size:12.5px}
.mynd-forsyn{display:grid;place-items:center;width:100%;aspect-ratio:1;background:var(--rudur);border-radius:10px}
.mynd-forsyn .smamynd{max-width:100%;max-height:100%;width:auto}
@media(max-width:640px){.byrja-rod .takki{font-size:16px}.mynd-kostir{gap:10px}.visbending{font-size:15px}}

/* Litaspjaldið undir spjaldinu */
.litarod{position:relative;width:100%;max-width:720px;display:grid;gap:8px}
.litaspjald{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:8px;row-gap:17px;padding-bottom:12px}
.litur{position:relative;width:100%;max-width:50px;justify-self:center;aspect-ratio:1;border-radius:50%;border:2.5px solid var(--ink);background:radial-gradient(circle,#fffdf7 0 21%,var(--l) 23%);padding:0;color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
.litur span{position:absolute;inset:auto -4px -16px;color:var(--soft);font-size:10px;font-weight:600;text-align:center}
.litur[aria-pressed=true]{transform:scale(1.14);outline:3px dotted var(--ink);outline-offset:2px}
.litur.fleiri::after{content:'';position:absolute;top:-3px;right:-3px;width:12px;height:12px;border-radius:50%;background:var(--afbr);border:1.5px solid var(--ink)}
.litur.hluti{outline:3px dotted var(--soft);outline-offset:2px}
.afbrigdi{position:absolute;z-index:15;display:grid;gap:8px;justify-items:center;padding:12px 12px 8px;background:var(--paper);border:3px solid var(--ink);border-radius:18px 11px 20px 10px;box-shadow:5px 6px 0 var(--fjola)}
.afbrigdi-litir{display:flex;gap:12px;padding-bottom:14px}
.afbrigdi .litur{width:50px;max-width:none}
.afbrigdi .litur.abc::after,.abc-punktur{content:'';position:absolute;top:-3px;right:-3px;width:12px;height:12px;border-radius:50%;background:var(--graen);border:2px solid var(--ink)}
.abc-punktur{position:relative;display:inline-block;top:1px;right:auto;width:10px;height:10px}
.afbrigdi small{font-size:12px;color:var(--soft);white-space:nowrap}
@media(max-width:640px){
 .ritill{--rymi:268px}
 .litaspjald{grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;row-gap:16px}
 .valinn-litur{font-size:16px}
 .afbrigdi .litur{width:46px}.afbrigdi-litir{gap:10px}
}