/* Local fonts keep initial rendering independent of external requests. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/inter-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-024F,U+2000-206F,U+20A0-20CF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/inter-cyrillic-wght-normal.woff2') format('woff2'); unicode-range: U+0400-052F; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/jetbrains-mono-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-024F,U+2000-206F,U+20A0-20CF; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/jetbrains-mono-cyrillic-wght-normal.woff2') format('woff2'); unicode-range: U+0400-052F; }
/* Shared default for native elements; component rules retain intentional transparent edges. */
:where(body, body *) { border-color: var(--line); }
/* Preserve the original main content layout; sidebar follows the user-approved reference. */
body {
  background-image: radial-gradient(ellipse 56.25rem 25rem at 38% -20%, color-mix(in srgb, var(--accent) 2.35%, transparent), transparent 72%);
}
.sidenav { background: var(--bg-2); padding: 1.9375rem 1.1875rem 1.125rem; gap: 0; }
.sidenav > * { flex-shrink: 0; }
.sidenav-top { padding: 0 0.5rem; margin: 0; border: 0; min-height: 2.3125rem; }
.sidenav-brand { gap: 0.625rem; }
.sidenav .brand-icon { width: 2.3125rem; height: 2.3125rem; border-radius: 0.6875rem; }
.sidenav #sn-group-main, .sidenav #sn-group-admin { display: grid; gap: 0.3125rem; }
.sidenav-item { min-height: 2.5rem; padding: 0.8125rem; gap: 0.75rem; border-radius: 0.5rem; font-size: 0.75rem; line-height: 1.2; }
.sidenav-item .sn-icon { width: 1.1875rem; height: 1.1875rem; opacity: 1; }
.bp-nav-caption, .sidenav-group-title { margin: 0 0.8125rem 0.75rem; padding: 0; color: var(--nav-caption); font-size: 0.625rem; line-height: 1.3; letter-spacing: 0.1rem; font-weight: 600; }
.bp-nav-caption { margin-top: 2.125rem; }
.sidenav-group-title { margin: 1.5625rem 0.8125rem 0.75rem; padding-top: 1.4375rem; border-top: 1px solid var(--line); }
.sidenav .sn-count { min-width: 0; margin-left: auto; border-radius: 0.25rem; padding: 0.125rem 0.3125rem; font-size: 0.625rem; line-height: 1.2; font-weight: 500; background: var(--badge-bg); color: var(--badge-text); }
.sidenav .active .sn-count { background: color-mix(in srgb, var(--bg) 9.02%, transparent); color: var(--text-on-accent); }
.sidenav-item.active { background: var(--accent); color: var(--text-on-accent); font-weight: 650; }
.sidenav-item.active::before { display: none; }
.sidenav-item.active:hover { color: var(--text-on-accent); background: var(--accent-hover); }
.sidenav-brand .brand-name { font-size: 1.0625rem; font-weight: 900; letter-spacing: -.8px; }
.brand-name .brand-pay { color: var(--accent); }
.brand-icon { background: var(--grad-brand); box-shadow: none; }
.brand-icon > svg { width: 100%; height: 100%; display: block; }
.project-card { background: var(--project-surface); border-color: var(--line); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--white) 1.18%, transparent), 0 0.5rem 2rem color-mix(in srgb, var(--ink) 7.84%, transparent); }
.project-card:hover { border-color: var(--line); }
.project-title { min-width: 0; max-width: 100%; }
.project-name, .project-codename, .project-meta { overflow-wrap: anywhere; }
.geo-card { display: flex; flex-direction: column; background: var(--surface); border-color: var(--line); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--white) 1.57%, transparent); }
.geo-head { align-items: flex-start; gap: 0.75rem; margin-bottom: 1.25rem; }
.geo-card__link { gap: 0.375rem; }
.geo-name { display: block; margin: 0; line-height: 1.4; }
.geo-card::before { background: var(--line); opacity: .5; }
.geo-card:hover { border-color: var(--line); box-shadow: 0 0.625rem 1.75rem -1rem color-mix(in srgb, var(--ink) 60.0%, transparent); }
.geo-fee { min-height: 2rem; align-self: flex-start; background: color-mix(in srgb, var(--accent) 3.92%, transparent); border-color: var(--line); color: var(--accent); border-radius: 0.5rem; box-shadow: inset 0 1px 0 color-mix(in srgb, var(--white) 1.18%, transparent); }
.geo-fee:hover { border-color: var(--line); color: var(--accent); background: var(--surface-2); }
.geo-ico, .geo-ico[data-tone] { color: var(--icon-neutral); background: var(--icon-neutral-bg); }
.geo-ico[data-tone="success"] { color: var(--icon-success); background: color-mix(in srgb, var(--icon-success-tint) 6.27%, transparent); }
.geo-ico[data-tone="info"] { color: var(--icon-info); background: color-mix(in srgb, var(--icon-info-tint) 6.27%, transparent); }
.geo-ico[data-tone="warning"] { color: var(--icon-subtle); background: var(--icon-subtle-bg); }
.geo-stat-row.is-key .geo-ico { color: var(--accent); background: color-mix(in srgb, var(--accent) 7.06%, transparent); box-shadow: none; }
.geo-stat-row.is-positive .geo-stat-val { color: var(--text); }
.geo-stat-row.is-key .geo-stat-val { color: var(--text); }
.geo-code { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; width: fit-content; min-width: 2.625rem; min-height: 2rem; margin: 0; padding: 0 0.625rem; border: 1px solid var(--line); border-radius: 0.5rem; background: color-mix(in srgb, var(--accent) 3.53%, transparent); font-size: 1rem; font-weight: 650; line-height: 1; letter-spacing: .02em; }
.geo-code::before { content: none; }
.geo-card .geo-stats { display: flex; flex-direction: column; gap: 0.5rem; margin: 0; }
.geo-card .geo-stats + .geo-stats { margin-top: 0.75rem; }
.geo-card .geo-stat-row { display: grid; grid-template-columns: minmax(0, 1fr) max-content; align-items: center; gap: 0.75rem; min-width: 0; margin: 0; }
.geo-card .geo-stat-label { min-width: 0; align-items: center; line-height: 1.4; }
.geo-card .geo-stat-val { margin: 0; font-size: 0.8125rem; line-height: 1.4; text-align: right; white-space: nowrap; }
.geo-card .geo-stat-row.is-key { margin-top: 0; padding-top: 0.75rem; border-top: 1px solid var(--line); }
.geo-card .geo-stats + .geo-stats .geo-stat-row.is-key { padding-top: 0.75rem; border-top: 1px solid var(--line); width: 100%; }
.geo-card > .geo-stats:last-of-type { margin-bottom: 1.25rem; }
.geo-card .geo-stat-row.bp-stat-stack { grid-template-columns: minmax(0, 1fr); gap: 0.3125rem; }
.geo-card .geo-stat-row.bp-stat-stack .geo-stat-val { padding-left: 2rem; text-align: left; }
@container (min-width: 460px) {
  .geo-card .geo-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.25rem; }
  .geo-card .geo-stat-row { display: flex; flex-direction: column; align-items: flex-start; gap: 0.375rem; }
  .geo-card .geo-stat-val { text-align: left; font-size: 1rem; }
  .geo-card .geo-stats + .geo-stats { grid-template-columns: minmax(0, 1fr); }
  .geo-card .geo-stat-row.is-key { grid-column: 1 / -1; }
}
@container (min-width: 720px) {
  .geo-card .geo-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .geo-card .geo-stats + .geo-stats { grid-template-columns: minmax(0, 1fr); }
}
.project-codename { color: var(--text-muted); }
.project-codename > svg { color: var(--text-muted); }
.project-meta > svg { color: var(--text-muted); }
.project-meta a { color: var(--info); }
.project-meta a:hover { color: var(--text); }
.page-head__row > svg.lucide { color: var(--accent); }
.profit-banner { isolation: isolate; background: var(--surface); color: var(--text-on-accent); border-color: var(--line); box-shadow: none; }
.profit-banner::before { display: block; content: ""; position: absolute; inset: 0 auto 0 0; width: 54%; height: 100%; background: var(--accent); border-radius: inherit; z-index: -1; }
.profit-banner::after {
  content: ""; position: absolute; width: 11.25rem; height: 8.75rem; top: -1.0625rem; right: 46%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M18 47C39 49 54 32 61 20C63 16 68 17 68 22C68 25 65 29 65 30C71 56 46 68 26 65C15 64 9 54 13 50C14 48 16 47 18 47Z' fill='%2308090b'/%3E%3Cpath d='M18 47C39 49 54 32 61 20C63 16 68 17 68 22C66 35 51 52 32 56C22 58 14 55 13 52C12 49 15 47 18 47Z' fill='%23333300'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .065; transform: rotate(-18deg); pointer-events: none; z-index: -1;
}
.profit-banner__ico, .profit-banner.is-below .profit-banner__ico { background: var(--bg); color: var(--accent); }
.profit-banner__title { color: var(--text-on-yellow-muted); }
.profit-loading { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; min-height: 1.875rem; margin-top: 0.375rem; color: var(--text-on-accent); font-size: 0.75rem; }
.profit-loading__track { position: relative; flex: 0 0 3rem; height: 0.25rem; overflow: hidden; border-radius: 62.4375rem; background: var(--bg); }
.profit-loading__track::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 1.25rem; border-radius: inherit; background: var(--accent); transform: translateX(0.875rem); }
@media (prefers-reduced-motion: no-preference) {
  .profit-loading__track::after { animation: profit-loading-slide 1.2s ease-in-out infinite; }
}
@keyframes profit-loading-slide { from { transform: translateX(-1.25rem); } to { transform: translateX(3rem); } }
.profit-target__label { color: var(--text-muted); }
.profit-banner__value, .profit-banner.is-positive .profit-banner__value, .profit-banner.is-below .profit-banner__value,
.profit-target__value { color: var(--text-on-accent); }
.profit-banner .profit-target__value { color: var(--text); }
.profit-banner.is-negative .profit-banner__value { color: var(--text-on-yellow-danger); }
.profit-banner__value .pp-cur { color: var(--text-on-yellow-muted); }
.profit-banner__refresh { color: var(--text-on-yellow-muted); background: color-mix(in srgb, var(--bg) 3.14%, transparent); border-color: var(--line); }
.profit-banner__refresh:hover { color: var(--text-on-accent); background: color-mix(in srgb, var(--bg) 7.84%, transparent); border-color: var(--line); }
.profit-banner__warn { color: var(--text-on-yellow-warning); border-color: var(--line); }
.profit-target__note { color: var(--text-muted); }
@media (max-width: 1280px) {
  .profit-banner { background: var(--accent); border-color: var(--line); }
  .profit-banner::before { display: none; }
  .profit-banner .profit-target__label, .profit-banner .profit-target__note { color: var(--text-on-yellow-muted); }
  .profit-banner .profit-target__value { color: var(--bg); }
  .profit-banner::after { right: 3%; }
}
@media (max-width: 640px) {
  .geo-code { font-size: 0.9375rem; }
  .profit-banner::after { top: -0.5625rem; right: -1.0625rem; width: 13.125rem; height: 13.125rem; }
  .profit-banner .profit-target { border-top-color: var(--line); }
  .project-actions { display: grid; grid-template-columns: max-content minmax(0, 1fr) 2.25rem; gap: 0.5rem; }
  .project-actions > .ui-btn { padding-inline: 0.625rem; }
  .project-actions > .menu { min-width: 0; }
}
@media (max-width: 370px) {
  .project-actions { grid-template-columns: minmax(0, 1fr) 2.25rem; }
  .project-actions > .ui-btn { grid-column: 1; justify-content: flex-start; }
  .project-actions > .menu { grid-column: 2; grid-row: 1 / span 2; align-self: start; }
}
@media (pointer: coarse) {
  .geo-code, .geo-fee { min-height: 2.5rem; }
}
.ui-btn { border-radius: 0.5rem; font-weight: 600; }
.ui-btn--primary, .add-btn { background: var(--accent); color: var(--text-on-accent); border-color: var(--line); font-weight: 600; box-shadow: 0 0.1875rem 1.125rem color-mix(in srgb, var(--accent) 7.06%, transparent); }
.ui-btn--primary:hover, .add-btn:hover { background: var(--accent-hover); border-color: var(--line); color: var(--text-on-accent); box-shadow: none; }
.ui-btn--primary:disabled { color: var(--text-on-accent); }
.ui-btn--secondary { background: linear-gradient(180deg, var(--button-top), var(--button-bottom)); border-color: var(--line); color: var(--button-text); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--white) 1.57%, transparent); }
.ui-btn--secondary > svg { color: var(--text-muted); }
.ui-btn--secondary:hover { border-color: var(--line); background: var(--surface-3); }
.ui-btn--secondary:hover > svg { color: var(--accent); }
.ui-btn--icon { background: var(--icon-button-bg); border-color: var(--line); }
.ui-btn--icon:hover { background: var(--icon-button-hover); border-color: var(--line); }
.profit-banner .profit-banner__refresh { color: var(--text-on-yellow-muted); background: color-mix(in srgb, var(--bg) 3.14%, transparent); border-color: var(--line); }
.profit-banner .profit-banner__refresh:hover { color: var(--bg); background: color-mix(in srgb, var(--bg) 7.84%, transparent); border-color: var(--line); }
.ui-input, .ui-select, .ui-textarea { background: var(--field-bg); border-color: var(--line); box-shadow: inset 0 1px 0.1875rem color-mix(in srgb, var(--ink) 9.41%, transparent); }
.ui-input:focus, .ui-select:focus, .ui-textarea:focus { border-color: var(--line); box-shadow: none; }
.modal-card, .ui-dialog { background: var(--dialog-bg); border-color: var(--line); box-shadow: 0 1.25rem 5rem color-mix(in srgb, var(--ink) 50.2%, transparent); }
.modal-card.ps-card { padding-bottom: 0; }
.modal-card.ps-card { display: flex; flex-direction: column; overflow: hidden; }
.ps-card > :not(#ps-body) { flex-shrink: 0; }
.ps-card #ps-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 1rem; }
.ps-card .ps-foot { position: static; }
.menu__list { background: var(--menu-bg); border-color: var(--line); box-shadow: 0 0.75rem 2.1875rem color-mix(in srgb, var(--ink) 40.0%, transparent); }
.menu__item:hover { background: color-mix(in srgb, var(--accent) 3.14%, transparent); }
.bp-icon { stroke-width: 1.65; }
.geo-spark__title { color: var(--text-muted); }
.geo-spark { margin-top: auto; padding-top: 1rem; }
.geo-spark__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.375rem 0.75rem; margin-bottom: 0.75rem; }
.geo-spark__title { flex: 0 0 auto; white-space: nowrap; line-height: 1.4; }
.geo-spark__total { min-width: 0; margin-left: auto; white-space: normal; text-align: right; line-height: 1.4; }
.geo-spark__plot { height: 5rem; }
.geo-spark__axis { display: flex; justify-content: space-between; gap: 0.25rem; height: 1.5rem; padding-top: 0.4375rem; }
.geo-spark__axis span { position: static; transform: none; font-size: 0.5625rem; line-height: 1.2; white-space: nowrap; }
.geo-spark__axis span.bp-tick-hidden { display: none; }
@container (max-width: 340px) {
  .geo-spark__head { flex-direction: column; align-items: stretch; gap: 0.3125rem; }
  .geo-spark__total { margin-left: 0; text-align: left; font-size: 0.6875rem; }
}
.geo-spark__plot svg { filter: none; }
.geo-spark__bar { fill: var(--chart-bar); }
.geo-spark__bar[opacity="1"] { fill: var(--chart-bar-active); }
.geo-spark__bar:last-of-type { fill: var(--accent); }
.geo-spark__bar.bp-chart-hit, .geo-spark__plot:hover .geo-spark__bar.bp-chart-hit { opacity: 0 !important; }
.bp-spark-line { filter: drop-shadow(0 0 0.1875rem color-mix(in srgb, var(--accent) 10.2%, transparent)); }
.bp-spark-line, .bp-spark-fill, .bp-spark-end, .bp-spark-grid { pointer-events: none; }
::selection { color: var(--text-on-accent); background: var(--accent); }
@media (max-width: 900px) {
  .sidenav { padding: 1.5625rem 1.1875rem 1.125rem; }
  .sidenav-top { padding: 0 0.5rem; }
  .sidenav-close { flex: none; margin-right: -0.5rem; }
  .sidenav-brand .brand-name { font-size: 1rem; }
  .bp-nav-caption { margin-top: 1.75rem; }
  .sidenav-item { min-height: 2.75rem; }
}
@media (max-width: 640px) {
  .ps-foot { margin-inline: -1.125rem; padding-inline: 1.125rem; }
}

/* Shared application components: same geometry and contrast on every screen. */
.brand-pay { color: var(--accent); }
.brand-icon, .ui-brand__mark { overflow: hidden; box-shadow: none; }
.brand-icon > img, .ui-brand__mark > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ui-brand__name { font-weight: 800; letter-spacing: -.04em; }
.ui-auth__card { background: var(--surface); border-color: var(--line); box-shadow: var(--shadow-lg); }
body.ui-auth { background-image: radial-gradient(ellipse 37.5rem 25rem at 50% 30%, color-mix(in srgb, var(--accent) 3%, transparent), transparent 75%); }
.ui-auth input { background: var(--bg-2); border-color: var(--line); }
.ui-auth input:focus { border-color: var(--line); box-shadow: none; }
.ui-auth input[aria-invalid="true"] { border-color: var(--line); }
.ui-auth button[type="submit"] { background: var(--accent); color: var(--text-on-accent); box-shadow: none; }
.ui-auth button[type="submit"]:hover { background: var(--accent-hover); box-shadow: 0 0.375rem 1.5rem var(--accent-soft); }
.dash-header { background: var(--bg-2); border-bottom-color: var(--line); }
.stat-card, .account-card, .dash-kpi, .subpanel, .pp-card, .uw-card { background: var(--surface); border-color: var(--line); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--white) 2%, transparent); }
.stat-card::before { content: none; }
.stat-card--accent { background: var(--accent-soft); border-color: var(--line); }
.stat-card--accent .stat-value { color: var(--accent); }
.stat-card--accent .stat-label > svg { color: var(--accent); }
.account-card { border-radius: var(--radius-lg); }
.account-card:hover { border-color: var(--line); }
.account-avatar { background: var(--surface-3); color: var(--text); border: 1px solid var(--line); box-shadow: none; }
.dash-kpi { border-radius: var(--radius-lg); position: relative; isolation: isolate; overflow: hidden; }
.dash-kpi:nth-child(2) { background: var(--accent); border-color: var(--line); }
.dash-kpi:nth-child(2) .dash-kpi-value { color: var(--text-on-accent); }
.dash-kpi:nth-child(2) :is(.dash-kpi-label, .dash-kpi-sub) { color: var(--text-on-yellow-muted); }
.dash-kpi:nth-child(2)::after { content: ""; position: absolute; width: 9.375rem; height: 9.375rem; right: -0.5rem; top: -1.5rem; background: url('/static/banana-logo.svg') center / contain no-repeat; opacity: .09; mix-blend-mode: multiply; z-index: -1; transform: rotate(-15deg); }
.tab.active { background: var(--accent); color: var(--text-on-accent); box-shadow: 0 0.25rem 1.125rem var(--accent-soft); }
.tab:not(.active):hover { background: var(--surface-2); color: var(--text); }
.period-btn.active { background: var(--accent); border-color: var(--line); color: var(--text-on-accent); box-shadow: none; }
.modal { background: var(--surface); border-color: var(--line); box-shadow: var(--shadow-lg); }
.modal :is(input, textarea, select):where(:not([type="checkbox"]):not([type="radio"])), .card-input, .search-input, .access-input {
  background-color: var(--bg-2); border-color: var(--line); color: var(--text);
}
.modal :is(input, textarea, select):focus, .card-input:focus, .search-input:focus { border-color: var(--line); box-shadow: none; }
:is(.btn-save, .btn-small:not(.danger), .confirm-btn) { background: var(--accent); color: var(--text-on-accent); box-shadow: none; }
:is(.btn-save, .btn-small:not(.danger), .confirm-btn):hover { background: var(--accent-hover); color: var(--text-on-accent); box-shadow: 0 0.25rem 1rem var(--accent-soft); }
.ui-table thead, thead { background: var(--bg-2); }
.ui-table th, th { color: var(--text-muted); }
.ui-table td, td { border-color: var(--line); }
.ui-dialog, .ui-menu, .ui-dp { background-color: var(--surface); border-color: var(--line); }
.ui-switch__input:checked + .ui-switch__track { background: var(--accent); }
.msg-bubble.out { background: var(--surface-3); color: var(--text); border: 1px solid var(--line); }
.msg-bubble.in { background: var(--surface-2); }
.msg-thread.active { background: var(--accent-soft); }
.ui-btn--danger:hover { color: var(--text-on-danger); }
.ui-btn[hidden], [hidden] { display: none !important; }
.setting-btn { background: var(--surface-2); border-color: var(--line); color: var(--text-muted); box-shadow: none; }
.setting-btn:hover { background: var(--accent-soft); border-color: var(--line); color: var(--accent); }
.pl-row .ui-field:has(.ui-hint) { width: min(20rem, 100%); min-width: 0; }
.pl-row > .ui-btn { max-width: 100%; }
.modal :is(input, textarea, select)[aria-invalid="true"] { border-color: var(--line); }
.profit-banner:is(.is-positive, .is-negative, .is-below) .profit-banner__ico { background: var(--bg); color: var(--accent); }
/* Touch calendar: every preset remains visible in the bottom sheet. */
.ui-dp--sheet .ui-dp__presets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
.ui-dp--sheet .ui-dp__preset { min-width: 0; padding: 0.5rem 0.375rem; white-space: normal; line-height: 1.3; }
.msg-shell { grid-template-columns: 20rem minmax(0, 1fr); }
.msg-chat, .msg-sidebar, .msg-composer textarea { min-width: 0; }
.msg-head-name, .msg-head-sub { overflow-wrap: anywhere; }
.msg-chat-actions button:hover { color: var(--text-on-danger); }
@media (max-width: 900px) { .msg-shell { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) {
  .msg-chat-head { flex-wrap: wrap; }
  .msg-chat-head .msg-head-info { min-width: 6.875rem; }
  .msg-chat-actions { margin-left: auto; max-width: 100%; }
}

/* Container focus and decorative edge strips follow the same dark border. */
:is([role="dialog"], [data-ui-dialog]):focus-visible { outline: none !important; }
.account-card::before { background: var(--line); }

/* Saturated brand accents; statuses keep their text and icon markers. */
:root { --success: #00E676; --success-soft: #00E67614; --danger: #FFDA00; --danger-soft: #FFDA0014; --warning: #FFDA00; --icon-success: #00E676; --icon-success-tint: #00E676; }

.page-head.is-sr #page-head-actions { display: none; }

:root { --accent-soft:#101113; --success-soft:#101113; --danger-soft:#101113; --warning-soft:#101113; }
.bp-spark-fill { opacity: 0; }

/* Shared compact density: real component sizes, with an unchanged browser scale. */
:root {
  --bp-ui-text: 0.875rem;
  --bp-ui-label: 0.75rem;
  --bp-ui-title: 1.375rem;
  --bp-control-height: 2.125rem;
  --bp-control-small: 1.875rem;
  --bp-panel-padding: 1rem;
  --bp-page-padding: 1.25rem;
}
html:root { font-size: 1rem; }
body { font-size: var(--bp-ui-text); line-height: 1.5; }
body :is(input, select, textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]) { font-size: var(--bp-ui-text); }
@media (max-width: 639px), (pointer: coarse) {
  :root { --bp-control-height: 2.5rem; --bp-control-small: 2.25rem; --bp-page-padding: 1rem; }
  body :is(input, select, textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]) { font-size: 1rem; }
}

.main { padding: var(--bp-page-padding) var(--bp-page-padding) 3rem; }
.page-title, .page-head h1 { font-size: var(--bp-ui-title); }
.project-card, .geo-card { padding: var(--bp-panel-padding); }
.project-header { margin-bottom: 1rem; }
.projects-list { gap: 1rem; }
.project-name { font-size: 1rem; }
.sidenav-item { min-height: 2.125rem; padding: 0.5rem 0.75rem; font-size: 0.8125rem; line-height: 1.125rem; }
.sidenav-brand .brand-name { font-size: 0.875rem; letter-spacing: -.03em; }
.bp-nav-caption, .sidenav-group-title, .sidenav .sn-count { font-size: 0.6875rem; }
.geo-spark__axis span { font-size: 0.6875rem; }
.geo-spark__total { font-size: 0.75rem; }
.sidenav .brand-icon { width: 1.75rem; height: 1.75rem; border-radius: 0.5rem; }
.sidenav { padding-top: 1.25rem; }
.ui-btn { min-height: var(--bp-control-height); }
.ui-btn--sm { min-height: var(--bp-control-small); }
.ui-btn--icon { width: var(--bp-control-height); }
:is(.ui-input, .ui-select) { min-height: var(--bp-control-height); }
.profit-banner { padding: 1rem; }
.profit-banner__value { font-size: 1.75rem; }
@media (max-width: 639px), (pointer: coarse) { .sidenav-item { min-height: 2.5rem; } }

/* Text links and controls have no decorative underline, including keyboard focus. */
:is(a, button, input, textarea, select, summary, label, u, [role=link], [role=button]) { text-decoration-line: none !important; }

/* Login templates can define their own focus rules after this stylesheet. */
:focus-visible { outline-color: var(--line) !important; }
:is(input, select, textarea):focus { border-color: var(--line) !important; box-shadow: none !important; }

/* Compact desktop density: native text and layout sizes, browser stays at 100%. */
html:root { --bp-density: 1; font-size: 16px; }
@media (min-width: 768px) and (pointer: fine) {
  html:root { --bp-density: .8; font-size: 12.8px; }
}