/* CoffeeList / Durakwerk visual language. Load after each view's layout CSS.
   Page layouts, chart geometry, trading semantics and visibility remain owned
   by the existing view. These tokens also cover dynamically rendered panels. */
:root, html[data-theme="dark"] {
    color-scheme: dark;
    --ds-bg:#101114; --ds-panel:#191b20; --ds-surface:#23262c; --ds-hover:#2b2f36;
    --ds-border:#343840; --ds-input:#555c68; --ds-text:#f2f4f7; --ds-muted:#acb2bd;
    --ds-accent:#77d8ba; --ds-blue:#8bc5f0; --ds-primary:#e6e9ef; --ds-on-primary:#171a20;
    --ds-selected:#2d323b; --ds-good:#77d8ba; --ds-good-bg:#222e2b;
    --ds-warning:#f0cd83; --ds-warning-bg:#352e20; --ds-danger:#ffb2bb; --ds-danger-bg:#38252a;
    --ds-shadow:0 2px 8px #00000014;
}
html[data-theme="light"] {
    color-scheme: light;
    --ds-bg:#f5f6f8; --ds-panel:#fff; --ds-surface:#f0f2f5; --ds-hover:#e7eaef;
    --ds-border:#dce0e6; --ds-input:#9ba3af; --ds-text:#20242c; --ds-muted:#586270;
    --ds-accent:#007d64; --ds-blue:#00699d; --ds-primary:#252a33; --ds-on-primary:#fff;
    --ds-selected:#e8ecf1; --ds-good:#007d64; --ds-good-bg:#eef5f2;
    --ds-warning:#765000; --ds-warning-bg:#fff3d8; --ds-danger:#a61f3c; --ds-danger-bg:#fcecef;
    --ds-shadow:0 2px 8px #20242c06;
}
html[data-design] {
    --tb-bg-1:var(--ds-bg); --tb-bg-2:var(--ds-bg); --tb-bg-3:var(--ds-bg);
    --tb-panel:var(--ds-panel); --tb-panel-soft:var(--ds-panel); --tb-panel-border:var(--ds-border);
    --tb-text:var(--ds-text); --tb-muted:var(--ds-muted); --tb-accent:var(--ds-accent); --tb-accent-2:var(--ds-blue);
    --tb-shadow-lg:var(--ds-shadow); --tb-shadow-md:var(--ds-shadow); --tb-radius-lg:16px; --tb-radius-md:14px;
    --tb-danger:var(--ds-danger); --tb-success:var(--ds-good); --tb-shadow:var(--ds-shadow); --tb-radius:14px;
    --bg:var(--ds-bg); --bg-1:var(--ds-bg); --bg-2:var(--ds-bg); --bg-body:var(--ds-bg);
    --panel:var(--ds-panel); --panel-border:var(--ds-border); --bg-card:var(--ds-panel); --bg-card-alt:var(--ds-surface);
    --text:var(--ds-text); --text-main:var(--ds-text); --text-muted:var(--ds-muted); --muted:var(--ds-muted);
    --border-color:var(--ds-border); --accent:var(--ds-accent); --accent-2:var(--ds-blue);
    --bg-input:var(--ds-bg); --bg-hover:var(--ds-hover); --text-sub:var(--ds-muted);
    --btn-nav:var(--ds-surface); --btn-nav-hover:var(--ds-hover); --btn-active:var(--ds-selected);
    --color-win:var(--ds-good); --color-loss:var(--ds-danger); --color-warning:var(--ds-warning);
    --ps-accent:var(--ds-warning); --ps-accent-2:var(--ds-accent); --ps-muted:var(--ds-muted); --ps-good:var(--ds-good); --ps-bad:var(--ds-danger);
    background:var(--ds-bg);
}
html[data-design] body {
    background:var(--ds-bg); color:var(--ds-text);
    font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    -webkit-font-smoothing:antialiased;
}
html[data-design]:not([data-design-ready]) *, html[data-design]:not([data-design-ready]) *::before, html[data-design]:not([data-design-ready]) *::after { transition:none!important; }
html[data-design] body[data-view] :where(h1,h2,h3,h4) { color:var(--ds-text); text-wrap:balance; }
html[data-design] body[data-view] :where(h1,.tb-title) { font-weight:700; letter-spacing:-1.2px; line-height:1.15; }
html[data-design] body[data-view] :where(h2) { font-weight:650; letter-spacing:-.65px; }
html[data-design] body[data-view] :where(h3) { font-weight:650; letter-spacing:-.25px; }
html[data-design] .tb-title { font-size:clamp(1.7rem,3vw,2.6rem); }
html[data-design] .tb-title span { color:var(--ds-text); font-weight:400; }
html[data-design] body[data-view] :where(a) { color:var(--ds-blue); }
html[data-design] body[data-view] :where(.tb-subtitle,.card-description,.metric-label,.placeholder,.empty-state,.hint,.login-subtitle,.section-subtitle,.widget-subtitle,.validation-footnote) { color:var(--ds-muted); }
html[data-design] body[data-view] :where(.tb-shell,.page-shell) { max-width:1440px; min-width:0; }
html[data-design] body[data-view] :where(.tb-hero,.hero,.landing-hero,.page-hero,.header-inner,.bt-dash-header,.login-card) {
    background:var(--ds-panel); border:1px solid var(--ds-border); border-radius:16px;
    box-shadow:none; backdrop-filter:none;
}
html[data-design] body[data-view] :where(.tb-hero,.hero,.page-hero,.header-inner,.landing-hero) { padding:24px; }
html[data-design] body[data-view] :where(.tb-brand-logo,.brand-logo,.header-logo,.page-hero-logo) {
    width:56px; height:56px; padding:4px; border-radius:12px; background:var(--ds-surface); box-shadow:none;
}
html[data-design] body[data-view] :where(.tb-brand-wrap,.brand-wrap,.header-main) { gap:16px; }
html[data-design] body[data-view] :where(.eyebrow,.tb-eyebrow,.page-eyebrow,.login-eyebrow) {
    color:var(--ds-muted); background:transparent; border:0; padding:0;
    font-size:11px; letter-spacing:1.2px; font-weight:650; text-transform:uppercase;
}
html[data-design] body[data-view] :where(.tb-back-link,.back-home-btn,.footer-maintenance-link,.section-link,.toolbar a) {
    color:var(--ds-text); background:var(--ds-surface); border:1px solid var(--ds-border);
    border-radius:10px; box-shadow:none; font-size:13px; font-weight:550;
}
html[data-design] body[data-view] :where(button,input,select,textarea) { font-family:inherit; }
html[data-design] body[data-view] :where(button,.card-button,.install-cta-btn) {
    border-radius:10px; background:var(--ds-surface); color:var(--ds-text);
    border:1px solid var(--ds-input); box-shadow:none; font-weight:550;
    transition:background-color .15s,border-color .15s;
}
html[data-design] body[data-view] :where(button:hover,a.tb-back-link:hover,.card-button:hover) {
    background:var(--ds-hover); border-color:var(--ds-input); box-shadow:none; transform:none;
}
html[data-design] body[data-view] :where(button,input,select,textarea,summary,a):focus-visible { outline:3px solid var(--ds-blue); outline-offset:3px; }
html[data-design] body[data-view] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea) {
    color:var(--ds-text); background:var(--ds-bg); border:1px solid var(--ds-input); border-radius:10px;
    max-width:100%;
}
html[data-design] body[data-view] :where(input,textarea)::placeholder { color:var(--ds-muted); opacity:1; }
html[data-design] body[data-view] :where(input[type="checkbox"],input[type="radio"],input[type="range"]) { accent-color:var(--ds-accent); }
html[data-design] body[data-view] :where(button:disabled) { opacity:.5; cursor:not-allowed; }
html[data-design] body[data-view] :where(.refresh-btn,.apply-btn,.login-button,.action-btn--accent,.bt-btn-primary,#btn-calc) {
    background:var(--ds-primary); color:var(--ds-on-primary); border-color:var(--ds-primary); font-weight:650;
}
html[data-design] body[data-view] :where(.refresh-btn,.apply-btn,.login-button,.action-btn--accent,.bt-btn-primary,#btn-calc):hover { filter:brightness(.94); }
html[data-design] body[data-view] :where(.action-btn--danger,.toolbar-btn--danger,.danger-btn,.ps-combo-btn-delete) {
    color:var(--ds-danger); background:var(--ds-danger-bg); border-color:var(--ds-danger);
}
html[data-design] :is(#btn-calc,#btn-save-combo,#btn-optimizer-add,#btn-optimizer-remove,#btn-optimizer-compare,#btn-optimizer-swap) { background:var(--ds-primary); color:var(--ds-on-primary); border-color:var(--ds-primary); }
/* Shared surfaces cover both initial HTML and all generated report panels. */
html[data-design] body[data-view] :where(.tb-glass-card,.section-card,.widget-card,.checklist-card,.psych-widget,.emotion-panel,.mindset-bottom-panel,
    .motivation-card,.motivation-focus-card,.motivation-win-highlight,.news-item,.news-summary-box,.news-history-panel,.news-history-metric,
    .metric-card,.insight-card,.pair-card,.table-card,.monthly-card,.monthly-grid-card,.magic-compare-card,.phase-card,
    .heatmap-card,.scatter-chart-frame,.validation-method,.validation-strategy,.validation-detail,.diagnostic-strategy,.diagnostic-signal,
    .ps-settings,.ps-metric,.ps-combo-item,.ps-ea-card,.ps-inline-chart-cycle-card,.ps-drawdown-analysis,.ps-drawdown-card,.ps-opt-col,
    .dashboard-tile,.month-calendar-card,.journal-entry-card,.journal-empty-card,.content-section,.chart-card,.info-highlight-card,
    .stats-container,.heatmap-wrapper,.garch-regime-block,.news-card,.table-wrapper,.filter-container,
    .query-panel,.info-item,.server-status-panel,.status-stat,.table-section-group,.detail-panel,.purge-magic-panel,.log-source-card,
    .bt-dash-card,.bt-session-card,.bt-perf-card,.bt-panel-card,.bt-combined-overview,.bt-combined-stat,.bt-dash-time-box,.bt-stat) {
    color:var(--ds-text); background:var(--ds-panel); border-color:var(--ds-border);
    border-radius:14px; box-shadow:var(--ds-shadow); backdrop-filter:none;
}
html[data-design] body[data-view] :where(.metric-value,.metric-card strong,.ps-metric strong,.info-value,.bt-stat-value,.kpi-box strong) {
    font-variant-numeric:tabular-nums; font-weight:650; letter-spacing:-.5px;
}
html[data-design] body[data-view] :where(.mcc-header,.mcc-scores,.phase-card-head,.monthly-card-head,.heatmap-card-head,
    .range-card summary,.section-toggle > summary,.server-status-summary,.table-section-summary,.viewer-kpi-bar,
    .bt-card-stat,.bt-session-summary-row,.ps-combo-header,.ps-run-header,.ps-opt-header,.related-rows-header) {
    background:var(--ds-surface); color:var(--ds-text); border-color:var(--ds-border);
}
html[data-design] body[data-view] :where(.insight-item,.stat-chip,.meta-chip,.badge,.status-pill,.landing-badge,.pair-freq-badge,
    .sync-info,.kpi-box,.mcc-score,.mcc-score-row,.phase-delta-chip,.reduction-item,.best5-ea-entry,.account-freshness,.news-value,
    .month-calendar-pill,.toggle-indicator,.bt-tf-badge,.bt-counter,.scatter-magic-tag,.ps-scale-badge,.log-source,.frag-badge) {
    color:var(--ds-text); background:var(--ds-surface); border-color:var(--ds-border); border-radius:8px;
}
html[data-design] body[data-view] :where(.toolbar,.filter-container,.ps-actions,.validation-controls) { gap:10px; }
html[data-design] body[data-view] :where(.tabs,.modal-tabs,.profit-method-tabs,.ps-tabs,.validation-chart-tabs,.section-links,.pair-filters) {
    background:var(--ds-panel); border:1px solid var(--ds-border); border-radius:12px; padding:5px; gap:5px;
}
html[data-design] body[data-view] :where(.tab-btn,.modal-tab,.profit-method-tabs button,.ps-tab-btn,.validation-chart-tabs button,.section-link,.pair-btn,.overfit-filter) {
    color:var(--ds-text); background:var(--ds-surface); border:1px solid var(--ds-input); border-radius:8px;
    box-shadow:none; padding:9px 12px; font-size:13px; font-weight:550;
}
html[data-design] body[data-view] :where(.tab-btn.active,.modal-tab.active,.ps-tab-btn.is-active,.pair-btn.active,.overfit-filter.is-active,
    .profit-method-tabs button[aria-selected="true"],.validation-chart-tabs .is-active,.tab-btn[aria-selected="true"]) {
    color:var(--ds-accent); background:var(--ds-selected); border-color:var(--ds-accent); font-weight:650;
}
html[data-design] body[data-view] button:not(:disabled):not([aria-disabled="true"]) { cursor:pointer; }
html[data-design] body[data-view] :where(.tab-btn,.modal-tab,.profit-method-tabs button,.ps-tab-btn,.validation-chart-tabs button,.section-link,.pair-btn,.overfit-filter):not(:disabled):hover { background:var(--ds-hover); border-color:var(--ds-blue); }
html[data-design] body[data-view] :where(table,.data-table,.ps-table) { background:var(--ds-panel); color:var(--ds-text); font-variant-numeric:tabular-nums; }
html[data-design] body[data-view] :where(th,.data-table th,.monthly-table th,.overfit-table th,.heatmap-table th,.mc-table th,.ps-opt-matrix th) {
    background:var(--ds-surface); color:var(--ds-muted); border-color:var(--ds-border); font-weight:600;
}
html[data-design] body[data-view] :where(td) { border-color:var(--ds-border); }
html[data-design] body[data-view] :where(tbody tr:hover td) { background-color:var(--ds-hover); }
html[data-design] body[data-view] :where(.data-table-wrap,.table-wrapper,.overfit-table-wrap,.ps-table-wrap,.ps-opt-matrix-wrap) { max-width:100%; overflow-x:auto; }
html[data-design] body[data-view] :where(.month-calendar-pill,.meta-chip,.stat-chip) :where(strong,span) { color:inherit; }
html[data-design] body[data-view] :where(.ps-range-note,.ps-ranking-help) { color:var(--ds-muted); }
html[data-design] body[data-view] :where(.news-debug-banner,.checklist-theme-badge) { background:var(--ds-surface); color:var(--ds-blue); border-color:var(--ds-border); }
html[data-design] body[data-view] :where(.empty-state,.corr-empty,.news-empty,.bt-card-empty) { background:var(--ds-surface); border-color:var(--ds-border); }
html[data-design] body[data-view] :where(dialog,.terminal-dialog,.journal-modal-card,.confirm-dialog,.text-editor-modal,.ps-inline-tooltip) {
    background:var(--ds-panel); color:var(--ds-text); border:1px solid var(--ds-input); border-radius:16px; box-shadow:0 12px 40px #0003;
}
html[data-design] dialog::backdrop { background:#10111499; backdrop-filter:blur(3px); }
html[data-design] body[data-view] :where(.positive,.label-win) { color:var(--ds-good); }
html[data-design] body[data-view] :where(.negative,.label-loss,.danger) { color:var(--ds-danger); }
html[data-design] body[data-view] :where(.status-pill[data-tone="success"],.status-badge.working,.overfit-status--stable,.phase-health-badge--healthy,.checklist-result--ready,.status-completed) { color:var(--ds-good); background:var(--ds-good-bg); }
html[data-design] body[data-view] :where(.status-pill[data-tone="error"],.status-badge.weak,.overfit-status--high,.phase-health-badge--red-flag,.checklist-result--notready,.diagnostic-warning,.msg.error) { color:var(--ds-danger); background:var(--ds-danger-bg); }
html[data-design] body[data-view] :where(.status-badge.watch,.status-badge.sample-warn,.overfit-status--watch,.phase-health-badge--warning,.checklist-result--partial,.account-freshness[data-state="stale"],.account-freshness[data-state="warning"]) { color:var(--ds-warning); background:var(--ds-warning-bg); }
/* Start page: compact directory, neutral cards, distinct section hierarchy. */
html[data-design] .landing-shell { max-width:1440px; padding:28px; }
html[data-design] body[data-view="index"] { padding:0; }
html[data-design] body[data-view="daily-overview-live"] { padding-top:76px; }
html[data-design] .landing-hero { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:0; }
html[data-design] .landing-hero::before, html[data-design] .card::after { display:none; }
html[data-design] .cluster-section { padding:0; background:transparent; border:0; box-shadow:none; }
html[data-design] .cluster-grid { gap:14px; }
html[data-design] .card { background:var(--ds-panel); border:1px solid var(--ds-border); border-radius:14px; padding:22px; box-shadow:none; min-height:0; }
html[data-design] .card:hover { background:var(--ds-surface); border-color:var(--ds-input); transform:none; }
html[data-design] .card-icon { background:var(--ds-surface); color:var(--ds-accent); border-radius:10px; width:42px; height:42px; }
html[data-design] .card-title { font-size:20px; color:var(--ds-text); }
html[data-design] .card-button { background:transparent; color:var(--ds-text); padding:0; border:0; }
/* Home tiles are the navigation targets; no second action inside each tile. */
html[data-design] body[data-view="index"] .landing-hero { background:transparent; border:0; border-bottom:1px solid var(--ds-border); border-radius:0; padding:12px 0 28px; }
html[data-design] body[data-view="index"] .hero-main { display:block; }
html[data-design] body[data-view="index"] .cluster-stack { gap:36px; }
html[data-design] body[data-view="index"] .section-heading { gap:18px; margin-bottom:16px; }
html[data-design] body[data-view="index"] .section-heading::after { content:""; height:1px; flex:1; background:var(--ds-border); }
html[data-design] body[data-view="index"] .section-heading h2 { font-size:23px; margin:0; }
html[data-design] body[data-view="index"] .card { min-height:200px; padding:24px; cursor:pointer; }
html[data-design] body[data-view="index"] .card:hover { border-color:var(--ds-accent); }
html[data-design] body[data-view="index"] .card-top { margin-bottom:20px; }
html[data-design] body[data-view="index"] .card-icon { background:transparent; width:32px; height:32px; border-radius:0; box-shadow:none; font-size:26px; }
html[data-design] body[data-view="index"] .landing-badge { background:transparent; color:var(--ds-muted); padding:0; border:0; border-radius:0; font-weight:500; }
html[data-design] body[data-view="index"] .card-description { font-size:14px; line-height:1.65; }
html[data-design] body[data-view="index"] .footer { border-top:1px solid var(--ds-border); padding-top:20px; }
html[data-design] body[data-view="index"] .footer-maintenance-link { background:transparent; border:0; padding:0; font-weight:400; }
html[data-design] body[data-view="index"] .footer-maintenance-link:hover { color:var(--ds-accent); text-decoration:underline; }
html[data-design] body[data-view] :where(footer,.footer) { color:var(--ds-muted); }
/* Trading and replay retain their full-height canvas and compact tool geometry. */
html[data-design] :is(#top-bar,#bt-topbar,#sidebar,#bt-sidebar,#bt-right-panel,#bt-playback-bar,#symbol-bar-bottom,#pending-trades-bar,#floating-toolbar,#bt-trades-section) {
    background:var(--ds-panel); color:var(--ds-text); border-color:var(--ds-border); box-shadow:none; backdrop-filter:none; border-radius:0;
}
html[data-design] :is(#top-bar,#bt-topbar) { border-bottom:1px solid var(--ds-border); }
html[data-design] :is(#top-bar,#bt-topbar,#sidebar,#bt-sidebar,#bt-playback-bar,#floating-toolbar) button {
    background:var(--ds-surface); color:var(--ds-text); border-color:var(--ds-border); box-shadow:none; border-radius:8px;
}
html[data-design] :is(#top-bar,#bt-topbar,#sidebar,#bt-sidebar,#bt-playback-bar,#floating-toolbar) button:hover { background:var(--ds-hover); transform:none; }
html[data-design] :is(#top-bar,#sidebar,#bt-sidebar) button.active-btn { background:var(--ds-selected); color:var(--ds-accent); border-color:var(--ds-accent); }
html[data-design] :is(#live-price,#candle-countdown,.bt-time-display) { color:var(--ds-text); background:var(--ds-surface); box-shadow:none; }
html[data-design] body[data-view="trading"] #price-container { position:static; transform:none; margin-left:auto; flex:0 0 auto; }
html[data-design] body[data-view="trading"] #top-bar > .design-theme-toggle { margin-left:0; }
html[data-design] body[data-view="trading"] #top-bar { flex-wrap:wrap; gap:10px; padding:10px 16px; }
html[data-design] body[data-view="trading"] :is(#btn-alarms,#btn-screenshot,#btn-show-drawings) { flex:0 0 36px; margin-left:0; }
html[data-design] body[data-view="trading"] #drawing-recovery:not(:empty) { order:20; flex:1 0 100%; }
html[data-design] body[data-view="trading"] :is(#top-bar,#sidebar) button { background:var(--ds-surface); color:var(--ds-text); border-color:var(--ds-border); }
html[data-design] body[data-view="trading"] #sidebar button.active-btn { background:var(--ds-selected); color:var(--ds-accent); border-color:var(--ds-accent); }
html[data-design] body[data-view="trading"] button :is(text) { fill:currentColor; }
html[data-design] :is(#chart-area,#bt-chart-wrap) { background:var(--ds-panel); }
html[data-design] body[data-view="trading"] #chart-area { background:#0a1220; }
html[data-design][data-theme="light"] body[data-view="trading"] #chart-area { background:#fafafa; }
html[data-design] #bt-trading-banner { background:var(--ds-danger-bg); border-color:var(--ds-danger); }
html[data-design] #bt-status-bar { background:var(--ds-surface); border-color:var(--ds-border); height:auto; min-height:26px; padding:5px 14px; }
html[data-design] #bt-trades-table th { background:var(--ds-surface); color:var(--ds-muted); }
html[data-design] #bt-speed-select { background:var(--ds-surface); color:var(--ds-text); border-color:var(--ds-border); }
html[data-design] :is(#drawings-panel,#checklist-gate .gate-card,.storm-gauge) { background:var(--ds-panel); color:var(--ds-text); border-color:var(--ds-border); border-radius:12px; box-shadow:var(--ds-shadow); }
html[data-design] #drawings-panel table { color:var(--ds-text); }
html[data-design] :is(.sg-title,.sg-subtitle) { color:var(--ds-muted); background:transparent; }
html[data-design] #viewer-wrapper { background:var(--ds-panel); border-color:var(--ds-border); border-radius:14px; box-shadow:none; }
html[data-design] :is(.img-container,.info-container,.journal-paste-zone,.month-calendar-day,.month-calendar-day.is-weekend) { background:var(--ds-surface); color:var(--ds-text); border-color:var(--ds-border); }
html[data-design] .month-calendar-day.is-positive { background:var(--ds-good-bg); }
html[data-design] .month-calendar-day.is-negative { background:var(--ds-danger-bg); }
html[data-design] :is(.equity-chart-frame,.equity-curve-wrap,.ps-canvas-box canvas,.hourly-chart,.bt-card-equity-curve) { background:var(--ds-panel); border-color:var(--ds-border); }
html[data-design] :is(.apexcharts-text,.validation-chart text,.diagnostic-chart text) { fill:var(--ds-muted); }
html[data-design] :is(.apexcharts-tooltip,.apexcharts-tooltip-title,.apexcharts-menu) { background:var(--ds-panel)!important; color:var(--ds-text)!important; border-color:var(--ds-border)!important; }
/* Theme switch uses the same geometry as the top-bar icon buttons. */
html[data-design] button.design-theme-toggle { display:inline-flex; align-items:center; justify-content:center; flex:0 0 36px; width:36px; height:36px; padding:0; border:1px solid var(--ds-border); border-radius:10px; margin-left:auto; color:var(--ds-text); background:var(--ds-surface); }
html[data-design] .design-theme-toggle svg { flex-shrink:0; }
html[data-design] :is(.login-shell,.profit-method-guide > section) > .design-theme-toggle { margin-top:16px; }
html[data-design] body[data-view="privacy"] { padding:24px; max-width:none; }
html[data-design] body[data-view="privacy"] main { max-width:900px; margin:0 auto; padding:32px; background:var(--ds-panel); border:1px solid var(--ds-border); border-radius:16px; }
html[data-design] body[data-view="privacy"] :is(p,li,.meta) { color:var(--ds-muted); }
html[data-design] :is(.login-card,.login-shell) { min-width:0; }
html[data-design] body.login-page { overflow:auto; }
html[data-design] .login-page::before, html[data-design] .login-page::after { display:none; }
html[data-design] :is(.login-label,.login-card .hint,.attempt-meter) { color:var(--ds-muted); }
html[data-design] .login-shell a { color:var(--ds-blue)!important; }
html[data-design] body[data-view] .login-button { background:var(--ds-primary); color:var(--ds-on-primary); }
html[data-design] .msg.info { color:var(--ds-blue); background:var(--ds-surface); border-color:var(--ds-border); }
html[data-design] .login-icon { background:var(--ds-surface); color:var(--ds-text); box-shadow:none; }
/* The linked Python backtesting monitor ships these same shared assets. */
html[data-design] body[data-view^="webgui-"] :is(.dim,.heartbeat-meta,.panel-head small) { color:var(--ds-muted); }
html[data-design] body[data-view^="webgui-"] :is(.log-box,pre) { background:var(--ds-bg); color:var(--ds-text); border:1px solid var(--ds-border); border-radius:10px; }
html[data-design] body[data-view^="webgui-"] :is(.btn,.topnav a) { color:var(--ds-text); background:var(--ds-surface); border-color:var(--ds-border); border-radius:10px; box-shadow:none; }
html[data-design] body[data-view^="webgui-"] .btn-primary { background:var(--ds-primary); color:var(--ds-on-primary); }
html[data-design] body[data-view^="webgui-"] .warning-msg { color:var(--ds-warning); background:var(--ds-warning-bg); border-color:var(--ds-warning); }
html[data-design] body[data-view^="webgui-"] main { min-width:0; padding-top:76px; }
html[data-design] body[data-view^="webgui-"] :is(.kv-table,.data-table) { width:100%; max-width:100%; table-layout:fixed; }
html[data-design] body[data-view^="webgui-"] :is(td,th) { padding:10px; overflow-wrap:anywhere; }
html[data-design] body[data-view^="webgui-"] :is(input,select) { padding:8px 12px; min-height:38px; }
@media (max-width:900px) {
    /* Keep the replay canvas usable while all tools and panels remain reachable. */
    html[data-design] body[data-view="backtesting"] { overflow:auto; }
    html[data-design] :is(#bt-app,#bt-chart-view) { height:auto; min-height:100dvh; overflow:visible; }
    html[data-design] #bt-main { flex:none; overflow:visible; }
    html[data-design] #bt-sidebar { display:flex; flex-direction:row; width:100%; overflow:auto; padding:8px; border-bottom:1px solid var(--ds-border); }
    html[data-design] .bt-sidebar-tools { flex-direction:row; flex:0 0 auto; }
    html[data-design] .bt-sidebar-tool-btn { flex:0 0 44px; width:44px; height:48px; }
    html[data-design] #bt-chart-col { flex:none; height:520px; }
    html[data-design] #bt-right-panel { flex-direction:column; overflow:visible; }
    html[data-design] #bt-right-panel .bt-panel-card { min-width:0; border-right:0; border-bottom:1px solid var(--ds-border); }
}
@media (max-width:760px) {
    html[data-design] .dashboard-grid { grid-template-columns:minmax(0,1fr); }
    html[data-design] .mindset-top-grid { grid-template-columns:minmax(0,1fr); }
    html[data-design] :is(.widget-card,.checklist-card,.mindset-top-grid,.checklist-header-row) { min-width:0; max-width:100%; }
    html[data-design] .checklist-header-row { flex-wrap:wrap; gap:8px; }
    html[data-design] body[data-view] :where(.tb-hero,.hero,.page-hero,.header-inner,.landing-hero) { padding:16px; }
    html[data-design] body[data-view] :where(.tb-brand-logo,.brand-logo,.header-logo,.page-hero-logo) { width:42px; height:42px; }
    html[data-design] .landing-shell { padding:16px; }
    html[data-design] .tb-title { font-size:26px; }
    html[data-design] body[data-view] :where(.toolbar,.filter-container,.validation-controls,.ps-actions,.profit-method-tabs,.modal-tabs) { flex-wrap:wrap; }
    html[data-design] body[data-view] :where(.toolbar input,.toolbar select,.filter-group) { min-width:0; max-width:100%; }
    html[data-design] body[data-view] :where(.hero-head,.tb-brand-wrap) { flex-wrap:wrap; }
    html[data-design] .profit-method-tabs button { flex:1 1 auto; white-space:normal; }
    html[data-design] body[data-view] :where(.summary-grid,.profit-summary-grid,.db-info-bar) { grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr)); }
    html[data-design] button.design-theme-toggle { width:32px; height:32px; flex-basis:32px; }
    html[data-design] body[data-view="trading"] :is(#btn-alarms,#btn-screenshot,#btn-show-drawings) { flex-basis:32px; }
    html[data-design] body[data-view="privacy"] { padding:12px; }
    html[data-design] body[data-view="privacy"] main { padding:20px; }
}
@media (pointer:coarse) {
    html[data-design] button.design-theme-toggle { width:44px; height:44px; flex-basis:44px; }
    html[data-design] body[data-view="trading"] :is(#btn-alarms,#btn-screenshot,#btn-show-drawings) { flex-basis:44px; }
}
@media (prefers-reduced-motion:reduce) {
    html[data-design] *,html[data-design] *::before,html[data-design] *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
@media print {
    html[data-design] body { background:#fff; color:#20242c; }
    html[data-design] .design-theme-toggle { display:none!important; }
}

/* Compact legal navigation: shared size, theme colors and keyboard focus. */
html body .legal-navigation {
  box-sizing:border-box; min-width:0; max-width:100%; flex:0 1 100%;
  padding:4px 0; font-size:11px; line-height:1.4; width:100%; order:100; justify-content:center;
  color:var(--muted,var(--ds-muted,#9aa5b3));
}
html body .legal-navigation, html body .legal-navigation nav {
  display:flex; flex-wrap:wrap; align-items:center; gap:2px 12px;
}
html body .legal-navigation nav, html body .legal-navigation[data-legal-navigation] nav {
  min-width:0; max-width:100%; margin:0; padding:0;
  background:transparent; border:0; border-radius:0; box-shadow:none; width:100%; justify-content:center;
}
html body :is(footer,.footer):has(> .legal-navigation) { flex-wrap:wrap; }
html body footer > nav:has(a[href*="impressum.html"]) { display:flex; flex-wrap:wrap; align-items:center; gap:2px 12px; font-size:11px; }
html body > .legal-navigation { width:100%; max-width:1200px; margin:0 auto; }
html body > .legal-navigation nav { justify-content:center; width:100%; }
html body :is(.legal-navigation a,footer a[href*="impressum.html"],footer a[href*="datenschutz.html"],footer a[href*="agb.html"],footer a[href*="widerruf.html"]) {
  display:inline-flex; align-items:center; min-height:24px; max-width:100%; padding:2px 0;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif; font-size:11px; font-weight:400; line-height:1.4;
  letter-spacing:normal; text-transform:none; text-decoration:none; white-space:normal;
  color:var(--muted,var(--ds-muted,#9aa5b3)); overflow-wrap:anywhere;
}
html body :is(.legal-navigation a,footer a[href*="impressum.html"],footer a[href*="datenschutz.html"],footer a[href*="agb.html"],footer a[href*="widerruf.html"]):hover {
  color:var(--text,var(--ds-text,inherit)); text-decoration:underline;
}
html body :is(.legal-navigation a,footer a[href*="impressum.html"],footer a[href*="datenschutz.html"],footer a[href*="agb.html"],footer a[href*="widerruf.html"]):focus-visible {
  outline:2px solid currentColor; outline-offset:2px; border-radius:2px;
}
html[data-design] body[data-view="index"] .legal-navigation { padding:0; justify-content:center; }

/* Shared login design: keep this block identical across app themes. */
html body.auth-page { --ds-bg:#101114; --ds-panel:#191b20; --ds-surface:#23262c; --ds-border:#343840; --ds-input:#555c68; --ds-text:#f2f4f7; --ds-muted:#acb2bd; --ds-accent:#77d8ba; --ds-blue:#8bc5f0; --ds-primary:#e6e9ef; --ds-on-primary:#171a20; --ds-danger:#ffb2bb; }
html[data-theme="light"] body.auth-page { --ds-bg:#f5f6f8; --ds-panel:#fff; --ds-surface:#e9ecf0; --ds-border:#dce0e6; --ds-input:#a1a8b3; --ds-text:#20242c; --ds-muted:#626d7b; --ds-accent:#267860; --ds-blue:#28669c; --ds-primary:#e2e5eb; --ds-on-primary:#20242c; --ds-danger:#b5283e; }
html body.auth-page .legal-navigation a { color:var(--ds-muted)!important; }
html body.auth-page .legal-navigation a:hover { color:var(--ds-text)!important; }

html body.auth-page { margin:0; min-height:100vh; min-height:100svh; padding:24px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; background:var(--ds-bg,#101114); color:var(--ds-text,#f2f4f7); font:16px system-ui,-apple-system,"Segoe UI",sans-serif; overflow:auto; }
html body.auth-page::before, html body.auth-page::after { display:none; }
html body.auth-page .auth-layout { width:100%; max-width:430px; position:relative; }
html body.auth-page .auth-card { box-sizing:border-box; position:relative; width:100%; max-width:430px; margin:0; padding:28px; border:1px solid var(--ds-border,#343840); border-radius:18px; background:var(--ds-panel,#191b20); color:var(--ds-text,#f2f4f7); box-shadow:none; backdrop-filter:none; }
html body.auth-page .auth-card > img { display:block; width:56px; height:56px; margin:0; }
html body.auth-page .auth-card :is(h1,h2) { margin:24px 0; color:inherit; font-size:30px; font-weight:700; line-height:1.2; letter-spacing:normal; }
html body.auth-page .auth-card p { margin:16px 0; color:var(--ds-muted,#acb2bd); font-size:14px; line-height:1.5; }
html body.auth-page .auth-card label { display:block; margin:16px 0 8px; color:inherit; font-size:16px; font-weight:400; line-height:1.5; }
html body.auth-page .auth-card :is(input:not([type=checkbox]):not([type=hidden]),select) { box-sizing:border-box; display:block; width:100%; height:46px; min-height:46px; margin-top:8px; padding:10px 12px; border:1px solid var(--ds-input,#555c68); border-radius:8px; background:var(--ds-bg,#101114); color:inherit; font:16px system-ui,-apple-system,"Segoe UI",sans-serif; }
html body.auth-page .auth-card :is(input,select):focus-visible { outline:2px solid var(--ds-blue,#8bc5f0); outline-offset:3px; box-shadow:none; }
html body.auth-page .auth-card label:has(input[type=checkbox]) { display:flex; align-items:center; gap:8px; margin:16px 0; font-size:14px; }
html body.auth-page .auth-card input[type=checkbox] { width:14px; height:14px; margin:0; flex:0 0 14px; accent-color:var(--ds-accent,#77d8ba); }
html body.auth-page .auth-card button[type=submit] { width:100%; min-height:46px; margin:16px 0 0; padding:10px 12px; border:1px solid var(--ds-primary,#e6e9ef); border-radius:8px; background:var(--ds-primary,#e6e9ef)!important; color:var(--ds-on-primary,#171a20)!important; font:600 14px system-ui,-apple-system,"Segoe UI",sans-serif!important; box-shadow:none; transform:none; cursor:pointer; }
html body.auth-page .auth-card button:disabled { opacity:.6; cursor:not-allowed; }
html body.auth-page :is(.auth-card [data-theme-toggle],.auth-layout > .design-theme-toggle) { position:absolute; top:28px; right:28px; width:36px; min-width:36px; height:36px; min-height:36px; margin:0; padding:8px; display:grid; place-items:center; border:1px solid var(--ds-border,#343840); border-radius:10px; background:var(--ds-surface,#23262c); color:var(--ds-text,#f2f4f7); }
html body.auth-page .legal-navigation { width:100%; max-width:430px; margin:0; padding:4px 0; }
html body.auth-page .auth-layout > .legal-navigation { margin-top:16px; }
html body.auth-page .auth-card .fields { display:block; }
html body.auth-page .auth-card .actions { display:flex; flex-direction:column; gap:8px; margin:0; }
html body.auth-page .auth-card .actions > button:not([type=submit]) { width:100%; min-height:36px; margin:0; padding:8px; font-size:14px; }
html body.auth-page .auth-card .notice { padding:0; border:0; background:transparent; }
html body.auth-page .auth-card :is(.hint,.attempt-meter,.msg) { font-size:14px; line-height:1.5; margin-top:16px; }
html body.auth-page .auth-card .msg { padding:10px 12px; border:1px solid var(--ds-border,#343840); border-radius:8px; }
html body.auth-page .auth-card .error { color:var(--ds-danger,#ffb2bb); }
html body.auth-page .auth-card .info { color:var(--ds-blue,#8bc5f0); }
html body.auth-page .shell { width:100%; max-width:430px; margin:0; padding:0; }
html body.auth-page .shell > :is(.hero,#navigation), html body.auth-page .footer-credit { display:none; }
html body.auth-page #content { display:block; margin:0; }
html body.auth-page #status { font-size:14px; margin:0 0 12px; padding:0; }
html body.auth-page #status:empty { display:none; }
html body.auth-page .shell > footer { margin-top:16px; padding:0; border:0; }
@media(max-width:480px) { html body.auth-page { padding:20px; } html body.auth-page .auth-card { padding:24px; } html body.auth-page :is(.auth-card [data-theme-toggle],.auth-layout > .design-theme-toggle) { top:24px; right:24px; } }
/* End shared login design. */