:root {
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --line2:#cbd5e1;
  --teal:#0d9488; --teal-d:#0f766e; --teal-l:#ccfbf1;
  --amber:#b45309; --amber-bg:#fef3c7; --danger:#b91c1c;
  --page:#eef2f6; --stage:#d9e0e8;
  --shadow:0 1px 3px rgba(15,23,42,.08),0 6px 20px rgba(15,23,42,.05);
}
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  background:var(--page); color:var(--ink);
  font-family:'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
  display:flex; flex-direction:column; -webkit-font-smoothing:antialiased;
}
.cond { font-family:'Arial Narrow', Arial, sans-serif; }

/* ============ header ============ */
header.app {
  flex:none; background:linear-gradient(120deg,#0f766e,#0d9488); color:#fff;
  padding:10px 22px; display:flex; align-items:center; gap:16px;
}
.logopill { background:#fff; border-radius:10px; padding:6px 12px; display:inline-flex; align-items:center; box-shadow:0 2px 8px rgba(0,0,0,.18); }
.logopill img { height:34px; display:block; }
.titleblock .centername {
  font-family:"Goudy Old Style","Hoefler Text",Georgia,"Times New Roman",serif;
  font-size:27px; font-weight:600; letter-spacing:.8px; line-height:1.05;
  text-shadow:0 1px 3px rgba(0,0,0,.18);
}
.titleblock .subtitle { font-size:11px; letter-spacing:.32em; text-transform:uppercase; font-weight:600; opacity:.92; margin-top:3px; }
.headactions { margin-left:auto; display:flex; align-items:center; gap:10px; visibility:hidden; min-width:0; }
body.hasday .headactions { visibility:visible; }
#fileinfo {
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); color:#fff;
  border-radius:999px; padding:5px 14px; font-size:12.5px; max-width:360px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
#warnings { display:none; background:var(--amber-bg); color:var(--amber); border-radius:999px; padding:5px 12px; font-size:12px; font-weight:700; cursor:help; }

/* ============ buttons ============ */
.btn {
  font:inherit; font-size:13px; font-weight:700; color:#334155; background:#fff;
  border:1px solid var(--line2); border-radius:8px; padding:7px 14px; cursor:pointer; transition:.12s;
  white-space:nowrap;
}
.btn:hover { border-color:var(--teal); background:var(--teal-l); color:var(--teal-d); }
.btn.primary { background:var(--teal); border-color:var(--teal-d); color:#fff; }
.btn.primary:hover { background:var(--teal-d); color:#fff; }
.btn.nav { padding:5px 11px; }
.btn.light { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.45); color:#fff; }
.btn.light:hover { background:rgba(255,255,255,.28); color:#fff; border-color:#fff; }

/* ============ landing ============ */
#screen-drop { flex:1; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:28px; }
.dropcard {
  background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow);
  padding:30px 34px 26px; width:min(640px, 94vw); text-align:center;
}
#dropzone { border:3px dashed var(--line2); border-radius:14px; padding:42px 26px 38px; cursor:pointer; transition:.15s; }
#dropzone:hover, #dropzone.over { border-color:var(--teal); background:#f0fdfa; }
#dropzone .big { font-size:21px; font-weight:800; margin-top:12px; }
#dropzone .small { font-size:13.5px; color:var(--muted); margin-top:8px; line-height:1.55; }
#btndrive { display:none; margin-top:16px; font-size:14px; padding:9px 20px; }
#privacy {
  background:#dcfce7; color:#166534; border-radius:12px; padding:9px 20px;
  font-size:12.5px; line-height:1.55; text-align:center;
}
#droperr { display:none; background:#fee2e2; color:#b91c1c; border:1px solid #fecaca; padding:10px 18px; border-radius:10px; font-size:13.5px; max-width:640px; font-weight:600; }
#fileinput { display:none; }

/* ============ viewer ============ */
#screen-preview { flex:1; min-height:0; display:none; flex-direction:column; }
#mainrow { flex:1; min-height:0; display:flex; }

#sidebar { flex:none; width:300px; background:#fff; border-right:1px solid var(--line); display:flex; flex-direction:column; min-height:0; }
.sidehead {
  flex:none; padding:10px 16px; font-size:11px; letter-spacing:.14em; font-weight:800;
  color:var(--teal-d); text-transform:uppercase; border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,var(--teal-l),transparent);
}
#patientlist { flex:1; overflow-y:auto; min-height:0; }
.plitem {
  display:flex; align-items:center; gap:8px; padding:8px 10px 8px 12px;
  border-bottom:1px solid #f1f5f9; border-left:4px solid transparent; cursor:pointer;
}
.plitem:hover { background:#f1f5f9; }
.plitem.active { background:var(--teal-l); border-left-color:var(--teal); }
.pl-time { flex:none; width:48px; font-size:12.5px; font-weight:800; color:var(--teal-d); }
.pl-name { flex:1; min-width:0; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pl-name b { font-weight:800; }
.pl-badges { flex:none; display:flex; align-items:center; gap:4px; }
.plb { font-size:9.5px; font-weight:800; border:1px solid var(--line2); border-radius:5px; padding:1px 5px; color:#475569; }
.plb.ord2 { background:#0f172a; border-color:#0f172a; color:#fff; }
.plb.alert { background:var(--amber-bg); border-color:var(--amber); color:var(--amber); }
.plb.flagdot { width:9px; height:9px; border-radius:50%; background:var(--danger); border:none; padding:0; }
.plb.surg { background:var(--teal-l); border-color:var(--teal); color:var(--teal-d); max-width:112px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidetip { flex:none; padding:8px 16px; font-size:10.5px; color:var(--muted); border-top:1px solid var(--line); line-height:1.5; }

#stageside { flex:1; min-width:0; display:flex; flex-direction:column; min-height:0; }
#stagehead { flex:none; display:flex; align-items:center; gap:10px; padding:8px 16px; background:#fff; border-bottom:1px solid var(--line); }
#navpos { color:var(--muted); font-size:13px; min-width:52px; text-align:center; font-weight:700; }
#navname { font-weight:800; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.edithint { margin-left:auto; font-size:11.5px; color:var(--muted); padding-right:4px; }

#stage { flex:1; min-height:0; overflow:auto; display:flex; align-items:flex-start; justify-content:center; background:var(--stage); }
#sheets { transform-origin:top center; margin:16px 0; }
#sheets.measuring .sheet { display:flex !important; position:absolute; top:0; left:0; visibility:hidden; }

/* ============ the printed sheet (Mockup A2 v2 — layout locked) ============ */
.sheet {
  width:10.45in; height:7.96in; background:#fff; padding:0.22in;
  display:none; flex-direction:column; overflow:hidden;
  box-shadow:0 4px 20px rgba(15,23,42,.28);
}
.sheet.current { display:flex; }
.sheet[contenteditable]:focus { outline:3px dashed rgba(13,148,136,.55); outline-offset:4px; }

.cell { border:2.5px solid #000; min-width:0; display:flex; flex-direction:column; }
.hd {
  background:#d6d6d6; color:#000; font-weight:800; font-size:13px; letter-spacing:2px;
  padding:2px 10px; -webkit-print-color-adjust:exact; print-color-adjust:exact;
}
.bd { padding:4px 12px 6px; flex:1; min-height:0; }

.toprow { flex:none; display:flex; align-items:stretch; gap:12px; }
/* TIME and DOB/AGE: two stacked lines each (Marc 9/4 — the name must never wrap, so the
   boxes stay narrow), with the row trimmed to the minimum height: smaller label bars,
   near-zero padding, tight line-heights. overflow:hidden keeps the font's descent
   metric from poking past the box and tripping the fit checks. */
.toprow .hd { font-size:11px; letter-spacing:1.5px; padding:0 8px; line-height:1.45; }
.timebox .bd { text-align:center; padding:1px 10px 2px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.timeval { font-size:54px; font-weight:800; letter-spacing:-1px; line-height:1.0; white-space:nowrap; overflow:hidden; }
.ampm { font-size:24px; font-weight:800; letter-spacing:2px; line-height:1.0; margin-top:1px; overflow:hidden; }
.pname { flex:1; align-self:center; font-size:72px; line-height:1.02; font-weight:800; letter-spacing:-1px; white-space:nowrap; overflow:hidden; }
.pname .first { font-weight:800; }
.dupwrap { display:inline-block; }
.duplabel {
  display:block; font-family:Arial, Helvetica, sans-serif; font-size:13px;
  font-weight:800; letter-spacing:2px; line-height:1; text-align:center;
  margin-bottom:2px; white-space:nowrap;
}
.pname .dup { display:block; text-align:center; border:4px solid #000; padding:0 10px; }
.dobbox .bd {
  text-align:center; padding:1px 10px 2px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.dobval { font-size:40px; font-weight:800; line-height:1.05; white-space:nowrap; overflow:hidden; }
.ageval { font-size:28px; font-weight:800; line-height:1.0; margin-top:1px; white-space:nowrap; overflow:hidden; }

.alertbar {
  flex:none; margin-top:7px; padding:5px 12px; text-align:center;
  border:4px dashed #000; font-size:20px; font-weight:800; white-space:nowrap; overflow:hidden;
}
.alertbar .who { font-weight:400; }

.eyebanner {
  flex:none; margin-top:7px; background:#000; color:#fff; display:flex; align-items:center;
  padding:6px 16px; -webkit-print-color-adjust:exact; print-color-adjust:exact;
}
.eyename { flex:1; font-size:54px; font-weight:800; letter-spacing:2px; line-height:1.0; }
.order { flex:none; font-size:32px; font-weight:800; white-space:nowrap; }
.order.second { background:#fff; color:#000; padding:3px 15px; }

.strip { flex:none; display:flex; gap:10px; margin-top:7px; }
.strip .cell { flex:1; }
/* SURGERY box: one item per line, no boxes, all at one large size (fitwrap scales together) */
.surgrow { display:block; font-size:46px; line-height:1.12; overflow:hidden; }
.surgval { display:block; font-size:inherit; font-weight:800; }
.surgadd { display:block; font-size:inherit; font-weight:800; }
.surgadds { display:block; }
.surgadds .surgadd { display:inline; white-space:nowrap; margin-right:0.35em; } /* 3+ add-ons flow inline */
.lensval { font-size:46px; font-weight:800; letter-spacing:-1px; white-space:nowrap; line-height:1.14; overflow:hidden; /* descent metric must not count as overflow */ }
.lensname { display:block; font-size:30px; font-weight:800; white-space:nowrap; margin-top:2px; }
.toricline { display:block; font-size:40px; font-weight:800; white-space:nowrap; margin-top:2px; }
.surgcell { flex:1.05; }
.iolcell { flex:1; }
.lensxcell { flex:0.95; }
.lensxmain { display:block; font-size:38px; font-weight:800; white-space:nowrap; }
.lensxdepth { display:block; font-size:30px; font-weight:800; white-space:nowrap; margin-top:2px; }
.lensxdepth.solo { font-size:34px; } /* depth/OZ (or OZ/CAPS) on their own lines when the 3rd line is free */
.lensxtag { display:block; font-size:26px; font-weight:800; white-space:nowrap; margin-top:2px; }

/* SURGICAL MODIFIERS: one big bold line; fitSheet shrinks a little, then allows two lines */
.modrow { font-size:34px; font-weight:800; line-height:1.2; white-space:nowrap; }
.modrow.wrap { white-space:normal; }
.mod { white-space:nowrap; }
.mod.hi { background:#000; color:#fff; padding:0 12px; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.msep { padding:0 9px; font-weight:800; }

/* inline flow: un-highlighted allergies continue on the same line as the boxes */
.arow { display:block; line-height:1.35; }
.aflag { display:inline-block; font-size:40px; font-weight:800; border:3.5px solid #000; padding:2px 14px; margin:3px 10px 3px 0; vertical-align:middle; }
.aother { display:inline; font-size:36px; vertical-align:middle; }
.nkda { font-size:44px; font-weight:800; }
.nkda small { font-size:16px; color:#222; }

.dropscell { flex:1; }
.medcell { flex:1.25; }
.medtext { font-size:28px; font-weight:800; line-height:1.25; margin-top:4px; }
.dropsval { font-size:24px; font-weight:400; white-space:nowrap; }
.dropsub { font-size:17px; font-weight:400; }
.sub { font-size:14px; color:#222; margin-top:1px; }
.mchips { display:flex; flex-wrap:wrap; gap:6px; }
.mchip { font-size:26px; font-weight:800; border:2.5px solid #000; padding:2px 10px; }
.mchip.inv { background:#000; color:#fff; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.mchip.medhigh { white-space:normal; line-height:1.2; text-align:left; }

.poline { white-space:nowrap; }
.poline .office { font-size:34px; font-weight:800; }
.poline .dt { font-size:32px; font-weight:800; }
.poline .posub { font-size:15px; color:#222; }

.plancell { flex:1 1 auto; min-height:1.05in; margin-top:7px; overflow:hidden; }
.bd.plansplit { padding:0; display:flex; align-items:stretch; }
.plansplit .planmain { flex:1; min-width:0; padding:4px 12px 6px; display:flex; flex-direction:column; }
.plansplit .plantext { flex:1 1 auto; min-height:0; }
.droptag {
  align-self:flex-start; margin-top:5px; font-size:20px; font-weight:800;
  border:2.5px solid #000; padding:1px 10px; white-space:nowrap;
}
.plantext { font-size:24px; line-height:1.42; }
.plantext .lead { font-weight:800; font-size:26px; }
.plantext .flagchip.planwarn { font-size:30px; padding:2px 14px; }
.plantext .sep { font-weight:800; padding:0 5px; }
.plantext .poss { font-style:italic; }
.plantext .warnseg { font-weight:800; }
.plantext .flagchip { font-weight:800; background:#000; color:#fff; padding:1px 9px; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.plantext .goal { font-weight:800; border:2.5px solid #000; padding:1px 9px; white-space:nowrap; }
.lensxcol { flex:none; width:3.3in; border-left:2.5px solid #000; display:flex; flex-direction:column; }
.lensxcol .lhd {
  background:#d6d6d6; color:#000; font-weight:800; font-size:13px; letter-spacing:2px;
  padding:2px 10px; -webkit-print-color-adjust:exact; print-color-adjust:exact;
}
.lensxcol .lbd { padding:4px 10px 5px; flex:1; min-height:0; overflow:hidden; }
.lensxcol .arcs { font-size:26px; font-weight:800; line-height:1.1; }
.lensxcol .d { font-size:19px; font-weight:700; margin-top:2px; }
.lensxcol .smart { display:inline-block; margin-top:3px; font-size:13px; font-weight:800; border:2px solid #000; padding:1px 7px; letter-spacing:1px; }

/* ============ vertical compaction tiers (added by fitSheet when needed) ============
   Priority per Marc: allergy and surgical-plan FONTS hold their base size while the
   plan's whitespace and every other box shrink first; allergies shrink only at the
   very last tier, and the plan font never shrinks at all. */
/* Tiers 1-2 remove WHITESPACE ONLY — no font anywhere gets smaller. */
.sheet.compact1 .strip { margin-top:4px; }
.sheet.compact1 .plancell { margin-top:4px; }
.sheet.compact1 .eyebanner { margin-top:4px; padding:4px 16px; }
.sheet.compact1 .bd { padding:3px 10px 4px; }
.sheet.compact1 .hd { padding:1px 10px; }
.sheet.compact1 .toprow { gap:8px; }
.sheet.compact1 .timebox .bd, .sheet.compact1 .dobbox .bd { padding:1px 8px 1px; }
.sheet.compact1 .arow { gap:5px 12px; }
.sheet.compact1 .mchips { gap:4px; }
.sheet.compact1 .chips { margin-top:4px; gap:4px; }
.sheet.compact1 .plantext { line-height:1.3; }
.sheet.compact1 .medtext { margin-top:2px; line-height:1.18; }
.sheet.compact1 .surgrow { gap:4px 8px; }

.sheet.compact2 .strip { margin-top:2px; }
.sheet.compact2 .plancell { margin-top:2px; }
.sheet.compact2 .eyebanner { margin-top:2px; padding:2px 16px; }
.sheet.compact2 .bd { padding:2px 8px 2px; }
.sheet.compact2 .hd { padding:0 8px; }
.sheet.compact2 .lensxcol .lbd { padding:2px 8px 3px; }
.sheet.compact2 .plantext { line-height:1.22; }
.sheet.compact2 .aflag { padding:1px 10px; }
.sheet.compact2 .timeval, .sheet.compact2 .dobval { line-height:0.95; }
.sheet.compact2 .lensxcol .smart { margin-top:1px; }
.sheet.compact2 .ageval, .sheet.compact2 .ampm { margin-top:0; }

/* Tier 3-4: all whitespace is gone — ONLY the surgical plan text may step down.
   Allergies, medical, surgery, and IOL/LenSx stay large for 10-ft viewing. */
.sheet.compact3 .plantext { font-size:20px; line-height:1.3; }
.sheet.compact3 .plantext .lead { font-size:21px; }
.sheet.compact3 .plantext .flagchip.planwarn { font-size:25px; }
.sheet.compact3 .droptag { font-size:17px; margin-top:3px; }
.sheet.compact4 .plantext { font-size:17px; line-height:1.22; }
.sheet.compact4 .plantext .lead { font-size:18px; }
.sheet.compact4 .plantext .flagchip.planwarn { font-size:21px; }

/* Tier 5-6: whitespace AND plan are exhausted — allergies alone may finally step down. */
.sheet.compact5 .aflag { font-size:34px; padding:1px 10px; }
.sheet.compact5 .aother { font-size:31px; }
.sheet.compact5 .nkda { font-size:38px; }
.sheet.compact5 .arow { gap:4px 10px; }
.sheet.compact6 .aflag { font-size:28px; padding:1px 8px; border-width:2.5px; }
.sheet.compact6 .aother { font-size:25px; }
.sheet.compact6 .nkda { font-size:31px; }

/* ============ print ============ */
@page { size: letter landscape; margin:0.24in; }
@media print {
  html, body { height:auto; background:#fff; display:block; }
  header.app, #screen-drop, #sidebar, #stagehead { display:none !important; }
  #screen-preview { display:block !important; height:auto; }
  #mainrow, #stageside { display:block !important; height:auto; min-height:0; }
  #stage { overflow:visible; display:block; background:#fff; }
  #sheets { transform:none !important; margin:0; }
  .sheet { display:flex !important; box-shadow:none; break-after:page; outline:none !important; }
  .sheet:last-child { break-after:auto; }
  body.print-one .sheet:not(.current) { display:none !important; }
}