/* GOELRO identity, shared by every composition. Source: goelro.space, 04.11.2026. */
:root {
  --font-brand: 'Raleway', Arial, sans-serif;
  --brand-black: #070707;
  --brand-white: #f7f7f7;
  --brand-red: #cc4629;
  --brand-gold: #fdb500;
}
html { background: var(--brand-black); color-scheme: dark; }
body, body[class] {
  --bg: var(--brand-black); --panel: #141414; --ink: var(--brand-white);
  --muted: #b0ada6; --line: #343331; --accent: var(--brand-gold);
  --soft: #24211a; --hero: #1c1b17; --hero-ink: var(--brand-white);
  --sidebar: #0c0c0c; --side-ink: #d2d0cb; --radius: 8px;
  --warn: #f18a71; --ring-color: var(--brand-gold);
  font-family: var(--font-brand); font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: 'lnum' 1, 'tnum' 1;
  background: var(--bg); color: var(--ink);
}
button, input, select, textarea { font-family: inherit; font-variant-numeric: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 2px solid var(--brand-gold); outline-offset: 4px;
}
body[class] h1, body[class] h2, body[class] h3,
body[class] .metric strong, body[class] .hospitality-result strong,
body[class] .hospitality-result small, body[class] .personal-summary strong {
  font-family: var(--font-brand); font-style: normal;
}
body[class] h1 { font-weight: 500; letter-spacing: -.025em; }
body[class] h2 { font-weight: 500; letter-spacing: -.02em; }
body[class] em { font-style: normal; color: var(--brand-gold); }
body[class] .page-title h1 { text-transform: uppercase; font-size: clamp(25px,2.5vw,38px); line-height: 1.16; }
body[class] .muted { color: var(--muted); }
.brand img, .toolbar-brand img, .auth-brand img { display: block; object-fit: contain; }
.application-bar .toolbar-brand { display: flex; align-items: center; flex-shrink: 0; }
.toolbar-brand img { width: 98px; height: 36px; }
body[class] .sidebar .brand img { width: 132px; height: 48px; }
body[class] .sidebar .brand span { color: var(--muted); letter-spacing: 1.2px; font-size: 7px; }
body[class] .application-bar { background: var(--brand-black); border-color: var(--line); min-height: 72px; }
body[class] .sidebar { border-right: 1px solid var(--line); }
body[class] .sidebar .brand { color: var(--ink); }
body[class] .side-label, body[class] .side-bottom, body[class] .side-profile,
body[class] .side-profile small { color: var(--muted); border-color: var(--line); }
body[class] .sidebar nav button { border-radius: 5px; }
body[class] .sidebar nav button.active { background: var(--brand-red); color: #fff; border-color: var(--brand-red); }
body[class] .sidebar nav button:hover:not(.active) { background: var(--panel); color: var(--ink); }
body[class] .view-switch { background: var(--panel); border-radius: 5px; }
body[class] .view-switch button { border-radius: 3px; }
body[class] .view-switch button.active { background: var(--brand-red); color: #fff; }
body[class] .appearance-button { border-radius: 5px; background: transparent; }
body[class] .toolbar-action:hover, body[class] .side-theme:hover { color: var(--brand-gold); }
body[class] .data-filters select, body[class] .manager-controls input,
body[class] .manager-controls select, body[class] .person-selector select,
body[class] .compact-navigation select, body[class] .list-heading select { border-radius: 5px; }
body[class] .metric, body[class] .panel, body[class] .person-card { border-radius: var(--radius); }
body[class] .hero, body[class] .personal-summary { border: 1px solid var(--line); background: var(--hero); color: var(--ink); }
body[class] .hero .progress, body[class] .personal-plan .progress,
body[class] .people-person-copy .progress { background: #ffffff19; }
body[class] .progress i, body[class] .hero-progress i,
body[class] .personal-plan .progress i, body[class] .people-person-copy .progress i { background: var(--brand-gold); }
body[class] .hero-progress { background: #ffffff19; }
body[class] .donut > div { background: var(--hero); }
body[class] .insight-leader { background: #242015; border-color: #68501e; }
body[class] .insight-leader .insight-label, body[class] .insight-leader .insight-result strong { color: var(--brand-gold); opacity: 1; }
body[class] .insight-lagging { background: #211613; border-color: #643b30; border-top-color: var(--brand-red); }
body[class] .insight-action { background: var(--panel); }
body[class] .insight-action .insight-label { color: var(--warn); }
body[class] .insight-person h3 { font-weight: 600; }
body[class] .insight-card:hover, body[class] .person-card:hover { box-shadow: 0 8px 28px #0004; }
body[class] .person-card:hover { border-color: #786238; }
body[class] .person-stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
body[class] .person-stats > div { min-width: 0; }
body[class] .portrait,
body[class] .person-card:nth-child(n) .portrait,
body[class] .photo-card:nth-child(n) > .portrait,
body[class] .hospitality-person .profile-large .portrait.large,
body[class] .people-person > .portrait.large,
body[class] .wall-person .portrait.large {
  background: #2b2924; color: #b7aa90;
}
body[class] .person-card:nth-child(2n) .portrait { background: #302622; color: #ba9f93; }
body[class] .person-card:nth-child(3n) .portrait { background: #282828; color: #b1b1b1; }
body[class] .portrait > span, body[class] .portrait.large > span { color: var(--ink); }
body[class] .portrait > small, body[class] .photo-card > .portrait > small { color: var(--muted); }
body[class] .score-header, body[class] .workspace-welcome, body[class] .ledger-profile,
body[class] .ledger-note, body[class] .journey-result, body[class] .journey-footer span {
  background: var(--panel); color: var(--ink); border-color: var(--line);
}
body[class] .score-header { border-top-color: var(--brand-gold); }
body[class] .workspace-welcome > span, body[class] .journey-result .overline,
body[class] .journey-result h2 small, body[class] .journey-result p,
body[class] .journey-footer { color: var(--muted); }
body[class] .wall-title strong { color: var(--brand-gold); }
body[class] .people-person { background: var(--hero); border: 1px solid var(--line); }
body[class] .people-person-copy { color: var(--ink); }
body[class] .people-person-copy .overline, body[class] .people-person-copy > p,
body[class] .people-person-result small, body[class] .people-person-result > span { color: var(--muted); }
body[class] .people-person-copy h2 em, body[class] .people-intro em { color: var(--brand-gold); }
body[class] .personal-tabs .active { background: var(--brand-red); color: #fff; }
body[class] .personal-tabs button { border-radius: 5px; }
body[class] .table-box a { color: #e9c779; }
body[class] .table-box { border-radius: 5px; }
body[class] .theme-precision, body.theme-precision { font-family: var(--font-brand); }
body[class] .theme-journey .funnel-block::after, body[class] .personal-journey > div::after { color: var(--muted); }
body[class] .return-period { background: var(--brand-red); color: #fff; border-radius: 5px; }
/* The layout selector previews one identity, with ten distinct compositions. */
#appearance-dialog {
  --dialog-ink: var(--ink); background: var(--panel); color: var(--ink);
  border-color: var(--line); border-radius: 10px; box-shadow: 0 30px 110px #0009;
}
#appearance-dialog::backdrop, .admin-dialog::backdrop { background: #000a; }
#appearance-dialog button:focus-visible, #appearance-dialog input:focus-visible { outline-color: var(--brand-gold); }
.appearance-head p, .theme-name > span, .link-themes, .appearance-bottom > span { color: var(--muted); }
.appearance-close { background: var(--bg); border-color: var(--line); color: var(--ink); }
.appearance-target { background: var(--bg); border-radius: 5px; }
.appearance-target button { color: var(--muted); border-radius: 3px; }
.appearance-target button[aria-selected="true"] { background: var(--brand-red); color: #fff; box-shadow: none; }
.link-themes input { accent-color: var(--brand-red); }
.theme-option { background: var(--bg); color: var(--ink); border-color: var(--line); border-radius: 6px; }
.theme-option:hover { border-color: var(--brand-gold); box-shadow: none; }
.theme-option.selected { border-color: var(--brand-gold); box-shadow: 0 0 0 2px #fdb50022; }
.theme-thumbnail { --thumb-bg: #111; --thumb-dark: #393630; --thumb-accent: var(--brand-gold); border-radius: 3px; }
.theme-name i { color: var(--brand-gold); }
.appearance-bottom { background: var(--panel); border-color: var(--line); }
.appearance-bottom > button { background: var(--brand-red); color: #fff; border-radius: 5px; }
#notification { background: #24211a; color: var(--ink); border: 1px solid #68501e; border-radius: 5px; }
/* Sign-in and administration belong to the same GOELRO portal. */
body.auth-body { background: var(--brand-black) !important; }
.auth-shell { color: var(--ink); background: var(--brand-black); }
.auth-brand { color: var(--ink); }
.auth-brand img { width: 168px; height: 65px; }
.auth-intro { color: var(--muted); font-size: 13px; margin: 14px 0 32px; }
.auth-card { background: var(--panel); border-color: var(--line); border-radius: 8px; box-shadow: 0 20px 75px #0008; }
.auth-card h1 { font-size: 26px; line-height: 1.25; font-weight: 500; }
.auth-card label, .auth-card p { color: var(--muted); }
.auth-card > p { margin-bottom: 24px; }
.auth-card input { background: var(--bg); color: var(--ink); border-color: var(--line); border-radius: 5px; }
.auth-card button { background: var(--brand-red); color: #fff; border-radius: 5px; }
.auth-card button:hover:not(:disabled) { background: #b53b24; }
.auth-card .auth-back { color: var(--muted); background: transparent; margin-right: 20px; line-height: 1.6; }
.auth-card .auth-back:hover { color: var(--ink); background: transparent; }
.auth-error { color: var(--warn); }
.setup-qr { display: block; width: min(232px,100%); height: auto; margin: 0 auto; background: #fff; }
.setup-manual { color: var(--muted); font-size: 12px; }
.setup-manual summary { cursor: pointer; padding: 5px 0; }
.setup-key { margin-top: 10px; background: #24211a; color: var(--ink); border-radius: 4px; font-size: 12px; }
.recovery-codes { grid-template-columns: minmax(0, 1fr); }
.recovery-codes code { background: #24211a; color: var(--ink); border-radius: 4px; overflow-wrap: anywhere; font-size: 12px; }
.live-loading { color: var(--ink); background: var(--brand-black); font-family: var(--font-brand); }
.live-loading > img { width: 160px; height: 65px; object-fit: contain; }
.live-loading button { background: var(--brand-red); color: #fff; border-radius: 5px; }
.admin-dialog { border-radius: 8px; }
.admin-content input, .admin-content select { border-radius: 5px; }
.admin-content button { background: var(--brand-red); color: #fff; border-radius: 5px; }
.admin-content input[type=checkbox] { accent-color: var(--brand-red); }
.user-form.password-only { grid-template-columns: 1.3fr 1fr 1fr auto; }
@media (min-width:761px) {
  body.theme-editorial .sidebar .brand img, body.theme-people .sidebar .brand img { width: 110px; height: 38px; }
  body.theme-editorial .sidebar .brand span, body.theme-people .sidebar .brand span { display: none; }
}
@media (max-width:760px) {
  .toolbar-brand img { width: 88px; height: 32px; }
  body[class] .application-bar { min-height: auto; }
  body[class] .page-title h1 { font-size: 27px; }
  .user-form.password-only { grid-template-columns: 1fr 1fr; }
  .appearance-bottom { background: var(--panel); }
  .auth-shell { padding: 28px 18px; }
  .editorial-person { grid-template-columns: 100px minmax(0,1fr); }
  .editorial-person > div { min-width: 0; }
  body[class] .editorial-person h2 { font-size: clamp(28px,8.8vw,46px); overflow-wrap: anywhere; }
}
@media (max-width:480px) {
  body[class] .person-grid:not(.people-grid) .person-stats b { font-size: 14px; }
  body[class] .person-grid:not(.people-grid) .person-stats span { font-size: 8px; overflow-wrap: anywhere; }
}

/* Shared information hierarchy for all ten GOELRO themes. */
.view-manager .page-title h1{font-size:clamp(26px,3.1vw,42px);line-height:1.15}
.view-manager .page-title{margin-bottom:18px}
.view-manager .person-selector{margin:12px 0 18px}
.view-manager .personal-tabs{margin-bottom:24px;overflow-x:auto;flex-wrap:nowrap}
.view-manager .personal-tabs button{flex-shrink:0;white-space:nowrap;min-height:44px}
.manager-overview{display:grid;gap:22px}
.manager-overview>.manager-hero,.manager-overview>.personal-kpis{margin:0}
.manager-hero .profile,.manager-hero .personal-summary{min-width:0}
.manager-hero.profile-summary-row{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.3fr);gap:20px}
.manager-hero .profile-large{min-height:0}
.manager-hero .profile-large .portrait{max-height:160px}
.manager-overview .overview-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.manager-focus{display:grid;grid-template-columns:1.2fr 1fr;gap:22px;align-items:stretch}
.manager-focus>.panel{margin:0;min-width:0}
.manager-priorities h3{margin:0;font-size:18px}
.priority-row{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;gap:14px;align-items:center;text-align:left;width:100%;padding:17px 0;color:var(--ink);border-bottom:1px solid var(--line);font-size:14px}
.priority-row>strong{font-size:17px;white-space:nowrap}
.priority-row>span:last-child{color:var(--accent)}
.priority-row:hover>span:first-child{color:var(--accent)}
.manager-position{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:22px;font-size:12px;color:var(--muted)}
.review-fold{border:1px solid var(--line);border-radius:var(--radius,10px);background:var(--panel);margin:18px 0;min-width:0}
.manager-overview>.review-fold{margin:0}
.review-fold>summary{cursor:pointer;display:flex;align-items:center;gap:16px;padding:20px 24px;min-height:64px;list-style:none;font-size:15px;font-weight:600;color:var(--ink)}
.review-fold>summary:after{content:'+';font-size:22px;font-weight:400;margin-left:auto;color:var(--accent)}
.review-fold[open]>summary:after{content:'−'}
.review-fold>summary>small{font-size:12px;font-weight:400;color:var(--muted);margin-left:auto}
.review-fold-body{padding:4px 24px 24px;min-width:0}
.review-fold-body>.panel{border:0;padding:0;margin:0;box-shadow:none}
.review-fold-body p{line-height:1.6}
.review-fold-body .contact-grid{gap:18px;padding:18px 0}
.review-fold-body .contact-grid>div>b{display:block;margin-top:8px;font-size:22px;font-weight:500}
.review-fold.secondary-signals{border:0;background:none;margin:4px 0}
.secondary-signals>summary{padding:12px 0;min-height:44px;font-size:12px}
.secondary-signals>.review-fold-body{padding:0}
.quiet-note{color:var(--muted);font-size:13px;line-height:1.6}
.review-fold summary:focus-visible,.priority-row:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:900px){.manager-focus{grid-template-columns:1fr}.manager-hero.profile-summary-row{grid-template-columns:1fr}.manager-hero .profile{padding:20px}.manager-focus .dynamics{min-height:180px}}
@media(max-width:600px){.manager-overview{gap:16px}.manager-overview .overview-kpis{gap:8px}.overview-kpis .metric{padding:16px 10px}.overview-kpis .metric strong{font-size:22px}.review-fold>summary{padding:16px;flex-wrap:wrap;gap:8px}.review-fold>summary>small{width:calc(100% - 32px);margin-left:0;order:2}.review-fold>summary:after{margin-left:auto}.review-fold-body{padding:0 16px 16px}.priority-row{font-size:13px;gap:8px}.priority-row>strong{font-size:15px}}

/* A personal card has its own tabs; remove the duplicate team navigation. */
body.view-manager .sidebar,body.view-manager .compact-navigation,body.view-manager .content-top{display:none}
body.view-manager .design-shell{display:block}
body.view-manager .design-main{max-width:1240px;margin:0 auto;width:100%}
body.view-manager .page-title .overline{display:none}
body.view-manager .page-title h1{font-size:26px}
body.view-manager .source-status{font-size:11px}
@media(max-width:600px){
 body.view-manager .page-title{margin:18px 0 12px;gap:14px}
 body.view-manager .page-title h1{font-size:22px}
 .manager-overview .overview-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .manager-overview .overview-kpis>.metric:last-child{grid-column:1/-1}
 body.view-manager .mode-label{display:none}
}

@media(max-width:600px){
 body.view-manager .people-person{grid-template-columns:100px minmax(0,1fr);min-height:260px}
 body.view-manager .people-person>.portrait.large{width:100%;min-height:260px;height:100%}
 body.view-manager .people-person-copy{min-width:0;padding:24px 16px}
 body.view-manager .people-person-copy h2{font-size:28px;line-height:1.15;overflow-wrap:anywhere;margin:16px 0}
 body.view-manager .people-person-result{margin-top:16px;padding-top:16px}
}