/* v57 · Grundrechner (Einheiten, Winkel, Prozent & Toleranz) – ergänzt calculator-card / panel-card / rk-skizze. */
.gr-section{padding:26px 0;scroll-margin-top:90px}
.gr-block{margin-top:22px;scroll-margin-top:90px}
.gr-block:first-of-type{margin-top:0}
.gr-head{margin:10px 0 4px}
.gr-head h2{font-size:clamp(1.6rem,3.4vw,2.3rem)}
.gr-panel{padding:26px;min-width:0}
.gr-panel>p+p,.gr-panel>p+.gr-tabelle-wrap,.gr-panel .rk-skizze+.rk-skizze{margin-top:14px}
.calculator-card,.gr-panel{min-width:0}

/* Formelzeichen kursiv mit Serifen (l nicht mit I verwechseln) */
.gr-v{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;font-size:1.08em}
.calc-field label .gr-v{font-weight:400}
.calc-field label small{display:block;font-weight:600;color:var(--ct-abb5c8);font-size:.8rem}

.gr-zwei{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
@media(max-width:520px){.gr-zwei{grid-template-columns:1fr}}

/* Ergebnis mit Rechenweg */
.gr-result{line-height:1.5}
.gr-result .gr-haupt{display:block;margin-bottom:6px;color:var(--ct-f3f6fb);font-size:1.12rem;font-weight:800}
.gr-result .gr-haupt strong{color:var(--ct-7ee7c8)}
.gr-result .gr-werte{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px 14px;margin:6px 0 10px;padding:0;list-style:none}
.gr-result .gr-werte li{display:grid;gap:1px}
.gr-result .gr-werte span{color:var(--ct-abb5c8);font-size:.82rem}
.gr-result .gr-werte b{color:var(--ct-f3f6fb);font-size:1.02rem}
.gr-result .gr-werte b small{display:block;color:var(--ct-abb5c8);font-size:.8rem;font-weight:600}
.gr-result h3{margin:12px 0 8px;font-size:.92rem;color:var(--ct-abb5c8);text-transform:uppercase;letter-spacing:.06em}
.gr-weg{margin-top:4px}
.gr-weg b{overflow-wrap:anywhere}
.gr-status{display:inline-flex;align-items:center;gap:8px;margin:4px 0 8px;padding:6px 12px;border-radius:999px;border:1px solid var(--cr-6f8396);font-weight:800;color:var(--ct-f3f6fb)}
.gr-status.ok{border-color:var(--cr-7ee7c8);background:var(--cf-10313a);color:var(--ct-7ee7c8)}
.gr-status.nok{border-color:var(--cr-ff8a8a);background:var(--cf-3a1a22);color:var(--ct-ff8a8a)}
.gr-hinweis{margin:8px 0 0;padding:8px 12px;border-left:3px solid var(--cr-f6d58a);border-radius:0 10px 10px 0;background:var(--cf-1d1a10);color:var(--ct-f6d58a);font-size:.9rem}
.calc-input[aria-invalid="true"]{border-color:var(--cr-ff8a8a)}

/* Einheiten: von – tauschen – nach */
.gr-vonnach{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:10px}
.gr-tausch{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--cr-00b4d8);background:var(--cf-10313a);color:var(--ct-8bdcff);font:inherit;font-size:1.35rem;font-weight:900;cursor:pointer}
.gr-tausch:hover{background:var(--cf-15434f)}
.gr-tausch:focus-visible,.gr-chip:focus-visible,.gr-tabelle-wrap:focus-visible,.gr-wahl input:focus-visible{outline:3px solid var(--cr-f6d58a);outline-offset:2px}
.gr-tausch.dreht span{display:inline-block;transform:rotate(180deg);transition:transform .25s ease}
@media(max-width:420px){.gr-vonnach{grid-template-columns:1fr}.gr-tausch{justify-self:center;transform:rotate(90deg)}}
.gr-merk{margin:12px 0 0;color:var(--ct-abb5c8);font-size:.9rem;line-height:1.5}
.gr-merk:empty{display:none}
.gr-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}
.gr-chips>span{color:var(--ct-abb5c8);font-size:.86rem;font-weight:700}
.gr-chip{min-height:44px;padding:6px 13px;border-radius:999px;border:1px solid var(--cr-6f8396);background:transparent;color:var(--ct-f3f6fb);font:inherit;font-size:.86rem;font-weight:700;cursor:pointer}
.gr-chip:hover{border-color:var(--cr-00b4d8);color:var(--ct-8bdcff)}

/* Tabellen */
.gr-tabelle-wrap{max-width:100%;overflow-x:auto;border-radius:12px;border:1px solid var(--cr-273143)}
.gr-tabelle-wrap.gr-lang{max-height:420px;overflow-y:auto}
.gr-tabelle{width:100%;border-collapse:collapse;font-size:.92rem}
.gr-tabelle caption{padding:10px 12px 4px;text-align:left;color:var(--ct-abb5c8);font-weight:800}
.gr-tabelle th,.gr-tabelle td{padding:9px 12px;border-bottom:1px solid var(--cr-273143);text-align:left;color:var(--ct-f3f6fb);font-variant-numeric:tabular-nums}
.gr-tabelle thead th{position:sticky;top:0;background:var(--cf-111722);color:var(--ct-abb5c8);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.gr-tabelle tbody tr:last-child th,.gr-tabelle tbody tr:last-child td{border-bottom:0}
.gr-tabelle td:last-child{font-weight:800}
.gr-tabelle tr.ist-von td,.gr-tabelle tr.ist-von th{background:var(--cf-10313a)}
.gr-tabelle tr.ist-nach td,.gr-tabelle tr.ist-nach th{background:var(--cf-1d1a10)}
.gr-tabelle tr.ist-nach td:last-child{color:var(--ct-f6d58a)}
.gr-tabelle .gr-marke{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;border:1px solid var(--cr-6f8396);color:var(--ct-abb5c8);font-size:.72rem;font-weight:800}
.gr-tab-titel{margin-bottom:10px!important}
.gr-klein{margin-top:10px!important;font-size:.84rem}
.gr-vz{font-size:1.2rem;color:var(--ct-8bdcff)}
.gr-vorsatz td:last-child{font-weight:600;color:var(--ct-abb5c8)}
.gr-vorsatz td small{display:block;color:var(--ct-abb5c8);font-size:.78rem;font-weight:600}
.gr-vorsatz td:nth-child(3){white-space:nowrap}
.gr-merkliste{margin:14px 0 0;padding-left:20px;display:grid;gap:8px;color:var(--ct-abb5c8)}
.gr-merkliste b{color:var(--ct-f3f6fb)}

/* Auswahl (Radio) */
.gr-wahl{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:10px 12px;border:1px solid var(--cr-273143);border-radius:14px}
.gr-wahl legend{padding:0 6px;font-weight:850}
.gr-wahl label{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer}
.gr-wahl input{width:20px;height:20px;accent-color:var(--ct-00b4d8)}

/* Dynamische Skizzen */
.gr-dyn{margin:14px 0 0}
.gr-dyn-svg svg{display:block;width:100%;height:auto;max-width:520px;margin:0 auto;border-radius:14px;border:1px solid var(--cr-273143)}
.gr-dyn figcaption{margin-top:6px;color:var(--ct-abb5c8);font-size:.84rem;text-align:center}
.gr-loch-aus{display:grid;gap:14px;margin-top:4px}
.gr-loch-aus .gr-dyn-svg svg{max-width:340px}

.rk-skizze figcaption a{color:var(--ct-8bdcff)}
.gr-panel .quiet-note a,.gr-panel details a{color:var(--ct-8bdcff)}

@media(max-width:760px){.gr-panel{padding:20px}}
@media(prefers-reduced-motion:reduce){.gr-tausch.dreht span{transition:none}}

/* Druckansicht (nur Seiten mit .gr-section): helle Seite, keine fixen Leisten, Karten nicht zerreißen */
@media print{
  @page{margin:14mm 12mm}
  html:has(.gr-section),body:has(.gr-section){background:var(--cf-ffffff)!important;color:var(--ct-111111)!important}
  body:has(.gr-section) h2,body:has(.gr-section) h3,body:has(.gr-section) .gr-haupt{break-after:avoid;page-break-after:avoid}
  body:has(.gr-section) .site-header,body:has(.gr-section) .skip-link,body:has(.gr-section) .consent-bar,body:has(.gr-section) .tr-fab,
  body:has(.gr-section) .area-nav,body:has(.gr-section) .favorite-tools,body:has(.gr-section) .hero-actions,body:has(.gr-section) .site-footer,
  body:has(.gr-section) .floating-top,body:has(.gr-section) .deko-layer,body:has(.gr-section) .deko-badge,body:has(.gr-section) .calc-actions,
  body:has(.gr-section) .related-learning,body:has(.gr-section) .gr-chips,body:has(.gr-section) .gr-tausch{display:none!important}
  body:has(.gr-section) main{padding:0!important;margin:0!important}
  body:has(.gr-section) main *{color:var(--ct-111111)!important;box-shadow:none!important;text-shadow:none!important}
  body:has(.gr-section) .page-hero{padding:0 0 8px!important;margin:0!important;min-height:0!important;background:none!important}
  body:has(.gr-section) .page-hero h1{font-size:20pt!important;margin:4px 0!important;line-height:1.15!important}
  body:has(.gr-section) .page-hero p{margin:4px 0!important}
  body:has(.gr-section) .gradient-text{background:none!important;-webkit-text-fill-color:var(--ct-111111)!important}
  body:has(.gr-section) .container{max-width:none!important;width:auto!important;padding:0!important}
  body:has(.gr-section) .section,body:has(.gr-section) .gr-section{padding:6px 0!important;margin:0!important}
  body:has(.gr-section) .gr-head h2{font-size:15pt!important;margin:8px 0 4px!important}
  body:has(.gr-section) .calculator-grid{display:block!important}
  body:has(.gr-section) .calculator-card,body:has(.gr-section) .panel-card{background:var(--cf-ffffff)!important;border:1px solid var(--cr-6f8396)!important;border-radius:8px!important;padding:10px 12px!important;margin:0 0 10px!important}
  body:has(.gr-section) .calculator-card h2,body:has(.gr-section) .panel-card h2{font-size:14pt!important;margin:0 0 6px!important}
  body:has(.gr-section) .rk-skizze,body:has(.gr-section) .gr-dyn,body:has(.gr-section) .rk-schritte>li,body:has(.gr-section) .gr-werte,
  body:has(.gr-section) .gr-tabelle tr,body:has(.gr-section) .calc-field,body:has(.gr-section) .gr-merkliste li{break-inside:avoid;page-break-inside:avoid}
  body:has(.gr-section) .rk-svg{max-width:280px!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body:has(.gr-section) .gr-dyn-svg svg{max-width:300px!important;margin:0!important}
  body:has(.gr-section) .gr-zwei,body:has(.gr-section) .gr-vonnach{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body:has(.gr-section) .calc-hint,body:has(.gr-section) .quiet-note,body:has(.gr-section) .more-details,body:has(.gr-section) .calc-result,
  body:has(.gr-section) .gr-hinweis,body:has(.gr-section) .gr-status,body:has(.gr-section) .gr-tabelle thead th,body:has(.gr-section) .gr-tabelle tr td,
  body:has(.gr-section) .gr-tabelle tr th{background:var(--cf-ffffff)!important;border-color:var(--cr-111111)!important}
  body:has(.gr-section) .calc-result{border:1.5px solid var(--cr-111111)!important;min-height:0!important;padding:8px 10px!important}
  body:has(.gr-section) .calc-result:not(:has(.gr-weg,.gr-haupt)){display:none!important}
  body:has(.gr-section) .calc-input,body:has(.gr-section) .calc-select{background:var(--cf-ffffff)!important;border:1px solid var(--cr-6f8396)!important;min-height:0!important;padding:4px 8px!important}
  body:has(.gr-section) .calc-fields{gap:6px!important}
  body:has(.gr-section) .rk-schritte li::before{background:var(--cf-ffffff)!important;border-color:var(--cr-111111)!important}
  body:has(.gr-section) .gr-v{font-weight:400!important}
  body:has(.gr-section) .gr-tabelle-wrap{overflow:visible!important;max-height:none!important;border-color:var(--cr-6f8396)!important}
  body:has(.gr-section) .gr-tabelle thead th{position:static!important}
  body:has(.gr-section) a{text-decoration:underline}
  body:has(.gr-section) .lernbegriff,body:has(.gr-section) [data-begriff]{border:0!important;text-decoration:none!important}
}