/* ============================================================================
DARK THEME
----------------------------------------------------------------------------
Loaded after app.css and activated by data-theme="dark" on (set by the
inline boot script in the host document, toggled by , persisted
in localStorage under "glog-theme").
Three parts:
1. TOKENS - the hand-tuned dark palette. Everything in app.css that already
goes through var(--bg / --ink / --line / --accent / …) - the large
majority of the UI - flips over from this block alone. Edit freely.
2. GENERATED - per-rule overrides for the places where app.css hard-codes a
colour (status chips, semaphores, tinted callouts, shadows). Produced by
tools/dark-theme/gen-dark-theme.js, which remaps each literal onto a dark
surface: pale fills drop into a deep band, dark ink flips to light ink,
and hairlines move ABOVE the surface tone instead of below it. Do not
hand-edit - it is replaced wholesale between the markers. Rerun the tool
after hard-coding new colours in app.css, or just use the tokens.
3. TUNING - hand-written exceptions the generator cannot infer, e.g. a white
that sits on a photo rather than on the page. Survives regeneration.
Everything is wrapped in @media screen so printing always uses the light
sheet, whichever theme the reader has on screen.
============================================================================ */
@media screen {
/* ---------- 1. tokens ---------- */
:root[data-theme="dark"] {
color-scheme: dark; /* native controls, scrollbars, form widgets */
--bg: #1a1712;
--bg-elev: #26221c;
--ink: #f1ece2;
--ink-soft: #c2bbae;
--ink-mute: #8f8879;
--line: #383229;
--line-strong: #524a3e;
--accent: #e07a45; /* terracotta, lifted so it carries on a dark ground */
--accent-ink: #f0a473; /* links: the light-mode value is a near-black brown */
--accent-soft: #4a2c1a;
--ok: #6fb083;
--ok-soft: #1f3325;
/* Referenced in app.css only as var(--x, ), so these stay undefined in light
mode on purpose - defining them here is what makes the fallback stop firing in dark mode. */
--surface: #2f2c27; /* the tone plain #fff surfaces are mapped to below */
--surface-2: #38342d;
--paper: #26221c;
--danger: #e0705f;
--shadow-page: 0 18px 44px -20px rgba(0, 0, 0, .78), 0 2px 6px rgba(0, 0, 0, .45);
--shadow-card: 0 8px 18px -8px rgba(0, 0, 0, .62);
--paper-line: rgba(255, 255, 255, .055);
--paper-margin: rgba(224, 122, 69, .38);
--tape: rgba(228, 214, 168, .14);
}
/* The wordmark is dark green ink on transparent - it disappears against the dark ground. */
[data-theme="dark"] .brand-logo,
[data-theme="dark"] .lp-brand-logo,
[data-theme="dark"] .boot-logo,
[data-theme="dark"] .login-logo,
[data-theme="dark"] .footer-logo {
filter: brightness(1.75) saturate(.9);
}
/* The maps render their own DARK basemap style in this theme (glog-basemap-style-dark.json, picked by
basemap.js), so there is nothing left to dim here - a filter on top would only mute the labels. */
/* ---------- 2. generated ---------- */
/* >>> BEGIN GENERATED - tools/dark-theme/gen-dark-theme.js rewrites everything down to the END
marker. Hand edits here are lost on the next run; put exceptions in section 3 instead. */
/* ── app.css ── */
[data-theme="dark"] .beta-report-btn:hover {
border-color: #4c463e;
}
[data-theme="dark"] .fb-card {
box-shadow: 0 24px 70px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .fb-error {
background: #2f1c1c;
color: #e49797;
border: 1px solid #623e3e;
}
[data-theme="dark"] .fb-fab {
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.406);
}
[data-theme="dark"] .fb-fab:hover {
box-shadow: 0 14px 30px rgba(0, 0, 0, 0.493);
}
[data-theme="dark"] .fb-fab::before {
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .fb-fab::after {
box-shadow: 0 0 14px 3px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .fb-nudge {
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.319);
}
[data-theme="dark"] .onboard-card {
box-shadow: 0 24px 70px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .nav-dropdown-menu {
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.174);
}
@media (max-width: 760px) {
[data-theme="dark"] .nav-links {
box-shadow: 0 16px 28px rgba(0, 0, 0, 0.203);
}
}
[data-theme="dark"] .invite-status-active {
background: #3d784c;
}
[data-theme="dark"] .invite-status-expired {
background: #b67e28;
}
[data-theme="dark"] .invite-status-revoked {
background: #a7423a;
}
[data-theme="dark"] .invite-sent-check input {
accent-color: #9acca7;
}
[data-theme="dark"] .phase-corner-tab {
box-shadow: 0 -3px 8px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .phase-budget-spent.is-over {
color: #cf7b74;
}
[data-theme="dark"] .item.is-done {
background: #182616;
border-color: #426849;
}
[data-theme="dark"] .item.is-wip {
background: #292218;
border-color: #695943;
}
[data-theme="dark"] .item.is-na {
background: #24231f;
border-color: #55524b;
}
[data-theme="dark"] .item-important.is-important {
color: #e5b66b;
border-color: #6b5c44;
background: #2f281b;
}
[data-theme="dark"] .item.is-important {
border-color: #6f6247;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.7), 0 0 16px rgba(0, 0, 0, 0.58);
}
[data-theme="dark"] .gantt-bar.is-important {
box-shadow: 0 0 0 1.5px #fff, 0 0 0 3px rgba(0, 0, 0, 0.7), 0 0 10px 2px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .status-select.is-todo {
color: #da7f76;
border-color: #664641;
}
[data-theme="dark"] .status-select.is-wip {
color: #ebcc8b;
border-color: #6b6044;
}
[data-theme="dark"] .status-select.is-done {
color: #a6ccb1;
border-color: #426849;
}
[data-theme="dark"] .status-select.is-na {
color: #b4aea3;
border-color: #56534c;
}
[data-theme="dark"] .item-check.is-checked {
background: #3e6d4b;
border-color: #3f6e4c;
}
[data-theme="dark"] .bulk-bar-inner {
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .next-step-link:hover {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.087);
}
[data-theme="dark"] .next-step-tag.is-overdue {
color: #da7f76;
border-color: #664641;
background: #301f1c;
}
[data-theme="dark"] .next-step-tag.is-soon {
color: #ebcc8b;
border-color: #6b6044;
background: #2f281b;
}
[data-theme="dark"] .next-step-tag.is-important {
color: #e5b66b;
border-color: #6b5c44;
background: #2f281b;
}
[data-theme="dark"] .next-step-tag.is-wip {
color: #ebcc8b;
border-color: #6b6044;
background: #2d271b;
}
[data-theme="dark"] .inquiry-remove:hover {
color: #e49797;
}
[data-theme="dark"] .attachment-file .attachment-remove:hover {
color: #e49797;
}
[data-theme="dark"] .lightbox-figure img {
background: #2b2b2b;
box-shadow: 0 30px 60px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .btn-danger {
color: #e49797;
border-color: #623e3e;
}
[data-theme="dark"] .btn-danger:hover {
background: #2f1c1c;
border-color: #892424;
}
[data-theme="dark"] .toast-item {
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.203);
}
[data-theme="dark"] .hint-card {
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.232);
}
[data-theme="dark"] .comment-remove:hover {
color: #e49797;
}
[data-theme="dark"] .usage-fill.tone-warn {
background: #9e811c;
}
[data-theme="dark"] .legal-modal-card {
box-shadow: 0 24px 70px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .newsletter-modal-error {
color: #de766b;
}
[data-theme="dark"] .login-card {
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.102);
}
[data-theme="dark"] #blazor-error-ui {
background: #4d3f2b;
box-shadow: 0 -1px 8px rgba(0, 0, 0, 0.362);
}
[data-theme="dark"] .blazor-error-boundary {
background: #4d3f2b;
}
[data-theme="dark"] .cal-event.todo .cal-event-dot {
background: #db7064;
}
[data-theme="dark"] .cal-event.wip .cal-event-dot {
background: #ddb02b;
}
[data-theme="dark"] .cal-event.done .cal-event-dot {
background: #497453;
}
[data-theme="dark"] .cal-event.na .cal-event-dot {
background: #8f897b;
}
[data-theme="dark"] .status-pill.todo {
--status-color: #db7064;
background: #2f1f1c;
color: #e39b8d;
border-color: #5e423c;
}
[data-theme="dark"] .status-pill.wip {
--status-color: #ddb02b;
background: #2d281a;
color: #edd697;
border-color: #62593f;
}
[data-theme="dark"] .status-pill.done {
--status-color: #497453;
background: #1c2c1f;
color: #b5d5be;
border-color: #3e6146;
}
[data-theme="dark"] .status-pill.na {
--status-color: #8f897b;
background: #29251f;
color: #bcb8b1;
border-color: #585244;
}
[data-theme="dark"] .phase-file-doc.has-preview {
background: #2f2c27;
}
[data-theme="dark"] .sub-tier.is-featured {
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .sub-plan-tip {
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.406);
}
[data-theme="dark"] .ai-fab {
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.362);
}
[data-theme="dark"] .ai-fab:hover {
box-shadow: 0 14px 30px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .ai-sidebar {
box-shadow: -16px 0 30px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .conn-down {
background: rgba(46, 39, 27, 0.86);
}
[data-theme="dark"] .conn-down-card {
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .conn-dot {
background: #a7423a;
}
[data-theme="dark"] .usage-pill.is-exhausted {
background: #301f1c;
border-color: #62453f;
color: #df948e;
}
[data-theme="dark"] .usage-pill.is-exhausted .usage-pill-count {
color: #df948e;
}
[data-theme="dark"] .parcel-limit,
[data-theme="dark"] .ai-limit {
border: 1px solid #62453f;
background: #301f1c;
color: #df948e;
}
[data-theme="dark"] .ai-msg.from-ai .ai-msg-body {
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.087);
}
[data-theme="dark"] .ai-input {
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.058);
}
[data-theme="dark"] .ai-stop-btn {
background: #822222;
border-color: #892424;
}
[data-theme="dark"] .ai-stop-btn:hover:not(:disabled) {
background: #8c2525;
}
[data-theme="dark"] .ai-stop {
background: #822222;
}
[data-theme="dark"] .ai-stop:hover {
background: #8c2525;
}
[data-theme="dark"] .ai-switch::after {
background: #2f2c27;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .ai-advice-error {
color: #da7f76;
}
[data-theme="dark"] .item-remove:hover {
color: #e49797;
}
[data-theme="dark"] .icon-btn.item-remove:hover:not(:disabled) {
color: #e49797; border-color: #e49797;
}
[data-theme="dark"] .gantt.has-daygrid .gantt-row-track::before {
-webkit-mask-image: repeating-linear-gradient(to bottom, #2b2b2b 0, #2b2b2b 2px, transparent 2px, transparent 5px);
mask-image: repeating-linear-gradient(to bottom, #2b2b2b 0, #2b2b2b 2px, transparent 2px, transparent 5px);
}
[data-theme="dark"] .gantt-bar {
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .gantt-bar.todo {
--status-color: #db7064;
}
[data-theme="dark"] .gantt-bar.wip {
--status-color: #ddb02b;
}
[data-theme="dark"] .gantt-bar.done {
--status-color: #497453;
}
[data-theme="dark"] .gantt-bar.na {
--status-color: #8f897b;
}
[data-theme="dark"] .gantt-row:hover .gantt-bar {
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .kanban-col.status-todo {
--status-color: #db7064;
}
[data-theme="dark"] .kanban-col.status-wip {
--status-color: #ddb02b;
}
[data-theme="dark"] .kanban-col.status-done {
--status-color: #497453;
}
[data-theme="dark"] .kanban-col.status-na {
--status-color: #8f897b;
}
[data-theme="dark"] .kanban-card:hover {
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .kanban-card.is-important .kanban-card-title::after {
color: #dfb949;
}
/* Deadline + decision chips and the "zamuja" marks: the light theme's ink-on-paper reds go muddy
on dark paper, so they lift to the same hues the status dots use here. */
[data-theme="dark"] .kanban-chip.is-late {
color: #e58b7e; background: rgba(219, 112, 100, 0.16); border-color: rgba(219, 112, 100, 0.45);
}
[data-theme="dark"] .kanban-chip.is-soon {
color: #ddb02b; background: rgba(221, 176, 43, 0.16); border-color: rgba(221, 176, 43, 0.45);
}
[data-theme="dark"] .kanban-chip.is-chosen {
color: #7fae8b; background: rgba(73, 116, 83, 0.2); border-color: rgba(73, 116, 83, 0.55);
}
[data-theme="dark"] .kanban-wip {
color: #ddb02b; background: rgba(221, 176, 43, 0.12);
}
[data-theme="dark"] .gantt-bar.is-late {
box-shadow: inset 0 0 0 1.5px #e58b7e;
background-image: repeating-linear-gradient(135deg,
rgba(229, 139, 126, 0.3) 0 4px, transparent 4px 9px);
}
[data-theme="dark"] .gantt-late-chip {
color: #e58b7e; background: rgba(219, 112, 100, 0.14); border-color: rgba(219, 112, 100, 0.45);
}
[data-theme="dark"] .gantt-late-chip:hover { background: rgba(219, 112, 100, 0.24); }
[data-theme="dark"] .gantt-late-chip.active {
color: #1a1712; background: #e58b7e; border-color: #e58b7e;
}
[data-theme="dark"] .kanban-card-dragging {
box-shadow: 0 20px 40px -8px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .task-modal-card {
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .cost-status-done {
color: #98d8b2;
}
[data-theme="dark"] .budget-stat-num.is-over {
color: #cf7b74;
}
[data-theme="dark"] .budget-bar-fill.is-over {
background: #a7423a;
}
[data-theme="dark"] .cost-overbudget {
background: #301f1c;
border: 1px solid #62453f;
color: #df948e;
}
[data-theme="dark"] .budget-headroom.is-over {
color: #cf7b74;
}
[data-theme="dark"] .finance-gap.is-short {
background: #301f1c;
color: #df948e;
}
[data-theme="dark"] .finance-gap.is-ok {
background: #1b2e21;
color: #a4d7b5;
}
[data-theme="dark"] .cost-group-dot::after {
background: #2f2c27;
}
[data-theme="dark"] .rollup-bar-fill.is-over {
background: #a7423a;
}
[data-theme="dark"] .rollup-row.is-over {
background: #301f1c;
}
[data-theme="dark"] .rollup-row.is-over .rollup-label {
color: #df948e;
}
[data-theme="dark"] .rollup-alert {
color: #cf7b74;
}
[data-theme="dark"] .rollup-over {
color: #cf7b74;
}
[data-theme="dark"] .col-picker-menu {
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .btn-google {
background: #2f2c27;
color: #c3c6c9;
}
[data-theme="dark"] .btn-google:hover {
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .gchooser {
background: #2f2c27;
color: #d6d7da;
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.58);
}
[data-theme="dark"] .gchooser-head {
border-bottom: 1px solid #404752;
}
[data-theme="dark"] .gchooser-logo {
color: #b7b2a8;
}
[data-theme="dark"] .gchooser-close {
color: #b7b2a8;
}
[data-theme="dark"] .gchooser-close:hover {
color: #d6d7da;
}
[data-theme="dark"] .gchooser-sub {
color: #b7b2a8;
}
[data-theme="dark"] .gaccount {
color: #d6d7da;
}
[data-theme="dark"] .gaccount:hover {
background: #22282b;
}
[data-theme="dark"] .gaccount-avatar-plus {
background: #1f2328;
color: #b7b2a8;
}
[data-theme="dark"] .gaccount-email {
color: #b7b2a8;
}
[data-theme="dark"] .gform-field {
color: #b7b2a8;
}
[data-theme="dark"] .gform-field input {
border: 1px solid #585248;
color: #d6d7da;
}
[data-theme="dark"] .gform-field input:focus {
border-color: #495b73;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .gform-check {
color: #b7b2a8;
}
[data-theme="dark"] .gchooser-foot {
border-top: 1px solid #404752;
color: #b7b2a8;
background: #222930;
}
[data-theme="dark"] .project-card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.116);
}
[data-theme="dark"] .project-card-tools .icon-btn-danger:hover:not(:disabled) {
color: #e67973;
border-color: #a7312a;
}
[data-theme="dark"] .bookshelf-board {
background: linear-gradient(180deg, #785839 0%, #6a4d31 62%, #5c4329 100%);
box-shadow: 0 13px 22px -10px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, .12);
}
[data-theme="dark"] .shelf-book-cover {
background-color: color-mix(in srgb, var(--book-color, var(--accent)) 62%, #53321a);
box-shadow: 0 14px 22px -12px rgba(0, 0, 0, 0.7), inset 0 0 0 1px rgba(0, 0, 0, 0.362);
}
[data-theme="dark"] .shelf-book-cover:hover {
box-shadow: 0 24px 32px -14px rgba(0, 0, 0, 0.7), inset 0 0 0 1px rgba(0, 0, 0, 0.362);
}
[data-theme="dark"] .shelf-book-parcel {
border: 1px solid rgba(89, 76, 57, 0.28);
}
[data-theme="dark"] .shelf-book-tools .icon-btn-danger:hover:not(:disabled) {
background: #a3241d;
border-color: #a7312a;
}
[data-theme="dark"] .onboard-choice:hover {
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.145);
}
[data-theme="dark"] .cover-color-check svg {
filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.58));
}
[data-theme="dark"] .partner-parcel-card {
background: #2f2c27;
}
[data-theme="dark"] .partner-parcel-card:hover {
box-shadow: 0 14px 26px -10px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .partner-parcel-tape {
border: 1px solid rgba(111, 99, 71, 0.4);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .partner-parcel-thumb {
background: linear-gradient(135deg, #638438, #3a6684);
}
[data-theme="dark"] .partner-parcel-price {
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .item.reorder-dragging {
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.319);
}
[data-theme="dark"] .project-progress-fill.delivery {
background: #3a6684;
}
[data-theme="dark"] .weather-precip {
color: #8eb4cd;
}
[data-theme="dark"] .book-cover-inner .weather-widget {
border-top: 1px solid rgba(89, 76, 57, 0.16);
}
[data-theme="dark"] .book-cover-inner .weather-day {
border-color: rgba(89, 76, 57, 0.22);
}
[data-theme="dark"] .nearby-map-expand {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .nearby-pin-ico {
border: 2px solid #4c463e;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.58);
}
[data-theme="dark"] .nearby-dist {
color: #8eb4cd;
}
[data-theme="dark"] .delivery-bar-fill {
background: #3a6684;
}
[data-theme="dark"] .catalog-tab-badge.is-published {
color: #98d8b2;
background: color-mix(in srgb, #2f7e4f 16%, transparent);
}
[data-theme="dark"] .catalog-kind-badge.kind-1 {
background: #b67e28;
}
[data-theme="dark"] .catalog-kind-badge.kind-2 {
background: #a7423a;
}
[data-theme="dark"] .catalog-pub-badge.is-published {
background: #548138;
}
[data-theme="dark"] .catalog-warn {
border: 1px solid #6f6447;
background: #2e291b;
}
[data-theme="dark"] .catalog-error {
color: #dd9d99;
border: 1px solid #654040;
background: #311e1d;
}
[data-theme="dark"] .catalog-ai-error {
color: #dc8f84;
}
[data-theme="dark"] .admin-card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.116);
}
[data-theme="dark"] .admin-delete-warn {
color: #e49797;
background: #2f1c1c;
border: 1px solid #623e3e;
}
[data-theme="dark"] .user-status.is-disabled {
background: #291b18;
color: #dc8f84;
}
[data-theme="dark"] .analytics-package.tier-3 {
background: #221e14;
color: #edd297;
}
[data-theme="dark"] .kpi-card-live {
border-color: rgba(93, 121, 80, 0.5);
}
[data-theme="dark"] .live-dot {
background: #57714b;
}
[data-theme="dark"] .chart-fill.is-alt {
background: #728f63;
}
[data-theme="dark"] .chart-fill.is-bad {
background: #a85444;
}
[data-theme="dark"] .chart-fill.is-issue {
background: #a85444;
}
[data-theme="dark"] .chart-fill.is-idea {
background: #b99524;
}
[data-theme="dark"] .legend-dot.is-issue {
background: #a85444;
}
[data-theme="dark"] .legend-dot.is-idea {
background: #b99524;
}
[data-theme="dark"] .legend-dot.is-visitor {
background: #728f63;
}
[data-theme="dark"] .dist-list.is-bad .dist-fill {
background: #a85444;
}
[data-theme="dark"] .afb-badge.is-issue {
background: #291b18;
color: #dc8f84;
}
[data-theme="dark"] .afb-badge.is-idea {
background: #292518;
color: #e9d18b;
}
[data-theme="dark"] .afb-flag-warn {
color: #dc8f84;
}
[data-theme="dark"] .ko-combo-list {
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.203);
}
[data-theme="dark"] .parcel-error {
border: 1px solid #623e3e;
border-left: 3px solid #892424;
background: #2f1c1c;
color: #e49797;
}
[data-theme="dark"] .parcel-li-warning {
color: #edcb98;
background: #312a1d;
border: 1px solid #645940;
}
[data-theme="dark"] .parcel-adjacent-item {
border-left: 3px solid #4a5a73;
}
[data-theme="dark"] .parcel-map {
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.174);
background: linear-gradient(rgba(122,50,20,.05) 1px, transparent 1px) 0 0 / 26px 26px,
linear-gradient(90deg, rgba(122,50,20,.05) 1px, transparent 1px) 0 0 / 26px 26px,
#322a1d;
}
[data-theme="dark"] .parcel-progress-bar {
background: linear-gradient(90deg, var(--accent, #2563eb), #6797e6);
}
[data-theme="dark"] .report-ai-summary {
border: 1px solid #5f4f3d;
background: linear-gradient(180deg, #342b1e, #2f271c);
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.087);
}
[data-theme="dark"] .report-ai-summary-item dt {
color: #ebcc8b;
}
[data-theme="dark"] .report-ai-summary-item dd {
color: #d8d3ce;
}
[data-theme="dark"] .report-score-beta {
color: #d0b890;
background: #292318;
border: 1px solid #61563e;
}
[data-theme="dark"] .report-score-num {
color: #d8d3ce;
}
[data-theme="dark"] .report-score--good .report-score-dot {
background: #39824a;
}
[data-theme="dark"] .report-score--good .report-score-label {
color: #90ce9e;
}
[data-theme="dark"] .report-score--warn .report-score-dot {
background: #c39520;
}
[data-theme="dark"] .report-score--warn .report-score-label {
color: #ebcc8b;
}
[data-theme="dark"] .report-score--bad .report-score-dot {
background: #b13428;
}
[data-theme="dark"] .report-score--bad .report-score-label {
color: #de766b;
}
[data-theme="dark"] .report-score-bar {
background: linear-gradient(90deg, #be4d3c 0%, #e1bd6f 55%, #498e5b 100%);
}
[data-theme="dark"] .report-score-marker {
background: #484039;
}
[data-theme="dark"] .report-ai-checklist {
background: #2f2c27;
}
[data-theme="dark"] .report-ai-check-list li {
color: #d8d3ce;
}
[data-theme="dark"] .report-ai-check-box {
background: #2f2c27;
}
[data-theme="dark"] .report-ai-check-box:checked::after {
border: solid #4c463e;
}
[data-theme="dark"] .report-info-notes {
background: #322a1d;
}
[data-theme="dark"] .report-info-h {
color: #b8b0a9;
}
[data-theme="dark"] .energy-potentials {
background: linear-gradient(180deg, #322a1e, #2e261b);
}
[data-theme="dark"] .energy-card {
background: #352d1f;
}
[data-theme="dark"] .energy-card-h {
color: #b8b0a9;
}
[data-theme="dark"] .energy-val {
color: #df8d68;
}
[data-theme="dark"] .noise-scale-h {
color: #b8b0a9;
}
[data-theme="dark"] .noise-scale li {
background: #2e261b;
}
[data-theme="dark"] .noise-db {
color: #d8d3ce;
}
[data-theme="dark"] .parcel-act-badge.is-valid {
color: #93e9ab;
}
[data-theme="dark"] .parcel-util-dot {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.217);
}
[data-theme="dark"] .parcel-util-badge.is-on {
color: #93e9ab;
}
[data-theme="dark"] .parcel-regime-natura2000 {
color: #93e9ab;
}
[data-theme="dark"] .parcel-regime-epo {
color: #c8ed97;
}
[data-theme="dark"] .parcel-regime-arheologija {
color: #ea9f86;
}
[data-theme="dark"] .parcel-regime-dediscina {
color: #ebb08c;
}
[data-theme="dark"] .parcel-legend-swatch {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.116);
}
[data-theme="dark"] .p3d-canvas-wrap {
background: #1a232c;
}
[data-theme="dark"] .p3d-canvas-loading {
background: rgba(26, 35, 44, 0.85);
}
[data-theme="dark"] .p3d-render-img {
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .p3d-render-progress-fill {
background: linear-gradient(90deg, #5095e2, #2dc375);
}
[data-theme="dark"] .p3d-render-bar .btn-primary {
background: #2372d6;
border-color: #485a71;
}
[data-theme="dark"] .p3d-render-bar .btn-primary:hover:not(:disabled) {
background: #2866b7;
}
[data-theme="dark"] .p3d-render-loader-ring {
border-top-color: #44556a;
}
[data-theme="dark"] .p3d-render-loader-text {
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .p3d-render-setup .btn-primary {
background: #2372d6;
border-color: #485a71;
}
[data-theme="dark"] .p3d-render-setup .btn-primary:hover:not(:disabled):not(.disabled) {
background: #2866b7;
}
[data-theme="dark"] .p3d-render-bg-preview {
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .p3d-render-alignbar {
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.58);
}
[data-theme="dark"] .p3d-render-alignbar .btn-primary {
background: #2372d6;
border-color: #485a71;
}
[data-theme="dark"] .p3d-render-alignbar .btn-primary:hover:not(:disabled) {
background: #2866b7;
}
[data-theme="dark"] .p3d-export-pop {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .p3d-cachebanner {
background: #2f281c;
border: 1px solid #655a41;
color: #ebd19f;
}
[data-theme="dark"] .p3d-askreal-card {
box-shadow: 0 18px 50px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .p3d-winedit-remove {
border: 1px solid rgba(103, 71, 66, 0.55);
}
[data-theme="dark"] .p3d-winedit-remove:hover {
background: rgba(225, 90, 74, 0.18);
}
[data-theme="dark"] select.p3d-intedit-name option {
background: #5e3f12;
}
[data-theme="dark"] .p3d-import-sel {
background: rgba(35, 91, 215, 0.28);
border: 1px solid rgba(64, 78, 100, 0.5);
}
[data-theme="dark"] .p3d-import-el.sel {
background: rgba(35, 91, 215, 0.3);
}
[data-theme="dark"] .p3d-furncat-btn.is-open,
[data-theme="dark"] .p3d-furncat-btn.has-armed,
[data-theme="dark"] .p3d-furncat:hover > .p3d-furncat-btn {
color: #f7ebd3;
}
[data-theme="dark"] .p3d-furnmenu {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .p3d-furnmenu-item.is-active {
color: #f7ebd3;
}
[data-theme="dark"] .p3d-ai-hl {
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.058);
}
[data-theme="dark"] .p3d-hint kbd {
color: #f7e8d0;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .p3d-opn-ai-msg {
color: #e67973;
}
[data-theme="dark"] .p3d-opn-row.is-ok {
background: #1c2f1f;
border-color: #3e6147;
color: #a4d8b1;
}
[data-theme="dark"] .p3d-opn-row.is-bad {
background: #311e1d;
border-color: #5f3f3d;
color: #e67973;
}
[data-theme="dark"] .p3d-solar-bar-fill {
background: linear-gradient(to top, #dc9726, #e4bf5b);
}
[data-theme="dark"] .p3d-util-leg .p3d-util-dot {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.217);
}
[data-theme="dark"] .p3d-compass {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .p3d-compass-n {
color: #de766b;
}
[data-theme="dark"] .p3d-compass-needle {
border-bottom: 17px solid #bc3c2f;
}
[data-theme="dark"] .p3d-compass-needle::after {
border-top: 17px solid #52585d;
}
[data-theme="dark"] .p3d-sun-slider {
accent-color: #debb42;
}
[data-theme="dark"] .p3d-menu-pop {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .p3d-mitem.is-active {
color: #f7ebd3;
}
[data-theme="dark"] .p3d-mrow select {
background: #5f4611;
}
[data-theme="dark"] .p3d-mrow select option {
background: #5f4611;
}
[data-theme="dark"] .p3d-mapcard {
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.362);
}
[data-theme="dark"] .p3d-tree-node.is-sel {
color: #f7ebd3;
}
[data-theme="dark"] .p3d-dial {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .p3d-zdial {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .cookie-consent {
box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .lp-header {
background: rgba(46, 39, 27, 0.85);
}
[data-theme="dark"] .lp-hero-card {
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.145);
}
[data-theme="dark"] .ic-divider {
background: #2f2c27;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.29);
}
[data-theme="dark"] .ic-handle {
background: #2f2c27;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .img-compare:focus-within .ic-handle {
box-shadow: 0 0 0 3px var(--accent-soft), 0 2px 10px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .lp-feature:hover {
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.102);
}
[data-theme="dark"] .lp-cta-modal {
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.406);
}
[data-theme="dark"] .lp-cta-modal-option.is-loka {
background: #45362a;
border-color: #6d5740;
}
[data-theme="dark"] .lp-cta-modal-loka-btn {
background: #bd551f;
}
[data-theme="dark"] .lp-cta-modal-loka-btn:hover {
background: #a3491d;
}
[data-theme="dark"] .lp-parcel-loka-link:hover {
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .lp-parcel-loka {
background: radial-gradient(120% 140% at 0% 0%, rgba(180, 83, 39, 0.35) 0%, transparent 55%),
linear-gradient(135deg, #523623 0%, #383838 100%);
border: 1px solid rgba(190, 92, 48, 0.35);
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.406);
}
[data-theme="dark"] .lp-parcel-loka-glow {
background: radial-gradient(circle, rgba(180, 83, 39, 0.45) 0%, transparent 65%);
}
[data-theme="dark"] .lp-parcel-loka-badge {
background: rgba(37, 29, 22, 0.14);
border: 1px solid rgba(93, 74, 59, 0.28);
}
[data-theme="dark"] .lp-parcel-loka-btn:hover {
background: #cc5c26;
box-shadow: 0 10px 26px rgba(0, 0, 0, 0.609);
}
[data-theme="dark"] .lp-newsletter-input {
border: 1px solid rgba(86, 75, 55, 0.25);
background: rgba(50, 42, 29, 0.08);
}
[data-theme="dark"] .lp-newsletter-input:focus {
background: rgba(50, 42, 29, 0.14);
}
/* One note colour for every card (matches the single yellow in the light theme). */
[data-theme="dark"] .contractor-card {
background: #222114;
box-shadow: 2px 7px 16px -7px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .contractor-card:hover {
box-shadow: 0 16px 30px -12px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .contractor-edit-inline .task-modal-card {
background: #222114;
box-shadow: 3px 9px 20px -7px rgba(0, 0, 0, 0.58);
}
/* Contracts inside a (dark) contractor sticky note: lift the row off the note and brighten the
signed/unsigned accents, which are tuned for the light pastel backgrounds. */
[data-theme="dark"] .contractor-contracts {
border-top-color: rgba(200, 175, 130, 0.22);
}
[data-theme="dark"] .contract-row {
background: rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .contract-row.is-signed {
border-left-color: #6dbb6f;
}
[data-theme="dark"] .contract-row.is-unsigned {
border-left-color: #d8ab3c;
}
[data-theme="dark"] .contract-badge.is-signed {
background: rgba(109, 187, 111, 0.18);
color: #8fd191;
}
[data-theme="dark"] .contract-badge.is-unsigned {
background: rgba(216, 171, 60, 0.18);
color: #e0bd63;
}
/* Bare action icons: the light-theme hover wash is a black tint, invisible on a dark note. */
[data-theme="dark"] .contract-icon:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .contract-icon-danger:hover {
color: #e08a8a;
}
[data-theme="dark"] .parcel-pick-btn {
border: 1px solid #60523e;
background: #2f2c27;
color: #e5bc97;
}
[data-theme="dark"] .parcel-pick-btn:hover {
background: #32291d;
border-color: #bf6130;
color: #e38e63;
}
[data-theme="dark"] .lp-parcel-map-cta {
border: 1px solid #655141;
background: linear-gradient(180deg, #33291e, #2e251b);
color: #eab696;
}
[data-theme="dark"] .lp-parcel-map-cta:hover {
border-color: #bf6130;
}
[data-theme="dark"] .lp-parcel-map-cta-ic {
background: #bd551f;
}
[data-theme="dark"] .lp-parcel-map-cta-txt span {
color: #bfa693;
}
[data-theme="dark"] .lp-parcel-map-cta-go {
color: #e38e63;
}
[data-theme="dark"] .lp-parcel-or {
color: #a79989;
}
[data-theme="dark"] .lp-parcel-or::before,
[data-theme="dark"] .lp-parcel-or::after {
background: #251f16;
}
[data-theme="dark"] .mappick {
background: #2f2c27;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .mappick-head {
border-bottom: 1px solid #5b4e3a;
}
[data-theme="dark"] .mappick-head h3 {
color: #d8d3ce;
}
[data-theme="dark"] .mappick-x {
color: #aca295;
}
[data-theme="dark"] .mappick-x:hover {
background: #2d261a;
color: #d8d3ce;
}
[data-theme="dark"] .mappick-search-ic {
color: #a88f75;
}
[data-theme="dark"] .mappick-search-input {
border: 1px solid #60523e;
}
[data-theme="dark"] .mappick-search-input:focus {
border-color: #bf6130;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .mappick-suggest {
background: #2f2c27;
border: 1px solid #5e503c;
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.217);
}
[data-theme="dark"] .mappick-suggest-opt:hover {
background: #30271c;
}
[data-theme="dark"] .mappick-suggest-empty {
color: #a79989;
}
[data-theme="dark"] .mappick-map {
border: 1px solid #5e503c;
background: #1f272c;
}
[data-theme="dark"] .mappick-map-fail {
border: 1px solid #5e503c;
background: #322a1d;
color: #c5bdb3;
}
[data-theme="dark"] .mappick-fs-btn {
background: #2f2c27;
border: 1px solid #60523e;
color: #c5bdb3;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .mappick-fs-btn:hover {
background: #30281c;
color: #d8d3ce;
}
[data-theme="dark"] .mappick-result-item {
background: #30281c;
}
[data-theme="dark"] .mappick-result-k {
color: #a79989;
}
[data-theme="dark"] .mappick-result-v {
color: #d8d3ce;
}
[data-theme="dark"] .mappick-empty,
[data-theme="dark"] .mappick-busy {
color: #aca295;
}
[data-theme="dark"] .mappick-ok {
color: #97d99b;
}
[data-theme="dark"] .mappick-foot {
border-top: 1px solid #5b4e3a;
}
[data-theme="dark"] .mappick-cancel {
background: #2c261a;
color: #c5bdb3;
}
[data-theme="dark"] .mappick-cancel:hover {
background: #262016;
}
[data-theme="dark"] .mappick-pin {
color: #e38e63;
filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.507));
}
[data-theme="dark"] .mappick--inline {
border: 1px solid #5e503c;
}
[data-theme="dark"] .mappick--inline.mappick--fullscreen {
background: #2f2c27;
}
[data-theme="dark"] .kp {
border: 1px solid #3e4a56;
background: #2f2c27;
}
[data-theme="dark"] .kp-eyebrow {
color: #9ca2ac;
}
[data-theme="dark"] .kp-head p {
color: #9ca2ac;
}
[data-theme="dark"] .kp-field label {
color: #b8c0ce;
}
[data-theme="dark"] .kp-field input,
[data-theme="dark"] .kp-field select {
border: 1px solid #444b56;
}
[data-theme="dark"] .kp-unit span {
color: #9ca2ac;
}
[data-theme="dark"] .kp-oprema-lbl {
color: #b8c0ce;
}
[data-theme="dark"] .kp-error {
color: #e67070;
}
[data-theme="dark"] .kp-table th,
[data-theme="dark"] .kp-table td {
border-bottom: 1px solid #384857;
}
[data-theme="dark"] .kp-table thead th {
color: #9ca2ac;
}
[data-theme="dark"] .kp-table tfoot td {
border-top: 2px solid #444b56;
}
[data-theme="dark"] .kp-note {
color: #ebc98e;
background: #32291e;
border: 1px solid #5e4f3c;
}
[data-theme="dark"] .kp-source {
color: #9ca2ac;
}
[data-theme="dark"] .kp-basis {
color: #9ca2ac;
}
[data-theme="dark"] .parcel-rule-src {
color: #9ca2ac;
}
[data-theme="dark"] .price-trend.is-up {
color: #a6ccb1;
}
[data-theme="dark"] .price-trend.is-down {
color: #cf7b74;
background: #301f1c;
}
[data-theme="dark"] .price-tip {
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.319);
}
[data-theme="dark"] .price-tip-key.is-avg::before {
background: rgba(50, 42, 29, 0.55);
}
[data-theme="dark"] .gauge-val.tone-good {
color: #a6ccb1;
}
[data-theme="dark"] .gauge-val.tone-warn {
color: #ebcc8b;
}
[data-theme="dark"] .gauge-val.tone-bad {
color: #cf7b74;
}
[data-theme="dark"] .gauge-zone.tone-warn {
background: rgba(177, 132, 35, 0.5);
}
[data-theme="dark"] .gauge-zone.tone-bad {
background: rgba(167, 66, 58, 0.48);
}
[data-theme="dark"] .gauge-legend .tone-warn {
background: rgba(177, 132, 35, 0.65);
}
[data-theme="dark"] .gauge-legend .tone-bad {
background: rgba(167, 66, 58, 0.62);
}
[data-theme="dark"] .tone-chip.tone-good {
color: #a6ccb1;
}
[data-theme="dark"] .tone-chip.tone-good::before {
background: #3e6d4b;
}
[data-theme="dark"] .tone-chip.tone-warn {
color: #ebcc8b;
background: #2f281b;
}
[data-theme="dark"] .tone-chip.tone-warn::before {
background: #b18423;
}
[data-theme="dark"] .tone-chip.tone-bad {
color: #cf7b74;
background: #301f1c;
}
[data-theme="dark"] .tone-chip.tone-bad::before {
background: #a7423a;
}
[data-theme="dark"] .parcel-rule-srcs {
color: #9ca2ac;
}
[data-theme="dark"] .sub-voucher {
background: #2f2c27;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.043);
}
[data-theme="dark"] .sub-voucher-msg.is-ok {
background: #1b2e1b;
color: #a4d8a4;
}
[data-theme="dark"] .sub-voucher-msg.is-err {
background: #2f1e1c;
color: #dd8484;
}
[data-theme="dark"] .sub-referral {
background: #2f2c27;
}
[data-theme="dark"] .admin-form-card {
background: #2f2c27;
}
[data-theme="dark"] .admin-form-msg {
color: #a4d8a4;
}
[data-theme="dark"] .trial-banner-urgent {
background: #2b2019;
}
[data-theme="dark"] .lp-plan {
background: #2f2c27;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.058);
}
[data-theme="dark"] .lp-plan.is-featured {
box-shadow: 0 6px 22px rgba(0, 0, 0, 0.189);
}
[data-theme="dark"] .lp-plan-cert {
box-shadow: 0 5px 14px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .paywall-card {
box-shadow: 0 18px 50px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .sub-downgrade-notice {
background: #31281d;
}
[data-theme="dark"] .sub-pending-notice {
background: #2f1e1c;
}
[data-theme="dark"] .sub-modal {
background: #2f2c27;
box-shadow: 0 18px 50px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .sub-buy-qr img {
background: #2f2c27;
}
[data-theme="dark"] .inv-row {
background: #2f2c27;
}
[data-theme="dark"] .inv-badge-off {
background: #2c251a;
}
[data-theme="dark"] .project-card-readonly {
color: #dc8f84;
background: #291b18;
}
[data-theme="dark"] .sub-controls {
background: #2f2c27;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.043);
}
[data-theme="dark"] .journal-search-results {
box-shadow: 0 14px 32px rgba(0, 0, 0, 0.29);
}
[data-theme="dark"] .journal-add-pop {
box-shadow: 0 16px 34px rgba(0, 0, 0, 0.319);
}
[data-theme="dark"] .book-cover-inner {
background-color: color-mix(in srgb, var(--book-color, var(--accent)) 58%, #53321a);
background-image: radial-gradient(130% 95% at 78% -12%, rgba(255, 255, 255, .09), transparent 52%),
radial-gradient(42% 36% at 18% 28%, rgba(0, 0, 0, .18), transparent 70%),
radial-gradient(46% 42% at 76% 62%, rgba(0, 0, 0, .2), transparent 70%),
radial-gradient(34% 30% at 52% 92%, rgba(255, 255, 255, .05), transparent 70%),
repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, .05) 0 1px, transparent 1px 3px),
repeating-linear-gradient(115deg, rgba(0, 0, 0, .035) 0 2px, transparent 2px 6px),
linear-gradient(135deg, color-mix(in srgb, var(--book-color, var(--accent)) 74%, #57341b), color-mix(in srgb, var(--book-color, var(--accent)) 48%, #523017));
box-shadow: 7px 0 0 -3px #efe4cf, 10px 2px 8px -3px rgba(0, 0, 0, 0.464),
12px 0 0 -6px #e6dbc4, 15px 3px 9px -6px rgba(0, 0, 0, 0.377),
0 26px 52px -22px rgba(0, 0, 0, 0.7), inset 0 0 90px rgba(0, 0, 0, 0.493);
}
[data-theme="dark"] .book-cover-reset {
border: 1px solid rgba(89, 76, 57, 0.3);
}
[data-theme="dark"] .book-cover-reset:hover {
border-color: rgba(89, 76, 57, 0.65);
}
[data-theme="dark"] .book-cover-parcel-cta {
box-shadow: 0 12px 24px -12px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .book-cover-parcel {
background: #2f2c27;
border: .45rem solid #4c463e;
box-shadow: 0 16px 30px -12px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .book-cover-parcel-map {
background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 17px),
repeating-linear-gradient(90deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 17px),
linear-gradient(135deg, #b7c9a4, #90ac73 55%, #759660);
}
[data-theme="dark"] .parcel-outline-svg {
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.7));
}
[data-theme="dark"] .book-cover-parcel-clip {
color: #8c919a;
filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.58));
}
[data-theme="dark"] .cover-photo.is-doc {
background: #2f2c27;
}
[data-theme="dark"] .cover-photo.cover-photo-empty {
border: 2px dashed rgba(89, 76, 57, 0.5);
}
[data-theme="dark"] .cover-photo.cover-photo-empty:hover {
border-color: rgba(89, 76, 57, 0.8);
}
[data-theme="dark"] .cover-hero {
background: #2f2c27;
box-shadow: 3px 10px 24px -8px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .cover-hero.cover-hero-empty {
border: 2px dashed rgba(89, 76, 57, 0.5);
}
[data-theme="dark"] .cover-hero.cover-hero-empty:hover {
border-color: rgba(89, 76, 57, 0.85);
}
[data-theme="dark"] .cover-hero-tape {
border: 1px solid rgba(111, 99, 71, 0.4);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .cover-hero-btn-danger:hover {
background: #a3241d;
border-color: #a7312a;
}
[data-theme="dark"] .journal-bookmark.journal-bookmark-ai {
background: linear-gradient(135deg, var(--accent), var(--accent-ink)) padding-box,
linear-gradient(120deg, #dc2a2a, #dc7e28, #dec037, #49a053, #3184c8, #7f43be, #dc2a2a) border-box;
}
[data-theme="dark"] .journal-bookmark.journal-bookmark-ai:hover {
background: linear-gradient(135deg, var(--accent-ink), var(--accent)) padding-box,
linear-gradient(120deg, #dc2a2a, #dc7e28, #dec037, #49a053, #3184c8, #7f43be, #dc2a2a) border-box;
}
[data-theme="dark"] .journal-bookmark.journal-bookmark-ai.is-current {
background: linear-gradient(135deg, var(--accent-ink), var(--accent)) padding-box,
linear-gradient(120deg, #dc2a2a, #dc7e28, #dec037, #49a053, #3184c8, #7f43be, #dc2a2a) border-box;
}
[data-theme="dark"] .journal-page.journal-page-spread {
box-shadow: var(--shadow-page),
0 26px 42px -26px rgba(0, 0, 0, 0.7),
-6px 0 0 -3px var(--bg-elev), -8px 1px 6px -3px rgba(0, 0, 0, 0.435),
6px 0 0 -3px var(--bg-elev), 8px 1px 6px -3px rgba(0, 0, 0, 0.435),
-11px 0 0 -6px var(--bg-elev), -13px 2px 7px -6px rgba(0, 0, 0, 0.348),
11px 0 0 -6px var(--bg-elev), 13px 2px 7px -6px rgba(0, 0, 0, 0.348);
}
[data-theme="dark"] .journal-spread-rmargin {
background: rgba(180, 83, 39, 0.22);
}
[data-theme="dark"] .cover-photo {
background: #2f2c27;
box-shadow: 3px 9px 20px -7px rgba(0, 0, 0, 0.7);
}
[data-theme="dark"] .cover-photo-tape {
border: 1px solid rgba(111, 99, 71, 0.4);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.261);
}
[data-theme="dark"] .parcel-report-cta:hover {
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .lp-hero-card::before {
border: 1px solid rgba(111, 99, 71, 0.4);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.217);
}
[data-theme="dark"] .journal-book-cover .next-step-link {
border-bottom: 1px dotted rgba(89, 76, 57, 0.16);
}
[data-theme="dark"] .book-cover-progress-fill {
background: linear-gradient(90deg, var(--accent-soft), #2f2c27);
}
[data-theme="dark"] .book-cover-inner::after {
border: 2px dashed rgba(89, 76, 57, 0.26);
}
[data-theme="dark"] .book-cover-eyebrow {
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.507);
}
[data-theme="dark"] .book-cover-title {
border-bottom: 1px solid rgba(89, 76, 57, 0.32);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.58);
}
[data-theme="dark"] .book-cover-lead {
border-bottom: 1px dashed rgba(89, 76, 57, 0.22);
}
[data-theme="dark"] .book-cover-type {
border: 1px solid rgba(89, 76, 57, 0.4);
}
[data-theme="dark"] .journal-page {
box-shadow: var(--shadow-page),
6px 0 0 -3px var(--bg-elev), 8px 1px 6px -3px rgba(0, 0, 0, 0.435),
11px 0 0 -6px var(--bg-elev), 13px 2px 7px -6px rgba(0, 0, 0, 0.348);
}
[data-theme="dark"] .phase-file-card {
background: #2f2c27;
}
[data-theme="dark"] .phase-file-card:hover {
box-shadow: 0 14px 26px -10px rgba(0, 0, 0, 0.652);
}
[data-theme="dark"] .phase-file-tape {
border: 1px solid rgba(111, 99, 71, 0.4);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.174);
}
[data-theme="dark"] .journal-page.is-file-dragging .phase-drop-overlay {
background: color-mix(in srgb, var(--accent) 10%, rgba(50, 42, 29, 0.5));
}
[data-theme="dark"] .phase-drop-overlay-card {
background: rgba(50, 42, 29, 0.98);
box-shadow: 0 16px 34px rgba(0, 0, 0, 0.435);
}
[data-theme="dark"] .cms-card:hover {
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.087);
}
[data-theme="dark"] .cms-badge.is-pub {
color: #9ee4cc;
background: color-mix(in srgb, #227b5d 14%, transparent);
}
[data-theme="dark"] .cms-quill {
background: #2f2c27;
}
[data-theme="dark"] .theme-toggle-knob {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.507);
}
/* <<< END GENERATED */
/* ---------- 3. hand tuning ----------
The generated pass above reads a colour's ROLE from its property, which is right almost
everywhere but cannot know that a given white sits on top of something that was already dark in
light mode. These are those cases. Keep new exceptions here, below the generated block. */
/* Switch knobs ride on a coloured track, so they stay light in both themes. */
[data-theme="dark"] .ai-switch::after,
[data-theme="dark"] .cost-group-dot::after {
background: #e9e3d7;
}
/* Before/after slider chrome sits on the photo, not on the page. */
[data-theme="dark"] .ic-divider,
[data-theme="dark"] .ic-handle {
background: #fff;
}
/* The key caps in the 3D view's tips strip sit on a dark pill over the scene - in BOTH themes. Their
cap stays white, so the generated pass flipping their glyphs to cream left white-on-white keys. */
[data-theme="dark"] .p3d-hint kbd {
color: #1f1300;
}
/* Inverted panels: `background: var(--ink)` blocks whose inner text is hard-coded cream/white. The
token flip alone would turn the panel LIGHT and leave that text unreadable, so in dark mode they
stay dark - pushed below the page tone so they still read as a distinct block. */
[data-theme="dark"] .lp-newsletter-card,
[data-theme="dark"] .sub-plan-tip,
[data-theme="dark"] .price-tip,
[data-theme="dark"] .cover-photo-unpin {
background: #0e0c09;
}
[data-theme="dark"] .lp-newsletter-card,
[data-theme="dark"] .lp-newsletter-copy h2,
[data-theme="dark"] .lp-newsletter-input {
color: var(--ink); /* light mode uses var(--bg), which is dark ink on the inverted panel */
}
/* Pill inside the accent-coloured beta banner - the banner stays terracotta in dark mode. */
[data-theme="dark"] .beta-report-btn {
background: rgba(255, 255, 255, .16);
border-color: rgba(255, 255, 255, .45);
}
[data-theme="dark"] .beta-report-btn:hover {
background: rgba(255, 255, 255, .28);
border-color: #fff;
}
/* d3 paints the cost charts with inline fills, so the axis/legend text needs !important to
follow the theme (the series colours are categorical and read fine on either ground). */
[data-theme="dark"] #cost-chart-line text,
[data-theme="dark"] #cost-chart-pie text,
[data-theme="dark"] #cost-chart-bar text {
fill: var(--ink-soft) !important;
}
[data-theme="dark"] #cost-chart-line .domain,
[data-theme="dark"] #cost-chart-line .tick line,
[data-theme="dark"] #cost-chart-pie .domain,
[data-theme="dark"] #cost-chart-pie .tick line,
[data-theme="dark"] #cost-chart-bar .domain,
[data-theme="dark"] #cost-chart-bar .tick line {
stroke: var(--line-strong);
}
/* One-off inline style on the API-token reveal (Profile.razor). */
[data-theme="dark"] .profile-token-reveal {
background: #2c2513 !important;
border-color: #6b5510 !important;
}
/* Učilnica (UcilnicaModal.razor). The structural parts already ride theme tokens, so only the few
literal colours need a dark counterpart. The TEMPERATURE scale is deliberately NOT touched: those
fills arrive inline from C# (HeatPumpModel/TempColor) and are a legend - blue must stay cold and
ochre must stay warm in both themes, or the reader has to relearn the picture. */
[data-theme="dark"] .p3d-uc-sky { fill: #2a3a4d; }
[data-theme="dark"] .p3d-uc-earth { fill: #3a3227; }
[data-theme="dark"] .p3d-uc-probe { stroke: #cfc8bb; }
[data-theme="dark"] .p3d-uc-pipe.is-cool { stroke: #6f93bd; }
[data-theme="dark"] .p3d-uc-pipe.is-cold { stroke: #5b83c4; }
[data-theme="dark"] .p3d-uc-arrow.is-cold { stroke: #5b83c4; }
[data-theme="dark"] .p3d-uc-ahf.is-cold { fill: #5b83c4; }
[data-theme="dark"] .p3d-uc-frost rect { fill: #22344a; stroke: #5b83c4; }
[data-theme="dark"] .p3d-uc-frost text { fill: #bcd4ef; }
/* Učilnica: the four envelope subjects. Same rule as above - the structure rides tokens, so only the
literal colours need a counterpart, and only where a colour would either glare (a pale material fill
on a dark card) or sink into the ground (the dark blue of the winter sun). The WARM/COLD pairing is
preserved in both themes: whatever else moves, red stays summer and blue stays winter. */
[data-theme="dark"] .p3d-uc-layer.is-plaster { fill: #4a453c; }
[data-theme="dark"] .p3d-uc-layer.is-block { fill: #5c4a37; }
[data-theme="dark"] .p3d-uc-layer.is-ins { fill: #6e6438; }
/* Brighter than the tank's glass on purpose: this pane has the sun on it, and the shaded part of it is
painted over the top in near-black. Against the old #2f4a63 the shadow had nowhere darker to go and
the one thing the drawing is about disappeared in the dark theme. */
[data-theme="dark"] .p3d-uc-window { fill: #4a7ba8; stroke: #8db4e0; }
[data-theme="dark"] .p3d-uc-ray.is-winter { stroke: #5b83c4; }
[data-theme="dark"] .p3d-uc-hit.is-winter { stroke: #5b83c4; }
[data-theme="dark"] .p3d-uc-walltx.is-winter { fill: #5b83c4; }
[data-theme="dark"] .p3d-uc-shaded { fill: #0e0b07; opacity: .6; }
[data-theme="dark"] .p3d-uc-curve.is-good, [data-theme="dark"] .p3d-uc-key.is-good { stroke: #6aa17a; }
[data-theme="dark"] .p3d-uc-tank { fill: #2f4a63; }
[data-theme="dark"] .p3d-uc-roof, [data-theme="dark"] .p3d-uc-eave { fill: #7a3d2a; }
[data-theme="dark"] .p3d-uc-soil { fill: #2a2118; }
/* The two exchanger streams are the one pair here a stylesheet cannot reach: their colour is a
gradient computed from the efficiency slider, so it is written into the drawing. The mid-tone red
and blue chosen there carry on this background too - which is why there is no override for them. */
} /* @media screen */