/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-9r4bbrc61b] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-9r4bbrc61b] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Pages/Home.razor.rz.scp.css */
.hero[b-8sz7j32em4] {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    overflow: hidden;
    background:
        radial-gradient(ellipse 80% 60% at 50% 0%, #1b2a44 0%, transparent 70%),
        radial-gradient(ellipse 60% 50% at 100% 100%, #14223a 0%, transparent 70%),
        linear-gradient(160deg, #0a1120 0%, #0e1a2e 45%, #0b1322 100%);
    color: var(--text);
}

/* Fine blueprint grid: a quiet nod to engineering precision */
.grid[b-8sz7j32em4] {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(var(--grid-major) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-major) 1px, transparent 1px),
        linear-gradient(var(--grid-minor) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-minor) 1px, transparent 1px);
    background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
    background-position: center center;
    mask-image: radial-gradient(ellipse 70% 65% at 50% 50%, #000 30%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 70% 65% at 50% 50%, #000 30%, transparent 100%);
}

.glow[b-8sz7j32em4] {
    position: absolute;
    width: min(900px, 120vw);
    aspect-ratio: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(201, 162, 92, 0.13) 0%, rgba(201, 162, 92, 0.04) 35%, transparent 65%);
    animation: breathe-b-8sz7j32em4 9s ease-in-out infinite;
    pointer-events: none;
}

.content[b-8sz7j32em4] {
    position: relative;
    text-align: center;
    max-width: 100%;
    animation: rise-b-8sz7j32em4 1.6s var(--ease-settle) both;
}

.eyebrow[b-8sz7j32em4] {
    margin: 0 0 1.5rem;
    font-family: var(--font-mono);
    font-size: clamp(0.7rem, 1.6vw, 0.85rem);
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: var(--muted);
}

.title[b-8sz7j32em4] {
    margin: 0;
    font-family: var(--font-display);
    font-weight: 600;
    /* Skalerer med bredden, så "Kenneth.systems" altid står på én linje, også på smalle mobiler. */
    font-size: clamp(1.5rem, 9.5vw, 8.5rem);
    line-height: 1;
    letter-spacing: -0.035em;
    background: linear-gradient(180deg, #f4f6fa 0%, #c9d3e3 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    white-space: nowrap;
}

.dot[b-8sz7j32em4] {
    background: linear-gradient(180deg, #e8c987 0%, var(--accent) 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

.rule[b-8sz7j32em4] {
    width: 72px;
    height: 2px;
    margin: 2.25rem auto;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
}

.tagline[b-8sz7j32em4] {
    margin: 0;
    font-family: var(--font-display);
    font-weight: 300;
    font-size: clamp(1.15rem, 3.4vw, 2rem);
    letter-spacing: 0.02em;
    color: var(--muted-strong);
}

.ellipsis[b-8sz7j32em4] {
    color: var(--accent);
    animation: blink-b-8sz7j32em4 2.4s steps(1) infinite;
}

.corner-link[b-8sz7j32em4] {
    position: absolute;
    right: 1.75rem;
    bottom: 1.6rem;
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--faint);
    text-decoration: none;
    transition: color 0.4s var(--ease-settle);
}

.corner-link-2[b-8sz7j32em4] {
    bottom: 3.2rem;
}

    .corner-link:hover[b-8sz7j32em4],
    .corner-link:focus-visible[b-8sz7j32em4] {
        color: var(--accent);
    }

@keyframes rise-b-8sz7j32em4 {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes breathe-b-8sz7j32em4 {
    0%, 100% { opacity: 0.75; transform: translate(-50%, -50%) scale(1); }
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1.06); }
}

@keyframes blink-b-8sz7j32em4 {
    0%, 70% { opacity: 1; }
    71%, 100% { opacity: 0.35; }
}

@media (prefers-reduced-motion: reduce) {
    .content[b-8sz7j32em4], .glow[b-8sz7j32em4], .ellipsis[b-8sz7j32em4] { animation: none; }
}
/* /Components/Pages/MarketTickers.razor.rz.scp.css */
/* Små kort på én række, skubbet helt til højre i linje med overskriften; 3 på række på smalle skærme. */
.markets[b-jnrvef8d96] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 9.5rem));
    gap: 0.5rem;
    margin-left: auto;
}

@media (max-width: 900px) {
    .markets[b-jnrvef8d96] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }
}

.market[b-jnrvef8d96] {
    display: flex;
    flex-direction: column;
    padding: 0.45rem 0.65rem 0.4rem;
    border-radius: 10px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
    min-width: 0;
    cursor: pointer;
    transition: border-color 0.35s var(--ease-settle), background-color 0.35s var(--ease-settle);
}

    .market:hover[b-jnrvef8d96] {
        border-color: rgba(201, 162, 92, 0.4);
    }

    .market:focus-visible[b-jnrvef8d96] {
        outline: 2px solid var(--accent);
        outline-offset: 2px;
    }

    /* Vises i hovedgrafen. */
    .market.in-chart[b-jnrvef8d96] {
        border-color: var(--accent);
        background: rgba(201, 162, 92, 0.12);
    }

.market-top[b-jnrvef8d96] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.4rem;
}

.market-name[b-jnrvef8d96] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.8rem;
    color: var(--muted-strong);
}

.market-change[b-jnrvef8d96] {
    font-size: 0.76rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--muted);
}

    .market-change.up[b-jnrvef8d96] {
        color: #a6e3a1;
    }

    .market-change.down[b-jnrvef8d96] {
        color: #ff7a6b;
    }

.market-price[b-jnrvef8d96] {
    overflow: hidden;
    text-overflow: ellipsis;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    line-height: 1.2;
}

.market-value[b-jnrvef8d96] {
    font-size: 1.08rem;
    font-weight: 600;
    color: var(--text);
}

.market-price small[b-jnrvef8d96] {
    font-size: 0.66rem;
    color: var(--faint);
}

.market-spark[b-jnrvef8d96] {
    display: block;
    width: 100%;
    height: 22px;
    margin-top: 0.1rem;
    overflow: visible;
}

    .market-spark[b-jnrvef8d96]  .spark-base {
        stroke: rgba(148, 170, 205, 0.25);
        stroke-width: 1;
        stroke-dasharray: 2 3;
    }

    .market-spark[b-jnrvef8d96]  .spark-line {
        fill: none;
        stroke: var(--accent);
        stroke-width: 1.25;
        stroke-linejoin: round;
        stroke-linecap: round;
    }

.market.up .market-spark[b-jnrvef8d96]  .spark-line {
    stroke: #a6e3a1;
}

.market.down .market-spark[b-jnrvef8d96]  .spark-line {
    stroke: #ff7a6b;
}
/* /Components/Pages/Spotpriser.razor.rz.scp.css */
/* Siden fylder mindst skærmen, og grafen tager den plads, der er tilbage; kun lave skærme får scrollbar. */
.page[b-v28ohwsvg0] {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    padding: 20px;
    color: var(--text);
}

.head[b-v28ohwsvg0] {
    margin-bottom: 2rem;
}

.head-top[b-v28ohwsvg0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

/* Valg af prisområde øverst til højre */
.area-switch[b-v28ohwsvg0] {
    display: inline-flex;
    padding: 3px;
    border-radius: 999px;
    background: rgba(201, 162, 92, 0.06);
    border: 1px solid rgba(201, 162, 92, 0.25);
}

    .area-switch a[b-v28ohwsvg0] {
        padding: 0.35rem 0.9rem;
        border-radius: 999px;
        font-size: 0.9rem;
        color: var(--muted);
        text-decoration: none;
        transition: background 0.35s var(--ease-settle), color 0.35s var(--ease-settle);
    }

        .area-switch a:hover[b-v28ohwsvg0] {
            color: var(--text);
        }

        .area-switch a.active[b-v28ohwsvg0] {
            background: rgba(201, 162, 92, 0.2);
            color: var(--text);
        }

    .area-switch small[b-v28ohwsvg0] {
        margin-left: 0.2rem;
        font-family: var(--font-mono);
        font-size: 0.7rem;
        letter-spacing: 0.08em;
        color: var(--faint);
    }

.brand[b-v28ohwsvg0] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--text);
    text-decoration: none;
}

.dot[b-v28ohwsvg0] {
    color: var(--accent);
}

.eyebrow[b-v28ohwsvg0] {
    margin: 2rem 0 0.5rem;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--faint);
}

.title[b-v28ohwsvg0] {
    margin: 0;
    font-weight: 600;
    font-size: clamp(1.75rem, 5vw, 3rem);
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.empty[b-v28ohwsvg0] {
    color: var(--muted);
}

/* Nøgletal */
/* Hvert kort har sin egen tone (--tone som "r, g, b"), der giver lysstribe, glød og prik i etiketten. */
.stats[b-v28ohwsvg0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.6rem;
    margin-bottom: 1.25rem;
}

.stat[b-v28ohwsvg0] {
    --tone: 201, 162, 92;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.65rem 0.85rem 0.7rem;
    border-radius: 10px;
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(var(--tone), 0.16), transparent 60%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01) 55%),
        rgba(5, 10, 22, 0.5);
    border: 1px solid rgba(var(--tone), 0.45);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 6px 18px -10px rgba(var(--tone), 0.5);
    backdrop-filter: blur(6px);
    transition: transform 0.35s var(--ease-settle), border-color 0.35s var(--ease-settle), box-shadow 0.35s var(--ease-settle);
}

    /* Tynd lysstribe langs toppen */
    .stat[b-v28ohwsvg0]::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 2px;
        background: linear-gradient(90deg, transparent, rgba(var(--tone), 0.9) 30%, rgba(var(--tone), 0.9) 70%, transparent);
        opacity: 0.7;
    }

    .stat:hover[b-v28ohwsvg0] {
        transform: translateY(-2px);
        border-color: rgba(var(--tone), 0.75);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.08),
            0 10px 24px -10px rgba(var(--tone), 0.65);
    }

.stat-now[b-v28ohwsvg0] {
    border-color: rgba(var(--tone), 0.7);
    background:
        radial-gradient(120% 100% at 100% 0%, rgba(var(--tone), 0.3), transparent 65%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.01) 55%),
        rgba(5, 10, 22, 0.5);
}

    .stat-now[b-v28ohwsvg0]::before {
        opacity: 1;
    }

.stat-min[b-v28ohwsvg0] { --tone: 76, 199, 106; }
.stat-max[b-v28ohwsvg0] { --tone: 255, 74, 42; }
.stat-avg[b-v28ohwsvg0] { --tone: 108, 184, 255; }
.stat-car[b-v28ohwsvg0] { --tone: 166, 227, 161; }

.stat-label[b-v28ohwsvg0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-mono);
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
}

    .stat-label[b-v28ohwsvg0]::before {
        content: "";
        flex: none;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: rgb(var(--tone));
        box-shadow: 0 0 6px rgba(var(--tone), 0.9);
    }

/* Prikken pulserer på "lige nu" */
.stat-now .stat-label[b-v28ohwsvg0]::before {
    animation: pulse-b-v28ohwsvg0 2.4s ease-in-out infinite;
}

@keyframes pulse-b-v28ohwsvg0 {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--tone), 0.7); }
    50% { box-shadow: 0 0 0 5px rgba(var(--tone), 0); }
}

.stat-value[b-v28ohwsvg0] {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

.stat-now .stat-value[b-v28ohwsvg0] {
    background: linear-gradient(180deg, #fff6e4, rgb(var(--tone)));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

    .stat-value small[b-v28ohwsvg0] {
        font-size: 0.75rem;
        font-weight: 300;
        color: var(--muted);
        -webkit-text-fill-color: var(--muted);
    }

/* Bilens ladestatus fra Tessie */
.battery[b-v28ohwsvg0] {
    position: relative;
    display: block;
    height: 6px;
    margin: 0.15rem 0 0.1rem;
    border-radius: 3px;
    background: rgba(148, 170, 205, 0.15);
}

.battery-fill[b-v28ohwsvg0] {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: 3px;
    background: #a6e3a1;
}

.battery-charging[b-v28ohwsvg0] {
    animation: charging-b-v28ohwsvg0 2.8s ease-in-out infinite;
}

.battery-limit[b-v28ohwsvg0] {
    position: absolute;
    top: -3px;
    bottom: -3px;
    width: 2px;
    margin-left: -1px;
    background: var(--muted-strong);
}

@keyframes charging-b-v28ohwsvg0 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.stat-sub[b-v28ohwsvg0] {
    font-size: 0.75rem;
    color: var(--faint);
}

/* Billig strøm grænse */
.threshold[b-v28ohwsvg0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 1rem;
}

    .threshold label[b-v28ohwsvg0] {
        font-family: var(--font-mono);
        font-size: 0.75rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted);
    }

.threshold-input[b-v28ohwsvg0] {
    display: inline-flex;
    align-items: center;
    border-radius: 8px;
    background: rgba(201, 162, 92, 0.06);
    border: 1px solid rgba(201, 162, 92, 0.25);
}

    .threshold-input:focus-within[b-v28ohwsvg0] {
        border-color: var(--accent);
    }

    .threshold-input input[b-v28ohwsvg0] {
        width: 6rem;
        padding: 0.45rem 0.6rem;
        border: 0;
        background: transparent;
        color: var(--text);
        font: inherit;
        font-variant-numeric: tabular-nums;
        outline: none;
    }

.threshold-unit[b-v28ohwsvg0] {
    padding-right: 0.7rem;
    color: var(--muted);
    font-size: 0.9rem;
}

.threshold-legend[b-v28ohwsvg0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: var(--muted);
}

.swatch[b-v28ohwsvg0] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    background: #6cb8ff;
}

.swatch-min[b-v28ohwsvg0] {
    background: #4cc76a;
}

.swatch-max[b-v28ohwsvg0] {
    background: #ff4a2a;
}

.swatch-fee[b-v28ohwsvg0] {
    background: #6b7484;
}

.swatch-sub[b-v28ohwsvg0] {
    background: #ffe14d;
}

/* Graf */
.chart[b-v28ohwsvg0] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 320px;
    margin: 0;
    padding: 1rem 1rem 0.75rem;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.chart-caption[b-v28ohwsvg0] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.25rem 1rem;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
    color: var(--muted-strong);
}

.chart-range[b-v28ohwsvg0] {
    color: var(--faint);
    font-size: 0.85rem;
}

.chart-frame[b-v28ohwsvg0] {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
}

.chart-grid[b-v28ohwsvg0] {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: 3.25rem 1fr;
    grid-template-rows: 1fr 1.75rem;
    padding-top: 1.25rem;
}

.y-axis[b-v28ohwsvg0] {
    position: relative;
}

    .y-axis .axis-label[b-v28ohwsvg0] {
        position: absolute;
        right: 0.5rem;
        transform: translateY(-50%);
    }

.plot[b-v28ohwsvg0] {
    position: relative;
    min-height: 0;
}

    .plot svg[b-v28ohwsvg0] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        display: block;
    }

.x-axis[b-v28ohwsvg0] {
    position: relative;
    grid-column: 2;
}

    .x-axis .axis-label[b-v28ohwsvg0] {
        position: absolute;
        top: 0.45rem;
        transform: translateX(-50%);
        white-space: nowrap;
    }

    .x-axis .axis-first[b-v28ohwsvg0] {
        transform: none;
    }

.grid[b-v28ohwsvg0] {
    stroke: rgba(148, 170, 205, 0.1);
    stroke-width: 1;
}

.grid-zero[b-v28ohwsvg0] {
    stroke: rgba(148, 170, 205, 0.35);
}

.day-line[b-v28ohwsvg0] {
    stroke: rgba(148, 170, 205, 0.3);
    stroke-dasharray: 3 4;
}

.axis-label[b-v28ohwsvg0] {
    font-family: var(--font-mono);
    font-size: 12px;
    color: var(--faint);
    font-variant-numeric: tabular-nums;
}

.axis-day[b-v28ohwsvg0] {
    color: var(--muted-strong);
}

.hit[b-v28ohwsvg0] {
    fill: transparent;
}

.bar[b-v28ohwsvg0] {
    fill: #ff9f43;
    transition: fill 0.3s var(--ease-settle);
}

/* Tillæg og afgifter i bunden af hver søjle. */
.fee[b-v28ohwsvg0] {
    fill: #6b7484;
}

.fee-past[b-v28ohwsvg0] {
    fill: rgba(107, 116, 132, 0.4);
}

/* Abonnementet oven på tarifferne. */
.sub[b-v28ohwsvg0] {
    fill: #ffe14d;
}

.sub-past[b-v28ohwsvg0] {
    fill: rgba(255, 225, 77, 0.4);
}

.bar-past[b-v28ohwsvg0] {
    fill: rgba(255, 159, 67, 0.35);
}

.bar-now[b-v28ohwsvg0] {
    fill: #fff1d6;
}

.bar-cheap[b-v28ohwsvg0] {
    fill: #6cb8ff;
}

.bar-past.bar-cheap[b-v28ohwsvg0] {
    fill: rgba(108, 184, 255, 0.35);
}

.bar-now.bar-cheap[b-v28ohwsvg0] {
    fill: #c6e4ff;
}

/* Det laveste og højeste kvarter fremover, i samme farver som deres etiketter. */
.bar.bar-min[b-v28ohwsvg0] {
    fill: #4cc76a;
}

.bar.bar-max[b-v28ohwsvg0] {
    fill: #ff4a2a;
}

.peak-label[b-v28ohwsvg0] {
    position: absolute;
    transform: translate(-50%, calc(-100% - 4px));
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    background: rgba(5, 10, 22, 0.85);
    font-family: var(--font-mono);
    font-size: 12px;
    color: var(--text);
    white-space: nowrap;
    pointer-events: none;
}

.peak-min[b-v28ohwsvg0] {
    border: 1px solid #4cc76a;
}

.peak-max[b-v28ohwsvg0] {
    border: 1px solid #ff4a2a;
}

.col.active .bar[b-v28ohwsvg0],
.col:hover .bar[b-v28ohwsvg0] {
    fill: var(--accent);
}

/* Prisgrænsen: svag grå stiplet linje, der ikke fanger musen, så tooltippet stadig virker. */
.limit-line[b-v28ohwsvg0] {
    stroke: rgba(200, 210, 225, 0.45);
    stroke-width: 1;
    stroke-dasharray: 6 5;
    pointer-events: none;
}

.now-line[b-v28ohwsvg0] {
    stroke: #fff1d6;
    stroke-width: 1.5;
}

.now-label[b-v28ohwsvg0] {
    position: absolute;
    bottom: 100%;
    transform: translateX(-50%);
    margin-bottom: 4px;
    padding: 0.1rem 0.35rem;
    border: 1px solid #fff1d6;
    border-radius: 4px;
    background: rgba(5, 10, 22, 0.85);
    font-family: var(--font-mono);
    font-size: 12px;
    color: #fff1d6;
    white-space: nowrap;
}

.tooltip[b-v28ohwsvg0] {
    position: absolute;
    transform: translate(-50%, -100%);
    padding: 0.35rem 0.6rem;
    border-radius: 6px;
    background: #e8ecf3;
    color: #0a1120;
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

.note[b-v28ohwsvg0] {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    color: var(--faint);
}

.fineprint[b-v28ohwsvg0] {
    margin: 1rem 0 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--faint);
}

@media (prefers-reduced-motion: reduce) {
    .battery-charging[b-v28ohwsvg0],
    .stat-now .stat-label[b-v28ohwsvg0]::before { animation: none; }

    .stat:hover[b-v28ohwsvg0] { transform: none; }
}

@media (max-width: 600px) {
    .chart[b-v28ohwsvg0] {
        padding: 0.75rem 0.5rem 0.5rem;
    }

    .x-axis .axis-label:nth-child(even)[b-v28ohwsvg0] {
        display: none;
    }
}
/* /Components/Pages/Stocks.razor.rz.scp.css */
.page[b-7ho036rrgp] {
    min-height: 100vh;
    min-height: 100dvh;
    padding: 20px;
    color: var(--text);
}

/* Én kolonne: grafen øverst i fuld bredde, søgning og liste under den. */
.layout[b-7ho036rrgp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

/* Søgning og aktieliste foldes sammen opad: rækken glider fra fuld højde til 0, og indholdet toner ud. */
.search-panel[b-7ho036rrgp] {
    padding: 0.7rem 0.9rem;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.search-head[b-7ho036rrgp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.75rem;
}

.search-toggle[b-7ho036rrgp] {
    display: inline-flex;
    padding: 0.3rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.25);
    background: rgba(201, 162, 92, 0.06);
    color: var(--muted-strong);
    cursor: pointer;
}

    .search-toggle:hover[b-7ho036rrgp] {
        color: var(--text);
        background: rgba(201, 162, 92, 0.18);
    }

    .search-toggle svg[b-7ho036rrgp] {
        transition: transform var(--fold-time) var(--ease-settle);
    }

.search-panel.folded .search-toggle svg[b-7ho036rrgp] {
    transform: rotate(-90deg);
}

.search-title[b-7ho036rrgp] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.search-summary[b-7ho036rrgp] {
    font-size: 0.85rem;
    color: var(--muted);
}

.search-body[b-7ho036rrgp] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows var(--fold-time) var(--ease-settle);
}

.search-body-inner[b-7ho036rrgp] {
    min-height: 0;
    overflow: hidden;
    /* Lidt luft, så fokusrammer om felterne ikke klippes af overflow. */
    margin: 0 -4px;
    padding: 0.85rem 4px 4px;
    transition: opacity 0.45s var(--ease-settle), padding-top var(--fold-time) var(--ease-settle), visibility 0s;
}

.search-panel.folded .search-body[b-7ho036rrgp] {
    grid-template-rows: 0fr;
}

.search-panel.folded .search-body-inner[b-7ho036rrgp] {
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-out, padding var(--fold-time) var(--ease-settle), visibility 0s linear var(--fold-time);
}

@media (prefers-reduced-motion: reduce) {
    .search-body[b-7ho036rrgp],
    .search-body-inner[b-7ho036rrgp],
    .search-panel.folded .search-body-inner[b-7ho036rrgp],
    .search-toggle svg[b-7ho036rrgp] {
        transition: none;
    }
}

.compare-head-start[b-7ho036rrgp] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.compare-clear[b-7ho036rrgp] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    border: 1px solid rgba(201, 162, 92, 0.25);
    background: rgba(201, 162, 92, 0.06);
    color: var(--muted-strong);
    font: inherit;
    font-size: 0.8rem;
    cursor: pointer;
    transition: background-color 0.35s var(--ease-settle), border-color 0.35s var(--ease-settle), color 0.35s var(--ease-settle);
}

    .compare-clear:hover:not(:disabled)[b-7ho036rrgp] {
        color: var(--text);
        border-color: rgba(255, 122, 107, 0.5);
        background: rgba(255, 122, 107, 0.12);
    }

    .compare-clear:disabled[b-7ho036rrgp] {
        opacity: 0.4;
        cursor: default;
    }

.chart-col[b-7ho036rrgp] {
    order: -1;
}

.head[b-7ho036rrgp] {
    margin-bottom: 1.5rem;
}

/* Overskriften til venstre og markedstickerne helt til højre i samme linje; på smalle skærme lægger tickerne sig under. */
.title-row[b-7ho036rrgp] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem 2rem;
}

.brand[b-7ho036rrgp] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--text);
    text-decoration: none;
}

.dot[b-7ho036rrgp] {
    color: var(--accent);
}

.eyebrow[b-7ho036rrgp] {
    margin: 2rem 0 0.5rem;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--faint);
}

.title[b-7ho036rrgp] {
    margin: 0;
    font-weight: 600;
    font-size: clamp(1.75rem, 5vw, 3rem);
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.empty[b-7ho036rrgp] {
    color: var(--muted);
}

/* Søgning og filtre */
.filters[b-7ho036rrgp] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.field[b-7ho036rrgp] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.field-search[b-7ho036rrgp] {
    flex: 0 1 18rem;
}

    .field label[b-7ho036rrgp] {
        font-family: var(--font-mono);
        font-size: 0.7rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted);
    }

    .field input[b-7ho036rrgp],
    .field select[b-7ho036rrgp] {
        padding: 0.45rem 0.6rem;
        border-radius: 8px;
        border: 1px solid rgba(201, 162, 92, 0.25);
        background: rgba(201, 162, 92, 0.06);
        color: var(--text);
        font: inherit;
        outline: none;
    }

        .field input:focus[b-7ho036rrgp],
        .field select:focus[b-7ho036rrgp] {
            border-color: var(--accent);
        }

    .field option[b-7ho036rrgp],
    .field optgroup[b-7ho036rrgp] {
        background: #0a1120;
        color: var(--text);
    }

.filters button[b-7ho036rrgp] {
    padding: 0.45rem 0.9rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.4);
    background: rgba(201, 162, 92, 0.14);
    color: var(--text);
    font: inherit;
    cursor: pointer;
}

    .filters button:hover[b-7ho036rrgp] {
        background: rgba(201, 162, 92, 0.24);
    }

.count[b-7ho036rrgp] {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    color: var(--faint);
}

/* Sammenligningsgraf; indholdet tegnes af stocks.js og styles derfor gennem ::deep. */
.compare[b-7ho036rrgp] {
    padding: 1rem 1rem 0.75rem;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
    transition: opacity 0.35s var(--ease-settle);
}

    .compare.loading[b-7ho036rrgp] {
        opacity: 0.6;
    }

.compare-empty[b-7ho036rrgp] {
    display: none;
    margin: 0.75rem 0 0.25rem;
    font-size: 0.9rem;
    color: var(--muted);
}

.compare-none[b-7ho036rrgp] {
    display: none;
    margin: 0.75rem 0 0.25rem;
    font-size: 0.9rem;
    color: var(--muted);
}

/* Ingen valgte aktier: kun vejledningen. Valgte, men ingen med flueben: listen uden graf. */
.compare.empty .compare-empty[b-7ho036rrgp],
.compare.none-visible .compare-none[b-7ho036rrgp] {
    display: block;
}

.compare.empty .compare-frame[b-7ho036rrgp],
.compare.empty .chosen-title[b-7ho036rrgp],
.compare.empty .chosen[b-7ho036rrgp],
.compare.none-visible .compare-frame[b-7ho036rrgp] {
    display: none;
}

.compare-frame[b-7ho036rrgp] {
    margin-top: 0.75rem;
}

.compare-head[b-7ho036rrgp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
}

.compare-title[b-7ho036rrgp] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 400;
    color: var(--muted-strong);
}

.range-switch[b-7ho036rrgp] {
    display: inline-flex;
    padding: 3px;
    border-radius: 999px;
    background: rgba(201, 162, 92, 0.06);
    border: 1px solid rgba(201, 162, 92, 0.25);
}

    .range-switch button[b-7ho036rrgp] {
        padding: 0.25rem 0.7rem;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--muted);
        font-family: var(--font-mono);
        font-size: 0.75rem;
        cursor: pointer;
    }

        .range-switch button:hover[b-7ho036rrgp] {
            color: var(--text);
        }

        .range-switch button[aria-pressed="true"][b-7ho036rrgp] {
            background: rgba(201, 162, 92, 0.2);
            color: var(--text);
        }

/* Gemte lister (cookie) */
.lists[b-7ho036rrgp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(201, 162, 92, 0.14);
}

.lists-group[b-7ho036rrgp] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.lists select[b-7ho036rrgp],
.lists input[b-7ho036rrgp] {
    padding: 0.35rem 0.55rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.25);
    background: rgba(201, 162, 92, 0.06);
    color: var(--text);
    font: inherit;
    font-size: 0.85rem;
    outline: none;
}

    .lists select:focus[b-7ho036rrgp],
    .lists input:focus[b-7ho036rrgp] {
        border-color: var(--accent);
    }

.lists select[b-7ho036rrgp] {
    max-width: 15rem;
}

.lists input[b-7ho036rrgp] {
    width: 11rem;
}

/* Mulighederne oprettes af stocks.js og får derfor ikke Blazors scope-attribut; uden ::deep bliver de hvide på hvidt. */
.lists[b-7ho036rrgp]  option {
    background: #0a1120;
    color: var(--text);
}

.lists button[b-7ho036rrgp] {
    padding: 0.35rem 0.7rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.3);
    background: rgba(201, 162, 92, 0.1);
    color: var(--text);
    font: inherit;
    font-size: 0.85rem;
    cursor: pointer;
}

    .lists button:hover:not(:disabled)[b-7ho036rrgp] {
        background: rgba(201, 162, 92, 0.22);
    }

    .lists button:disabled[b-7ho036rrgp],
    .lists select:disabled[b-7ho036rrgp] {
        opacity: 0.4;
        cursor: default;
    }

    .lists .lists-delete:hover:not(:disabled)[b-7ho036rrgp] {
        border-color: rgba(255, 122, 107, 0.5);
        background: rgba(255, 122, 107, 0.12);
    }

.lists-status[b-7ho036rrgp] {
    font-size: 0.8rem;
    color: var(--muted);
}

    .lists-status.error[b-7ho036rrgp] {
        color: #ff7a6b;
    }

/* Listen over valgte aktier under grafen; den er også grafens forklaring. */
.chosen-title[b-7ho036rrgp] {
    margin: 1rem 0 0.4rem;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
}

.chosen[b-7ho036rrgp] {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.9rem;
    border-top: 1px solid rgba(201, 162, 92, 0.14);
}

    .chosen[b-7ho036rrgp]  li {
        display: grid;
        grid-template-columns: auto auto minmax(0, 1fr) auto 4.6rem 6.2rem auto;
        align-items: center;
        gap: 0.65rem;
        padding: 0.45rem 0.25rem;
        border-bottom: 1px solid rgba(148, 170, 205, 0.08);
    }

        .chosen[b-7ho036rrgp]  li.off .chosen-name,
        .chosen[b-7ho036rrgp]  li.off .chosen-price {
            opacity: 0.55;
        }

    .chosen[b-7ho036rrgp]  .chosen-pick {
        width: 1rem;
        height: 1rem;
        margin: 0;
        accent-color: var(--accent);
        cursor: pointer;
    }

    /* Tom ramme, når aktien ikke er i grafen; ellers en prøve af linjen (farve + linjetype). */
    .chosen[b-7ho036rrgp]  .chosen-swatch {
        display: inline-flex;
        width: 24px;
        height: 10px;
        border-radius: 3px;
    }

        .chosen[b-7ho036rrgp]  .chosen-swatch:empty {
            box-shadow: inset 0 0 0 1px rgba(148, 170, 205, 0.25);
        }

    .chosen[b-7ho036rrgp]  .chosen-name {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    /* Navn og evt. "+"-knap; navnet forkortes, så knappen altid kan ses. */
    .chosen[b-7ho036rrgp]  .chosen-title-row {
        display: flex;
        align-items: center;
        min-width: 0;
    }

    .chosen[b-7ho036rrgp]  .chosen-label {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .chosen[b-7ho036rrgp]  .chosen-symbol {
        font-family: var(--font-mono);
        font-size: 0.7rem;
        color: var(--faint);
    }

    .chosen[b-7ho036rrgp]  .chosen-price,
    .chosen[b-7ho036rrgp]  .chosen-day,
    .chosen[b-7ho036rrgp]  .chosen-period {
        text-align: right;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .chosen[b-7ho036rrgp]  .chosen-price small {
        font-size: 0.75rem;
        color: var(--faint);
    }

    .chosen[b-7ho036rrgp]  .chosen-period {
        font-size: 0.8rem;
    }

    .chosen[b-7ho036rrgp]  .chosen-remove {
        display: inline-flex;
        padding: 0.25rem;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: var(--faint);
        cursor: pointer;
    }

        .chosen[b-7ho036rrgp]  .chosen-remove:hover,
        .chosen[b-7ho036rrgp]  .chosen-remove:focus-visible {
            color: #ff7a6b;
            background: rgba(255, 122, 107, 0.1);
        }

@container chart (max-width: 520px) {
    .chosen[b-7ho036rrgp]  li {
        grid-template-columns: auto auto minmax(0, 1fr) 4.6rem auto;
    }

    .chosen[b-7ho036rrgp]  .chosen-price,
    .chosen[b-7ho036rrgp]  .chosen-period {
        display: none;
    }
}

.chart-col[b-7ho036rrgp] {
    container: chart / inline-size;
}

.compare[b-7ho036rrgp]  .swatch-line {
    flex: none;
    display: block;
}

.compare[b-7ho036rrgp]  .up {
    color: #a6e3a1;
}

.compare[b-7ho036rrgp]  .down {
    color: #ff7a6b;
}

.compare-frame[b-7ho036rrgp] {
    position: relative;
}

.compare-chart[b-7ho036rrgp] {
    display: block;
    width: 100%;
    overflow: visible;
    touch-action: pan-y;
}

    .compare-chart[b-7ho036rrgp]  .grid {
        stroke: rgba(148, 170, 205, 0.1);
        stroke-width: 1;
    }

    .compare-chart[b-7ho036rrgp]  .grid-zero {
        stroke: rgba(148, 170, 205, 0.4);
    }

    .compare-chart[b-7ho036rrgp]  .axis {
        font-family: var(--font-mono);
        font-size: 11px;
        fill: var(--faint);
        font-variant-numeric: tabular-nums;
    }

    .compare-chart[b-7ho036rrgp]  .line {
        fill: none;
        stroke-width: 2;
        stroke-linejoin: round;
        stroke-linecap: round;
    }

    .compare-chart[b-7ho036rrgp]  .end-dot,
    .compare-chart[b-7ho036rrgp]  .hover-dot {
        stroke: #080e1c;
        stroke-width: 2;
    }

    .compare-chart[b-7ho036rrgp]  .end-label {
        font-size: 12px;
        fill: var(--muted-strong);
        font-variant-numeric: tabular-nums;
    }

    .compare-chart[b-7ho036rrgp]  .crosshair {
        stroke: rgba(232, 236, 243, 0.35);
        stroke-width: 1;
    }

.compare-tip[b-7ho036rrgp] {
    position: absolute;
    transform: translate(-50%, -100%);
    min-width: 12rem;
    padding: 0.45rem 0.65rem;
    border-radius: 6px;
    background: #e8ecf3;
    color: #0a1120;
    font-size: 0.8rem;
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

    .compare-tip[b-7ho036rrgp]  .tip-date {
        margin-bottom: 0.25rem;
        color: #4f5d75;
    }

    .compare-tip.below[b-7ho036rrgp] {
        transform: translate(-50%, 0);
    }

    .compare-tip[b-7ho036rrgp]  .tip-rows {
        column-gap: 1.25rem;
    }

    .compare-tip[b-7ho036rrgp]  .tip-row {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        break-inside: avoid;
    }

    .compare-tip[b-7ho036rrgp]  .tip-name {
        flex: 1;
        max-width: 11rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .compare-tip[b-7ho036rrgp]  .tip-value {
        font-variant-numeric: tabular-nums;
        font-weight: 600;
    }

.compare-note[b-7ho036rrgp] {
    margin: 0.25rem 0 0;
    font-size: 0.8rem;
    color: var(--faint);
}

    .compare-note:empty[b-7ho036rrgp] {
        display: none;
    }

/* Tabel */
.pick-col[b-7ho036rrgp] {
    width: 1px;
    padding-right: 0 !important;
}

.pick[b-7ho036rrgp] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--accent);
    cursor: pointer;
}

.visually-hidden[b-7ho036rrgp] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.table-wrap[b-7ho036rrgp] {
    overflow-x: auto;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.stocks[b-7ho036rrgp] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

    .stocks th[b-7ho036rrgp] {
        padding: 0.7rem 1rem;
        text-align: left;
        font-family: var(--font-mono);
        font-size: 0.7rem;
        font-weight: 400;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted);
        border-bottom: 1px solid rgba(201, 162, 92, 0.14);
    }

    .stocks td[b-7ho036rrgp] {
        padding: 0.55rem 1rem;
        border-bottom: 1px solid rgba(148, 170, 205, 0.08);
    }

    .stocks tbody tr:last-child td[b-7ho036rrgp] {
        border-bottom: 0;
    }

    .stocks tbody tr:hover[b-7ho036rrgp] {
        background: rgba(201, 162, 92, 0.05);
    }

    .stocks .num[b-7ho036rrgp] {
        text-align: right;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .stocks small[b-7ho036rrgp] {
        font-size: 0.75rem;
        color: var(--faint);
    }

.name[b-7ho036rrgp] {
    display: block;
}

.symbol[b-7ho036rrgp] {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    color: var(--faint);
}

.etf-badge[b-7ho036rrgp] {
    margin-left: 0.4rem;
    padding: 0 0.3rem;
    border-radius: 4px;
    border: 1px solid rgba(201, 162, 92, 0.35);
    font-family: var(--font-mono);
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    color: var(--accent);
    vertical-align: 1px;
}

.market[b-7ho036rrgp],
.updated[b-7ho036rrgp] {
    font-size: 0.85rem;
    color: var(--muted);
}

.up[b-7ho036rrgp] {
    color: #a6e3a1;
}

.down[b-7ho036rrgp] {
    color: #ff7a6b;
}

/* Sider */
.pager[b-7ho036rrgp] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.25rem;
    margin-top: 1rem;
    font-size: 0.9rem;
    color: var(--muted);
}

    .pager a[b-7ho036rrgp] {
        color: var(--text);
        text-decoration: none;
    }

        .pager a:hover[b-7ho036rrgp] {
            color: var(--accent);
        }

.fineprint[b-7ho036rrgp] {
    margin: 1rem 0 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--faint);
}

/* Børs og tidspunkt skjules efter listens bredde, ikke skærmens. */
.list-inner[b-7ho036rrgp] {
    container: list / inline-size;
}

@container list (max-width: 560px) {
    .hide-sm[b-7ho036rrgp] {
        display: none;
    }

    .stocks th[b-7ho036rrgp],
    .stocks td[b-7ho036rrgp] {
        padding-left: 0.6rem;
        padding-right: 0.6rem;
    }
}
/* /Components/Pages/StocksLogin.razor.rz.scp.css */
.login[b-pu8pvi3v8q] {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

form[b-pu8pvi3v8q] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: min(100%, 22rem);
    padding: 2rem;
    border-radius: 16px;
    background: rgba(5, 10, 22, 0.75);
    border: 1px solid rgba(201, 162, 92, 0.18);
}

.brand[b-pu8pvi3v8q] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.4rem;
    letter-spacing: -0.02em;
    color: var(--text);
    text-decoration: none;
}

.dot[b-pu8pvi3v8q] {
    color: var(--accent);
}

.lead[b-pu8pvi3v8q] {
    margin: 0 0 0.75rem;
    color: var(--muted-strong);
}

label[b-pu8pvi3v8q] {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--muted);
}

input[b-pu8pvi3v8q] {
    padding: 0.75rem 0.9rem;
    border-radius: 10px;
    border: 1px solid rgba(148, 170, 205, 0.3);
    background: rgba(5, 10, 22, 0.7);
    color: var(--text);
    font: inherit;
}

    input:focus[b-pu8pvi3v8q] {
        outline: 2px solid var(--accent);
        outline-offset: 1px;
    }

.error[b-pu8pvi3v8q] {
    margin: 0;
    color: #ff7a6b;
    font-size: 0.9rem;
}

button[b-pu8pvi3v8q] {
    margin-top: 0.5rem;
    padding: 0.8rem 1rem;
    border: none;
    border-radius: 999px;
    background: var(--accent);
    color: #0a1120;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

    button:hover[b-pu8pvi3v8q] {
        filter: brightness(1.1);
    }
/* /Components/Pages/StocksTips.razor.rz.scp.css */
.page[b-nk91s0sg0q] {
    min-height: 100vh;
    min-height: 100dvh;
    padding: 20px;
    color: var(--text);
}

.head[b-nk91s0sg0q] {
    margin-bottom: 1.5rem;
}

.brand[b-nk91s0sg0q] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--text);
    text-decoration: none;
}

.dot[b-nk91s0sg0q] {
    color: var(--accent);
}

.eyebrow[b-nk91s0sg0q] {
    margin: 2rem 0 0.5rem;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--faint);
}

.title[b-nk91s0sg0q] {
    margin: 0;
    font-weight: 600;
    font-size: clamp(1.75rem, 5vw, 3rem);
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.back[b-nk91s0sg0q] {
    display: inline-block;
    margin-top: 0.75rem;
    font-size: 0.9rem;
    color: var(--muted-strong);
    text-decoration: none;
}

    .back:hover[b-nk91s0sg0q] {
        color: var(--accent);
    }

.block[b-nk91s0sg0q] {
    margin-top: 2rem;
    line-height: 1.55;
}

    .block h2[b-nk91s0sg0q] {
        margin: 0 0 0.6rem;
        font-size: 1.1rem;
        font-weight: 600;
    }

    .block h3[b-nk91s0sg0q] {
        margin: 0 0 0.4rem;
        font-family: var(--font-mono);
        font-size: 0.7rem;
        font-weight: 400;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted);
    }

    .block p[b-nk91s0sg0q] {
        margin: 0 0 0.75rem;
        max-width: 75ch;
    }

.muted[b-nk91s0sg0q] {
    color: var(--muted);
}

.small[b-nk91s0sg0q] {
    font-size: 0.8rem;
}

.table-wrap[b-nk91s0sg0q] {
    overflow-x: auto;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

table[b-nk91s0sg0q] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

th[b-nk91s0sg0q] {
    padding: 0.65rem 0.9rem;
    text-align: left;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
    border-bottom: 1px solid rgba(201, 162, 92, 0.14);
}

td[b-nk91s0sg0q] {
    padding: 0.5rem 0.9rem;
    border-bottom: 1px solid rgba(148, 170, 205, 0.08);
    vertical-align: top;
}

tbody tr:last-child td[b-nk91s0sg0q] {
    border-bottom: 0;
}

.num[b-nk91s0sg0q] {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.nowrap[b-nk91s0sg0q] {
    white-space: nowrap;
}

.features tr:not(.used)[b-nk91s0sg0q] {
    color: var(--muted);
}

.features tr.used td:last-child[b-nk91s0sg0q] {
    color: var(--accent);
}

.f-name[b-nk91s0sg0q] {
    font-weight: 500;
}

.f-desc[b-nk91s0sg0q] {
    display: block;
    font-size: 0.78rem;
    color: var(--faint);
}

.badge[b-nk91s0sg0q] {
    margin-left: 0.4rem;
    padding: 0 0.35rem;
    border-radius: 4px;
    border: 1px solid rgba(201, 162, 92, 0.35);
    font-family: var(--font-mono);
    font-size: 0.62rem;
    color: var(--accent);
    vertical-align: 1px;
}

.chip[b-nk91s0sg0q] {
    display: inline-block;
    margin: 0.1rem 0.35rem 0.1rem 0;
    padding: 0.05rem 0.4rem;
    border-radius: 6px;
    border: 1px solid rgba(148, 170, 205, 0.18);
    font-family: var(--font-mono);
    font-size: 0.72rem;
    white-space: nowrap;
    color: var(--muted-strong);
}

    .chip.hit[b-nk91s0sg0q] {
        border-color: rgba(166, 227, 161, 0.45);
        color: #a6e3a1;
    }

    .chip.miss[b-nk91s0sg0q] {
        border-color: rgba(255, 122, 107, 0.45);
        color: #ff7a6b;
    }

.pairs[b-nk91s0sg0q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
    gap: 1.5rem;
}

.pair-list[b-nk91s0sg0q] {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.85rem;
}

    .pair-list li[b-nk91s0sg0q] {
        display: flex;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.35rem 0;
        border-bottom: 1px solid rgba(148, 170, 205, 0.08);
    }

/* Luft mellem Mønstertips og Analysetips. */
.block-gap[b-nk91s0sg0q] {
    height: 2.5rem;
}
/* /Components/Pages/TipsPanel.razor.rz.scp.css */
.tips[b-k5h6lpc22w] {
    margin-bottom: 20px;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.tips-head[b-k5h6lpc22w] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 1rem;
}

.tips-toggle[b-k5h6lpc22w] {
    display: inline-flex;
    margin-right: -0.4rem;
    padding: 0.3rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.25);
    background: rgba(201, 162, 92, 0.06);
    color: var(--muted-strong);
    cursor: pointer;
}

    .tips-toggle:hover[b-k5h6lpc22w] {
        color: var(--text);
        background: rgba(201, 162, 92, 0.18);
    }

    .tips-toggle svg[b-k5h6lpc22w] {
        transition: transform var(--fold-time) var(--ease-settle);
    }

.tips.collapsed .tips-toggle svg[b-k5h6lpc22w] {
    transform: rotate(-90deg);
}

/* Sammenfoldning: rækken glider fra fuld højde til 0, og indholdet toner ud. */
.tips-body[b-k5h6lpc22w] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows var(--fold-time) var(--ease-settle);
}

.tips-body-inner[b-k5h6lpc22w] {
    min-height: 0;
    overflow: hidden;
    padding-top: 0.85rem;
    transition: opacity 0.45s var(--ease-settle), padding-top var(--fold-time) var(--ease-settle), visibility 0s;
}

.tips.collapsed .tips-body[b-k5h6lpc22w] {
    grid-template-rows: 0fr;
}

.tips.collapsed .tips-body-inner[b-k5h6lpc22w] {
    padding-top: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-out, padding-top var(--fold-time) var(--ease-settle), visibility 0s linear var(--fold-time);
}

.tips-summary[b-k5h6lpc22w] {
    display: none;
    font-size: 0.85rem;
    color: var(--muted-strong);
}

.tips.collapsed .tips-summary[b-k5h6lpc22w] {
    display: inline;
}

@media (prefers-reduced-motion: reduce) {
    .tips-body[b-k5h6lpc22w],
    .tips-body-inner[b-k5h6lpc22w],
    .tips.collapsed .tips-body-inner[b-k5h6lpc22w],
    .tips-toggle svg[b-k5h6lpc22w] {
        transition: none;
    }
}

.tips-title[b-k5h6lpc22w] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text);
}

.tips-date[b-k5h6lpc22w] {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: var(--muted);
}

.tips-score[b-k5h6lpc22w] {
    font-size: 0.85rem;
    color: var(--muted-strong);
}

.tips-money[b-k5h6lpc22w] {
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
    color: var(--muted-strong);
    cursor: help;
}

    .tips-money.up[b-k5h6lpc22w] {
        color: #a6e3a1;
    }

    .tips-money.down[b-k5h6lpc22w] {
        color: #ff7a6b;
    }

/* "Gem liste": skubbes til højre; "Mønstre og historik" står lige efter den. */
.tips-save[b-k5h6lpc22w] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    padding: 0.3rem 0.75rem;
    border-radius: 8px;
    border: 1px solid rgba(201, 162, 92, 0.4);
    background: rgba(201, 162, 92, 0.14);
    color: var(--text);
    font-size: 0.85rem;
    text-decoration: none;
    transition: background-color 0.35s var(--ease-settle);
}

    .tips-save:hover[b-k5h6lpc22w] {
        background: rgba(201, 162, 92, 0.26);
    }

    .tips-save + .tips-more[b-k5h6lpc22w] {
        margin-left: 0;
    }

.tips-more[b-k5h6lpc22w] {
    margin-left: auto;
    font-size: 0.85rem;
    color: var(--muted-strong);
    text-decoration: none;
}

    .tips-more:hover[b-k5h6lpc22w] {
        color: var(--accent);
    }

.tips-run[b-k5h6lpc22w] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.75rem;
    margin-bottom: 0.85rem;
}

.tips-bar[b-k5h6lpc22w] {
    flex: 0 1 16rem;
    height: 6px;
    border-radius: 999px;
    background: rgba(148, 170, 205, 0.15);
    overflow: hidden;
}

    .tips-bar span[b-k5h6lpc22w] {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: var(--accent);
        transition: width 0.9s var(--ease-settle);
    }

.tips-run-label[b-k5h6lpc22w] {
    margin: 0 0 0.85rem;
    font-size: 0.78rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.tips-run .tips-run-label[b-k5h6lpc22w] {
    margin: 0;
}

.tips-empty[b-k5h6lpc22w] {
    margin: 0;
    color: var(--muted);
}

.tips-list[b-k5h6lpc22w] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Seks tips: 6, 3 eller 2 på række, så der aldrig står ét alene. */
@media (min-width: 560px) {
    .tips-list[b-k5h6lpc22w] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 900px) {
    .tips-list[b-k5h6lpc22w] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1800px) {
    .tips-list[b-k5h6lpc22w] {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

.tip[b-k5h6lpc22w] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    background: rgba(201, 162, 92, 0.04);
    border: 1px solid rgba(148, 170, 205, 0.12);
    font-size: 0.85rem;
}

.tip-top[b-k5h6lpc22w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tip-dir[b-k5h6lpc22w] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-weight: 600;
}

.is-up .tip-dir[b-k5h6lpc22w] {
    color: #a6e3a1;
}

.is-down .tip-dir[b-k5h6lpc22w] {
    color: #ff7a6b;
}

.tip-prob[b-k5h6lpc22w] {
    font-size: 1.35rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}

.tip-name[b-k5h6lpc22w] {
    display: flex;
    align-items: center;
    font-size: 0.95rem;
    color: var(--text);
}

    .tip-name span[b-k5h6lpc22w] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

/* Lille graf-ikon: lægger papiret i hovedgrafen; guldkant, mens det er der. */
.tip-graph-btn[b-k5h6lpc22w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: 0.35rem;
    border-radius: 50%;
    border: 1px solid rgba(201, 162, 92, 0.45);
    color: var(--accent);
    text-decoration: none;
    transition: background-color 0.35s var(--ease-settle), border-color 0.35s var(--ease-settle);
}

    .tip-graph-btn:hover[b-k5h6lpc22w] {
        background: rgba(201, 162, 92, 0.18);
    }

    .tip-graph-btn.in-chart[b-k5h6lpc22w] {
        border-color: var(--accent);
        background: rgba(201, 162, 92, 0.28);
    }

.tip-meta[b-k5h6lpc22w] {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--faint);
}

.tip-figures[b-k5h6lpc22w] {
    display: flex;
    gap: 1.25rem;
    margin: 0.2rem 0 0;
}

    .tip-figures dt[b-k5h6lpc22w] {
        font-size: 0.7rem;
        color: var(--muted);
    }

    .tip-figures dd[b-k5h6lpc22w] {
        margin: 0;
        font-variant-numeric: tabular-nums;
        color: var(--text);
    }

    .tip-figures dd.up[b-k5h6lpc22w] {
        color: #a6e3a1;
    }

    .tip-figures dd.down[b-k5h6lpc22w] {
        color: #ff7a6b;
    }

    .tip-figures small[b-k5h6lpc22w] {
        font-size: 0.7rem;
        color: var(--faint);
    }

.tip-reasons[b-k5h6lpc22w] {
    margin: 0.2rem 0 0;
    padding-left: 1rem;
    color: var(--muted-strong);
    font-size: 0.78rem;
    line-height: 1.4;
}

/* Graf under tippet; indholdet tegnes af tips.js og styles derfor gennem ::deep. */
.tip-chart[b-k5h6lpc22w] {
    margin: 0.35rem 0 0;
}

    .tip-chart svg[b-k5h6lpc22w] {
        display: block;
        width: 100%;
        height: 64px;
        overflow: visible;
    }

    .tip-chart[b-k5h6lpc22w]  .tip-base {
        stroke: rgba(148, 170, 205, 0.25);
        stroke-width: 1;
    }

    .tip-chart[b-k5h6lpc22w]  .tip-claim {
        fill: none;
        stroke-width: 2;
        stroke-dasharray: 5 4;
    }

    .tip-chart[b-k5h6lpc22w]  .tip-line {
        fill: none;
        stroke: var(--accent);
        stroke-width: 2;
        stroke-linejoin: round;
        stroke-linecap: round;
    }

    .tip-chart[b-k5h6lpc22w]  .tip-dot {
        fill: var(--accent);
        stroke: #080e1c;
        stroke-width: 2;
    }

    .tip-chart[b-k5h6lpc22w]  .tip-claim-end {
        fill: #080e1c;
        stroke-width: 2;
    }

.is-up .tip-chart[b-k5h6lpc22w]  .tip-claim,
.is-up .tip-chart[b-k5h6lpc22w]  .tip-claim-end {
    stroke: #a6e3a1;
}

.is-down .tip-chart[b-k5h6lpc22w]  .tip-claim,
.is-down .tip-chart[b-k5h6lpc22w]  .tip-claim-end {
    stroke: #ff7a6b;
}

.tip-chart figcaption[b-k5h6lpc22w] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem 0.75rem;
    margin-top: 0.3rem;
    font-size: 0.7rem;
    color: var(--muted);
}

.tip-legend[b-k5h6lpc22w] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

    .tip-legend[b-k5h6lpc22w]::before {
        content: "";
        width: 14px;
        border-top: 2px solid var(--accent);
    }

.tip-legend-claim[b-k5h6lpc22w]::before {
    border-top-style: dashed;
}

.is-up .tip-legend-claim[b-k5h6lpc22w]::before {
    border-top-color: #a6e3a1;
}

.is-down .tip-legend-claim[b-k5h6lpc22w]::before {
    border-top-color: #ff7a6b;
}

.tip-now[b-k5h6lpc22w] {
    margin-left: auto;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--muted-strong);
}

    .tip-now.up[b-k5h6lpc22w] {
        color: #a6e3a1;
    }

    .tip-now.down[b-k5h6lpc22w] {
        color: #ff7a6b;
    }

.tip-outcome[b-k5h6lpc22w] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem 0.6rem;
    margin-top: auto;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(148, 170, 205, 0.1);
    font-size: 0.78rem;
    color: var(--faint);
    font-variant-numeric: tabular-nums;
}

    .tip-outcome.hit[b-k5h6lpc22w] {
        color: #a6e3a1;
    }

    .tip-outcome.miss[b-k5h6lpc22w] {
        color: #ff7a6b;
    }

.tip-verdict[b-k5h6lpc22w] {
    font-weight: 600;
}

.tips-note[b-k5h6lpc22w] {
    margin: 0.75rem 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: var(--faint);
}

    .tips-note a[b-k5h6lpc22w] {
        color: var(--muted-strong);
    }
/* /Components/Pages/TipsStats.razor.rz.scp.css */
.muted[b-5stmk9yksf] {
    color: var(--muted);
}

.stats-tiles[b-5stmk9yksf] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.stats-tile[b-5stmk9yksf] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.75rem 0.9rem;
    border-radius: 12px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.stats-label[b-5stmk9yksf] {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
}

.stats-value[b-5stmk9yksf] {
    font-size: 1.5rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}

.stats-sub[b-5stmk9yksf] {
    font-size: 0.78rem;
    color: var(--faint);
}

/* Graf */
.stats-chart[b-5stmk9yksf] {
    margin: 0 0 1rem;
    padding: 0.9rem 1rem 0.75rem;
    border-radius: 14px;
    background: rgba(5, 10, 22, 0.55);
    border: 1px solid rgba(201, 162, 92, 0.12);
}

.stats-legend[b-5stmk9yksf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 1.1rem;
    margin-bottom: 0.6rem;
    font-size: 0.8rem;
    color: var(--muted-strong);
}

.legend[b-5stmk9yksf] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

    .legend[b-5stmk9yksf]::before {
        content: "";
        width: 16px;
        border-top: 2px solid var(--accent);
    }

.legend-day[b-5stmk9yksf]::before {
    width: 10px;
    height: 10px;
    border: 0;
    border-radius: 2px;
    background: rgba(148, 170, 205, 0.4);
}

.legend-promise[b-5stmk9yksf]::before {
    border-top: 2px dashed #6cb8ff;
}

.legend-coin[b-5stmk9yksf]::before {
    border-top: 1px dashed rgba(148, 170, 205, 0.6);
}

.stats-frame[b-5stmk9yksf] {
    position: relative;
}

.stats-grid[b-5stmk9yksf] {
    display: grid;
    grid-template-columns: 3rem 1fr;
    grid-template-rows: 220px 1.6rem;
}

.stats-y[b-5stmk9yksf] {
    position: relative;
}

    .stats-y span[b-5stmk9yksf] {
        position: absolute;
        right: 0.5rem;
        transform: translateY(-50%);
    }

.stats-y span[b-5stmk9yksf],
.stats-x span[b-5stmk9yksf] {
    font-family: var(--font-mono);
    font-size: 12px;
    color: var(--faint);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.stats-plot[b-5stmk9yksf] {
    position: relative;
}

    .stats-plot svg[b-5stmk9yksf] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        display: block;
        overflow: visible;
    }

.stats-x[b-5stmk9yksf] {
    position: relative;
    grid-column: 2;
}

    .stats-x span[b-5stmk9yksf] {
        position: absolute;
        top: 0.4rem;
        transform: translateX(-50%);
    }

.grid[b-5stmk9yksf] {
    stroke: rgba(148, 170, 205, 0.1);
    stroke-width: 1;
}

.coin[b-5stmk9yksf] {
    stroke: rgba(148, 170, 205, 0.6);
    stroke-width: 1;
    stroke-dasharray: 4 4;
}

.hit[b-5stmk9yksf] {
    fill: transparent;
}

.bar[b-5stmk9yksf] {
    fill: rgba(148, 170, 205, 0.4);
    transition: fill 0.3s var(--ease-settle);
}

.col.active .bar[b-5stmk9yksf],
.col:hover .bar[b-5stmk9yksf] {
    fill: rgba(148, 170, 205, 0.7);
}

/* Investeringsgrafen: gevinst grøn, tab rød; lysere ved hover. */
.stats-grid-money[b-5stmk9yksf] {
    grid-template-rows: 160px 1.6rem;
}

.bar.gain[b-5stmk9yksf] {
    fill: rgba(166, 227, 161, 0.55);
}

.bar.loss[b-5stmk9yksf] {
    fill: rgba(255, 122, 107, 0.55);
}

.col.active .bar.gain[b-5stmk9yksf],
.col:hover .bar.gain[b-5stmk9yksf] {
    fill: #a6e3a1;
}

.col.active .bar.loss[b-5stmk9yksf],
.col:hover .bar.loss[b-5stmk9yksf] {
    fill: #ff7a6b;
}

.legend-gain[b-5stmk9yksf]::before,
.legend-loss[b-5stmk9yksf]::before {
    width: 10px;
    height: 10px;
    border: 0;
    border-radius: 2px;
    background: rgba(166, 227, 161, 0.55);
}

.legend-loss[b-5stmk9yksf]::before {
    background: rgba(255, 122, 107, 0.55);
}

.stats-caption[b-5stmk9yksf] {
    flex-basis: 100%;
    color: var(--muted);
}

.stats-value.up[b-5stmk9yksf] {
    color: #a6e3a1;
}

.stats-value.down[b-5stmk9yksf] {
    color: #ff7a6b;
}

.total[b-5stmk9yksf],
.promise[b-5stmk9yksf] {
    fill: none;
    stroke-width: 2;
    stroke-linejoin: round;
    stroke-linecap: round;
    pointer-events: none;
}

.total[b-5stmk9yksf] {
    stroke: var(--accent);
}

.promise[b-5stmk9yksf] {
    stroke: #6cb8ff;
    stroke-dasharray: 5 4;
}

.stats-tooltip[b-5stmk9yksf] {
    position: absolute;
    transform: translate(-50%, -100%);
    padding: 0.35rem 0.6rem;
    border-radius: 6px;
    background: #e8ecf3;
    color: #0a1120;
    font-size: 0.8rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    z-index: 1;
}
