/*
 FI-LUMA PANEL v0.7.0 — canonical UI system.
 This file intentionally loads after page styles and is the single final authority
 for typography, control sizing, desktop density and shared interaction primitives.
*/
:root{
  --type-micro:8px;
  --type-meta:9px;
  --type-control:10px;
  --type-body:11px;
  --type-body-strong:12px;
  --type-card-title:14px;
  --type-section:18px;
  --type-metric:28px;
  --type-page:38px;

  --control-h-sm:32px;
  --control-h:36px;
  --control-h-lg:40px;
  --ui-gap-1:6px;
  --ui-gap-2:8px;
  --ui-gap-3:10px;
  --ui-gap-4:12px;
  --ui-gap-5:16px;
  --ui-gap-6:20px;
}

/*
 On a standard 1x desktop display the application uses the density the user
 preferred at Chrome 125%. Browser zoom / HiDPI already raises dppx, so the
 additional scale is intentionally not applied there. Mobile is untouched.
*/
@media (min-width:1450px) and (max-resolution:1.1dppx){
  body{zoom:1.25}
}
@media (max-width:900px){
  body{zoom:1}
}

/* Canonical typography */
body{font-size:var(--type-body);line-height:1.45}
.page-heading .kicker,
.hero .kicker,
.profile-kicker,
.drawer-kicker,
.panel-sub,
[class*="-kicker"]{
  font-size:var(--type-meta);
}
.page-heading h1,
.hero h1{
  font-size:var(--type-page);
  line-height:1.04;
  letter-spacing:-.05em;
}
.page-heading p,
.hero p{
  font-size:var(--type-body);
  line-height:1.6;
}
.panel-title,
.profile-card-head h2,
.drawer-section h3{
  font-size:var(--type-body-strong);
  line-height:1.25;
}
.panel-sub,
.profile-card-head p{
  font-size:var(--type-meta);
  line-height:1.5;
}
.metric-card .v,
.infra-kpi .v{
  font-size:var(--type-metric);
}
.metric-card .l,
.infra-kpi .l,
.finance-period-card .label,
.finance-status span,
.finance-quality-grid span,
.profile-facts span,
.project-registry-primary span,
.project-registry-facts span,
.backup-source-facts span,
.core-user-fact span{
  font-size:var(--type-micro);
}
.btn,
.top-action,
.segmented button,
.input,
select.input,
textarea.input,
.lang-switch button{
  font-size:var(--type-control);
}
.table-row,
.finance-project-table td,
.finance-recent-table td,
.backup-core-row,
.journal-row,
.service-row{
  font-size:var(--type-body);
}
.table-row.header,
.finance-project-table th,
.finance-recent-table th{
  font-size:var(--type-micro);
}

/* Canonical controls */
.btn{
  min-height:var(--control-h);
  border-radius:9px;
}
.input,
select.input{
  min-height:var(--control-h);
  border-radius:9px;
}
.segmented{min-height:var(--control-h)}
.segmented button{min-height:30px}
.icon-btn{
  width:34px;height:34px;padding:0;display:inline-grid;place-items:center;
  border:1px solid #292929;border-radius:9px;background:#111;color:#777;
  cursor:pointer;transition:.18s var(--ease);flex:0 0 34px
}
.icon-btn:hover{color:#eee;border-color:#3a3a3a;background:#151515}
.icon-btn svg{width:15px;height:15px;stroke-width:1.8}

/* Shared panel rhythm */
.panel{border-radius:13px}
.panel-head{min-height:52px;padding:11px 14px}
.page-heading{padding-top:29px;padding-bottom:18px}
.page-heading h1{margin-top:9px}
.page-heading p{margin-top:10px;margin-bottom:0}

/* Sidebar/operator rhythm */
.operator-copy{gap:7px}
.operator-meta{gap:8px;margin-top:1px}
.operator-role{min-height:18px;padding:0 7px}
.operator-name{font-size:var(--type-body-strong);line-height:1.15}

/* Tables and dense lists */
.finance-project-table th,.finance-project-table td,
.finance-recent-table th,.finance-recent-table td{padding:11px 13px}
.backup-core-row{padding:10px 13px}
.journal-row{padding-top:9px;padding-bottom:9px}

/* Never let raw SVG dimensions leak into action surfaces. */
.btn svg,.top-action svg,.icon-button-text svg{max-width:15px;max-height:15px}


/* v0.7.1 — one page heading system; breadcrumb owns hierarchy */
.page-heading .kicker,
.profile-kicker{display:none!important}
.page-heading h1{
  margin:0;
  font-size:var(--type-page);
  line-height:1.04;
  letter-spacing:-.05em;
}
.page-heading p{
  margin:12px 0 0;
  max-width:760px;
  color:var(--muted);
  font-size:var(--type-body);
  font-weight:400;
  line-height:1.6;
}
.overview-heading .page-heading,
.finance-heading .page-heading,
.projects-heading .page-heading,
.core-users-head .page-heading,
.backups-core-head .page-heading,
.events-heading .page-heading{
  padding-top:28px;
  padding-bottom:18px;
}
.breadcrumb{
  font-size:var(--type-meta);
  letter-spacing:.08em;
}
.profile-main h1{margin-top:0}


/* v0.7.2 — one breadcrumb style + one page-heading vertical rhythm */

/* Breadcrumb is one component: every segment is visually equal. */
.breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  color:#626262;
  font:650 var(--type-meta)/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.breadcrumb span,
.breadcrumb strong{
  display:block;
  max-width:220px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#626262;
  font:650 var(--type-meta)/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.breadcrumb-sep{
  color:#3b3b3b;
  font:650 var(--type-meta)/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

/*
 Every core page starts at the exact same vertical coordinate.
 Previous Overview/Finance styles applied outer padding and then ui-system
 applied page-heading padding again, producing the visible jump.
*/
.overview-heading,
.finance-heading,
.projects-heading,
.core-users-head,
.infra-heading,
.journal-heading,
.backups-core-head,
.events-heading{
  padding:28px 0 18px !important;
  margin:0 !important;
  align-items:flex-end;
}
.overview-heading .page-heading,
.finance-heading .page-heading,
.projects-heading .page-heading,
.core-users-head .page-heading,
.infra-heading .page-heading,
.journal-heading .page-heading,
.backups-core-head .page-heading,
.events-heading .page-heading{
  padding:0 !important;
  margin:0 !important;
}

/* Title/subtitle baseline is identical on every page. */
.page-heading h1{
  margin:0 !important;
}
.page-heading p{
  margin:12px 0 0 !important;
}

/* Side controls align to the same heading baseline without moving the title. */
.overview-controls,
.finance-controls,
.infra-actions,
.projects-head-stats{
  align-self:flex-end;
}

/* Account hero follows the same top offset after the topbar. */
.profile-hero{
  margin-top:28px;
}


/* v0.7.3 — authentication is viewport-native, not application-density scaled */
body.auth-body{
  zoom:1!important;
  width:100%!important;
  height:100dvh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
}


/* v0.7.4 — login scale is explicit; never re-enable application zoom here */
body.auth-body{zoom:1!important}

/* v0.7.5 — final breadcrumb neutralization */
.topbar .breadcrumb,
.main .breadcrumb{
  color:#626262 !important;
}
.topbar .breadcrumb span,
.topbar .breadcrumb strong,
.main .breadcrumb span,
.main .breadcrumb strong{
  color:#626262 !important;
  font:650 var(--type-meta)/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.topbar .breadcrumb-sep,
.main .breadcrumb-sep{
  color:#3b3b3b !important;
  font:650 var(--type-meta)/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace !important;
}