@layer grundlage{:root{color-scheme:light dark;--papier:light-dark(oklch(97.6% .008 75),oklch(16.5% .011 50));--flaeche:light-dark(oklch(99.4% .004 80),oklch(20.5% .013 50));--flaeche-2:light-dark(oklch(95.2% .011 72),oklch(24.5% .015 50));--flaeche-3:light-dark(oklch(92.5% .014 70),oklch(28.5% .016 52));--linie:light-dark(oklch(90% .012 70),oklch(29% .014 50));--linie-stark:light-dark(oklch(80% .018 65),oklch(40% .018 55));--tinte:light-dark(oklch(23% .02 50),oklch(95% .012 75));--tinte-2:light-dark(oklch(40% .02 55),oklch(81% .014 70));--tinte-3:light-dark(oklch(49% .018 60),oklch(70% .014 70));--akzent:light-dark(oklch(50% .125 48),oklch(77% .115 62));--akzent-stark:light-dark(oklch(43% .12 45),oklch(84% .1 65));--auf-akzent:light-dark(oklch(99% .005 80),oklch(18% .02 50));--akzent-zart:color-mix(in oklch, var(--akzent) 11%, var(--flaeche));--wartet:light-dark(oklch(47% .035 250),oklch(76% .045 250));--kalibriert:light-dark(oklch(50% .11 68),oklch(81% .125 80));--fertig:light-dark(oklch(47% .085 152),oklch(79% .1 152));--luecke:light-dark(oklch(50% .1 92),oklch(83% .12 95));--warnung:light-dark(oklch(51% .14 45),oklch(77% .13 52));--fehler:light-dark(oklch(49% .16 25),oklch(73% .14 25));--reihe-temperatur:light-dark(#b0612a,#cc7c40);--reihe-feuchte:light-dark(#00899b,#16a2b1);--reihe-druck:light-dark(#2a78d6,#3987e5);--reihe-fluss:#d55181;--reihe-gewicht:light-dark(#4a3aa7,#9085e9);--bcc-aktuell:#e5484d;--bcc-vergleich:light-dark(#625b55,#b8afa7);--bcc-ziel:color-mix(in oklch, var(--akzent) 12%, transparent);--schatten-nah:light-dark(oklch(30% .03 50/.07),oklch(0% 0 0/.35));--schatten-fern:light-dark(oklch(30% .04 50/.16),oklch(0% 0 0/.55));--schatten:0 1px 2px var(--schatten-nah);--schatten-hoch:0 1px 2px var(--schatten-nah), 0 14px 36px -10px var(--schatten-fern);--schrift-text:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--schrift-titel:"Fraunces", ui-serif, Georgia, "Times New Roman", serif;--t-mini:.75rem;--t-klein:.8125rem;--t-text:1rem;--t-gross:clamp(1.125rem, 1.02rem + .45vw, 1.3rem);--t-zwischen:clamp(1.35rem, 1.15rem + .9vw, 1.75rem);--t-titel:clamp(1.9rem, 1.35rem + 2.3vw, 2.9rem);--t-held:clamp(2.5rem, 1.7rem + 3.4vw, 4.1rem);--r-1:.25rem;--r-2:.5rem;--r-3:.75rem;--r-4:1rem;--r-5:1.5rem;--r-6:2rem;--r-7:3rem;--r-8:4rem;--rand:clamp(1rem, .6rem + 1.8vw, 2.5rem);--rund-1:10px;--rund-2:16px;--rund-3:24px;--kurve:cubic-bezier(.2, .7, .2, 1);--dauer:.24s;--leiste-hoehe:4.25rem;--seitenleiste:16.5rem}:root[data-farbschema=hell]{color-scheme:light}:root[data-farbschema=dunkel]{color-scheme:dark}*,:before,:after{box-sizing:border-box}html{-moz-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:contain;background:var(--papier);hanging-punctuation:first last;scroll-padding-top:5rem}body{background:var(--papier);min-height:100dvh;color:var(--tinte);font-family:var(--schrift-text);font-size:var(--t-text);font-feature-settings:"cv11", "ss03";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;margin:0;line-height:1.55}h1,h2,h3,h4{font-family:var(--schrift-titel);letter-spacing:-.012em;text-wrap:balance;font-optical-sizing:auto;margin:0;font-weight:480;line-height:1.12}h1{font-size:var(--t-titel);letter-spacing:-.022em;font-weight:420}h2{font-size:var(--t-zwischen)}h3{font-size:var(--t-gross);font-weight:540}p{text-wrap:pretty;max-inline-size:68ch;margin:0}a{color:inherit;-webkit-text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-underline-offset:.2em}a:hover{text-decoration-color:currentColor}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}img,svg{max-width:100%;display:block}:focus-visible{outline:2px solid var(--akzent);outline-offset:3px;border-radius:6px}:focus:not(:focus-visible){outline:none}::selection{background:color-mix(in oklch, var(--akzent) 28%, transparent)}.ziffern,time,data{font-variant-numeric:tabular-nums}.nur-vorlesen{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;overflow:hidden;position:absolute!important}}@layer rahmen{.sprunglink{inset:var(--r-3) auto auto var(--r-3);z-index:100;padding:var(--r-2) var(--r-4);border-radius:var(--rund-1);background:var(--tinte);color:var(--papier);font-weight:600;position:fixed;translate:0 -200%;&:focus-visible{translate:0}}.rahmen{grid-template-rows:auto 1fr;grid-template-columns:1fr;min-height:100dvh;display:grid}.navigation{z-index:30;padding:var(--r-1) var(--r-2) max(var(--r-1), env(safe-area-inset-bottom));background:color-mix(in oklch, var(--flaeche) 86%, transparent);-webkit-backdrop-filter:saturate(1.4)blur(18px);border-top:1px solid var(--linie);display:flex;position:fixed;inset:auto 0 0;& .marke,& .navigation__fuss,& .suchknopf{display:none}& ul{grid-auto-columns:1fr;grid-auto-flow:column;width:100%;margin:0;padding:0;list-style:none;display:grid}& a{min-height:3.5rem;padding:var(--r-2) var(--r-1) var(--r-1);border-radius:var(--rund-1);color:var(--tinte-3);letter-spacing:.01em;transition:color var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);justify-items:center;gap:2px;font-size:.6875rem;font-weight:560;text-decoration:none;display:grid;position:relative;& svg{stroke-width:1.75px;width:1.375rem;height:1.375rem}&[aria-current=page]{color:var(--akzent-stark);& svg{stroke-width:2.1px}}&:hover{color:var(--tinte)}}@media (width<60rem){& ul{grid-auto-columns:minmax(0,1fr);&>li{min-width:0}}& ul>li>a{letter-spacing:0;align-content:start;min-width:0;min-height:max(44px,3.5rem);padding-inline:2px;font-size:.625rem;line-height:1.1;&>span:not(.zaehler){overflow-wrap:anywhere;text-align:center;max-width:100%}&>.zaehler{inset-inline:auto 0}}}& .zaehler{background:var(--akzent);min-width:1.15rem;color:var(--auf-akzent);text-align:center;font-variant-numeric:tabular-nums;border-radius:99px;padding:0 5px;font-size:.625rem;font-weight:700;line-height:1.15rem;position:absolute;inset:4px auto auto calc(50% + 6px)}}.kopf{z-index:20;align-items:center;gap:var(--r-3);min-height:3.5rem;padding:max(var(--r-2), env(safe-area-inset-top)) var(--rand) var(--r-2);background:var(--papier);border-bottom:1px solid #0000;display:flex;position:sticky;top:0;& .marke{margin-inline-end:auto}}.marke{align-items:center;gap:var(--r-2);min-width:0;color:var(--tinte);font-family:var(--schrift-titel);letter-spacing:-.01em;white-space:nowrap;font-size:1.125rem;font-weight:560;text-decoration:none;display:inline-flex;& .marke__zeichen{object-fit:cover;width:2rem;height:2rem;box-shadow:0 0 0 1px color-mix(in oklch, var(--linie-stark) 55%, transparent);border-radius:22%;flex:none}}.suchknopf{align-items:center;gap:var(--r-2);min-height:2.75rem;padding:0 var(--r-3);border:1px solid var(--linie);background:var(--flaeche);color:var(--tinte-2);font-size:var(--t-klein);border-radius:99px;display:inline-flex;& svg{width:1.05rem;height:1.05rem}& kbd{border:1px solid var(--linie);background:var(--flaeche-2);color:var(--tinte-3);border-radius:6px;padding:1px 6px;font-family:inherit;font-size:.6875rem}&:hover{border-color:var(--linie-stark);color:var(--tinte)}}.haupt{min-width:0;padding:var(--r-2) var(--rand) calc(var(--leiste-hoehe) + env(safe-area-inset-bottom) + var(--r-7));container:haupt/inline-size;&:focus{outline:none}}@media (width>=60rem){.rahmen{grid-template-columns:var(--seitenleiste) minmax(0, 1fr);grid-template-rows:1fr}.kopf{display:none}.navigation{gap:var(--r-5);height:100dvh;padding:var(--r-5) var(--r-4);border-top:0;border-right:1px solid var(--linie);background:var(--papier);-webkit-backdrop-filter:none;backdrop-filter:none;flex-direction:column;position:sticky;inset:0 auto auto 0;& .marke{padding:0 var(--r-2);display:inline-flex}& .suchknopf{display:inline-flex}& ul{grid-auto-flow:row;gap:2px}& a{place-items:center start;gap:var(--r-3);min-height:2.75rem;padding:0 var(--r-3);color:var(--tinte-2);grid-template-columns:auto 1fr auto;font-size:.9375rem;font-weight:500;& svg{width:1.2rem;height:1.2rem}&:hover{background:var(--flaeche-2)}&[aria-current=page]{background:var(--flaeche);color:var(--tinte);box-shadow:var(--schatten), inset 0 0 0 1px var(--linie);& svg{color:var(--akzent)}}}& .zaehler{position:static}& .navigation__fuss{justify-items:start;display:grid;& .knopf{padding-inline:var(--r-3)}gap:var(--r-2);margin-top:auto}}.haupt{padding:var(--r-6) var(--rand) var(--r-8)}}}@layer bausteine{.seite{gap:var(--r-6);max-width:74rem;margin-inline:auto;display:grid}.seitenkopf{gap:var(--r-2);padding-top:var(--r-3);display:grid;& .seitenkopf__zeile{justify-content:space-between;align-items:end;gap:var(--r-3);flex-wrap:wrap;display:flex}& h1{view-transition-name:seitentitel}& h1:focus{outline:none}}.vorzeile{color:var(--tinte-3);font-size:var(--t-klein);letter-spacing:.08em;text-transform:uppercase;font-weight:600}.einleitung{color:var(--tinte-2);font-size:var(--t-gross);line-height:1.45}.zurueck{align-items:center;gap:var(--r-1);width:fit-content;min-height:2.75rem;color:var(--tinte-2);font-size:var(--t-klein);font-weight:560;text-decoration:none;display:inline-flex;& svg{width:1rem;height:1rem}&:hover{color:var(--tinte)}}.abschnitt{gap:var(--r-4);align-content:start;display:grid;&>header{justify-content:space-between;align-items:baseline;gap:var(--r-3);display:flex}& h2{font-size:var(--t-gross);font-family:var(--schrift-text);letter-spacing:-.005em;font-weight:620}}.mehr-link{color:var(--akzent-stark);font-size:var(--t-klein);white-space:nowrap;align-items:center;gap:4px;font-weight:600;text-decoration:none;display:inline-flex;& svg{width:1rem;height:1rem;transition:translate var(--dauer) var(--kurve)}&:hover svg{translate:3px}}.karte{gap:var(--r-4);padding:clamp(var(--r-4), 3cqi, var(--r-5));border:1px solid var(--linie);border-radius:var(--rund-2);background:var(--flaeche);box-shadow:var(--schatten);align-content:start;display:grid;position:relative;container-type:inline-size}a.karte,.karte--link{color:inherit;transition:border-color var(--dauer) var(--kurve), box-shadow var(--dauer) var(--kurve), translate var(--dauer) var(--kurve);text-decoration:none;&:hover{border-color:var(--linie-stark);box-shadow:var(--schatten-hoch)}&:active{translate:0 1px}}.chargenkarte__link{color:inherit;text-decoration:none;&:hover .sortenname__name{color:var(--akzent-stark)}}.chargennachtrag{gap:var(--r-3);padding-top:var(--r-3);border-top:1px solid var(--linie);display:grid;& fieldset{gap:var(--r-3);border:0;margin:0;padding:0;display:grid}& .feld__fehler{color:var(--fehler);font-size:var(--t-klein);font-weight:560}}.karte--held{background:radial-gradient(120% 90% at 100% 0%, color-mix(in oklch, var(--akzent) 9%, transparent), transparent 60%), var(--flaeche)}.karte__kopf{justify-content:space-between;align-items:start;gap:var(--r-3);display:flex}.sortenname{gap:2px;min-width:0;display:grid;& .sortenname__roester{color:var(--tinte-3);font-size:var(--t-klein);font-weight:560}& .sortenname__name{font-family:var(--schrift-titel);font-size:var(--t-gross);overflow-wrap:anywhere;font-weight:520;line-height:1.2}}.raster{gap:var(--r-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));display:grid}.kennzahlen{gap:var(--r-4) var(--r-5);grid-template-columns:repeat(2,minmax(0,1fr));margin:0;display:grid;@container (width>34rem){grid-template-columns:repeat(4,minmax(0,1fr))}}.kennzahl{align-content:start;gap:2px;margin:0;display:grid;& dt{color:var(--tinte-3);font-size:var(--t-klein);font-weight:520}& dd{font-size:var(--t-zwischen);letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:0;font-weight:560;line-height:1.1}& .einheit{color:var(--tinte-3);letter-spacing:0;margin-inline-start:.2em;font-size:.6em;font-weight:500}& .kennzahl__nebenbei{color:var(--tinte-3);font-size:var(--t-mini);font-weight:500}}.kennzahl--held dd{font-size:var(--t-held);letter-spacing:-.035em;font-weight:500}.fluss{align-items:baseline;gap:var(--r-2) var(--r-3);font-size:min(var(--t-held), 11.5cqi);letter-spacing:-.035em;font-variant-numeric:tabular-nums;flex-wrap:wrap;font-weight:500;line-height:1;display:flex;& .einheit{color:var(--tinte-3);letter-spacing:0;margin-inline-start:.1em;font-size:.42em;font-weight:500}& .fluss__pfeil{color:var(--tinte-3);align-self:center;& svg{width:.5em;height:.5em}}}.meta{gap:var(--r-1) var(--r-3);color:var(--tinte-3);font-size:var(--t-klein);flex-wrap:wrap;display:flex;&>*{align-items:center;gap:5px;display:inline-flex}& svg{width:.95rem;height:.95rem}}.plakette{--farbe:var(--tinte-2);background:color-mix(in oklch, var(--farbe) 11%, var(--flaeche));width:fit-content;box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--farbe) 22%, transparent);color:var(--farbe);font-size:var(--t-mini);white-space:nowrap;border-radius:99px;align-items:center;gap:5px;padding:3px 10px 3px 8px;font-weight:620;line-height:1.35;display:inline-flex;& svg{stroke-width:2.2px;flex:none;width:.85rem;height:.85rem}&[data-art=wartet]{--farbe:var(--wartet)}&[data-art=kalibriert]{--farbe:var(--kalibriert)}&[data-art=fertig]{--farbe:var(--fertig)}&[data-art=luecke]{--farbe:var(--luecke)}&[data-art=warnung]{--farbe:var(--warnung)}&[data-art=fehler]{--farbe:var(--fehler)}&[data-art=akzent]{--farbe:var(--akzent-stark)}}.plaketten{gap:var(--r-1) var(--r-2);flex-wrap:wrap;display:flex}.knopf{justify-content:center;align-items:center;gap:var(--r-2);min-height:2.75rem;padding:0 var(--r-4);border:1px solid var(--linie-stark);background:var(--flaeche);color:var(--tinte);white-space:nowrap;transition:background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve), scale .12s var(--kurve);border-radius:99px;font-size:.9375rem;font-weight:600;text-decoration:none;display:inline-flex;& svg{width:1.1rem;height:1.1rem}&:hover:not(:disabled){background:var(--flaeche-2)}&:active:not(:disabled){scale:.98}&:disabled{opacity:.5}}.knopf--haupt{background:var(--tinte);color:var(--papier);border-color:#0000;&:hover:not(:disabled){background:color-mix(in oklch, var(--tinte) 88%, var(--akzent))}}.knopf--akzent{background:var(--akzent);color:var(--auf-akzent);border-color:#0000;&:hover:not(:disabled){background:var(--akzent-stark)}}.knopf--leise{color:var(--tinte-2);background:0 0;border-color:#0000;&:hover:not(:disabled){background:var(--flaeche-2);color:var(--tinte)}}.knopf--gefahr{color:var(--fehler);border-color:color-mix(in oklch, var(--fehler) 40%, var(--linie))}.knopf--rund{width:2.75rem;padding:0}.knopfreihe{gap:var(--r-2);flex-wrap:wrap;align-items:center;display:flex}.segmente{background:var(--flaeche-2);width:fit-content;max-width:100%;box-shadow:inset 0 0 0 1px var(--linie);scrollbar-width:none;border-radius:99px;gap:2px;padding:3px;display:flex;overflow-x:auto;& a,& button{min-height:2.5rem;padding:0 var(--r-4);color:var(--tinte-2);font-size:var(--t-klein);white-space:nowrap;transition:background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);background:0 0;border:0;border-radius:99px;align-items:center;gap:6px;font-weight:600;text-decoration:none;display:inline-flex;&[aria-current=true],&[aria-pressed=true]{background:var(--flaeche);color:var(--tinte);box-shadow:var(--schatten), inset 0 0 0 1px var(--linie)}&:hover{color:var(--tinte)}}& .anzahl{color:var(--tinte-3);font-variant-numeric:tabular-nums;font-weight:500}}.liste{border:1px solid var(--linie);border-radius:var(--rund-2);background:var(--flaeche);box-shadow:var(--schatten);margin:0;padding:0;list-style:none;overflow:clip;&>li+li{border-top:1px solid var(--linie)}}.zeile{align-items:center;gap:var(--r-1) var(--r-4);min-height:3.75rem;padding:var(--r-3) var(--r-4);color:inherit;transition:background-color var(--dauer) var(--kurve);grid-template-columns:minmax(0,1fr) auto;text-decoration:none;display:grid;&:is(a):hover{background:var(--flaeche-2)}& .zeile__titel{overflow-wrap:anywhere;font-weight:600}& .zeile__rechts{align-items:center;gap:var(--r-3);color:var(--tinte-2);font-variant-numeric:tabular-nums;display:flex}& .zeile__pfeil{color:var(--tinte-3);width:1rem;height:1rem}}.gruppe{gap:var(--r-3);display:grid}.gruppenkopf{z-index:5;justify-content:space-between;align-items:baseline;gap:var(--r-3);margin-inline:calc(var(--r-2) * -1);padding:var(--r-2);background:color-mix(in oklch, var(--papier) 92%, transparent);-webkit-backdrop-filter:blur(10px);font-family:var(--schrift-text);font-size:var(--t-klein);letter-spacing:.02em;color:var(--tinte-2);font-weight:650;display:flex;position:sticky;top:3.5rem;& .gruppenkopf__zahl{color:var(--tinte-3);font-variant-numeric:tabular-nums;font-weight:500}@media (width>=60rem){top:0}}.band{gap:var(--r-3);margin-inline:calc(var(--rand) * -1);padding:var(--r-1) var(--rand) var(--r-3);overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--rand);scrollbar-width:thin;scrollbar-color:var(--linie-stark) transparent;grid-auto-columns:min(82%,19rem);grid-auto-flow:column;display:grid;overflow-x:auto;&>*{scroll-snap-align:start}}.hinweis{--farbe:var(--tinte-2);gap:var(--r-1) var(--r-3);padding:var(--r-4);border-radius:var(--rund-2);background:color-mix(in oklch, var(--farbe) 9%, var(--flaeche));box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--farbe) 26%, transparent);grid-template-columns:auto minmax(0,1fr);display:grid;&>svg{width:1.25rem;height:1.25rem;color:var(--farbe);margin-top:2px}& .hinweis__titel{font-weight:650}& .hinweis__text{color:var(--tinte-2);grid-column:2;font-size:.9375rem}& .knopfreihe{margin-top:var(--r-2);grid-column:2}&[data-art=sperre],&[data-art=warnung]{--farbe:var(--warnung)}&[data-art=fehler]{--farbe:var(--fehler)}&[data-art=luecke]{--farbe:var(--luecke)}&[data-art=info]{--farbe:var(--akzent)}}.leer{justify-items:center;gap:var(--r-2);padding:var(--r-7) var(--r-4);border:1px dashed var(--linie-stark);border-radius:var(--rund-2);text-align:center;display:grid;&>svg{width:2rem;height:2rem;color:var(--tinte-3);stroke-width:1.5px;margin-bottom:var(--r-2)}& .leer__titel{font-family:var(--schrift-titel);font-size:var(--t-gross);font-weight:520}& .leer__text{color:var(--tinte-2);max-width:40ch}}.skelett{gap:var(--r-3);display:grid}.skelett__balken{background:linear-gradient(90deg, var(--flaeche-2), var(--flaeche-3), var(--flaeche-2)) 0 0 / 300% 100%;border-radius:8px;height:1rem;&.skelett__balken--gross{border-radius:var(--rund-2);height:5.5rem}&.skelett__balken--kurz{width:45%}}.feld{gap:6px;display:grid;&>label,& .feld__name{color:var(--tinte-2);font-size:var(--t-klein);font-weight:600}& .feld__hilfe{color:var(--tinte-3);font-size:var(--t-mini)}& .feld__fehler{color:var(--fehler);font-size:var(--t-klein);font-weight:560}}.eingabe{width:100%;min-height:2.875rem;padding:var(--r-2) var(--r-3);border:1px solid var(--linie-stark);border-radius:var(--rund-1);background:var(--flaeche);color:var(--tinte);font-variant-numeric:tabular-nums;transition:border-color var(--dauer) var(--kurve), box-shadow var(--dauer) var(--kurve);&:focus-visible{border-color:var(--akzent);box-shadow:0 0 0 3px color-mix(in oklch, var(--akzent) 25%, transparent);outline:none}&[aria-invalid=true]{border-color:var(--fehler)}}textarea.eingabe{resize:vertical;min-height:6rem;line-height:1.5}select.eingabe{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--tinte-3) 50%), linear-gradient(135deg, var(--tinte-3) 50%, transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-repeat:no-repeat;background-size:5px 5px;padding-right:2.2rem}.formular{gap:var(--r-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));display:grid;& .feld--breit{grid-column:1/-1}}.notenskala{border:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;display:grid;@container (width>30rem){grid-template-columns:repeat(10,minmax(0,1fr))}& label{border:1px solid var(--linie-stark);border-radius:var(--rund-1);background:var(--flaeche);font-variant-numeric:tabular-nums;cursor:pointer;min-height:3rem;transition:background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);place-items:center;font-size:1.125rem;font-weight:600;display:grid;position:relative;&:hover{border-color:var(--akzent)}&:has(input:checked){background:var(--tinte);border-color:var(--tinte);color:var(--papier)}&:has(input:focus-visible){outline:2px solid var(--akzent);outline-offset:2px}}& input{opacity:0;pointer-events:none;position:absolute}}.chips{border:0;flex-wrap:wrap;gap:6px;margin:0;padding:0;display:flex;& label{min-height:2.5rem;padding:0 var(--r-3);border:1px solid var(--linie-stark);background:var(--flaeche);font-size:var(--t-klein);cursor:pointer;transition:background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);border-radius:99px;align-items:center;gap:6px;font-weight:560;display:inline-flex;& .punkt{background:var(--punkt,var(--tinte-3));border-radius:50%;width:.55rem;height:.55rem}&:hover{border-color:var(--akzent)}&:has(input:checked){border-color:var(--akzent);background:var(--akzent-zart);color:var(--akzent-stark)}&:has(input:focus-visible){outline:2px solid var(--akzent);outline-offset:2px}}& input{opacity:0;pointer-events:none;position:absolute}}dialog.dialog{width:min(100% - 2 * var(--r-3), 36rem);border:1px solid var(--linie);border-radius:var(--rund-3);background:var(--flaeche);max-height:min(88dvh,52rem);color:var(--tinte);box-shadow:var(--schatten-hoch);overscroll-behavior:contain;padding:0;overflow:auto;&::backdrop{background:color-mix(in oklch, var(--tinte) 30%, transparent);-webkit-backdrop-filter:blur(6px)}& .dialog__inhalt{gap:var(--r-4);padding:var(--r-5);display:grid}& .dialog__kopf{gap:var(--r-1);display:grid}& .dialog__fuss{justify-content:flex-end;gap:var(--r-2);padding:var(--r-3) var(--r-5) var(--r-4);border-top:1px solid var(--linie);background:var(--flaeche);flex-wrap:wrap-reverse;display:flex;position:sticky;bottom:0}}.menue{min-width:14rem;padding:var(--r-1);border:1px solid var(--linie);border-radius:var(--rund-2);background:var(--flaeche);color:var(--tinte);box-shadow:var(--schatten-hoch);margin:0;& .menue__titel{padding:var(--r-2) var(--r-3) var(--r-1);color:var(--tinte-3);font-size:var(--t-mini);letter-spacing:.06em;text-transform:uppercase;font-weight:650}& button,& a{align-items:center;gap:var(--r-3);width:100%;min-height:2.75rem;padding:0 var(--r-3);border-radius:var(--rund-1);color:inherit;text-align:start;background:0 0;border:0;font-size:.9375rem;text-decoration:none;display:flex;& svg{width:1.1rem;height:1.1rem;color:var(--tinte-3)}&:hover:not(:disabled),&:focus-visible{background:var(--flaeche-2);outline:none}&:disabled{opacity:.45}&[aria-checked=true]{font-weight:650;& svg{color:var(--akzent)}}&.menue__gefahr{color:var(--fehler);& svg{color:currentColor}}}& hr{margin:var(--r-1) 0;border:0;border-top:1px solid var(--linie)}}@supports (anchor-name:--a){.menue[popover]{position-area:block-end span-inline-start;position-try-fallbacks:flip-block, flip-inline, flip-block flip-inline;margin-block:6px}.menue--oben[popover]{position-area:block-start span-inline-end}}@supports not (anchor-name:--a){.menue[popover]{width:100%;max-width:32rem;padding-bottom:max(var(--r-3), env(safe-area-inset-bottom));border-radius:var(--rund-3) var(--rund-3) 0 0;margin:0 auto;inset:auto 0 0}}dialog.befehlsleiste{width:min(100% - 2 * var(--r-3), 40rem);border:1px solid var(--linie);border-radius:var(--rund-3);background:var(--flaeche);max-height:min(70dvh,34rem);color:var(--tinte);box-shadow:var(--schatten-hoch);margin-top:min(14vh,8rem);padding:0;overflow:hidden;&[open]{grid-template-rows:auto minmax(0,1fr) auto;display:grid}&::backdrop{background:color-mix(in oklch, var(--tinte) 26%, transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}& .befehlsleiste__suche{align-items:center;gap:var(--r-3);padding:0 var(--r-4);border-bottom:1px solid var(--linie);display:flex;& svg{width:1.2rem;height:1.2rem;color:var(--tinte-3);flex:none}& input{background:0 0;border:0;outline:none;flex:1;min-width:0;min-height:3.5rem;font-size:1.0625rem}}& [role=listbox]{padding:var(--r-2);overscroll-behavior:contain;margin:0;list-style:none;overflow-y:auto}& .befehlsleiste__gruppe{padding:var(--r-3) var(--r-3) var(--r-1);color:var(--tinte-3);font-size:var(--t-mini);letter-spacing:.06em;text-transform:uppercase;font-weight:650}& [role=option]{align-items:center;gap:var(--r-3);min-height:2.75rem;padding:var(--r-2) var(--r-3);border-radius:var(--rund-1);cursor:pointer;display:flex;& svg{width:1.1rem;height:1.1rem;color:var(--tinte-3);flex:none}& .option__neben{color:var(--tinte-3);font-size:var(--t-klein);white-space:nowrap;margin-inline-start:auto}&[aria-selected=true]{background:var(--akzent-zart);& svg{color:var(--akzent)}}}& .befehlsleiste__fuss{gap:var(--r-4);padding:var(--r-2) var(--r-4);border-top:1px solid var(--linie);color:var(--tinte-3);font-size:var(--t-mini);display:flex;& kbd{border:1px solid var(--linie);border-radius:5px;padding:0 5px;font-family:inherit}}}.rueckmeldungen{inset:auto var(--r-3) calc(var(--leiste-hoehe) + env(safe-area-inset-bottom) + var(--r-3));z-index:70;justify-items:center;gap:var(--r-2);pointer-events:none;display:grid;position:fixed;@media (width>=60rem){inset:auto var(--r-5) var(--r-5) auto;justify-items:end}}.rueckmeldung{align-items:center;gap:var(--r-2);padding:var(--r-2) var(--r-4);background:var(--tinte);color:var(--papier);box-shadow:var(--schatten-hoch);border-radius:99px;font-size:.9375rem;font-weight:560;display:inline-flex;& svg{width:1.05rem;height:1.05rem}}.ziehanzeige{z-index:40;pointer-events:none;place-items:center;height:0;display:grid;position:fixed;inset:0 0 auto;& span{background:var(--flaeche);width:2.5rem;height:2.5rem;box-shadow:var(--schatten-hoch);color:var(--akzent);translate:0 calc(var(--zug,0) * 1px - 3rem);opacity:calc(var(--zug,0) / 72);border-radius:50%;place-items:center;display:grid;& svg{width:1.2rem;height:1.2rem;rotate:calc(var(--zug,0) * 4deg)}}}.diagramm{gap:var(--r-2);display:grid;position:relative;& svg{touch-action:pan-y;overflow:visible}& svg:focus-visible{outline:2px solid var(--akzent);outline-offset:4px;border-radius:8px}& .achse text{fill:var(--tinte-3);font-variant-numeric:tabular-nums;font-size:11px}& .raster line{stroke:var(--linie);stroke-width:1px}& .linie{fill:none;stroke:var(--reihe);stroke-width:2px;stroke-linejoin:round;stroke-linecap:round}& .flaeche{fill:color-mix(in oklch, var(--reihe) 9%, transparent)}& .punkt{fill:var(--reihe);stroke:var(--flaeche);stroke-width:2px}& .fadenkreuz{stroke:var(--tinte-3);stroke-width:1px;stroke-dasharray:3 3}& .fadenpunkt{fill:var(--reihe);stroke:var(--flaeche);stroke-width:2.5px}}.kurve{gap:var(--r-3);display:grid;position:relative;& svg{touch-action:pan-y;overflow:visible}&>svg:focus-visible{outline:2px solid var(--akzent);outline-offset:4px;border-radius:8px}& .achse text{fill:var(--tinte-3);font-variant-numeric:tabular-nums;font-size:11px}& .raster line{stroke:var(--linie);stroke-width:1px}& .kurve__feldtitel{fill:var(--tinte-2);font-size:11px;font-weight:600}& .kurve__linie{fill:none;stroke-width:2px;stroke-linejoin:round;stroke-linecap:round}& .kurve__phase{& rect{fill:color-mix(in oklch, var(--tinte) 5%, transparent)}&[data-phase=preinfusion] rect{fill:color-mix(in oklch, var(--akzent) 9%, transparent)}&[data-phase=pouring] rect{fill:color-mix(in oklch, var(--akzent) 3%, transparent)}& line{stroke:var(--linie-stark);stroke-width:1px;stroke-dasharray:2 3}& text{fill:var(--tinte-3);letter-spacing:.02em;font-size:11px;font-weight:600}}& .fadenkreuz{stroke:var(--tinte-3);stroke-width:1px;stroke-dasharray:3 3}& .fadenpunkt{stroke:var(--flaeche);stroke-width:2.5px}}.kurve__ablesung{gap:var(--r-1);font-size:var(--t-klein);font-variant-numeric:tabular-nums;display:grid;& .kurve__zeit{color:var(--tinte-3)}}.kurve__legende{gap:var(--r-1) var(--r-4);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex;& li{align-items:center;gap:var(--r-2);display:inline-flex}& .kurve__name{font-weight:600}& .kurve__wert{color:var(--tinte-2);min-width:6ch}}.bcc{gap:var(--r-2);margin:0;display:grid;&>svg{width:min(100%,32rem);height:auto;margin-inline:auto;display:block;overflow:visible}& figcaption{color:var(--tinte-2);font-size:var(--t-klein);text-align:center;font-variant-numeric:tabular-nums}& .bcc__plot{fill:var(--flaeche-2);stroke:var(--linie-stark);stroke-width:1.5px}& .bcc__zielfenster{fill:var(--bcc-ziel);stroke:var(--akzent);stroke-width:1.5px}& .bcc__raster line{stroke:var(--linie);stroke-width:.7px}& .bcc__ratio line{stroke:var(--tinte-3);stroke-width:.8px;stroke-dasharray:4 4;opacity:.62}& .bcc__ratio-texte text,& .bcc__achsen text{fill:var(--tinte-3);font-family:var(--schrift-text);font-variant-numeric:tabular-nums;font-size:12px}& .bcc__achsen .bcc__richtung{fill:var(--tinte-2);font-size:12px;font-weight:620}& .bcc__achsen .bcc__achsentitel{fill:var(--tinte);font-size:12px;font-weight:700}& .bcc__treffer{fill:#0000;stroke:none;pointer-events:all}& .bcc__punkt--vergleich .bcc__marke{fill:var(--bcc-vergleich);stroke:var(--flaeche);stroke-width:1.5px;opacity:.68}& .bcc__punkt--aktuell circle{fill:var(--bcc-aktuell);stroke:var(--tinte);stroke-width:2px}& .bcc__ausserhalb{fill:var(--bcc-aktuell);stroke:var(--tinte);stroke-width:.8px}}.diagramm__kopf{justify-content:space-between;align-items:baseline;gap:var(--r-3);display:flex;& .diagramm__titel{font-weight:620}& .diagramm__wert{font-size:var(--t-zwischen);letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-weight:560}}.diagramm__spanne{color:var(--tinte-3);font-size:var(--t-klein);font-variant-numeric:tabular-nums}.tooltip{z-index:5;border:1px solid var(--linie);border-radius:var(--rund-1);background:var(--flaeche);box-shadow:var(--schatten-hoch);font-size:var(--t-klein);font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap;gap:1px;padding:6px 10px;display:grid;position:absolute;translate:-50% calc(-100% - 12px);& strong{font-size:.9375rem}& span{color:var(--tinte-3)}}.tabelle{border-collapse:collapse;width:100%;font-size:var(--t-klein);font-variant-numeric:tabular-nums;& th,& td{padding:var(--r-2) var(--r-3);border-bottom:1px solid var(--linie);text-align:end}& th:first-child,& td:first-child{text-align:start}& th{color:var(--tinte-3);background:var(--flaeche);font-weight:600;position:sticky;top:0}}details.aufklapp{border-top:1px solid var(--linie);padding-top:var(--r-3);&>summary{align-items:center;gap:var(--r-2);min-height:2.75rem;color:var(--tinte-2);font-size:var(--t-klein);cursor:pointer;font-weight:600;list-style:none;display:inline-flex;&::-webkit-details-marker{display:none}& svg{width:1rem;height:1rem;transition:rotate var(--dauer) var(--kurve)}}&[open]>summary svg{rotate:90deg}& .tabellenrahmen{max-height:22rem;overflow:auto}}.alter{gap:6px;display:grid;& .alter__zeile{justify-content:space-between;gap:var(--r-2);font-size:var(--t-klein);color:var(--tinte-2);display:flex}& .alter__balken{background:var(--flaeche-3);border-radius:99px;height:6px;position:relative;overflow:visible}& .alter__stand{border-radius:inherit;background:var(--akzent);position:absolute;inset:0 auto 0 0}& .alter__marke{background:var(--tinte-3);border-radius:2px;width:2px;position:absolute;top:-3px;bottom:-3px}}.konfidenz{align-items:center;gap:var(--r-2);font-size:var(--t-klein);color:var(--tinte-2);display:inline-flex;& meter{width:5rem;height:6px}& meter::-webkit-meter-bar{background:var(--flaeche-3);border:0;border-radius:99px;height:6px}& meter::-webkit-meter-optimum-value{background:var(--akzent);border-radius:99px}& meter::-webkit-meter-suboptimum-value{background:var(--akzent);border-radius:99px}& meter::-webkit-meter-even-less-good-value{background:var(--akzent);border-radius:99px}& meter::-moz-meter-bar{background:var(--akzent);border-radius:99px}}.fotos{gap:var(--r-3);grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));margin:0;padding:0;list-style:none;display:grid}.foto{aspect-ratio:3/4;padding:var(--r-3);border-radius:var(--rund-1);background:repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in oklch, var(--tinte) 4%, transparent) 10px 11px), var(--flaeche-2);box-shadow:inset 0 0 0 1px var(--linie);color:var(--tinte-2);font-size:var(--t-mini);align-content:end;gap:2px;display:grid;& svg{width:1.5rem;height:1.5rem;color:var(--tinte-3);margin-bottom:auto}& img{object-fit:cover;border-radius:inherit;width:100%;height:100%;position:absolute;inset:0}}.werte{gap:var(--r-2) var(--r-5);grid-template-columns:minmax(8rem,max-content) minmax(0,1fr);margin:0;display:grid;& dt{color:var(--tinte-3);font-size:var(--t-klein);padding-top:2px}& dd{align-items:baseline;gap:var(--r-1) var(--r-2);overflow-wrap:anywhere;flex-wrap:wrap;margin:0;display:flex}& .herkunft{color:var(--tinte-3);font-size:var(--t-mini);font-weight:560}& .herkunft--gelesen{color:var(--akzent-stark)}& .fehlt{color:var(--luecke);font-weight:560;font-size:var(--t-klein)}@container (width<26rem){grid-template-columns:1fr;gap:2px;& dd+dt{margin-top:var(--r-2)}}}.vergleich{gap:var(--r-3);display:grid;& .vergleich__zeile{gap:var(--r-2);padding:var(--r-3);border-radius:var(--rund-1);background:var(--flaeche-2);display:grid}& .vergleich__paar{gap:var(--r-3);grid-template-columns:1fr 1fr;display:grid}& .vergleich__seite{font-variant-numeric:tabular-nums;overflow-wrap:anywhere;gap:2px;display:grid}& .vergleich__seite small{color:var(--tinte-3);font-size:var(--t-mini);font-weight:600}}.rohtext{padding:var(--r-3) var(--r-4);border-radius:var(--rund-1);background:var(--flaeche-2);color:var(--tinte-2);white-space:pre-wrap;margin:0;font:.8125rem/1.6 ui-monospace,SF Mono,Menlo,monospace}.lesefortschritt{z-index:50;background:var(--akzent);transform-origin:0;height:2px;display:none;position:fixed;inset:0 0 auto;scale:0 1}}@layer seiten{.seite--schmal{max-width:52rem}.karte__titel{align-items:center;gap:var(--r-2);font-family:var(--schrift-text);font-size:var(--t-text);letter-spacing:0;padding:0;font-weight:650;display:flex;& svg{width:1.1rem;height:1.1rem;color:var(--akzent)}}.gruppen{gap:var(--r-6);display:grid}.heute-raster{gap:var(--r-6);display:grid;@container haupt (width>58rem){grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);&>:last-child:nth-child(odd){grid-column:1/-1}}}.detail-raster{gap:var(--r-4);align-items:start;display:grid;@container haupt (width>50rem){grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}}.rat{gap:var(--r-3);grid-template-columns:auto minmax(0,1fr);align-items:start;display:grid;& .rat__symbol{background:var(--akzent-zart);width:2.5rem;height:2.5rem;color:var(--akzent-stark);border-radius:50%;place-items:center;display:grid;& svg{width:1.3rem;height:1.3rem}}& .rat__text{gap:var(--r-2);display:grid}& .rat__kurz{font-family:var(--schrift-titel);font-size:var(--t-gross);font-weight:500;line-height:1.3}& .rat__lang{color:var(--tinte-2)}&[data-kompakt]{padding-top:var(--r-4);border-top:1px solid var(--linie);& .rat__symbol{width:2rem;height:2rem;& svg{width:1.05rem;height:1.05rem}}& .rat__kurz{font-size:1.0625rem}}&.rat--hinweis{grid-template-columns:minmax(0,1fr);& .rat__kurz{color:var(--tinte-2)}}}.belege{gap:var(--r-1);margin:0;padding:0;list-style:none;display:grid;& li{padding:var(--r-2) var(--r-3);border-radius:var(--rund-1);background:var(--flaeche-2);color:var(--tinte-2);font-size:var(--t-klein);font-variant-numeric:tabular-nums}}.ratwerte,.rat-alttext{gap:var(--r-3);color:var(--tinte-2);display:grid}.ratwerte h3,.rat-alttext h3{font-family:var(--schrift-text);font-size:var(--t-text);font-weight:700}.ratwerte ul,.rat-alttext ul{gap:var(--r-1);margin:0;padding-left:1.2rem;display:grid}.rat-alttext p+h3{margin-top:var(--r-2)}.ratwerte__tabelle{& th{width:38%}& td{font-variant-numeric:tabular-nums}}.ratwert__fenster{color:var(--tinte-3);font-size:var(--t-mini);display:block}.ratwert__lage{background:color-mix(in oklch, var(--fertig) 10%, transparent);color:var(--fertig);font-size:var(--t-mini);border-radius:99px;margin-top:3px;padding:1px 6px;font-weight:650;display:inline-block;&[data-lage=aussen]{background:color-mix(in oklch, var(--warnung) 10%, transparent);color:var(--warnung)}}.ratwerte__quelle{color:var(--tinte-3);font-size:var(--t-mini)}.rat-veraltet{justify-content:space-between;align-items:center;gap:var(--r-2);padding:var(--r-3);border-radius:var(--rund-1);background:color-mix(in oklch, var(--warnung) 8%, var(--flaeche));color:var(--warnung);flex-wrap:wrap;display:flex}.hinweiszeile{padding:var(--r-3) var(--r-4);border-left:3px solid var(--linie-stark);color:var(--tinte-2)}.bewertung{gap:var(--r-4);display:grid;container-type:inline-size}.bewertung-anzeige{gap:var(--r-3);display:grid}.aromen{gap:var(--r-4);padding-top:var(--r-3);display:grid}.erfassung{gap:var(--r-4);display:grid;container-type:inline-size}.erfassung__felder{gap:var(--r-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));display:grid}.wasser-zeile svg{vertical-align:-2px;width:14px;height:14px;margin-right:4px}.wert-warnung{color:var(--warnung)}.nullpunkt-hinweis{background:var(--flaeche-2);border-radius:99px;width:fit-content;margin-top:3px;padding:2px 7px;display:block}.aktionsleiste{align-items:center;gap:var(--r-2);flex-wrap:wrap;display:flex;& .meta{flex-basis:100%}}.aktionsleiste--haftend{bottom:calc(var(--leiste-hoehe) + env(safe-area-inset-bottom) + var(--r-2));z-index:10;padding:var(--r-3);border:1px solid var(--linie);background:color-mix(in oklch, var(--flaeche) 88%, transparent);-webkit-backdrop-filter:blur(14px);box-shadow:var(--schatten-hoch);border-radius:99px;justify-content:flex-end;position:sticky;@media (width>=60rem){bottom:var(--r-4)}}.bearbeiten{gap:var(--r-4);display:grid}fieldset.karte{min-width:0;margin:0}fieldset.karte>legend{float:left;width:100%;margin-bottom:var(--r-4)}fieldset.karte>legend+*{clear:both}.auffaellig{gap:var(--r-2);margin:0;padding:0;list-style:none;display:grid;& li{gap:var(--r-2);color:var(--tinte-2);grid-template-columns:auto 1fr;font-size:.9375rem;display:grid;& svg{width:1.05rem;height:1.05rem;margin-top:3px}&[data-art=luecke] svg{color:var(--luecke)}&[data-art=warnung] svg{color:var(--warnung)}}}.foto{position:relative}@container haupt (width<34rem){.zeile:not(.zeile--bezug){grid-template-columns:minmax(0,1fr);& .zeile__rechts{justify-content:space-between}}}.zeile--bezug{grid-template-columns:3.5rem minmax(0,1fr) auto;& .zeile__zeit{color:var(--tinte-3);font-size:var(--t-klein);font-weight:560}& .zeile__werte{font-size:var(--t-klein);display:none}@container haupt (width>40rem){& .zeile__werte{display:inline}}}.diagramme{gap:var(--r-5);display:grid;@container (width>44rem){grid-template-columns:1fr 1fr}}.diagramm__block{gap:var(--r-1);display:grid}.sortenkopf{padding:var(--r-2) 0}.platz-bezug{min-height:23rem;@container haupt (width>40rem){min-height:19rem}}.platz-klima{min-height:16rem}.platz-rat{min-height:5.5rem;padding-top:var(--r-4);border-top:1px solid var(--linie)}.tor{align-content:start;justify-items:center;gap:var(--r-6);min-height:100dvh;padding:max(var(--r-6), env(safe-area-inset-top)) var(--rand) var(--r-8);display:grid;@media (height>40rem){padding-top:max(12vh, env(safe-area-inset-top))}}.tor__inhalt{gap:var(--r-5);width:100%;max-width:30rem;display:grid}.verweisknopf{color:inherit;font:inherit;text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-decoration-color:color-mix(in oklch, currentColor 35%, transparent);text-underline-offset:.2em;cursor:pointer;background:0 0;border:0;padding:0}dialog.dialog--breit{width:min(100% - 2 * var(--r-3), 70rem);max-height:92dvh;@media (width<60rem){border-radius:var(--rund-3) var(--rund-3) 0 0;width:100%;max-width:none;max-height:94dvh;margin:auto 0 0;& .dialog__fuss{padding-bottom:max(var(--r-4), env(safe-area-inset-bottom))}}& .dialog__fuss{align-items:center}}.geschmack{gap:var(--r-4);min-width:0;display:grid}.geschmack__anzahl{color:var(--tinte-2);font-size:var(--t-klein);font-variant-numeric:tabular-nums;margin-inline-end:auto}.geschmack__erkundung{gap:var(--r-5);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid;@media (width<60rem){grid-template-columns:minmax(0,1fr)}}.geschmack__rad{width:100%;min-width:0;max-width:30rem;margin-inline:auto}.geschmack__rad>summary{padding-block:var(--r-2);cursor:pointer;font-weight:600}.geschmack__liste{gap:var(--r-3);min-width:0;display:grid}.aromarad{width:min(100%,max(0px,92dvh - 24rem));height:auto;margin-inline:auto;display:block;overflow:visible}.aromarad__ring{fill:var(--flaeche-2);stroke:var(--papier);stroke-width:1px;vector-effect:non-scaling-stroke}.aromarad__ebene{fill:var(--tinte);font-family:var(--schrift-titel);text-anchor:middle;font-size:9px}.aromarad__segment{cursor:pointer;& path{fill:light-dark(color-mix(in oklch, var(--akzent) var(--ton-hell), var(--flaeche)),color-mix(in oklch, var(--akzent) var(--ton-dunkel), var(--flaeche)));stroke:var(--papier);stroke-width:1px;vector-effect:non-scaling-stroke}& text{fill:var(--tinte);font-family:var(--schrift-text);pointer-events:none;font-size:9px}&.ist-gewaehlt path{fill:var(--intensitaet,var(--akzent))}&.ist-gewaehlt text{fill:var(--auf-akzent)}&:hover path,&:focus-visible path{stroke:var(--akzent);stroke-width:2px}&:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}}.aromarad__legende{gap:var(--r-1);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex;& .knopf{min-height:2.25rem;font-size:var(--t-klein);white-space:normal;text-align:start}}.geschmack .intensitaet-1{--intensitaet:var(--akzent)}.geschmack .intensitaet-2{--intensitaet:color-mix(in oklch, var(--akzent) 50%, var(--akzent-stark))}.geschmack .intensitaet-3{--intensitaet:var(--akzent-stark)}.merkmal{gap:var(--r-2);padding-block:var(--r-3);border-bottom:1px solid var(--linie);display:grid;&>.knopf{justify-self:start}}.merkmal__kopf{& h3{font-size:var(--t-gross);margin-inline-end:var(--r-2);display:inline}& small{color:var(--tinte-3);font-size:var(--t-klein);display:block}}.merkmal__gewaehlt{font-size:var(--t-klein);font-weight:600}.merkmal__tasten{gap:var(--r-2);flex-wrap:wrap;display:flex;& .knopf{white-space:normal;flex:auto}& .ist-gewaehlt{background:var(--intensitaet,var(--akzent));color:var(--auf-akzent);border-color:#0000}}.merkmal__tasten--wertung .knopf{font-size:var(--t-klein)}.geschmack .notenskala label.ist-gewaehlt{background:var(--akzent);color:var(--auf-akzent);border-color:#0000;justify-content:center;align-items:center;gap:2px;transition:none;display:flex}.notenskala__stand{margin:var(--r-2) 0 0}.frage{gap:var(--r-3)}.frage__zaehler{font-variant-numeric:tabular-nums;justify-self:end}.frage__wartet{& p{align-items:center;gap:var(--r-2);color:var(--tinte-2);display:flex}& p svg{width:1.1rem;height:1.1rem;color:var(--akzent);flex:none}}.frage__saetze{gap:var(--r-3);font-size:var(--t-gross);margin:0;padding:0;line-height:1.45;list-style:none;display:grid}.frage__nr{color:var(--akzent);font-size:var(--t-klein);font-variant-numeric:tabular-nums;font-weight:650}.frage__nr--link{text-decoration:none}.frage__nr--link:hover{text-decoration:underline}.frage__ursprung a{color:var(--akzent)}.frage__spalten{gap:var(--r-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));display:grid}.frage__spalte{gap:var(--r-2);align-content:start;display:grid}.frage__spaltenkopf{color:var(--tinte-3);font-family:var(--schrift-text);font-size:var(--t-klein);letter-spacing:.08em;text-transform:uppercase;font-weight:600}.frage__liste{gap:var(--r-1);margin:0;padding:0;list-style:none;display:grid}.frage__quelle{padding:var(--r-2) var(--r-3);border-radius:var(--rund-1);background:var(--flaeche-2);font-size:var(--t-klein);gap:2px;display:grid}.frage__aussage{color:var(--tinte)}.frage__bedingung,.frage__ursprung{color:var(--tinte-3);font-size:var(--t-mini)}.wirkungsbuch__filter{gap:var(--r-4);flex-wrap:wrap;display:flex}.wirkungsbuch__filter .feld{flex:12rem;min-width:0}.wirkungsbuch__tabelle{max-width:100%;overflow-x:auto}.wirkungsbuch__tabelle .tabelle{& th,& td{white-space:nowrap}& tbody th{color:var(--tinte);background:0 0;position:static}& th:nth-child(2),& td:nth-child(2),& th:last-child,& td:last-child{text-align:start}& tr[data-stufe=hinweis]{background:var(--akzent-zart)}}.wirkungsbuch__umfang{display:block}}@layer bewegung{@view-transition{navigation:auto}@media (prefers-reduced-motion:no-preference){::view-transition-old(root){animation:.16s var(--kurve) both ausblenden}::view-transition-new(root){animation:.28s var(--kurve) both einblenden}::view-transition-group(seitentitel){animation-duration:.32s;animation-timing-function:var(--kurve)}::view-transition-group(*.sorte){animation-duration:.34s;animation-timing-function:var(--kurve)}@keyframes ausblenden{to{opacity:0}}@keyframes einblenden{0%{opacity:0;translate:0 8px}}.skelett__balken{animation:1.6s linear infinite schimmern}@keyframes schimmern{to{background-position:-300% 0}}.rueckmeldung{animation:.26s var(--kurve) both auftauchen-unten}@keyframes auftauchen-unten{0%{opacity:0;translate:0 12px;scale:.98}}dialog.dialog[open],dialog.befehlsleiste[open]{animation:.22s var(--kurve) both dialog-auf}@keyframes dialog-auf{0%{opacity:0;translate:0 10px;scale:.985}}.menue:popover-open{animation:.18s var(--kurve) both dialog-auf}.ziehanzeige[data-laedt] svg{animation:.9s linear infinite drehen}@keyframes drehen{to{rotate:360deg}}@supports (animation-timeline:scroll()){.kopf{animation:linear both kopf-verdichten;animation-timeline:scroll(root);animation-range:0 96px}@keyframes kopf-verdichten{to{background:color-mix(in oklch, var(--papier) 82%, transparent);border-bottom-color:var(--linie);-webkit-backdrop-filter:saturate(1.4)blur(18px);backdrop-filter:saturate(1.4)blur(18px)}}.lesefortschritt{animation:linear both fortschritt;animation-timeline:scroll(root);display:block}@keyframes fortschritt{to{scale:1}}}@supports (animation-timeline:view()){.auftauchen{animation:linear both auftauchen;animation-timeline:view();animation-range:entry cover 22%}@keyframes auftauchen{0%{translate:0 22px;scale:.975}}.band>*{animation:linear both band-rand;animation-timeline:view(inline)}@keyframes band-rand{entry 0%{scale:.94}entry 60%{scale:1}exit 40%{scale:1}exit 100%{scale:.94}}}}@media (prefers-reduced-motion:reduce){::view-transition-group(*){animation:none!important}::view-transition-old(*){animation:none!important}::view-transition-new(*){animation:none!important}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}}@font-face{font-family:Fraunces;src:url(/schriften/fraunces.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Inter;src:url(/schriften/inter.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
