
:root{color-scheme:light;font-family:Georgia,'Times New Roman',serif;color:#211e1b;background:#f8f6f2}
*{box-sizing:border-box}
html{height:100%;overscroll-behavior:none;background:#f8f6f2}
body{margin:0;min-height:100%;overflow-x:hidden;overscroll-behavior:none}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(248,248,246,.70),rgba(248,248,246,.70)),url('papper.jpg') center/cover no-repeat;pointer-events:none}
.scen{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 18px;gap:26px}
/* Narrower, taller, about 10% smaller than v5 */
.kalender{width:min(293px,76vw,calc((100svh - 90px)*.4165));container-type:inline-size;flex:none;position:relative}
.kalender-topp{aspect-ratio:532/125;background:url('kalender-topp.png') center top/100% 100% no-repeat;position:relative;z-index:2;margin-bottom:-5.5cqw;pointer-events:none}
.blad{width:96%;margin-inline:auto;position:relative;aspect-ratio:390/600;padding:9% 8.7% 9%;background:linear-gradient(120deg,rgba(255,255,255,.32),rgba(241,231,213,.10)),#f8f4eb;border:0;box-shadow:0 11px 15px -11px rgba(45,33,21,.40),0 2px 3px -2px rgba(45,33,21,.23);display:flex;flex-direction:column}
.blad::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.10;background-image:url('papper.jpg');background-size:1100px auto;mix-blend-mode:multiply}
.blad>*{position:relative;z-index:1}
.metadata{display:flex;justify-content:space-between;font-size:5.2cqw;line-height:1.2}
.datumblock{text-align:center;margin-top:9%;display:flex;flex-direction:column;align-items:center}
.veckodag{font-size:8.2cqw;line-height:1.15}
.dag{color:#211e1b;font-size:43cqw;font-weight:700;line-height:.97;letter-spacing:-.045em;font-variant-numeric:lining-nums tabular-nums;margin-top:7cqw}
.dag.rod{color:var(--family-red)}
.manad{font-size:8.5cqw;line-height:1.15;margin-top:7cqw}
.avdelare{border-top:1px solid #34302c;margin-top:10%}



/* v7: paper texture cropped to remove baked-in side shadows; leaf aligned with calendar binding. */

/* v8: innehållsytor; kalenderns mått och datumlayout från v7 är oförändrade. */
/* v9: klassisk, vänsterställd uppslagsverkstext med samma läsbara storlek på alla skärmar. */
.berattelse{width:min(293px,76vw,calc((100svh - 90px)*.4165));border-top:1px solid #34302c;padding-top:18px;text-align:left;font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.65;font-weight:400;color:#211e1b}
.berattelse p{margin:0;overflow-wrap:break-word}
@media(max-height:720px){.scen{justify-content:flex-start}}

/* v10: Kalendern 15% mindre; berättelsen följer kalenderns bredd och har egen avdelare. */

/* v11: ordmärke och diskreta testkontroller, utan ändringar av kalenderbladet. */
.ordmarke{font-family:Georgia,'Times New Roman',serif;font-size:clamp(19px,3vw,25px);font-weight:700;letter-spacing:-.045em;line-height:1.1;text-align:center}
.ordmarke span{color:var(--family-red)}
.dagval{display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(293px,76vw,calc((100svh - 90px)*.4165));font:13px/1.3 Georgia,'Times New Roman',serif}
.dagval button{appearance:none;border:1px solid rgba(52,48,44,.4);border-radius:50%;background:rgba(248,244,235,.75);color:#211e1b;width:44px;height:44px;flex:none;font-size:24px;cursor:pointer}
.dagval button:disabled{opacity:.32;cursor:default}
.dagval button:focus-visible{outline:2px solid var(--family-red);outline-offset:3px}
#teststatus{text-align:center;font-size:12px;min-width:0}
.scen{gap:18px}

/* v12: pilar på bladet, rubrik med röd punkt och högst två rader. */
.dagrad{position:relative;width:100%;display:flex;align-items:center;justify-content:center;margin-top:7cqw;min-height:43cqw}
.dagrad .dag{margin-top:0}
.datum-pil{position:absolute;top:50%;transform:translateY(-50%);width:14cqw;height:25cqw;min-width:36px;min-height:44px;padding:0;border:0;background:transparent;color:#49413b;font:normal 18cqw/.8 Georgia,'Times New Roman',serif;cursor:pointer;display:grid;place-items:center;z-index:3}
.datum-pil:first-child{left:-5cqw}.datum-pil:last-child{right:-5cqw}
.datum-pil:disabled{opacity:.22;cursor:default}
.datum-pil:focus-visible{outline:2px solid var(--family-red);outline-offset:1px;border-radius:3px}
.manad{margin-top:7cqw}

.titelpunkt{color:var(--family-red)}
.dagval{display:none}

/* v13: kompakt blad, större ordmärke, stabil uppslagsverkstext. */
.blad{aspect-ratio:390/568}
.ordmarke{font-size:clamp(22px,3.45vw,28.75px)}
.scen{gap:15px}
.berattelse{font-size:15px;line-height:1.48;min-height:calc(15px * 1.48 * 7 + 19px);flex:none}
.berattelse p{margin:0}
@media(max-width:420px){.berattelse{font-size:14px;line-height:1.5;min-height:calc(14px * 1.5 * 8 + 19px)}}

/* v19: tydlig, enhetlig storlek för veckodag och rubrik. */
.veckodag,
.titelpunkt{font-size:1.13em;line-height:0;color:var(--family-red)}
.ordmarke span{font-size:1.13em;line-height:0}

/* v20: one definitive heading rule; same type size as weekday. */
.veckodag{font-size:24px}

/* v21: rubrik med normal vikt och samma basstorlek som veckodag. */
.nostalgi{font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400;line-height:1.12;text-align:center;flex:1;min-height:0;margin:0;display:flex;align-items:center;justify-content:center;align-content:center;flex-wrap:wrap;max-height:none;overflow:hidden;overflow-wrap:normal;word-break:normal;text-wrap:balance}
#nostalgi-text{max-width:100%}

/* v22: mindre, normal rubrik. Slutord och punkt hålls ihop. */
.nostalgi{font-size:21px;font-weight:400;line-height:1.12}
#nostalgi-text{display:block;max-width:100%;text-wrap:balance}
.sista-ordet{white-space:nowrap}
.titelpunkt{display:inline;font-size:1.13em;line-height:0;vertical-align:baseline;color:var(--family-red)}

/* v24: kompakta bladet och verklig centrering i det synliga rubrikfältet.
   Negativ undermarginal tar ut bladets nedre padding just för rubrikytan,
   utan att flytta datum, veckodag, månad eller avdelarstreck. */
.blad{aspect-ratio:390/520}
.nostalgi{margin-bottom:-9cqw}
#nostalgi-text{transform:none}
/* Röd slutpunkt som tydlig cirkel, på textens baslinje.
   Den ligger inuti .sista-ordet och kan därför inte hamna på egen rad. */
.titelpunkt{
  display:inline-block;
  width:.35em;
  height:.35em;
  margin-left:.06em;
  border-radius:50%;
  background:var(--family-red);
  color:transparent;
  font-size:1em;
  line-height:0;
  vertical-align:baseline;
  overflow:hidden;
}

/* v26 prov: neutralvit pappersyta, 70 % ljust overlagg. */

/* v27: Klassisk uppslagsverksrad som ersätter den gamla avdelaren. */
.berattelse { border-top: 0; padding-top: 0; }
.faktarad { display:flex; align-items:baseline; gap: .34em; width:100%; margin: 0 0 9px; color:#4b4844; font-family:Georgia,'Times New Roman',serif; font-size:13px; line-height:1.3; white-space:nowrap; }
.faktarad strong { font-weight:700; }
#faktanummer { font-weight:400; font-variant-numeric:lining-nums tabular-nums; }
.faktalinje { flex:1; min-width:12px; border-top:1px solid rgba(74,69,63,.48); align-self:center; margin-left:5px; }

/* v28: klassiskt uppslagsord och finare boktryckt, justerad faktatext. */
.faktarad { font-size: 16px; line-height: 1.25; margin-bottom: 7px; color: #393633; gap: .28em; }
.faktarad strong { font-size: 1.1em; font-weight: 700; letter-spacing: -.025em; }
#faktanummer { font-size: .88em; font-style: italic; font-weight: 400; }
.faktalinje { border-top-color: rgba(74,69,63,.42); }
.berattelse p {
  font-size: 13.5px;
  line-height: 1.55;
  font-style: italic;
  text-align: justify;
  text-align-last: left;
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}
@media(max-width:420px){ .berattelse p { font-size: 12.6px; line-height: 1.55; } }


/* v29: Smal uppslagsverksspalt, centrerad innanför kalenderbladets bredd.
   Endast faktasektionen påverkas, inte kalenderblad, datum eller bakgrund. */
.berattelse {
  width: min(252px, 65.4vw, calc((100svh - 90px) * .3582));
  max-width: calc(100vw - 36px);
  margin-inline: auto;
}
.faktarad { font-size: 15px; }
.faktarad strong { font-size: 1.08em; }
/* På smala mobilbredder undviker vänsterställd text glesa justerade rader. */
@media (max-width: 375px) {
  .berattelse p { text-align: left; hyphens: auto; -webkit-hyphens: auto; }
}

/* v30: Ett eget uppslagsverksurklipp runt den befintliga smala faktaspalten.
   Bakgrund och kalenderblad påverkas inte. */
.berattelse {
  box-sizing: border-box;
  width: min(300px, 78vw, calc((100svh - 90px) * .427));
  max-width: calc(100vw - 24px);
  padding: 16px 23px 18px;
  position: relative;
  isolation: isolate;
  border: none;
  border-radius: 3px 4px 5px 3px;
  background-color: #f2eee3;
  background-image:
    linear-gradient(116deg, rgba(250,247,238,.51), rgba(235,225,210,.33)),
    url('papper.jpg');
  background-size: 100% 100%, 345px auto;
  background-position: center, 44% 32%;
  background-repeat: no-repeat;
  box-shadow: 0 7px 14px -9px rgba(67,50,33,.33),
              0 2px 4px -2px rgba(67,50,33,.17),
              inset 0 1px 1px rgba(255,255,255,.45);
}
/* Papperets finare fibrer förstärks lokalt, utan att bakgrundens mönster upprepas. */
.berattelse::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: url('papper.jpg') 63% 47% / 215px auto no-repeat;
  opacity: .10;
  mix-blend-mode: multiply;
  z-index: -1;
}
@media (max-width: 375px) {
  .berattelse { padding-inline: 18px; }
}


/* v31: fast grundformat för uppslagsverksurklippet.
   Kortare notiser lämnar luft före det boktryckta sidnumret.
   Min-height snarare än max-height: längre texter kan aldrig klippas. */
.berattelse {
  display: flex;
  flex-direction: column;
  min-height: 278px;
}
.sidnummer {
  margin-top: auto;
  padding-top: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #625b52;
  font: normal 12px/1.2 Georgia, 'Times New Roman', serif;
  font-variant-numeric: lining-nums tabular-nums;
}
.sidstreck { width: 14px; height: 1px; background: rgba(93,81,69,.55); }
/* Mindre aggressiv avstavning: svenska långord får brytas,
   men browsern ska inte tvinga in avstavning i korta ord. */
.berattelse p { -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 4; hyphenate-limit-chars: 10 5 4; }
@media (max-width: 375px) {
  .berattelse { min-height: 295px; }
}

/* v32: cirka 17 % kortare faktalapp. Innehåll kan fortfarande öka höjden vid behov. */


/* v33: slutputs: naettare kalenderberattelse, mindre luft over ordmarket
   och en heltackande pappersbakgrund aven under scrollning i WKWebView. */
.nostalgi { font-size: 20px; } /* v32: 21 px */
.scen { padding-top: 25px; } /* v32: 35 px; endast ovre luft */
/* Behall exakt samma papper/overlagg som v32. Lagret ligger over sidans
   fallback-bakgrund men under kalenderinnehållet, utan negativ z-index. */
html, body { background-color: #f8f6f2; }
body::before { z-index: 0; }
.scen { position: relative; z-index: 1; }

/* Låga fristående fönster: använd faktalappens faktiska innehållshöjd.
   Kalenderbladets proportioner och textstorlekar behålls. */
@media(max-height:780px){
  html:not(.embedded) .scen{justify-content:flex-start;gap:10px;padding:10px 18px 10px}
  html:not(.embedded) .berattelse{min-height:0;padding:12px 18px}
  html:not(.embedded) .sidnummer{padding-top:10px}
}

/* Inbäddning: behåll läsbar text, frigör den tidigare tomma faktalappshöjden.
   Låga skärmar får skrolla hellre än att text eller sidnummer klipps. */
html.embedded,html.embedded body{min-height:100%;height:100%;overflow-x:hidden;overflow-y:auto}
html.embedded .ordmarke{display:none!important}
html.embedded .scen{min-height:100svh;height:auto;justify-content:flex-start;gap:10px;padding:8px 14px 12px;overflow:visible}
html.embedded .kalender{width:min(293px,76vw)!important}
html.embedded .berattelse{width:min(293px,76vw);min-height:0;flex:none;padding:12px 18px}
html.embedded .sidnummer{padding-top:10px}
@media(max-height:700px){html.embedded .kalender{width:min(260px,76vw)!important}}

/* Info v1: floating controls do not participate in the calendar layout. */
.info-trigger{position:fixed;right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));width:38px;height:38px;display:grid;place-items:center;z-index:20;border:0;background:transparent;color:#211e1b;cursor:pointer;padding:7px}
.info-trigger svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.info-trigger:focus-visible,.info-close:focus-visible,.info-action:focus-visible,.info-donation:focus-visible{outline:2px solid #bf3d3e;outline-offset:3px}
html.embedded .info-trigger,html.embedded .info-overlay{display:none!important}
.info-overlay[hidden]{display:none!important}
.info-overlay{position:fixed;inset:0;z-index:30;background:rgba(32,28,26,.44);display:flex;align-items:flex-end;justify-content:center;overscroll-behavior:contain}
.info-dialog{width:min(100%,560px);max-height:min(91svh,950px);overflow:auto;overscroll-behavior:contain;background:linear-gradient(rgba(248,248,246,.70),rgba(248,248,246,.70)),url('papper.jpg') center/cover,#f8f6f2;border-radius:26px 26px 0 0;box-shadow:0 -5px 30px rgba(20,15,12,.16);color:#211e1b;padding:22px 23px max(22px,env(safe-area-inset-bottom));font-family:Georgia,'Times New Roman',serif}
.info-head{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-bottom:12px}
.info-head h1{margin:0;font-size:clamp(23px,5.4vw,29px);font-weight:700;letter-spacing:-.035em}
.info-head h1 span{color:#bf3d3e}
.info-close{flex:none;display:grid;place-items:center;border:1px solid rgba(40,35,31,.17);width:35px;height:35px;border-radius:50%;background:#faf9f7;font-size:27px;line-height:1;cursor:pointer}
.info-content{font-size:15px;line-height:1.55}
.info-content p{margin:0 0 13px}
.info-content .info-lead{font-style:italic;color:#6b615a}
.info-divider{height:1px;background:rgba(40,35,31,.15);margin:19px 0}
.info-content h2{font-size:18px;margin:0 0 10px;font-weight:700}
.info-donations{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.info-donation{min-width:0;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(35,30,26,.18);border-radius:15px;background:#fdfcf9;color:#211e1b;min-height:105px;padding:12px 4px}
.info-donation-accent{background:#bf3d3e;color:white;border-color:#bf3d3e}
.info-donation-icon{font-size:24px;line-height:1.1}
.info-donation strong{font-size:17px}
.info-donation small{font:12px/1.3 Georgia,'Times New Roman',serif;text-align:center}
.info-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.info-action{min-width:0;min-height:77px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:11px 4px;text-decoration:none;border:1px solid rgba(35,30,26,.17);background:#fdfcf9;border-radius:13px;font:13px Georgia,'Times New Roman',serif;color:#211e1b;cursor:pointer}
.info-action svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.info-action:disabled{opacity:.37;cursor:default}
.info-feedback{min-height:0;margin:9px 0 0!important;text-align:center;color:#655b54;font-size:12px}
@media (min-width:600px){.info-overlay{align-items:center;padding:20px}.info-dialog{border-radius:24px;max-height:90svh}}

/* Spaltmeter-familjen: fristående variabler, inga beroenden till övriga appar. */
:root{
  --family-red:#BF3D3E;
  --family-ink:#211e1b;
  --family-muted:#746e68;
  --family-border:rgba(96,82,68,.17);
  --family-control:rgba(255,255,255,.68);
  --family-radius:20px;
  --family-inset:inset 0 1px 3px rgba(72,56,40,.07),0 1px 0 rgba(255,255,255,.7);
}
.info-trigger{width:44px;height:44px;border:0;border-radius:0;background:transparent;box-shadow:none;padding:0}
.info-dialog{border:1px solid var(--family-border);padding:22px;scrollbar-width:thin}
.info-head{margin-bottom:18px}
.info-close{width:44px;height:44px;background:var(--family-control);border-color:var(--family-border);box-shadow:var(--family-inset);color:var(--family-ink)}
.info-panel{background:rgba(255,255,255,.48);border:1px solid var(--family-border);border-radius:var(--family-radius);padding:18px;margin-bottom:14px;box-shadow:var(--family-inset)}
.info-panel p:last-child{margin-bottom:0}
.info-content .info-lead{font-size:17px;color:var(--family-ink)}
.info-content h2{font-size:20px;line-height:1.25}
.info-donations{margin-top:16px}
.info-donation,.info-action{border-color:var(--family-border);background:var(--family-control);box-shadow:var(--family-inset);border-radius:17px}
.info-donation-accent{background:var(--family-red);color:#fff;border-color:var(--family-red);box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.info-donation small,.info-action{font-family:system-ui,-apple-system,sans-serif}
.info-action{font-size:12px;font-weight:600;min-height:80px}
.info-feedback{font-family:system-ui,-apple-system,sans-serif;color:var(--family-muted)}
@media(max-width:375px){.info-dialog{padding:18px 15px}.info-panel{padding:15px}.info-actions{gap:7px}}

/* Info cards follow the Spaltmeter app settings reference. Scoped to Info only. */
.family-info{--info-red:#BF3D3E;--info-ink:#24211e;--info-muted:#77736e;--info-border:rgba(98,88,76,.12);--info-surface:rgba(255,255,255,.60)}
.family-info-card{margin:0 0 14px;border:1px solid var(--info-border);border-radius:24px;background:var(--info-surface);box-shadow:inset 0 1px 2px rgba(68,53,38,.025);overflow:hidden}
.family-info-card summary{display:flex;align-items:center;gap:13px;min-height:86px;padding:18px;cursor:pointer;list-style:none;text-align:left;-webkit-tap-highlight-color:transparent}
.family-info-card summary::-webkit-details-marker{display:none}
.family-info-card summary::after{content:'';width:8px;height:8px;border-right:2px solid #7b7874;border-bottom:2px solid #7b7874;transform:rotate(45deg);flex:none;margin:0 3px 4px auto;transition:transform .15s}
.family-info-card[open] summary::after{transform:rotate(225deg);margin-bottom:-3px}
.family-info-icon{width:30px;height:32px;display:grid;place-items:center;flex:none;color:var(--info-ink)}
.family-info-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.family-info-label{min-width:0;flex:1}
.family-info-label strong{display:block;color:var(--info-ink);font:700 21px/1.2 Georgia,'Times New Roman',serif;letter-spacing:-.025em}
.family-info-label small{display:block;margin-top:4px;color:var(--info-muted);font:400 13px/1.4 system-ui,-apple-system,sans-serif}
.family-info-body{padding:0 18px 18px}
.family-info p,.family-info .hint{font:400 15px/1.55 system-ui,-apple-system,sans-serif!important;color:var(--info-muted)!important;margin:0 0 14px}
.family-info-body p:last-child{margin-bottom:0}
.family-info h3{font:700 20px/1.25 Georgia,'Times New Roman',serif;letter-spacing:-.02em;color:var(--info-ink);margin:4px 0 8px}
.family-support{display:grid;gap:12px;margin:18px 0 4px}
.family-swish{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;padding:13px 10px;border:1px solid transparent;border-radius:15px;background:rgba(191,61,62,.055);color:var(--info-red);font:600 14px/1.35 system-ui,-apple-system,sans-serif;text-decoration:none;text-align:center}
.family-swish svg{width:21px;height:21px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.family-swish:hover{background:rgba(191,61,62,.09)}
.family-info summary:focus-visible,.family-swish:focus-visible{outline:2px solid var(--info-red);outline-offset:-3px}
@media(max-width:375px){.family-info-card summary{padding:15px 13px;gap:10px}.family-info-label strong{font-size:20px}.family-info-label small{font-size:12px}.family-info-body{padding:0 13px 16px}.family-swish{font-size:13px}}
@media(prefers-reduced-motion:reduce){.family-info-card summary::after{transition:none}}

/* Spaltmeter family: discreet links, no change to existing controls. */
.family-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:20px 0;padding-top:16px;border-top:1px solid #d9d4cc;font:14px/1.5 Arial,sans-serif;text-align:left}
.family-links a{color:#BF3D3E;text-decoration:none;overflow-wrap:anywhere}.family-links a:hover{text-decoration:underline}.family-links a:focus-visible{outline:2px solid #BF3D3E;outline-offset:4px}

/* Root background also covers short pages and overscroll. */
html:root{min-height:100%;background-color:#f8f6f2;background-image:linear-gradient(#fafafaad,#fafafaad),url("papper.jpg");background-position:center top;background-size:cover;background-attachment:fixed}
body{min-height:100vh;min-height:100svh;background-color:transparent}

/* Shared, collapsed family links. Existing editorial panels remain unchanged. */
.family-contact{border:1px solid rgba(64,51,39,.1);border-radius:22px;margin:16px 0;background:rgba(255,255,255,.55);overflow:hidden;text-align:left}
.family-contact>summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;padding:18px;color:#24211e;min-height:70px}.family-contact>summary::-webkit-details-marker{display:none}.family-contact>summary>svg{width:25px;height:25px;flex:none}.family-contact summary strong{display:block;font:700 21px/1.2 Georgia,serif}.family-contact summary small{display:block;font:13px/1.45 system-ui,sans-serif;color:#77716b;margin-top:4px}.contact-chevron{margin-left:auto;font:22px Arial,sans-serif;color:#77716b}.family-contact[open] .contact-chevron{transform:rotate(180deg)}
.family-contact-body{padding:0 18px 18px}.family-app-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.family-app-buttons a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 8px;background:rgba(191,61,62,.055);border:1px solid rgba(191,61,62,.08);border-radius:13px;color:#BF3D3E;text-align:center;text-decoration:none;font:600 13px/1.3 system-ui,sans-serif}.family-contact-mail{margin:17px 0 0!important;font:14px/1.5 system-ui,sans-serif!important;color:#77716b!important;overflow-wrap:anywhere}.family-contact-mail a{color:#BF3D3E;text-decoration:none}.family-contact a:focus-visible,.family-contact summary:focus-visible{outline:2px solid #BF3D3E;outline-offset:3px}
@media(max-width:340px){.family-app-buttons{grid-template-columns:1fr}.family-contact>summary{padding:14px;gap:9px}.family-contact summary strong{font-size:19px}}

.info-actions{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Delning av det synliga kalenderbladet, även i appens inbäddade vy. */
.calendar-share{width:min(340px,84vw);text-align:center;font:12px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.calendar-share-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid #bf3d3e40;border-radius:12px;background:#ffffff60;color:var(--family-red);font:600 12px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer}
.calendar-share-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.calendar-share-button:disabled{opacity:.4;cursor:default}
.calendar-share-button:focus-visible{outline:2px solid var(--family-red);outline-offset:3px}
.calendar-share-feedback{margin:6px 0 0;overflow-wrap:anywhere}
.calendar-share-feedback:empty{display:none}
.calendar-share-link{display:block;box-sizing:border-box;width:100%;min-height:44px;margin:8px 0;border:1px solid #bf3d3e60;border-radius:8px;padding:8px;background:#fff;color:#211e1b;font:12px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

/* Discreet header sharing, with a full-sized touch target. */
.calendar-share-trigger{position:fixed;left:max(16px,env(safe-area-inset-left));top:max(16px,env(safe-area-inset-top));z-index:20;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;color:#726b64;opacity:.72}
.calendar-share-trigger svg{width:22px;height:22px}
.calendar-share-trigger:disabled{opacity:.3}
.calendar-share{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:19;max-width:90vw}
.calendar-share-feedback:not(:empty){padding:8px 12px;border-radius:10px;background:#f8f6f2f5;color:#625b54;box-shadow:0 2px 12px #0001}
html.embedded .calendar-share-trigger{left:8px;top:8px}
