/* Nerdkram – Statistik-Dashboard (nur auf /nerdkram/ geladen) */
.hb-nerd { --nerd-gap: clamp(.75rem, 2vw, 1.25rem); display: grid; gap: var(--nerd-gap); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1rem; }
.hb-nerd > * { margin: 0 !important; min-width: 0; }
.hb-nerd-tiles, .hb-nerd-card--wide, .hb-nerd-foot { grid-column: 1 / -1; }
@media (max-width: 760px) { .hb-nerd { grid-template-columns: minmax(0, 1fr); } }

/* Kacheln */
.hb-nerd-tiles { display: grid; gap: var(--nerd-gap); grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.hb-nerd-tiles--small { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; }
.hb-nerd-tile { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: .2rem; padding: 1.1rem 1.2rem 1rem; border-radius: 18px; color: #fff; box-shadow: 0 10px 28px -14px rgba(0,0,0,.45); isolation: isolate; }
.hb-nerd-tile::after { content: ""; position: absolute; right: -30px; top: -30px; width: 120px; height: 120px; border-radius: 50%; background: rgba(255,255,255,.14); z-index: -1; }
.hb-nerd-tile__v { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(1.9rem, 3.4vw, 2.7rem); line-height: 1; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.hb-nerd-tiles--small .hb-nerd-tile__v { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.hb-nerd-tile__l { font-weight: 700; font-size: .9rem; opacity: .95; }
.hb-nerd-tile__s { font-size: .78rem; opacity: .82; }
.hb-nerd-tile--magenta { background: linear-gradient(135deg, #ff0077, #c2187a); }
.hb-nerd-tile--orange { background: linear-gradient(135deg, #ff9a1f, #e8560c); }
.hb-nerd-tile--violet { background: linear-gradient(135deg, #8b5cf6, #5b21b6); }
.hb-nerd-tile--cyan { background: linear-gradient(135deg, #22d3ee, #0e7490); }
.hb-nerd-tile--green { background: linear-gradient(135deg, #34d399, #047857); }
.hb-nerd-tile--blue { background: linear-gradient(135deg, #60a5fa, #1d4ed8); }
.hb-nerd-tile--live { background: radial-gradient(120% 120% at 0% 0%, #ff4d9a 0%, #7c3aed 55%, #111114 100%); }
.hb-nerd-tile--live .hb-nerd-tile__v::before { content: ""; display: inline-block; width: .32em; height: .32em; margin: 0 .25em .12em 0; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,.7); animation: hb-nerd-pulse 1.6s infinite; vertical-align: middle; }
@keyframes hb-nerd-pulse { 70% { box-shadow: 0 0 0 .5em rgba(74,222,128,0); } 100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); } }

/* Karten */
.hb-nerd-card { padding: clamp(1rem, 2.5vw, 1.4rem); border-radius: 18px; background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border); }
.hb-nerd-card__t { margin: 0 0 1rem; font-size: 1.15rem; text-transform: uppercase; letter-spacing: .03em; }
.hb-nerd-note { margin: .9rem 0 0; font-size: .9rem; color: var(--wp--preset--color--muted); }
.hb-nerd-note b { color: var(--wp--preset--color--contrast); }

/* Tempo */
.hb-nerd-pace { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.hb-nerd-pace > div { padding: .8rem 1rem; border-radius: 14px; background: var(--wp--preset--color--base); border-left: 5px solid var(--c, #ff0077); }
.hb-nerd-pace > div:nth-child(2) { --c: #ff7a00; } .hb-nerd-pace > div:nth-child(3) { --c: #7c3aed; } .hb-nerd-pace > div:nth-child(4) { --c: #06b6d4; } .hb-nerd-pace > div:nth-child(5) { --c: #10b981; }
.hb-nerd-pace b { display: block; font-family: var(--wp--preset--font-family--display); font-size: 1.8rem; line-height: 1.05; }
.hb-nerd-pace span { font-size: .85rem; color: var(--wp--preset--color--muted); }

/* Balken */
.hb-nerd-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.hb-nerd-bars li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .15rem .75rem; font-size: .92rem; }
.hb-nerd-bars__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-nerd-bars__label a { color: inherit; text-decoration: none; }
.hb-nerd-bars__label a:hover { color: var(--c); }
.hb-nerd-bars__val { font-weight: 700; font-variant-numeric: tabular-nums; }
.hb-nerd-bars__bar { grid-column: 1 / -1; height: 10px; border-radius: 99px; background: var(--wp--preset--color--base); position: relative; overflow: hidden; }
.hb-nerd-bars__bar::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: inherit; background: linear-gradient(90deg, var(--c), color-mix(in srgb, var(--c) 60%, #fff)); transform-origin: left; animation: hb-nerd-grow .9s cubic-bezier(.2,.8,.2,1) both; }
@keyframes hb-nerd-grow { from { transform: scaleX(0); } }

/* Säulen */
.hb-nerd-cols { display: flex; align-items: flex-end; gap: 4px; height: 180px; padding-top: 1.2rem; }
.hb-nerd-cols__c { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; min-width: 0; position: relative; }
.hb-nerd-cols__b { width: 100%; height: var(--h); border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, var(--c), color-mix(in srgb, var(--c) 55%, #000)); transform-origin: bottom; animation: hb-nerd-rise .9s cubic-bezier(.2,.8,.2,1) both; }
@keyframes hb-nerd-rise { from { transform: scaleY(0); } }
.hb-nerd-cols__v { position: absolute; bottom: calc(var(--h) + 1.35rem); font-size: .68rem; font-weight: 700; opacity: 0; transition: opacity .15s; white-space: nowrap; }
.hb-nerd-cols__c:hover .hb-nerd-cols__v { opacity: 1; }
.hb-nerd-cols:not(.hb-nerd-cols--months):not(.hb-nerd-cols--hours) .hb-nerd-cols__v { opacity: 1; }
.hb-nerd-cols__l { height: 1.2rem; margin-top: .25rem; font-size: .7rem; color: var(--wp--preset--color--muted); white-space: nowrap; }
.hb-nerd-cols--months .hb-nerd-cols__l { font-size: .62rem; }
@media (max-width: 600px) { .hb-nerd-cols--months .hb-nerd-cols__c:nth-child(odd) .hb-nerd-cols__l { visibility: hidden; } .hb-nerd-cols { gap: 2px; } }

/* Ring */
.hb-nerd-donut { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 1.25rem; align-items: center; }
.hb-nerd-donut__ring { aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; animation: hb-nerd-spin 1s cubic-bezier(.2,.8,.2,1) both; }
@keyframes hb-nerd-spin { from { transform: rotate(-90deg) scale(.6); opacity: 0; } }
.hb-nerd-donut__ring span { width: 62%; aspect-ratio: 1; border-radius: 50%; background: var(--wp--preset--color--surface); display: grid; place-content: center; text-align: center; line-height: 1; }
.hb-nerd-donut__ring b { font-family: var(--wp--preset--font-family--display); font-size: 1.8rem; }
.hb-nerd-donut__ring small { font-size: .72rem; color: var(--wp--preset--color--muted); }
.hb-nerd-donut__legend { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; font-size: .85rem; }
.hb-nerd-donut__legend li { display: flex; align-items: center; gap: .5rem; }
.hb-nerd-donut__legend li::before { content: ""; flex: none; width: .8rem; height: .8rem; border-radius: 4px; background: var(--c); }
.hb-nerd-donut__legend span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 420px) { .hb-nerd-donut { grid-template-columns: 1fr; justify-items: center; } .hb-nerd-donut__ring { width: 170px; } .hb-nerd-donut__legend { width: 100%; } }

/* Sparkline */
.hb-nerd-spark { margin-top: 1rem; }
.hb-nerd-spark svg { display: block; width: 100%; height: 120px; overflow: visible; }

/* Fakten */
.hb-nerd-facts { margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
.hb-nerd-facts li { padding: .65rem .85rem; border-radius: 12px; background: var(--wp--preset--color--base); font-size: .92rem; line-height: 1.4; }
.hb-nerd-facts a { color: var(--wp--preset--color--primary-dark); font-weight: 600; text-decoration: none; }
.hb-nerd-facts b { font-family: var(--wp--preset--font-family--display); font-size: 1.15em; }

/* GA noch nicht verbunden: nur die Besucher-Karte (ausgegraut) mit Hinweis zeigen */
.hb-nerd-ga__off { display: none; }
.hb-nerd[data-ga-off] .hb-nerd-ga__off { display: block; }
.hb-nerd[data-ga-off] .hb-nerd-gacard { display: none; }
.hb-nerd[data-ga-off] .hb-nerd-card--besucher .hb-nerd-tiles--small, .hb-nerd[data-ga-off] .hb-nerd-spark { opacity: .35; filter: grayscale(.6); }

.hb-nerd-foot { margin: .5rem 0 0; font-size: .78rem; color: var(--wp--preset--color--muted); text-align: center; }
@media (prefers-reduced-motion: reduce) { .hb-nerd *, .hb-nerd *::before { animation: none !important; } }

/* Autoren-Rangliste: Platz vorneweg, Top 3 als Gold/Silber/Bronze-Medaille */
.hb-nerd-bars--authors { counter-reset: hb-rank; }
.hb-nerd-bars--authors li { counter-increment: hb-rank; }
.hb-nerd-bars--authors .hb-nerd-bars__label { display: flex; align-items: center; gap: .55rem; }
.hb-nerd-bars--authors .hb-nerd-bars__label::before { content: counter(hb-rank); flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font: 800 .8rem/1 var(--wp--preset--font-family--display); background: var(--wp--preset--color--base); color: var(--wp--preset--color--muted); }
.hb-nerd-bars--authors li:nth-child(-n+3) .hb-nerd-bars__label::before { color: #3a2a00; box-shadow: inset 0 -2px 0 rgba(0,0,0,.18), 0 2px 6px rgba(0,0,0,.18); }
.hb-nerd-bars--authors li:nth-child(1) .hb-nerd-bars__label::before { background: radial-gradient(circle at 30% 30%, #fff6b0, #f5c518 45%, #b8860b); }
.hb-nerd-bars--authors li:nth-child(2) .hb-nerd-bars__label::before { background: radial-gradient(circle at 30% 30%, #ffffff, #c7ccd4 45%, #8a9099); color: #2b2f36; }
.hb-nerd-bars--authors li:nth-child(3) .hb-nerd-bars__label::before { background: radial-gradient(circle at 30% 30%, #ffd9b0, #cd7f32 45%, #8b4f1d); color: #fff; }
.hb-nerd-bars--authors li:nth-child(-n+3) .hb-nerd-bars__label a { font-weight: 700; }
.hb-nerd-bars--authors .hb-nerd-bars__label a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }