@font-face{
  font-family:Inter;
  src:url("/static/brand/inter.a32ace5dba84.ttf");
  font-weight:100 600}
@font-face{
  font-family:Inter;
  src:url("/static/brand/inter-bold.c59d7314123c.ttf");
  font-weight:650 900}

:root{
  --ink:#101a30;
  --muted:#526584;
  --blue:#163f78;
  --link:#0068d8;
  --line:#e2e8f1;
  --pale:#f6f9fc;
  --selected:#e5f1ff}
*{
  box-sizing:border-box}
body{
  margin:0;
  background:#fff;
  color:var(--ink);
  font:14px/1.5 Inter,Arial,sans-serif}
a{
  color:var(--link);
  text-decoration:none}
a:hover{
  text-decoration:underline}
button,input,select{
  font:inherit}
button,.button{
  min-height:46px;
  padding:12px 20px;
  border:1px solid #10356c;
  border-radius:5px;
  background:var(--blue);
  color:white;
  font-weight:550;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  gap:9px}
button:hover,.button:hover{
  background:#0c3064;
  text-decoration:none}
button:disabled{
  opacity:.6;
  cursor:wait}
.secondary{
  background:white;
  border-color:#c8d3e4;
  color:#193e74}
.secondary:hover{
  background:var(--selected)}
.full{
  width:100%}
.text-button{
  background:none!important;
  border:0;
  color:var(--muted);
  padding:0 10px;
  min-height:44px}
.sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:238px;
  background:var(--pale);
  border-right:1px solid var(--line);
  padding:24px 12px;
  display:flex;
  flex-direction:column}
.brand{
  padding:0 8px}
.logo{
  width:208px;
  height:38px;
  object-fit:contain}
.workspace{
  color:var(--muted);
  padding:2px 8px 25px;
  font-size:15px}
nav{
  padding-top:8px;
  display:grid;
  gap:4px}
nav a{
  min-height:49px;
  padding:12px 14px;
  border-radius:6px;
  display:flex;
  align-items:center;
  gap:18px;
  color:#344e75;
  font-size:14px}
nav a:hover{
  background:#edf3fa;
  text-decoration:none}
nav a[aria-current]{
  background:var(--selected);
  color:#0055bb}
.icon{
  width:22px;
  height:22px;
  flex-shrink:0;
  opacity:.8}
nav .icon{
  filter:invert(25%) sepia(17%) saturate(1300%) hue-rotate(177deg)}
nav a[aria-current] .icon{
  filter:invert(27%) sepia(96%) saturate(2300%) hue-rotate(200deg)}
.sidebar-foot{
  margin-top:auto;
  padding:20px 14px 0;
  color:var(--muted);
  font-size:11px}
.sidebar-foot p{
  margin:0 0 12px}
.sidebar-foot span,.sidebar-foot form{
  display:inline-block}
.shell{
  margin-left:238px}
.topbar{
  height:70px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:0 26px;
  border-bottom:1px solid var(--line)}
.environment{
  padding:8px 14px;
  background:#fff2d3;
  color:#935000;
  border-radius:5px;
  font-size:12px;
  white-space:nowrap}
.current-date{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap}
.global-search{
  margin-left:auto;
  position:relative;
  width:340px}
.global-search .icon{
  position:absolute;
  left:12px;
  top:12px;
  width:18px;
  height:18px}
.global-search input{
  padding-left:40px!important;
  min-height:42px!important;
  font-size:12px}
.mobile-account{
  display:none}
main{
  padding:18px 26px 36px;
  max-width:1660px;
  margin:auto}
.dev-note{
  font-size:11px;
  color:#8a5300;
  margin:0 0 14px}
.heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:0 0 24px}
h1{
  font-family:Inter,Arial,sans-serif;
  font-size:36px;
  line-height:1.2;
  letter-spacing:-1.2px;
  font-weight:750;
  margin:10px 0 3px;
  overflow-wrap:anywhere}
h2{
  font-size:19px;
  line-height:1.4;
  margin:0 0 18px;
  font-weight:750;
  letter-spacing:-.4px}
h3{
  font-size:16px;
  font-weight:650}
.subtitle{
  font-size:20px;
  color:var(--muted);
  margin:0}
.eyebrow{
  font-size:11px;
  color:var(--muted);
  letter-spacing:.3px;
  margin:0 0 10px}
.muted{
  color:var(--muted)}
.small,small{
  font-size:11px}
small{
  display:block;
  color:var(--muted);
  margin-top:4px}
.grid{
  display:grid;
  gap:18px}
.three{
  grid-template-columns:repeat(3,1fr)}
.two{
  grid-template-columns:repeat(2,1fr)}
.card{
  background:white;
  border:1px solid var(--line);
  border-radius:6px;
  padding:22px;
  min-width:0}
.metric{
  display:flex;
  gap:18px;
  align-items:flex-start;
  min-height:122px}
.metric p{
  margin:0 0 6px;
  color:var(--muted);
  font-size:13px}
.metric strong{
  font-size:25px;
  line-height:1.3;
  letter-spacing:-.4px}
.metric-icon{
  width:46px;
  height:46px;
  padding:11px;
  background:#edf5ff;
  border-radius:8px;
  flex-shrink:0}
.finance-middle{
  grid-template-columns:1.55fr 1fr;
  margin-top:18px}
.finance-bottom{
  grid-template-columns:1.85fr 1fr;
  margin-top:18px}
.empty{
  text-align:center;
  padding:28px 12px;
  color:var(--muted)}
.empty h2,.empty h3{
  color:var(--ink)}
.empty p{
  margin:10px 0 20px}
.empty-icon{
  width:44px;
  height:44px;
  display:block;
  margin:0 auto 16px;
  opacity:.6}
.chart-empty{
  padding:24px 10px}
.chart-empty h3{
  margin:8px 0}
.review-row{
  display:flex;
  gap:12px;
  align-items:center;
  padding:16px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink)}
.review-row:last-child{
  border:0}
.review-row .icon{
  width:24px;
  height:24px}
.review-row>span:nth-child(2){
  flex:1;
  min-width:0}
.review-row strong{
  font-size:12px;
  font-weight:550}
.pill{
  display:inline-block;
  border:0;
  border-radius:20px;
  background:#fff0ce;
  color:#925000;
  font-size:10px;
  padding:5px 10px;
  white-space:nowrap}
.pill.info{
  background:#e8f3ff;
  color:#0063c9}
.section-heading{
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:15px}
.section-heading a{
  font-size:12px;
  white-space:nowrap}
.forecast-row{
  padding:14px 0;
  border-bottom:1px solid var(--line)}
.forecast-row p{
  margin:0 0 5px;
  color:var(--muted);
  font-size:12px}
.forecast-row strong{
  font-size:21px}
.finance-bottom>.card>p{
  margin-top:18px}
.footer-note{
  font-size:11px;
  color:var(--muted);
  margin-top:24px}
.actions{
  display:flex;
  gap:12px;
  flex-shrink:0}
.notice,.error,.errorlist{
  border:1px solid #eed4a4;
  border-radius:5px;
  background:#fff5df;
  padding:12px 15px;
  margin:0 0 18px;
  font-size:12px}
.error,.errorlist{
  background:#fff0ec;
  border-color:#e4b3a3;
  color:#8d341d}
.errorlist{
  list-style:none;
  padding:8px 10px;
  margin:8px 0}
.narrow{
  max-width:780px;
  margin-top:25px}
.dropzone{
  display:grid;
  gap:10px;
  border:1px dashed #aab9cf;
  border-radius:6px;
  background:#f8fbff;
  text-align:center;
  padding:35px 20px;
  cursor:pointer}
.dropzone .empty-icon{
  margin-bottom:0}
.dropzone input{
  max-width:100%;
  margin-top:15px}
.dropzone span{
  color:var(--muted);
  font-size:12px}
.checkbox{
  display:flex;
  align-items:start;
  gap:12px;
  margin:22px 0}
.checkbox input{
  width:18px;
  height:18px;
  flex-shrink:0;
  margin-top:2px}
input:not([type=checkbox]):not([type=file]),select{
  width:100%;
  min-height:44px;
  border:1px solid #cad5e5;
  border-radius:4px;
  background:white;
  color:var(--ink);
  padding:9px 11px}
label{
  display:block;
  font-size:12px;
  color:var(--muted)}
.field{
  margin-bottom:16px}
.field label{
  margin-bottom:6px}
.filters{
  display:flex;
  gap:14px;
  align-items:end;
  margin:24px 0}
.filters label{
  flex:1;
  max-width:400px}
.filters input,.filters select{
  display:block;
  margin-top:6px}
.record{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink)}
.record:last-child{
  border:0}
.record>span:first-child{
  min-width:0;
  overflow-wrap:anywhere}
.money{
  font-variant-numeric:tabular-nums;
  white-space:nowrap}
.table-scroll{
  overflow-x:auto}
table{
  width:100%;
  border-collapse:collapse;
  text-align:left;
  font-size:12px}
th{
  font-size:11px;
  font-weight:500;
  color:var(--muted);
  background:var(--pale);
  padding:11px 10px;
  white-space:nowrap}
td{
  padding:16px 10px;
  border-bottom:1px solid var(--line);
  vertical-align:middle}
td:first-child{
  white-space:nowrap;
  color:var(--muted)}
tr:last-child td{
  border:0}
.row-link{
  color:var(--ink)}
.row-link strong{
  font-weight:550}
.amount{
  text-align:right}
.review-grid{
  grid-template-columns:1.3fr 1fr;
  align-items:start}
.document-workspace{
  display:grid;
  grid-template-columns:.85fr 1fr 1fr;
  gap:16px;
  align-items:start}
.tabs{
  display:flex;
  background:#f8fbff;
  border:1px solid var(--line);
  border-radius:4px;
  padding:5px;
  gap:5px}
.tabs a{
  flex:1;
  padding:7px;
  font-size:12px;
  text-align:center}
.tabs a:first-child{
  background:var(--selected);
  border-radius:3px}
.inbox-item{
  display:flex;
  gap:12px;
  align-items:start;
  padding:18px 10px;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  border-radius:5px}
.inbox-item.selected{
  background:var(--selected)}
.inbox-item strong{
  font-size:12px;
  overflow-wrap:anywhere}
.inbox-item .pill{
  margin-top:8px}
.inbox-item span{
  min-width:0}
.document-preview{
  display:block;
  width:100%;
  height:auto;
  max-height:680px;
  object-fit:contain;
  background:#f5f5f5;
  margin:18px 0}
.pdf-original{
  background:var(--pale);
  border:1px solid var(--line);
  padding:54px 16px;
  text-align:center;
  margin:20px 0;
  min-height:330px;
  overflow-wrap:anywhere}
.pdf-original strong{
  font-size:14px}
.history{
  margin-top:18px}
details{
  padding:14px 0;
  border-bottom:1px solid var(--line);
  overflow-wrap:anywhere}
summary{
  cursor:pointer;
  font-size:12px}
details p,pre{
  font-size:11px;
  white-space:pre-wrap;
  overflow-wrap:anywhere}
.login{
  max-width:460px;
  margin:60px auto;
  padding:36px;
  border:1px solid var(--line);
  border-radius:8px}
.login-logo{
  width:210px;
  margin-bottom:30px}
.login h1{
  font-size:29px;
  letter-spacing:-.6px;
  line-height:1.3}
.login form label{
  margin-bottom:6px}
.login button{
  width:100%;
  margin-top:15px}
.public{
  margin:0}
.public main{
  max-width:720px}
.login .eyebrow{
  margin-top:5px}
.busy{
  font-size:12px;
  margin-left:10px}
.skip{
  position:fixed;
  top:-100px;
  left:10px;
  background:white;
  padding:10px;
  z-index:20}
.skip:focus{
  top:10px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid #0068d8;
  outline-offset:3px}
[hidden]{
  display:none!important}

@media(max-width:1180px){
  .sidebar{
  width:210px}
.logo{
  width:180px}
.shell{
  margin-left:210px}
.public{
  margin:0}
main{
  padding:18px 22px}
.topbar{
  padding:0 22px;
  gap:12px}
.current-date{
  display:none}
h1{
  font-size:30px}
.subtitle{
  font-size:17px}
.heading .actions{
  flex-direction:column;
  gap:7px}
.card{
  padding:18px}
.metric{
  gap:12px}
.metric strong{
  font-size:20px}
.metric-icon{
  width:36px;
  height:36px;
  padding:8px}
.document-workspace{
  grid-template-columns:.8fr 1fr}
.receipt-fields{
  grid-column:2}
.inbox{
  grid-row:span 2}
.review-row{
  flex-wrap:wrap}
.review-row .pill{
  margin-left:36px}
.finance-bottom{
  grid-template-columns:1.6fr 1fr}
}

@media(max-width:760px){
  .sidebar{
  position:static;
  width:100%;
  padding:15px 12px 0}
.logo{
  width:180px;
  height:32px}
.workspace{
  padding:0 8px;
  font-size:12px}
nav{
  padding:12px 0;
  display:flex;
  overflow-x:auto;
  gap:4px}
nav a{
  flex-shrink:0;
  white-space:nowrap;
  gap:8px;
  min-height:44px;
  padding:10px 12px;
  font-size:12px}
nav .icon{
  width:18px;
  height:18px}
.sidebar-foot{
  display:none}
.shell{
  margin:0}
.topbar{
  height:58px;
  padding:0 18px}
.global-search,.current-date{
  display:none}
.environment{
  font-size:10px;
  padding:6px 9px}
.mobile-account{
  display:flex;
  gap:10px;
  align-items:center;
  margin-left:auto;
  font-size:11px}
.mobile-account button{
  min-height:44px;
  padding:6px 8px;
  background:transparent;
  border:0;
  color:var(--link);
  font-size:11px}
main{
  padding:16px 18px 30px}
.dev-note{
  font-size:10px;
  margin-bottom:13px}
h1{
  font-size:28px;
  letter-spacing:-.8px;
  line-height:1.25}
.subtitle{
  font-size:15px;
  margin-top:6px}
.heading{
  display:block;
  margin-bottom:20px}
.heading .actions{
  flex-direction:row;
  margin-top:18px}
.button,button{
  font-size:12px;
  padding:11px 15px;
  min-height:44px}
.grid,.three,.two,.finance-middle,.finance-bottom,.review-grid,.document-workspace{
  grid-template-columns:1fr;
  gap:14px}
.card{
  padding:18px}
.metric{
  min-height:105px}
.metric strong{
  font-size:24px}
.metric-icon{
  width:42px;
  height:42px;
  padding:10px}
.review-row{
  flex-wrap:nowrap}
.review-row .pill{
  margin-left:0;
  font-size:9px}
.review-row strong{
  font-size:11px}
.review-row .icon{
  width:20px;
  height:20px}
.review-row small{
  font-size:10px}
.chart-empty{
  padding:18px 5px}
.finance-bottom{
  margin-top:14px}
.section-heading h2{
  font-size:17px}
.section-heading a{
  font-size:11px}
.filters{
  flex-direction:column;
  align-items:stretch}
.filters label{
  max-width:none}
.inbox{
  grid-row:auto}
.receipt-fields{
  grid-column:auto}
.inbox .inbox-item:not(.selected){
  display:none}
.inbox-item{
  padding:12px}
.pdf-original{
  min-height:220px;
  padding:35px 12px}
.history{
  margin-top:14px}
.narrow{
  margin-top:20px}
.login{
  padding:25px;
  margin:25px 0}
.login h1{
  font-size:26px}
.table-scroll table{
  min-width:610px}
.record{
  gap:12px}
.record .pill{
  white-space:normal;
  max-width:115px}
h2{
  font-size:18px}
.footer-note{
  line-height:1.8}
.dropzone{
  padding:25px 12px}
}

@media(prefers-reduced-motion:reduce){
  *{
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important}
}

/* Selected 2026-11-01 reference: typography and density refinements after comparison. */
body{
  font-size:16px}
nav a{
  font-size:16px;
  gap:17px}
h1{
  font-size:40px;
  letter-spacing:-1.3px}
h2{
  font-size:21px}
.metric p{
  font-size:15px}
.metric strong{
  font-size:29px}
.metric small{
  font-size:12px}
table{
  font-size:14px}
th{
  font-size:12px}
.review-row strong{
  font-size:14px}
.review-row small{
  font-size:12px}
.pill{
  font-size:11px}
.section-heading a{
  font-size:14px}
.forecast-row p{
  font-size:14px}
.forecast-row strong{
  font-size:24px}
.current-date{
  font-size:14px}
.global-search input{
  font-size:13px}
.inbox-item strong{
  font-size:14px}
.inbox-item small{
  font-size:12px}
.receipt-fields label{
  font-size:13px}

@media(max-width:1180px){
  nav a{
  font-size:14px}
h1{
  font-size:32px}
.metric strong{
  font-size:22px}
.metric p{
  font-size:13px}
.review-row strong{
  font-size:12px}
}

@media(max-width:760px){
  body{
  font-size:14px}
nav a{
  font-size:12px}
h1{
  font-size:28px}
h2{
  font-size:18px}
.metric strong{
  font-size:25px}
.metric p{
  font-size:14px}
.review-row strong{
  font-size:11px}
.review-row small{
  font-size:10px}
.pill{
  font-size:10px}
.section-heading a{
  font-size:11px}
table{
  font-size:12px}
.inbox-item strong{
  font-size:13px}
}

nav .icon,nav a[aria-current] .icon{
  filter:none}
