/* ==========================================================================
   OraOS Business, Alpha 0.1
   Design layer.

   Direction: paper, not dashboard. An ivory canvas, ink type, one restrained
   gold accent used for emphasis and never for decoration. Status colour is
   named by meaning. Figures are tabular so columns line up.

   This is a deliberate evolution of the Ora Coffee Tools palette, which is the
   most mature working-tool language in the group. The earlier Core Engine
   prototype was dark and executive facing. A business owner uses this one
   every day, often on a phone in daylight, so it reads as paper.
   ========================================================================== */

:root{
  color-scheme: light;

  --canvas:#f7f5f1;
  --paper:#ffffff;
  --panel:#fbfaf7;
  --panel-2:#f3f0ea;

  --line:#e6e2da;
  --line-strong:#d3cec3;

  --ink-900:#0c0f14;
  --ink-800:#171c24;
  --ink-700:#2a313b;
  --ink-600:#4b5563;
  --ink-500:#6b7280;
  --ink-400:#9aa1ab;
  --ink-300:#c2c6cc;

  --accent-50:#faf6ee;
  --accent-100:#f0e6d0;
  --accent-200:#e0cba4;
  --accent-400:#b8912f;
  --accent-500:#9a7822;
  --accent-600:#7d611b;

  --good-50:#eaf5ee;  --good-100:#d3e9dc;  --good-500:#0f7a43;  --good-600:#0b6135;
  --warn-50:#fdf6e7;  --warn-100:#f8e9c4;  --warn-500:#a2700f;  --warn-600:#84590a;
  --bad-50:#fbecea;   --bad-100:#f6d8d4;   --bad-500:#b3261e;   --bad-600:#8f1e18;
  --calm-50:#eef2f7;  --calm-500:#3f5b7d;

  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:22px;

  --shadow-card:0 1px 2px rgba(12,15,20,.04), 0 1px 1px rgba(12,15,20,.03);
  --shadow-raised:0 2px 4px rgba(12,15,20,.05), 0 8px 24px -12px rgba(12,15,20,.14);
  --shadow-float:0 24px 60px -24px rgba(12,15,20,.32), 0 2px 8px rgba(12,15,20,.06);

  --sans:'Inter var','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --serif:'Iowan Old Style','Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;

  --sidebar-w:242px;
  --topbar-h:64px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  background:var(--canvas);
  color:var(--ink-900);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-size:15px;
  line-height:1.5;
}
table,.tnum,.num{font-variant-numeric:tabular-nums}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--accent-100);color:var(--ink-900)}
:focus-visible{outline:2px solid var(--accent-400);outline-offset:2px;border-radius:4px}
[hidden]{display:none !important}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:8px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:var(--ink-300);background-clip:content-box;border:3px solid transparent}
::-webkit-scrollbar-track{background:transparent}

/* --------------------------------------------------------------------------
   Type scale
   -------------------------------------------------------------------------- */
.display{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.14}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.011em;line-height:1.25}
.label{
  font-size:10.5px;font-weight:650;text-transform:uppercase;letter-spacing:.09em;
  color:var(--ink-500);
}
.muted{color:var(--ink-500)}
.dim{color:var(--ink-400)}
.small{font-size:13px}
.xs{font-size:12px}
.strong{font-weight:600}
.pos{color:var(--good-500)}
.neg{color:var(--bad-500)}
.warnt{color:var(--warn-600)}

/* --------------------------------------------------------------------------
   Brand mark
   -------------------------------------------------------------------------- */
.mark{display:flex;align-items:center;gap:10px;min-width:0}
.mark-glyph{
  width:32px;height:32px;border-radius:9px;flex:none;
  background:linear-gradient(150deg,#12161d,#2a313b 70%);
  color:var(--accent-200);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:16px;line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09);
}
.mark-glyph.lg{width:44px;height:44px;border-radius:12px;font-size:22px}
.mark-text{display:flex;flex-direction:column;min-width:0}
.mark-text b{font-size:14.5px;font-weight:650;letter-spacing:-.01em;white-space:nowrap}
.mark-text span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400)}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 15px;border-radius:9px;font-size:13.5px;font-weight:560;
  border:1px solid var(--line-strong);background:var(--paper);color:var(--ink-800);
  transition:background .13s ease,border-color .13s ease,transform .1s ease,box-shadow .13s ease;
  white-space:nowrap;
}
.btn:hover{background:var(--panel);border-color:var(--ink-300)}
.btn:active{transform:translateY(.5px)}
.btn-primary{
  background:var(--ink-900);color:#fff;border-color:var(--ink-900);
  box-shadow:0 1px 2px rgba(12,15,20,.18);
}
.btn-primary:hover{background:var(--ink-800);border-color:var(--ink-800)}
.btn-accent{background:var(--accent-500);border-color:var(--accent-500);color:#fff}
.btn-accent:hover{background:var(--accent-600);border-color:var(--accent-600)}
.btn-ghost{border-color:transparent;background:transparent;color:var(--ink-600)}
.btn-ghost:hover{background:var(--panel-2);color:var(--ink-900)}
.btn-sm{padding:6px 11px;font-size:12.5px;border-radius:8px}
.btn-lg{padding:12px 22px;font-size:15px;border-radius:11px}
.btn-block{width:100%}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-danger{color:var(--bad-500);border-color:var(--bad-100)}
.btn-danger:hover{background:var(--bad-50);border-color:var(--bad-100)}

/* --------------------------------------------------------------------------
   Surfaces
   -------------------------------------------------------------------------- */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-card)}
.card-pad{padding:18px 20px}
.card-h{display:flex;align-items:flex-start;gap:12px;padding:16px 20px 0}
.card-h .ttl{font-size:14.5px;font-weight:620;letter-spacing:-.008em}
.card-h .sub{font-size:12.5px;color:var(--ink-500);margin-top:2px}
.card-h .right{margin-left:auto;display:flex;gap:8px;align-items:center;flex:none}
.card-body{padding:16px 20px}
.card-foot{padding:12px 20px;border-top:1px solid var(--line);background:var(--panel);border-radius:0 0 var(--r-lg) var(--r-lg)}
.divider{height:1px;background:var(--line);border:0}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r)}

.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-main{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr)}
.stack{display:flex;flex-direction:column;gap:16px}
.row{display:flex;align-items:center;gap:10px}
.row-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.spacer{flex:1}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}

/* --------------------------------------------------------------------------
   Badges, chips, pills
   -------------------------------------------------------------------------- */
.badge{
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  font-size:11.5px;font-weight:600;padding:2.5px 9px;border-radius:20px;
  border:1px solid transparent;line-height:1.5;
}
.badge.good{background:var(--good-50);color:var(--good-600);border-color:var(--good-100)}
.badge.warn{background:var(--warn-50);color:var(--warn-600);border-color:var(--warn-100)}
.badge.bad{background:var(--bad-50);color:var(--bad-600);border-color:var(--bad-100)}
.badge.accent{background:var(--accent-50);color:var(--accent-600);border-color:var(--accent-100)}
.badge.neutral{background:var(--panel-2);color:var(--ink-600);border-color:var(--line)}
.badge.calm{background:var(--calm-50);color:var(--calm-500);border-color:#dde5ef}
.badge .dot{width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}

.proto{
  display:inline-flex;align-items:center;gap:5px;
  font-size:10px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;
  color:var(--accent-600);background:var(--accent-50);
  border:1px dashed var(--accent-200);border-radius:6px;padding:2px 7px;
}

.chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 13px;border-radius:20px;font-size:13px;font-weight:520;
  border:1px solid var(--line-strong);background:var(--paper);color:var(--ink-700);
  transition:background .12s,border-color .12s,color .12s;
}
.chip:hover{background:var(--accent-50);border-color:var(--accent-200);color:var(--accent-600)}
.chip.on{background:var(--ink-900);border-color:var(--ink-900);color:#fff}

.segment{display:inline-flex;background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px;overflow-x:auto;max-width:100%}
.segment button{
  padding:6.5px 14px;border-radius:8px;font-size:13px;font-weight:540;color:var(--ink-600);
  white-space:nowrap;transition:background .12s,color .12s;
}
.segment button:hover{color:var(--ink-900)}
.segment button.on{background:var(--paper);color:var(--ink-900);box-shadow:var(--shadow-card);font-weight:600}

/* --------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
.tbl th{
  text-align:left;font-size:10.5px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-500);padding:0 16px 9px;border-bottom:1px solid var(--line);white-space:nowrap;
}
.tbl td{padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:middle;color:var(--ink-700)}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr.clickable{cursor:pointer;transition:background .1s}
.tbl tbody tr.clickable:hover{background:var(--accent-50)}
.tbl .r{text-align:right}
.tbl .primary{color:var(--ink-900);font-weight:560}
.tbl .nowrap{white-space:nowrap}
.tbl tfoot td{padding:12px 16px;font-weight:640;color:var(--ink-900);border-top:1px solid var(--line-strong)}

.list{display:flex;flex-direction:column}
.list-row{
  display:flex;align-items:center;gap:14px;padding:13px 20px;
  border-bottom:1px solid var(--line);transition:background .1s;
}
.list-row:last-child{border-bottom:0}
.list-row.clickable{cursor:pointer}
.list-row.clickable:hover{background:var(--accent-50)}
.list-row .lead{min-width:0;flex:1}
.list-row .lead b{display:block;font-size:14px;font-weight:560;color:var(--ink-900);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.list-row .lead span{font-size:12.5px;color:var(--ink-500)}
.list-row .tail{text-align:right;flex:none}
.list-row .tail b{display:block;font-size:14px;font-weight:600}
.list-row .tail span{font-size:12px;color:var(--ink-500)}

.avatar{
  width:34px;height:34px;border-radius:10px;flex:none;
  background:var(--panel-2);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  font-size:12.5px;font-weight:650;color:var(--ink-600);
}
.avatar.sm{width:28px;height:28px;border-radius:8px;font-size:11px}
.avatar.gold{background:var(--accent-50);border-color:var(--accent-100);color:var(--accent-600)}
.avatar.ink{background:var(--ink-900);border-color:var(--ink-900);color:#fff}

.empty{padding:40px 20px;text-align:center;color:var(--ink-400);font-size:13.5px}

/* --------------------------------------------------------------------------
   App shell
   -------------------------------------------------------------------------- */
#app{display:flex;min-height:100vh}

.sidebar{
  width:var(--sidebar-w);flex:none;background:var(--paper);border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:60;
}
.side-top{padding:16px 16px 12px}
.side-biz{
  margin-top:14px;display:flex;align-items:center;gap:9px;width:100%;
  background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 10px;text-align:left;
}
.side-biz:hover{border-color:var(--line-strong)}
.side-biz .bz{width:24px;height:24px;border-radius:7px;background:var(--accent-100);color:var(--accent-600);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none}
.side-biz .nm{min-width:0;flex:1}
.side-biz .nm b{display:block;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-biz .nm span{font-size:10.5px;color:var(--ink-400)}

/* Named after a real company, so the workspace says what it is, quietly and
   permanently, rather than leaving a viewer to assume the figures are real. */
.demo-flag{
  margin:10px 14px 0;padding:8px 11px;border-radius:var(--r-sm);
  background:var(--accent-50);border:1px solid var(--accent-100);
  font-size:10.5px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-600);
}
.demo-flag span{
  display:block;margin-top:2px;font-size:10.5px;font-weight:500;letter-spacing:.01em;
  text-transform:none;color:var(--ink-500);
}

.nav{flex:1;overflow-y:auto;padding:6px 10px 14px}
.nav-label{font-size:10px;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);padding:14px 10px 6px}
.nav-item{
  display:flex;align-items:center;gap:11px;width:100%;
  padding:9px 10px;border-radius:9px;margin:1px 0;text-align:left;
  font-size:13.5px;font-weight:520;color:var(--ink-600);
  transition:background .12s,color .12s;position:relative;
}
.nav-item:hover{background:var(--panel-2);color:var(--ink-900)}
.nav-item.on{background:var(--accent-50);color:var(--accent-600);font-weight:600}
.nav-item.on::before{content:"";position:absolute;left:-10px;top:9px;bottom:9px;width:2.5px;border-radius:0 3px 3px 0;background:var(--accent-500)}
.nav-item .ic{width:17px;height:17px;flex:none;opacity:.92}
.nav-item .ct{
  margin-left:auto;font-size:10.5px;font-weight:700;min-width:18px;text-align:center;
  padding:1px 6px;border-radius:20px;background:var(--bad-50);color:var(--bad-600);
}
.nav-item .ct.warn{background:var(--warn-50);color:var(--warn-600)}
.nav-item .ct.neutral{background:var(--panel-2);color:var(--ink-500)}

.side-foot{border-top:1px solid var(--line);padding:10px}
.side-user{display:flex;align-items:center;gap:10px;width:100%;padding:8px;border-radius:10px;text-align:left}
.side-user:hover{background:var(--panel-2)}
.side-user .nm{min-width:0;flex:1}
.side-user .nm b{display:block;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-user .nm span{font-size:11px;color:var(--ink-400)}

.main{flex:1;min-width:0;margin-left:var(--sidebar-w);display:flex;flex-direction:column}

.topbar{
  position:sticky;top:0;z-index:40;height:var(--topbar-h);
  display:flex;align-items:center;gap:14px;padding:0 26px;
  background:rgba(247,245,241,.86);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar h1{font-size:16.5px;font-weight:620}
.topbar .sub{font-size:12.5px;color:var(--ink-500);margin-top:1px}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:9px}
.menu-btn{display:none;width:36px;height:36px;border:1px solid var(--line);border-radius:9px;
  background:var(--paper);align-items:center;justify-content:center}
.icon-btn{
  width:36px;height:36px;border:1px solid var(--line);border-radius:9px;background:var(--paper);
  display:flex;align-items:center;justify-content:center;color:var(--ink-600);position:relative;
  transition:border-color .12s,color .12s;
}
.icon-btn:hover{border-color:var(--line-strong);color:var(--ink-900)}
.icon-btn .pip{position:absolute;top:7px;right:7px;width:6px;height:6px;border-radius:50%;
  background:var(--bad-500);border:1.5px solid var(--paper)}

.ask-btn{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 11px;border-radius:20px;
  border:1px solid var(--line-strong);background:var(--paper);
  font-size:13px;font-weight:540;color:var(--ink-600);transition:border-color .13s,color .13s,background .13s;
}
.ask-btn:hover{border-color:var(--accent-200);background:var(--accent-50);color:var(--accent-600)}
.ask-btn .k{font-size:10.5px;color:var(--ink-400);border:1px solid var(--line);border-radius:5px;padding:0 5px;margin-left:4px}

.view{flex:1;padding:26px;max-width:1320px;width:100%}
.view-head{margin-bottom:22px}
.view-head .display{font-size:27px;margin-bottom:5px}
.view-head p{color:var(--ink-500);font-size:14px;max-width:64ch}

.scrim{position:fixed;inset:0;background:rgba(12,15,20,.4);z-index:55;opacity:0;pointer-events:none;transition:opacity .2s}
.scrim.on{opacity:1;pointer-events:auto}

/* --------------------------------------------------------------------------
   Home
   -------------------------------------------------------------------------- */
.greet{margin-bottom:24px}
.greet .display{font-size:32px}
.greet p{color:var(--ink-500);font-size:14.5px;margin-top:6px}

.today{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card);overflow:hidden;
}
.today-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.today-cell{padding:20px 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.today-cell:nth-child(3n){border-right:0}
.today-cell:nth-last-child(-n+3){border-bottom:0}
.today-cell .k{font-size:12.5px;color:var(--ink-500);font-weight:520}
.today-cell .v{font-size:24px;font-weight:650;letter-spacing:-.022em;margin:7px 0 4px;color:var(--ink-900)}
.today-cell .m{font-size:12px;color:var(--ink-400);display:flex;align-items:center;gap:5px}
.today-cell.link{cursor:pointer;transition:background .12s}
.today-cell.link:hover{background:var(--accent-50)}

.attend{display:flex;flex-direction:column}
.attend-row{
  display:flex;align-items:center;gap:13px;padding:14px 20px;border-bottom:1px solid var(--line);
  cursor:pointer;transition:background .12s;text-align:left;width:100%;
}
.attend-row:last-child{border-bottom:0}
.attend-row:hover{background:var(--accent-50)}
.attend-ic{
  width:30px;height:30px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;
}
.attend-ic.bad{background:var(--bad-50);color:var(--bad-500)}
.attend-ic.warn{background:var(--warn-50);color:var(--warn-600)}
.attend-ic.calm{background:var(--calm-50);color:var(--calm-500)}
.attend-ic.accent{background:var(--accent-50);color:var(--accent-600)}
.attend-row .tx{min-width:0;flex:1}
.attend-row .tx b{display:block;font-size:13.8px;font-weight:550;color:var(--ink-900)}
.attend-row .tx span{font-size:12.5px;color:var(--ink-500)}
.attend-row .go{color:var(--ink-300);flex:none}
.attend-row:hover .go{color:var(--accent-500)}

/* --------------------------------------------------------------------------
   Charts
   -------------------------------------------------------------------------- */
/* A chart is a plot plus a label rail. The plot may stretch; the rail never
   does, so type stays one size from a phone to an A4 page. */
.chartbox{width:100%}
.chart-axis{
  display:flex;justify-content:space-between;gap:2px;margin-top:9px;
  font-size:11px;font-weight:600;letter-spacing:.03em;color:var(--ink-400);
}
.chart-axis span{flex:1;text-align:center;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chart-axis.ends span:first-child{text-align:left}
.chart-axis.ends span:last-child{text-align:right}
.chart-axis .mark{color:var(--warn-600)}
@media (max-width:620px){
  .chart-axis.dense span:nth-child(even){visibility:hidden}
}

/* Bars, in plain boxes so nothing distorts */
.bars{display:flex;align-items:flex-end;gap:3px;width:100%}
.bar-col{flex:1;height:100%;display:flex;align-items:flex-end;min-width:0}
.bar-b{
  display:block;width:100%;border-radius:3px 3px 1px 1px;background:var(--ink-300);
  transition:background .15s;
}
.bar-b.hi{background:var(--ink-800)}
.bar-b.acc{background:var(--accent-400)}
.bar-col:hover .bar-b{background:var(--accent-500)}

/* Line plot, with the markers held in an unstretched layer above it */
.chart-plot{position:relative;width:100%}
.chart{width:100%;height:100%;display:block;overflow:visible}
.chart .grid-line{stroke:var(--line);stroke-width:1;stroke-dasharray:2 4}
.chart .ln{fill:none;stroke:var(--ink-800);stroke-width:1.75;stroke-linejoin:round;stroke-linecap:round}
.chart .ln.acc{stroke:var(--accent-500)}
.chart .area{fill:url(#areaGrad)}
.chart-dots{position:absolute;inset:0;pointer-events:none}
.cdot{
  position:absolute;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;
  background:var(--paper);border:1.75px solid var(--ink-800);box-sizing:content-box;pointer-events:auto;
}
.cdot.low{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-color:var(--warn-500)}

.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink-500);margin-top:12px}
.legend i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:6px}

.bar-line{display:flex;flex-direction:column;gap:11px}
.bar-item .bt{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px}
.bar-item .bt b{font-weight:550;color:var(--ink-800)}
.bar-item .bt span{color:var(--ink-500);font-variant-numeric:tabular-nums}
.bar-track{height:6px;border-radius:4px;background:var(--panel-2);overflow:hidden}
.bar-fill{height:100%;border-radius:4px;background:var(--ink-800);transition:width .6s cubic-bezier(.2,.8,.3,1)}
.bar-fill.acc{background:var(--accent-400)}
.bar-fill.good{background:var(--good-500)}
.bar-fill.warn{background:var(--warn-500)}
.bar-fill.bad{background:var(--bad-500)}

/* --------------------------------------------------------------------------
   Readiness
   -------------------------------------------------------------------------- */
.ready-hero{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:34px;align-items:center;
  padding:28px 30px;
}
.dial{position:relative;width:186px;height:186px;flex:none}
.dial svg{transform:rotate(-90deg)}
.dial .track{fill:none;stroke:var(--panel-2);stroke-width:13}
.dial .prog{fill:none;stroke:var(--accent-400);stroke-width:13;stroke-linecap:round;
  transition:stroke-dashoffset 1.1s cubic-bezier(.22,.85,.3,1)}
.dial .ghost{fill:none;stroke:var(--accent-100);stroke-width:13;stroke-linecap:round}
.dial-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.dial-center .n{font-family:var(--serif);font-size:50px;line-height:1;letter-spacing:-.02em}
.dial-center .n sup{font-size:20px;font-family:var(--sans);font-weight:600;top:-16px;position:relative;left:1px}
.dial-center .t{font-size:11px;font-weight:650;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-400);margin-top:5px}

.comp-row{display:grid;grid-template-columns:minmax(120px,1.15fr) minmax(90px,2fr) auto;gap:14px;align-items:center;
  padding:11px 0;border-bottom:1px solid var(--line)}
.comp-row:last-child{border-bottom:0}
.comp-row .cn{font-size:13.5px;font-weight:520;color:var(--ink-800)}
.comp-row .cn small{display:block;font-size:11px;color:var(--ink-400);font-weight:400}
.comp-row .cv{font-size:13.5px;font-weight:650;text-align:right;min-width:44px}

.improve{
  display:flex;align-items:flex-start;gap:14px;padding:15px 20px;border-bottom:1px solid var(--line);
}
.improve:last-child{border-bottom:0}
.improve .idx{
  width:24px;height:24px;border-radius:7px;background:var(--panel-2);color:var(--ink-500);
  font-size:11.5px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px;
}
.improve .tx{flex:1;min-width:0}
.improve .tx b{display:block;font-size:14px;font-weight:550;color:var(--ink-900)}
.improve .tx span{font-size:12.5px;color:var(--ink-500)}
.improve .gain{font-size:13px;font-weight:700;color:var(--good-500);flex:none;white-space:nowrap}
.improve.done{opacity:.55}
.improve.done .tx b{text-decoration:line-through}

.finroom-cta{
  background:linear-gradient(140deg,#12161d 0%,#20262f 58%,#2c3038 100%);
  color:#fff;border-radius:var(--r-lg);padding:26px 28px;position:relative;overflow:hidden;
}
.finroom-cta::after{
  content:"";position:absolute;right:-70px;top:-80px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(184,145,47,.24),transparent 66%);
}
.finroom-cta .display{font-size:22px;color:#fff;margin-bottom:8px}
.finroom-cta p{color:rgba(255,255,255,.66);font-size:13.5px;max-width:52ch}
.finroom-cta .btn{position:relative;z-index:2}

.disclaim{
  font-size:12px;color:var(--ink-500);background:var(--panel);border:1px solid var(--line);
  border-left:2.5px solid var(--accent-200);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:11px 14px;
}

/* --------------------------------------------------------------------------
   Financing room
   -------------------------------------------------------------------------- */
.room-nav{display:flex;flex-direction:column;gap:1px;position:sticky;top:calc(var(--topbar-h) + 20px)}
.room-nav button{
  text-align:left;padding:9px 12px;border-radius:8px;font-size:13px;color:var(--ink-600);
  display:flex;align-items:center;gap:9px;
}
.room-nav button:hover{background:var(--panel-2);color:var(--ink-900)}
.room-nav button.on{background:var(--ink-900);color:#fff;font-weight:550}
.room-nav .tick{width:14px;height:14px;flex:none;opacity:.7}
.room-sec{scroll-margin-top:calc(var(--topbar-h) + 20px)}
.room-sec h3{font-size:16px;margin-bottom:3px}
.room-sec .rs{font-size:12.5px;color:var(--ink-500);margin-bottom:14px}

.kv{display:grid;grid-template-columns:minmax(130px,auto) 1fr;gap:9px 20px;font-size:13.5px}
.kv dt{color:var(--ink-500)}
.kv dd{color:var(--ink-900);font-weight:520}

.build-step{display:flex;align-items:center;gap:11px;padding:8px 0;font-size:13.5px;color:var(--ink-400);
  transition:color .3s}
.build-step.on{color:var(--ink-900)}
.build-step.done{color:var(--ink-600)}
.build-step .sp{width:17px;height:17px;flex:none}
.spin{animation:spin 1s linear infinite;transform-origin:center}
@keyframes spin{to{transform:rotate(360deg)}}

/* --------------------------------------------------------------------------
   Drawer (record detail)
   -------------------------------------------------------------------------- */
.drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(560px,100vw);z-index:70;
  background:var(--canvas);border-left:1px solid var(--line);box-shadow:var(--shadow-float);
  transform:translateX(102%);transition:transform .3s cubic-bezier(.22,.85,.3,1);
  display:flex;flex-direction:column;
}
.drawer.on{transform:none}
.drawer-h{
  padding:18px 22px;border-bottom:1px solid var(--line);background:var(--paper);
  display:flex;align-items:flex-start;gap:14px;flex:none;
}
.drawer-h .t{flex:1;min-width:0}
.drawer-h .t h2{font-size:17.5px;font-weight:620;letter-spacing:-.012em}
.drawer-h .t p{font-size:12.5px;color:var(--ink-500);margin-top:2px}
.drawer-b{flex:1;overflow-y:auto;padding:20px 22px;display:flex;flex-direction:column;gap:16px}
.drawer-f{padding:14px 22px;border-top:1px solid var(--line);background:var(--paper);display:flex;gap:9px;flex:none;flex-wrap:wrap}

.mini-stat{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:var(--r);
  background:var(--paper);overflow:hidden}
.mini-stat > div{padding:13px 14px;border-right:1px solid var(--line)}
.mini-stat > div:last-child{border-right:0}
.mini-stat .k{font-size:11px;color:var(--ink-500);font-weight:520}
.mini-stat .v{font-size:16px;font-weight:640;margin-top:3px;letter-spacing:-.015em}

.timeline{display:flex;flex-direction:column;gap:0}
.tl-item{display:flex;gap:12px;padding-bottom:16px;position:relative}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:"";position:absolute;left:8px;top:18px;bottom:0;width:1px;background:var(--line)}
.tl-item:last-child::before{display:none}
.tl-dot{width:17px;height:17px;border-radius:50%;background:var(--paper);border:2px solid var(--line-strong);flex:none;margin-top:1px;z-index:1}
.tl-dot.on{border-color:var(--accent-400);background:var(--accent-50)}
.tl-dot.done{border-color:var(--good-500);background:var(--good-50)}
.tl-b b{display:block;font-size:13.5px;font-weight:550}
.tl-b span{font-size:12px;color:var(--ink-500)}

/* --------------------------------------------------------------------------
   Ask Ora
   -------------------------------------------------------------------------- */
.ask-panel{
  position:fixed;right:0;top:0;bottom:0;width:min(460px,100vw);z-index:75;
  background:var(--paper);border-left:1px solid var(--line);box-shadow:var(--shadow-float);
  transform:translateX(102%);transition:transform .3s cubic-bezier(.22,.85,.3,1);
  display:flex;flex-direction:column;
}
.ask-panel.on{transform:none}
.ask-h{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:11px;flex:none}
.ask-h .t b{font-size:15px;font-weight:620;display:block}
.ask-h .t span{font-size:11.5px;color:var(--ink-400)}
.ask-body{flex:1;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.ask-foot{padding:12px 16px 16px;border-top:1px solid var(--line);flex:none;background:var(--paper)}
.ask-input{display:flex;gap:8px;align-items:flex-end;background:var(--panel);border:1px solid var(--line-strong);
  border-radius:12px;padding:8px 8px 8px 13px}
.ask-input:focus-within{border-color:var(--accent-400);box-shadow:0 0 0 3px rgba(184,145,47,.11)}
.ask-input textarea{flex:1;border:none;background:transparent;resize:none;font-size:14px;
  max-height:110px;line-height:1.45;padding:5px 0}
.ask-input textarea:focus{outline:none}
.ask-send{width:32px;height:32px;border-radius:9px;background:var(--ink-900);color:#fff;flex:none;
  display:flex;align-items:center;justify-content:center}
.ask-send:disabled{opacity:.3}

.msg{max-width:100%;font-size:14px;line-height:1.55}
.msg.you{align-self:flex-end;background:var(--ink-900);color:#fff;border-radius:14px 14px 4px 14px;
  padding:10px 14px;max-width:84%}
.msg.ora{
  background:var(--panel);border:1px solid var(--line);border-radius:14px 14px 14px 4px;padding:13px 15px;color:var(--ink-800);
}
.msg.ora b{color:var(--ink-900);font-weight:620}
.msg.ora ul{margin:9px 0 0;padding-left:17px}
.msg.ora li{margin-bottom:5px}
.msg.ora .fig{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink-900)}
.msg.ora .src{
  margin-top:12px;padding-top:10px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--ink-400);display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.msg.ora .actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.typing{display:inline-flex;gap:4px;align-items:center;padding:4px 0}
.typing i{width:5px;height:5px;border-radius:50%;background:var(--ink-300);animation:blink 1.3s infinite}
.typing i:nth-child(2){animation-delay:.18s}
.typing i:nth-child(3){animation-delay:.36s}
@keyframes blink{0%,60%,100%{opacity:.25}30%{opacity:1}}

.ask-suggest{display:flex;flex-direction:column;gap:7px}
.ask-suggest button{
  text-align:left;padding:10px 13px;border:1px solid var(--line);border-radius:10px;background:var(--paper);
  font-size:13.2px;color:var(--ink-700);transition:border-color .12s,background .12s;
}
.ask-suggest button:hover{border-color:var(--accent-200);background:var(--accent-50);color:var(--accent-600)}

.ora-inline{
  display:flex;gap:11px;align-items:flex-start;padding:14px 16px;border-radius:var(--r);
  background:var(--accent-50);border:1px solid var(--accent-100);
}
.ora-inline .sp{color:var(--accent-500);flex:none;margin-top:1px}
.ora-inline .tx{font-size:13.3px;color:var(--ink-700);line-height:1.55}
.ora-inline .tx b{color:var(--ink-900);font-weight:600}

/* --------------------------------------------------------------------------
   Toast
   -------------------------------------------------------------------------- */
.toast-wrap{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:120;
  display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{
  background:var(--ink-900);color:#fff;font-size:13.3px;padding:11px 17px;border-radius:11px;
  box-shadow:var(--shadow-float);display:flex;align-items:center;gap:9px;
  animation:toastIn .26s cubic-bezier(.2,.9,.3,1);max-width:90vw;
}
@keyframes toastIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* --------------------------------------------------------------------------
   Modal
   -------------------------------------------------------------------------- */
.modal{
  position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(12,15,20,.42);opacity:0;pointer-events:none;transition:opacity .2s;
}
.modal.on{opacity:1;pointer-events:auto}
.modal-card{
  width:min(520px,100%);background:var(--paper);border-radius:var(--r-xl);box-shadow:var(--shadow-float);
  transform:translateY(14px) scale(.985);transition:transform .24s cubic-bezier(.2,.9,.3,1);
  max-height:88vh;overflow-y:auto;
}
.modal.on .modal-card{transform:none}

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
.field{display:flex;flex-direction:column;gap:6px}
.field > label{font-size:12.5px;font-weight:560;color:var(--ink-700)}
.field .hint{font-size:11.5px;color:var(--ink-400)}
.input,.select,.textarea{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line-strong);
  background:var(--paper);font-size:14px;color:var(--ink-900);transition:border-color .12s,box-shadow .12s;
}
.input:focus,.select:focus,.textarea:focus{
  outline:none;border-color:var(--accent-400);box-shadow:0 0 0 3px rgba(184,145,47,.11);
}
.input::placeholder{color:var(--ink-400)}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5L6 8l3-3.5' fill='none' stroke='%236b7280' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
.textarea{resize:vertical;min-height:80px}
.check{
  display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--line);
  border-radius:11px;cursor:pointer;transition:border-color .12s,background .12s;background:var(--paper);
}
.check:hover{border-color:var(--line-strong)}
.check.on{border-color:var(--accent-400);background:var(--accent-50)}
.check .bx{
  width:18px;height:18px;border-radius:5px;border:1.5px solid var(--line-strong);flex:none;margin-top:1px;
  display:flex;align-items:center;justify-content:center;color:#fff;transition:background .12s,border-color .12s;
}
.check.on .bx{background:var(--accent-500);border-color:var(--accent-500)}
.check .tx b{display:block;font-size:13.5px;font-weight:550}
.check .tx span{font-size:12px;color:var(--ink-500)}

/* --------------------------------------------------------------------------
   Onboarding
   -------------------------------------------------------------------------- */
#onboarding{min-height:100vh;display:flex;flex-direction:column;background:var(--canvas)}
.ob-top{padding:22px 26px;display:flex;align-items:center;gap:14px}
.ob-prog{margin-left:auto;display:flex;align-items:center;gap:8px}
.ob-prog .pl{font-size:11.5px;color:var(--ink-400);font-weight:560}
.ob-bar{width:130px;height:4px;background:var(--line);border-radius:3px;overflow:hidden}
.ob-bar i{display:block;height:100%;background:var(--accent-500);border-radius:3px;transition:width .45s cubic-bezier(.2,.85,.3,1)}
.ob-main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:12px 22px 60px}
.ob-card{width:min(720px,100%)}
.ob-step{animation:obIn .38s cubic-bezier(.2,.85,.3,1)}
@keyframes obIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ob-eyebrow{font-size:11px;font-weight:650;letter-spacing:.11em;text-transform:uppercase;color:var(--accent-600);margin-bottom:12px}
.ob-step h2{font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:-.017em;line-height:1.15;margin-bottom:9px}
.ob-step p.lead{color:var(--ink-500);font-size:14.5px;line-height:1.6;max-width:58ch;margin-bottom:26px}
.ob-step p.lead + p.lead{margin-top:-12px}
.ob-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ob-fields .full{grid-column:1 / -1}
.ob-nav{display:flex;align-items:center;gap:11px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.ob-hero{
  display:grid;grid-template-columns:minmax(0,1fr);gap:26px;
}
.ob-quote{
  font-family:var(--serif);font-size:34px;line-height:1.2;letter-spacing:-.017em;margin:6px 0 16px;
}
.ob-quote em{font-style:normal;color:var(--accent-600)}
.ob-pts{display:flex;flex-direction:column;gap:13px;margin:22px 0 4px}
.ob-pt{display:flex;gap:12px;align-items:flex-start}
.ob-pt .n{width:22px;height:22px;border-radius:6px;background:var(--accent-50);color:var(--accent-600);
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none;margin-top:2px}
.ob-pt b{font-size:14px;font-weight:560;display:block}
.ob-pt span{font-size:13px;color:var(--ink-500)}
.owner-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 86px 36px;gap:10px;align-items:center}
.owner-row .rm{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);display:flex;
  align-items:center;justify-content:center;color:var(--ink-400)}
.owner-row .rm:hover{color:var(--bad-500);border-color:var(--bad-100);background:var(--bad-50)}
.ready-mark{
  width:74px;height:74px;border-radius:50%;background:var(--good-50);border:1px solid var(--good-100);
  display:flex;align-items:center;justify-content:center;color:var(--good-500);margin-bottom:22px;
  animation:pop .5s cubic-bezier(.2,1.2,.4,1);
}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
.ready-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:22px 0 6px}
.ready-list div{display:flex;gap:9px;align-items:center;font-size:13.5px;color:var(--ink-600)}
.ready-list svg{color:var(--good-500);flex:none}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */
.bottomnav{display:none}
.fab{display:none}

@media (max-width:1120px){
  .g-main{grid-template-columns:minmax(0,1fr)}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .sidebar{transform:translateX(-102%);transition:transform .27s cubic-bezier(.22,.85,.3,1);width:270px}
  .sidebar.on{transform:none}
  .main{margin-left:0}
  .menu-btn{display:flex}
  .topbar{padding:0 16px}
  .view{padding:18px 16px 96px}
  .ready-hero{grid-template-columns:minmax(0,1fr);gap:22px;justify-items:center;text-align:center;padding:24px 20px}
  .ready-hero .rh-body{text-align:left;width:100%}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fab{
    display:flex;position:fixed;right:16px;bottom:78px;z-index:50;
    align-items:center;gap:8px;padding:12px 17px;border-radius:26px;
    background:var(--ink-900);color:#fff;font-size:13.5px;font-weight:560;
    box-shadow:var(--shadow-float);
  }
  .bottomnav{
    display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:52;
    background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .bottomnav button{
    display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 2px 8px;
    font-size:10px;font-weight:560;color:var(--ink-400);position:relative;
  }
  .bottomnav button.on{color:var(--accent-600)}
  .bottomnav button .ct{
    position:absolute;top:4px;right:calc(50% - 20px);min-width:15px;height:15px;border-radius:8px;
    background:var(--bad-500);color:#fff;font-size:9px;font-weight:700;
    display:flex;align-items:center;justify-content:center;padding:0 4px;
  }
  .drawer,.ask-panel{width:100vw;border-left:0}
  .today-grid{grid-template-columns:repeat(2,1fr)}
  .today-cell:nth-child(3n){border-right:1px solid var(--line)}
  .today-cell:nth-child(2n){border-right:0}
  .today-cell:nth-last-child(-n+3){border-bottom:1px solid var(--line)}
  .today-cell:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:680px){
  .g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}
  .ob-fields{grid-template-columns:minmax(0,1fr)}
  .ready-list{grid-template-columns:minmax(0,1fr)}
  .greet .display{font-size:25px}
  .view-head .display{font-size:22px}
  .ob-step h2{font-size:25px}
  .ob-quote{font-size:27px}
  .card-h,.card-body{padding-left:16px;padding-right:16px}
  .today-cell{padding:15px 16px}
  .today-cell .v{font-size:20px}
  .dial{width:158px;height:158px}
  .dial-center .n{font-size:42px}
  .owner-row{grid-template-columns:minmax(0,1fr) 36px;grid-auto-rows:auto}
  .owner-row .oc2{grid-column:1}
  .drawer-h,.drawer-b{padding-left:16px;padding-right:16px}
  .comp-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}
  .comp-row .cbar{grid-column:1 / -1}
}
@media (max-width:400px){
  .today-grid{grid-template-columns:minmax(0,1fr)}
  .today-cell{border-right:0 !important;border-bottom:1px solid var(--line) !important}
  .today-cell:last-child{border-bottom:0 !important}
}

/* ==========================================================================
   PAPER

   A Financing Room is the one thing in OraOS that leaves the building. It gets
   printed, saved as a PDF, mailed to a relationship manager and read on a desk
   next to four other companies' packs. So paper is a designed surface here and
   not a stylesheet afterthought.

   What changes on paper:
     the app furniture goes, and the company letterhead takes its place
     the two column room layout collapses, otherwise the document prints into
       the narrow navigation column and comes out unreadable
     cards stop being cards and become sections separated by rules
     every room section starts its own page, numbered, with the company name
       running along its foot
     colour that carries meaning is forced to print
   ========================================================================== */
.print-only,.print-head,.print-foot{display:none}

@media print{
  @page{ size:A4; margin:14mm 13mm 12mm; }

  html,body{background:#fff;font-size:10.2pt;line-height:1.42}
  body{-webkit-print-color-adjust:exact;print-color-adjust:exact}

  /* Furniture off */
  .sidebar,.topbar,.bottomnav,.fab,.ask-panel,.drawer,.scrim,.modal,.toast-wrap,
  .no-print,.segment,.chip,.btn,.icon-btn,.room-nav,.build-step,.finroom-cta,
  .list-row .go,.attend-row .go,#onboarding{display:none !important}

  #app{display:block}
  .main{margin-left:0;display:block}
  .view{padding:0;max-width:none;width:auto;display:block}
  .print-only{display:block}

  /* Letterhead and colophon */
  .print-head{
    display:flex;justify-content:space-between;align-items:flex-end;gap:20px;
    padding-bottom:7pt;margin-bottom:16pt;border-bottom:1.4pt solid #0c0f14;
  }
  .print-head b{display:block;font-size:11.4pt;font-weight:640;letter-spacing:-.01em;color:#0c0f14}
  .print-head span{display:block;font-size:7.6pt;color:#6b7280;margin-top:2pt}
  .print-head .r{text-align:right}
  .print-head .r b{font-weight:560}
  .print-foot{
    display:block;margin-top:18pt;padding-top:7pt;border-top:.7pt solid #d3cec3;
    font-size:7.4pt;color:#9aa1ab;
  }

  /* Cards become sections, not boxes */
  .card{
    background:none;border:0;border-radius:0;box-shadow:none;
    padding:0;margin:0 0 15pt;break-inside:avoid;
  }
  .card-pad,.card-body{padding:0}
  .card-h{display:block;padding:0 0 5pt;margin-bottom:9pt;border-bottom:.7pt solid #d3cec3}
  .card-h .ttl{font-size:11pt;font-weight:640;color:#0c0f14}
  .card-h .sub{font-size:8.4pt;color:#6b7280;margin-top:1pt}
  .card-h .right{display:none}
  .card-foot{border-top:.7pt solid #e6e2da;padding:6pt 0 0;margin-top:8pt;font-size:8.4pt;color:#6b7280}
  .stack{display:block}

  /* Multi column layouts fold down. The room grid must be undone: with the
     navigation hidden, its narrow first track would otherwise swallow the
     whole document. */
  .room-grid,.grid,.g-main,.g2,.g3,.g4,.ready-hero{display:block !important}
  .grid > * + *,.room-grid > * + *{margin-top:12pt}
  .today-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important}
  .mini-stat{display:grid !important;grid-template-columns:repeat(3,1fr) !important}
  .kv{display:grid !important;grid-template-columns:minmax(38mm,auto) 1fr !important;gap:4pt 10pt;font-size:9.4pt}

  .view-head{margin-bottom:14pt}
  .view-head .display{font-size:19pt}
  .view-head p{font-size:9.4pt;max-width:none}
  .greet{margin-bottom:14pt}

  /* Tables read as records, so they tighten and keep their headers */
  .tbl-wrap{overflow:visible}
  table.tbl{min-width:0;width:100%;font-size:8.8pt;break-inside:auto}
  .tbl thead{display:table-header-group}
  .tbl tfoot{display:table-footer-group}
  .tbl tr{break-inside:avoid}
  .tbl th{font-size:7.2pt;padding:0 6pt 5pt;border-bottom:.7pt solid #0c0f14;color:#2a313b}
  .tbl td{padding:5.5pt 6pt;border-bottom:.5pt solid #e6e2da}
  .tbl tfoot td{border-top:.9pt solid #0c0f14;padding:6pt}
  .tbl th:first-child,.tbl td:first-child{padding-left:0}
  .tbl th:last-child,.tbl td:last-child{padding-right:0}

  .list-row{padding:6pt 0;border-bottom:.5pt solid #e6e2da;break-inside:avoid}
  .list-row .lead b{font-size:9.4pt;white-space:normal}
  .list-row .lead span,.list-row .tail span{font-size:8pt}
  .avatar{width:20pt;height:20pt;border-radius:5pt;font-size:8pt}

  /* Colour that carries meaning has to survive the printer */
  .badge,.bar-fill,.bar-b,.avatar,.attend-ic,.dial .prog,.dial .ghost,.dial .track,
  .chart .area{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .badge{font-size:7.4pt;padding:1pt 5pt;border-width:.5pt}

  .today{border:.7pt solid #d3cec3;border-radius:2mm;overflow:hidden}
  .today-cell{padding:8pt 10pt;border-color:#e6e2da}
  .today-cell .k{font-size:7.2pt}
  .today-cell .v{font-size:13pt}
  .today-cell .m{font-size:7.6pt}

  .attend-row{padding:6pt 0;break-inside:avoid}
  .attend-row .tx b{font-size:9.4pt}
  .attend-row .tx span{font-size:8pt}

  /* Charts print. The bars are boxes and the line is a path, so both scale
     to the page width without needing a redraw. */
  .chartbox{break-inside:avoid;margin:2pt 0}
  .bars{height:34mm !important}
  .chart-plot{height:38mm !important}
  .chart-axis{font-size:7.2pt;margin-top:5pt}
  .cdot{border-width:1pt}

  .ora-inline{break-inside:avoid;background:#faf6ee;border-color:#e0cba4;padding:7pt 9pt;font-size:8.8pt}
  .proto{display:none}
  .disclaim{font-size:8pt;padding:7pt 9pt;break-inside:avoid;background:#fbfaf7}
  .empty{padding:10pt 0;text-align:left;font-size:8.8pt}
  .panel{border:.5pt solid #e6e2da;background:#fbfaf7}
  .comp-row{padding:5pt 0;break-inside:avoid;border-bottom:.5pt solid #e6e2da}
  .improve{padding:7pt 0;break-inside:avoid;border-bottom:.5pt solid #e6e2da}
  .tl-item{break-inside:avoid}

  .ready-hero{padding:0;gap:0}
  .ready-hero .dial{margin:0 auto 12pt}

  a[href]::after{content:none}

  /* ---- The Financing Room as a document ---------------------------------- */
  .room-cover{
    display:flex;flex-direction:column;min-height:248mm;break-after:page;padding-top:6mm;
  }
  .room-cover .rc-top{display:flex;align-items:center;gap:9pt;padding-bottom:26mm}
  .room-cover .rc-mark{
    width:26pt;height:26pt;border-radius:7pt;background:#171c24;color:#e0cba4;
    display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:14pt;
  }
  .room-cover .rc-brand b{display:block;font-size:10.4pt;font-weight:640;letter-spacing:-.01em}
  .room-cover .rc-brand span{display:block;font-size:7.6pt;letter-spacing:.12em;text-transform:uppercase;color:#9a7822}
  .room-cover .rc-label{font-size:7.4pt;font-weight:650;letter-spacing:.13em;text-transform:uppercase;color:#9aa1ab}
  .room-cover .rc-mid h1{
    font-family:var(--serif);font-weight:400;font-size:32pt;line-height:1.08;letter-spacing:-.02em;
    margin:6pt 0 7pt;color:#0c0f14;
  }
  .room-cover .rc-line{font-size:9.6pt;color:#4b5563}
  .room-cover .rc-facts{
    display:grid;grid-template-columns:1fr 1fr;margin-top:20mm;border-top:1.2pt solid #0c0f14;
  }
  .room-cover .rc-facts > div{padding:7pt 0;border-bottom:.5pt solid #e6e2da}
  .room-cover .rc-facts > div:nth-child(odd){padding-right:14pt}
  .room-cover .rc-facts > div:nth-child(even){padding-left:14pt;border-left:.5pt solid #e6e2da}
  .room-cover .rc-facts dt{font-size:7.4pt;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:#9aa1ab}
  .room-cover .rc-facts dd{font-size:10.4pt;font-weight:560;color:#0c0f14;margin-top:2pt}
  .room-cover .rc-contents{margin-top:14mm}
  .room-cover .rc-contents ol{
    margin:7pt 0 0;padding:0;list-style:none;counter-reset:rc;
    columns:2;column-gap:14pt;font-size:9.2pt;color:#2a313b;
  }
  .room-cover .rc-contents li{counter-increment:rc;padding:3pt 0;break-inside:avoid}
  .room-cover .rc-contents li::before{
    content:counter(rc) ".  ";color:#9a7822;font-weight:650;font-variant-numeric:tabular-nums;
  }
  .room-cover .rc-foot{
    margin-top:auto;padding-top:8pt;border-top:.7pt solid #d3cec3;
    font-size:7.8pt;line-height:1.5;color:#6b7280;
  }
  .room-cover .rc-foot b{color:#0c0f14}

  /* One section, one page. The number and the footer then read as running
     furniture without depending on fixed positioning, which browsers disagree
     about when they paginate. */
  /* Each section is set to the height of a page so its footer sits on the
     bottom rule rather than floating halfway up a short page. Every section
     measures under one page, so nothing is forced to split. */
  .room-sec{
    break-before:page;break-inside:auto;padding:0;
    display:flex;flex-direction:column;min-height:266mm;
  }
  /* The cover already ends its page, so section one must not ask for another
     and leave a blank sheet in the middle of a lender's pack. */
  #s1{break-before:avoid}
  .room-sec h3{
    font-size:15pt;font-weight:600;letter-spacing:-.012em;margin:0 0 2pt;
    padding-bottom:6pt;border-bottom:1.2pt solid #0c0f14;
  }
  .room-sec .sec-no{
    display:block;font-size:7.4pt;font-weight:650;letter-spacing:.14em;text-transform:uppercase;
    color:#9a7822;margin-bottom:5pt;
  }
  .room-sec .rs{font-size:8.8pt;color:#6b7280;margin:6pt 0 12pt}
  .room-sec .sec-foot{
    display:flex;justify-content:space-between;gap:16pt;
    margin-top:auto;padding-top:6pt;border-top:.5pt solid #e6e2da;
    font-size:7.4pt;color:#9aa1ab;
  }
  /* The room carries its own cover, so the shell letterhead stands down */
  .room-print .print-head,.room-print .print-foot,.room-print .view-head{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}