/* ============================================================================
   CANIPUS · 321 · THE ATELIER FOR DOCTORS AND HOSPITALS. The company desk's
   language (319, approved by Harsha on 3 Oct 2026) carried to the two other
   portals: a picture opening on the rooms, Instrument Serif headlines with a
   teal italic, mono kickers, numbered chapters, glass cards with a hairline,
   and buttons with light in them.

   This file is the frame both portals share: the side menu, the top bar, the
   path, the strip, the tab bar, the hero, the chapters, cards, buttons, rows.
   atelier-d.css dresses the doctor's rooms and atelier-h.css the hospital's.
   atelier-p.js marks the body (atp, and atd or ath) and the room it is in.

   Loaded after every other style on the page, so it only restyles: every
   button still calls what it called before, every number still comes from the
   database. Sizes come from type.css steps, as the house rule asks.
   Phone under 700 · tablet 700 to 919 · laptop 920 up (the side menu).
   ============================================================================ */
:root{
  --at-ink:#0A1428; --at-navy:#0D1830; --at-navy2:#13223E;
  --at-hair:rgba(153,189,208,0.14); --at-hair2:rgba(153,189,208,0.26);
  --at-glass:linear-gradient(180deg, rgba(20,36,66,0.78), rgba(10,20,40,0.84));
  --at-glass2:linear-gradient(160deg, rgba(26,46,82,0.72), rgba(11,22,42,0.86));
  --at-teal:#40C9BE; --at-teal2:#7BDED6; --at-teal-hi:#B8F1EC; --at-teal-lo:#1E8F86;
  --at-amber:#FFC46B; --at-red:#FF8A7A; --at-ok:#5FD8A8;
  --at-gold-hi:#F8E7BE; --at-gold:#DDB972; --at-gold-lo:#A57D39;
  --at-serif:'Instrument Serif', Georgia, serif;
  --at-r:22px; --at-r2:28px;
  --at-shadow:0 40px 80px -46px rgba(0,0,0,0.9);
  --at-btn:linear-gradient(180deg, #6BE0D6, #40C9BE 52%, #2AAFA4);
}
@keyframes atKb{ from{ transform:scale(1) translate3d(0,0,0); } to{ transform:scale(1.07) translate3d(-1.2%,-0.6%,0); } }
@keyframes atSweep{ 0%,55%{ left:-45%; } 100%{ left:135%; } }
@keyframes atShimmer{ 0%{ background-position:-200% 0; } 100%{ background-position:200% 0; } }
@keyframes atRise{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

/* ---------- the side menu ---------- */
@media (min-width:920px){
  body.atp .sidenav.on{ padding:24px 14px 18px; background:linear-gradient(180deg, rgba(8,18,36,0.72), rgba(7,16,32,0.55)); border-right:1px solid var(--at-hair); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  body.atp .rooms{ max-width:1320px; padding:0 40px 80px; }
}
body.atp .sn-brand{ padding:0 10px 18px; }
body.atp .sn-brand b{ letter-spacing:.2em; }
body.atp .pt-co{ border-radius:16px; padding:11px 12px; background:var(--at-glass2); border:0; box-shadow:inset 0 0 0 1px var(--at-hair2), 0 18px 40px -28px rgba(0,0,0,0.9); }
body.atp .pt-co .avx{ border-radius:11px; border:0; color:var(--headline); background:linear-gradient(160deg, #1F6166, #123A52); box-shadow:inset 0 1px 0 rgba(255,255,255,0.18), 0 0 0 1px rgba(64,201,190,0.35), 0 6px 16px -8px rgba(0,0,0,0.8); }
body.atp .pt-co b{ letter-spacing:.01em; }
body.atp .sn-grp{ font-family:var(--mono); font-weight:500; font-size:var(--t-label); letter-spacing:.16em; color:var(--faint); padding:18px 10px 6px; text-transform:uppercase; }
body.atp .sn-item{ border-radius:12px; padding:9px 10px; border-color:transparent; transition:background .2s ease, box-shadow .2s ease, color .2s ease; }
body.atp .sn-item:hover{ background:rgba(153,189,208,0.06); }
body.atp .sn-item.act{ background:linear-gradient(90deg, rgba(64,201,190,0.16), rgba(64,201,190,0.04)); box-shadow:inset 0 0 0 1px rgba(64,201,190,0.38); color:var(--headline); border-color:transparent; }
body.atp .sn-item.act span.lb{ color:var(--headline); }
body.atp .sn-item .num{ width:22px; height:22px; font-size:var(--t-label); }
body.atp .sn-item.act .num{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); box-shadow:0 0 14px -2px rgba(64,201,190,0.7); color:#062024; }
body.atp .sn-item .cnt.hot{ background:var(--at-amber); box-shadow:0 0 12px -3px rgba(255,196,107,0.8); }
body.atp .sn-help{ border-top:1px solid var(--at-hair); padding-top:16px; margin-top:auto; }

/* ---------- the top bar ---------- */
@media (min-width:920px){
  body.atp .pt-top{ position:sticky; top:0; z-index:40; margin:0 -40px 24px; padding:16px 40px; border-bottom:1px solid var(--at-hair); background:linear-gradient(180deg, rgba(14,26,50,0.94), rgba(13,24,48,0.78)); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
  body.atp .pt-top h1{ font-family:var(--sans); font-weight:600; font-size:var(--t-h3); letter-spacing:-0.01em; }
}
body.atp .pt-help{ border:0; box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .acct-b{ border:0; box-shadow:inset 0 0 0 1px var(--at-hair2); background:rgba(7,17,33,0.4); }
body.atp .acct-b .av{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); color:#062024; }

/* ---------- the path, as a journey rail ---------- */
body.atp .path-bar{ position:relative; overflow:hidden; border-radius:20px; padding:14px 16px; gap:14px 18px; margin:0 0 24px; background:linear-gradient(90deg, rgba(64,201,190,0.11), rgba(16,30,56,0.7) 45%, rgba(16,30,56,0.55)); box-shadow:inset 0 0 0 1px rgba(64,201,190,0.3), 0 24px 50px -34px rgba(0,0,0,0.9); }
body.atp .path-bar .dots{ position:relative; gap:6px; }
body.atp .path-bar .dot{ width:28px; height:28px; font-size:var(--t-label); background:rgba(7,17,33,0.55); transition:transform .2s ease; }
body.atp .path-bar .dot:hover{ transform:translateY(-1px); }
body.atp .path-bar .dot.done{ background:rgba(64,201,190,0.1); }
body.atp .path-bar .dot.here{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); box-shadow:0 0 0 4px rgba(64,201,190,0.16), 0 0 18px -2px rgba(64,201,190,0.8); color:#062024; }
body.atp .path-bar .w b{ font-weight:500; }
body.atp .path-bar .nx{ border-radius:12px; padding:10px 16px; background:var(--at-btn); color:#062024; box-shadow:0 12px 26px -14px rgba(64,201,190,0.9), inset 0 1px 0 rgba(255,255,255,0.35); }
body.atp .path-bar .nx.g{ background:rgba(153,189,208,0.07); color:var(--headline); box-shadow:inset 0 0 0 1px var(--at-hair2); }

/* ---------- the strip ---------- */
body.atp .pt-strip{ border-radius:18px; padding:14px 16px; background:linear-gradient(90deg, rgba(94,155,232,0.12), rgba(16,30,56,0.6)); border:0; box-shadow:inset 0 0 0 1px rgba(94,155,232,0.32); margin:0 0 22px; }
body.atp .pt-strip button{ border-radius:10px; }

/* ---------- the phone tab bar ---------- */
body.atp .tabbar{ background:linear-gradient(180deg, rgba(10,20,40,0.86), rgba(7,16,32,0.96)); border-top:1px solid var(--at-hair); box-shadow:0 -20px 40px -24px rgba(0,0,0,0.8); }
body.atp .tb.act::before{ top:-8px; width:26px; height:3px; margin-left:-13px; border-radius:0 0 4px 4px; background:var(--at-teal); box-shadow:0 0 12px rgba(64,201,190,0.9); z-index:0; }
body.atp .tb.act .avx{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); color:#062024; border-color:transparent; }

/* ---------- rooms ---------- */
body.atp .pane.on{ animation:atRise .45s cubic-bezier(.2,.7,.2,1) backwards; }
/* 323 · backwards, not both: a finished rise must leave no transform behind. A transform kept on the room
   (translateY(0) is still a transform) makes it the box every fixed thing inside it is measured against,
   so a film opened full screen from the feed on a phone had no height at all. */

/* ============ THE HERO: a picture, a mono kicker, a serif line, one sentence, the room's buttons ============ */
body.atp .at-hero{ position:relative; overflow:hidden; isolation:isolate; min-height:360px; display:flex; flex-direction:column; justify-content:flex-end; padding:46px 48px 40px; border-radius:30px; margin:0 0 22px;
  background:#0B1630; box-shadow:0 50px 90px -50px rgba(0,0,0,0.8); }
/* the hairline is drawn over the picture, so it runs unbroken round the whole card */
body.atp .at-hero::after{ content:''; position:absolute; inset:0; z-index:3; border-radius:inherit; box-shadow:inset 0 0 0 1px var(--at-hair2); pointer-events:none; }
body.atp .at-hero > *:not(.at-art){ position:relative; }
body.atp .at-hero > .at-art{ position:absolute; inset:-2%; z-index:-1; background:#0B1630 72% center / cover no-repeat; animation:atKb 34s ease-in-out infinite alternate; }
body.atp .at-hero > .at-art::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(9,18,36,0.97) 0%, rgba(9,18,36,0.88) 32%, rgba(9,18,36,0.4) 60%, rgba(9,18,36,0.08) 86%), linear-gradient(0deg, rgba(9,18,36,0.92) 0%, rgba(9,18,36,0) 46%); }
body.atp .at-k{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.18em; line-height:1.6; text-transform:uppercase; color:var(--at-teal); }
body.atp .at-k .at-date::before{ content:' · '; }
@media (max-width:699px){ body.atp .at-k .at-date{ display:block; } body.atp .at-k .at-date::before{ content:none; } }
body.atp .at-hero h2{ margin:14px 0 0; font-family:var(--at-serif); font-weight:400; font-size:clamp(calc(var(--t-h1) * 1.25), 4.3vw, var(--t-display)); line-height:.98; letter-spacing:-0.01em; max-width:15ch; color:var(--headline); text-wrap:balance; }
body.atp .at-hero h2 em{ color:var(--at-teal2); font-style:italic; }
body.atp .at-hero p{ margin:16px 0 0; max-width:56ch; font-size:var(--t-lead); line-height:1.6; color:#CFE0F3; }
body.atp .at-acts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
body.atp .at-btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; border:0; border-radius:14px; padding:13px 20px; font-family:var(--sans); font-weight:600; font-size:var(--t-chip); color:#062024; text-decoration:none; white-space:nowrap; cursor:pointer;
  background:var(--at-btn); box-shadow:0 14px 30px -14px rgba(64,201,190,0.85), inset 0 1px 0 rgba(255,255,255,0.35); transition:transform .18s ease, filter .2s ease, box-shadow .2s ease; }
body.atp .at-btn:hover{ transform:translateY(-1px); filter:brightness(1.04); }
body.atp .at-btn.q{ color:var(--headline); font-weight:500; background:rgba(153,189,208,0.08); box-shadow:inset 0 0 0 1px var(--at-hair2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
/* the day's hero: the words on the left, a glass card on the right */
body.atp .at-hero.at-split{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,0.75fr); gap:32px; align-items:end; min-height:440px; }
body.atp .at-hl > p{ max-width:52ch; }
@media (min-width:700px) and (max-width:919px){
  body.atp .at-hero{ min-height:340px; padding:40px 36px 34px; }
  body.atp .at-hero.at-split{ gap:24px; min-height:380px; }
  body.atp .at-hero h2{ font-size:calc(var(--t-h1) * 1.45); }
}
@media (max-width:699px){
  body.atp .at-hero, body.atp .at-hero.at-split{ display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; min-height:0; padding:0 0 22px; border-radius:24px; }
  body.atp .at-hero > .at-art{ position:relative; inset:auto; height:220px; flex:none; margin:0; animation:none; background-position:center; }
  body.atp .at-hero > .at-art::after{ background:linear-gradient(180deg, rgba(11,22,48,0) 28%, rgba(11,22,48,0.75) 68%, #0B1630 100%); }
  body.atp .at-hero > *:not(.at-art){ margin-left:20px; margin-right:20px; }
  body.atp .at-hero > .at-art + *{ margin-top:-56px; }
  body.atp .at-hero h2{ font-size:calc(var(--t-h1) * 1.3); max-width:none; }
  body.atp .at-hero p{ font-size:var(--t-body); }
  body.atp .at-acts .at-btn{ flex:1 1 auto; }
}

/* the head above the rooms: the opening of a room that has none of its own, and its first chapter */
body.atp .at-head{ margin:0; }
body.atp .at-head[hidden]{ display:none; }
body.atp .at-head > .at-ch:last-child{ margin-bottom:26px; }
@media (max-width:699px){
  /* the films come first on a phone: their opening is a band, its sentence behind the ? */
  body.atp .at-hero.at-slim > .at-art{ height:150px; }
  body.atp .at-hero.at-slim > p{ display:none; }
  body.atp .at-hero.at-slim h2{ font-size:var(--t-h1); }
}

/* ============ CHAPTERS: a big outlined number, a mono kicker, a serif line, a sentence, an aside ============ */
body.atp .at-ch{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:24px; align-items:start; margin:60px 0 24px; scroll-margin-top:96px; }
body.atp .at-hero + .at-ch{ margin-top:44px; }
body.atp .at-chn{ font-family:var(--at-serif); font-size:clamp(calc(var(--t-h1) * 1.8125), 6.2vw, calc(var(--t-display) * 1.4375)); line-height:.82; color:transparent; -webkit-text-stroke:1px rgba(123,222,214,0.45); margin-top:2px; user-select:none; }
body.atp .at-chk{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.16em; text-transform:uppercase; color:var(--at-teal); }
body.atp .at-ch h2{ margin:10px 0 0; font-family:var(--at-serif); font-weight:400; font-size:clamp(var(--t-h1), 3.2vw, calc(var(--t-h1) * 1.4375)); line-height:1.03; letter-spacing:-0.005em; color:var(--headline); text-wrap:balance; }
body.atp .at-ch h2 em{ color:var(--at-teal2); font-style:italic; }
body.atp .at-ch p{ margin:12px 0 0; max-width:62ch; color:var(--structure); font-size:var(--t-lead); line-height:1.55; }
body.atp .at-chs{ align-self:end; font-family:var(--mono); font-size:var(--t-label2); letter-spacing:var(--ls2); color:var(--muted); text-align:right; line-height:1.7; text-transform:uppercase; max-width:26ch; }
body.atp .at-chs > *{ font:inherit !important; color:inherit !important; letter-spacing:inherit !important; text-transform:inherit !important; margin:0 !important; padding:0 !important; }
@media (max-width:919px){ body.atp .at-chs{ grid-column:2; text-align:left; align-self:start; max-width:none; } body.atp .at-ch{ row-gap:10px; } }
@media (max-width:699px){
  body.atp .at-ch{ grid-template-columns:minmax(0,1fr); gap:6px; margin:48px 0 18px; }
  body.atp .at-hero + .at-ch{ margin-top:34px; }
  body.atp .at-chn{ font-size:calc(var(--t-h1) * 1.8); }
  body.atp .at-ch h2{ font-size:calc(var(--t-h1) * 1.075); }
  body.atp .at-ch p{ font-size:var(--t-body); }
  body.atp .at-chs{ grid-column:1; margin-top:6px; }
}
/* a short numbered head inside a card or over a strip: the outlined number, the serif name, a mono note */
body.atp .at-no{ font-family:var(--at-serif); font-style:normal; font-weight:400; color:transparent; -webkit-text-stroke:1px rgba(123,222,214,0.55); margin-right:4px; user-select:none; }

/* ============ SECTION HEADS ============ */
body.atp .pt-sec{ align-items:flex-end; margin:0 0 14px; }
body.atp .pt-sec h3{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h1); line-height:1.05; letter-spacing:-0.005em; color:var(--headline); }
body.atp .pt-sec span{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
body.atp .pt-link{ font-weight:500; color:var(--at-teal2); }
body.atp .pt-link:hover{ color:var(--at-teal-hi); }

/* ============ CARDS ============ */
body.atp .pt-card{ border-radius:var(--at-r); border:0; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), var(--at-shadow); backdrop-filter:none; -webkit-backdrop-filter:none; padding:20px 22px; }
body.atp .m-card{ border-radius:var(--at-r); border:0; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), var(--at-shadow); backdrop-filter:none; -webkit-backdrop-filter:none; }

/* ============ BUTTONS ============ */
body.atp .pt-btn{ border-radius:12px; background:var(--at-btn); color:#062024; box-shadow:0 12px 26px -14px rgba(64,201,190,0.85), inset 0 1px 0 rgba(255,255,255,0.35); transition:transform .18s ease, filter .2s ease, box-shadow .2s ease; }
body.atp .pt-btn:hover{ transform:translateY(-1px); filter:brightness(1.04); }
body.atp .pt-btn.g{ background:rgba(153,189,208,0.07); color:var(--headline); border:0; box-shadow:inset 0 0 0 1px var(--at-hair2); font-weight:500; }
body.atp .pt-btn.g:hover{ box-shadow:inset 0 0 0 1px rgba(153,189,208,0.42); }
body.atp .pt-btn.s{ border-radius:10px; }
body.atp .pt-btn:disabled{ transform:none; filter:none; }

/* ============ TABS ============ */
body.atp .yh-switch button{ border-radius:100px; padding:8px 15px; transition:background .2s ease, box-shadow .2s ease; }
body.atp .yh-switch button.on{ color:var(--headline); background:linear-gradient(180deg, rgba(64,201,190,0.22), rgba(64,201,190,0.1)); box-shadow:inset 0 0 0 1px rgba(64,201,190,0.55), 0 8px 20px -12px rgba(64,201,190,0.7); }

/* ============ ROWS, PILLS, PROGRESS ============ */
body.atp .pt-row{ border-top-color:var(--at-hair); }
body.atp .pt-tick.ok{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); border-color:transparent; box-shadow:0 0 12px -3px rgba(64,201,190,0.8); color:#062024; }
body.atp .pt-prog{ height:5px; background:rgba(153,189,208,0.12); }
body.atp .pt-prog i{ background:linear-gradient(90deg, var(--at-teal-lo), var(--at-teal) 60%, #8EEBE3); box-shadow:0 0 12px rgba(64,201,190,0.6); }
body.atp .pt-pill{ border-radius:100px; }

/* ============ NOTES, EMPTY, LOADING ============ */
body.atp .msg:not(:empty){ border-radius:14px; }
body.atp .pt-empty{ border-radius:18px; background:rgba(7,17,33,0.35); box-shadow:inset 0 0 0 1px var(--at-hair); }
body.atp .pt-empty b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2); }
body.atp .pt-load{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.16em; text-transform:uppercase; color:transparent; background:linear-gradient(90deg, var(--faint) 0%, var(--at-teal2) 50%, var(--faint) 100%); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; animation:atShimmer 2.2s linear infinite; }

/* ============ SHEETS: the ? and the setup list ============ */
body.atp .m-sheet{ border-radius:26px 26px 0 0; background:linear-gradient(180deg, #13223F, #0B1730); box-shadow:0 -30px 80px -20px rgba(0,0,0,0.85), inset 0 1px 0 var(--at-hair2); }
body.atp .m-sheet h3{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2b); color:var(--headline); letter-spacing:0; }
@media (min-width:600px){ body.atp .m-sheet{ border-radius:26px; } }

/* ============ THE FIRST WALK ============ */
body.atp .walk-veil{ background:rgba(3,10,22,0.66); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
body.atp .walk-sheet .dots i.on{ background:linear-gradient(180deg, #8EEBE3, var(--at-teal)); box-shadow:0 0 0 4px rgba(64,201,190,0.16), 0 0 18px -2px rgba(64,201,190,0.8); color:#062024; }
body.atp .walk-sheet .brow .go{ border-radius:14px; background:var(--at-btn); color:#062024; box-shadow:0 14px 30px -14px rgba(64,201,190,0.85), inset 0 1px 0 rgba(255,255,255,0.35); }

/* ============ THE NUMBERS (the charts both portals share): chapters, tiles, charts, tables ============ */
body.atp .an-filters{ gap:8px; margin:0 0 8px; padding:12px 14px; border-radius:20px; background:rgba(7,17,33,0.4); box-shadow:inset 0 0 0 1px var(--at-hair); }
body.atp .an-lab{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 4px 0 2px; }
body.atp .an-pill{ border:0; padding:8px 14px; background:rgba(153,189,208,0.05); box-shadow:inset 0 0 0 1px var(--at-hair2); color:var(--structure); transition:background .2s ease, box-shadow .2s ease; }
body.atp .an-pill.on{ color:#062024; background:var(--at-btn); box-shadow:0 10px 22px -12px rgba(64,201,190,0.9), inset 0 1px 0 rgba(255,255,255,0.35); font-weight:600; }
body.atp .an-date{ border:0; border-radius:12px; padding:8px 11px; background:rgba(7,17,33,0.55); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .an-pdf{ border:0; border-radius:12px; padding:9px 15px; background:rgba(153,189,208,0.07); box-shadow:inset 0 0 0 1px var(--at-hair2); color:var(--headline); }
body.atp .an-h2{ display:flex; align-items:baseline; gap:18px; margin:56px 0 20px; font-family:var(--at-serif); font-weight:400; font-size:clamp(var(--t-h1), 3.2vw, calc(var(--t-h1) * 1.4375)); line-height:1.03; letter-spacing:-0.005em; color:var(--headline); }
body.atp .an-h2 i{ font-family:var(--at-serif); font-style:normal; font-size:clamp(calc(var(--t-h1) * 1.8125), 6vw, calc(var(--t-display) * 1.375)); line-height:.8; color:transparent; -webkit-text-stroke:1px rgba(123,222,214,0.45); margin:0; }
body.atp .an-kpis{ gap:12px; margin-bottom:22px; }
body.atp .an-kpi{ border:0; border-radius:20px; padding:18px 18px 14px; background:var(--at-glass2); box-shadow:inset 0 0 0 1px var(--at-hair), 0 24px 50px -36px rgba(0,0,0,0.9); backdrop-filter:none; -webkit-backdrop-filter:none; }
body.atp .an-kpi .k{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); line-height:1.4; }
body.atp .an-kpi .n{ margin-top:8px; font-family:var(--at-serif) !important; font-weight:400; font-size:var(--t-h2b); line-height:1.05; color:var(--headline); white-space:nowrap; letter-spacing:0; }
body.atp .an-grid{ gap:18px; margin-bottom:18px; }
body.atp .an-ch{ border:0; border-radius:26px; padding:24px 26px 20px; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), var(--at-shadow); backdrop-filter:none; -webkit-backdrop-filter:none; }
body.atp .an-ch h3{ display:flex; align-items:baseline; gap:12px; font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2); line-height:1.1; letter-spacing:0; color:var(--headline); }
body.atp .an-ch h3 i{ font-style:normal; font-family:var(--at-serif); font-size:calc(var(--t-h1) * 1.3); line-height:.8; color:transparent; -webkit-text-stroke:1px rgba(123,222,214,0.5); }
body.atp .an-ch p{ margin:8px 0 16px; font-size:var(--t-small); color:var(--structure); }
body.atp .an-sec{ margin-bottom:12px; }
body.atp .an-link{ font-family:var(--mono); font-size:var(--t-label2); letter-spacing:.12em; text-transform:uppercase; color:var(--at-teal2); }
body.atp .an-tbl th{ font-family:var(--mono); font-weight:500; font-size:var(--t-label); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); border-bottom-color:var(--at-hair2); padding:10px 12px; }
body.atp .an-tbl td{ padding:13px 12px; border-bottom-color:var(--at-hair); }
body.atp .an-tbl tbody tr{ transition:background .2s ease; }
body.atp .an-tbl tbody tr:hover{ background:rgba(64,201,190,0.04); }
@media (max-width:759px){
  body.atp .an-h2{ margin-top:44px; }
  body.atp .an-h2 i{ font-size:calc(var(--t-h1) * 1.7); }
  body.atp .an-ch{ padding:18px 16px 14px; border-radius:22px; }
  body.atp .an-kpi .n{ font-size:var(--t-h2b); white-space:normal; }
}

/* ============ A CONVERSATION WITH A COMPANY (counter.js, both portals), and its sheets ============ */
body.atp .ct-head{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
body.atp .ct-sec{ margin-top:26px; }
body.atp .ct-card{ border-radius:20px; padding:16px 18px; gap:14px; background:var(--at-glass2); box-shadow:inset 0 0 0 1px var(--at-hair), 0 24px 50px -36px rgba(0,0,0,0.9); backdrop-filter:none; -webkit-backdrop-filter:none; transition:transform .25s ease, box-shadow .25s ease; }
body.atp .ct-card:hover{ transform:translateY(-2px); box-shadow:inset 0 0 0 1px var(--at-hair2), 0 30px 60px -36px rgba(0,0,0,0.95); }
body.atp .ct-card.lit{ background:linear-gradient(160deg, rgba(64,201,190,0.14), rgba(11,22,42,0.86) 70%); box-shadow:inset 0 0 0 1px rgba(64,201,190,0.5), 0 26px 50px -30px rgba(64,201,190,0.35); }
body.atp .ct-card .t b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h3); line-height:1.15; letter-spacing:0; }
body.atp .ct-av{ width:46px; height:46px; border-radius:14px; box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .ct-chip{ border-radius:100px; }
body.atp .ct-th{ border-radius:24px; padding:20px 22px 10px; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), var(--at-shadow); }
body.atp .ct-th .ct-top .t b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2); line-height:1.1; letter-spacing:0; }
body.atp .ct-th .ct-steps{ gap:6px; margin-top:16px; }
body.atp .ct-th .ct-steps span{ border-radius:100px; padding:9px 4px; background:rgba(7,17,33,0.4); box-shadow:inset 0 0 0 1px var(--at-hair); color:var(--faint); }
body.atp .ct-th .ct-steps span.on{ color:#062024; background:var(--at-btn); box-shadow:0 10px 22px -12px rgba(64,201,190,0.9), inset 0 1px 0 rgba(255,255,255,0.35); }
body.atp .ct-th .ct-steps span.was{ color:var(--at-teal2); background:rgba(64,201,190,0.08); box-shadow:inset 0 0 0 1px rgba(64,201,190,0.42); }
body.atp .ct-th .ct-req{ margin-top:16px; border-radius:20px; padding:16px 18px; background:linear-gradient(180deg, rgba(255,196,107,0.05), rgba(7,17,33,0.45)); box-shadow:inset 0 0 0 1px rgba(255,196,107,0.26); }
body.atp .ct-th .ct-req .k{ letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px; }
body.atp .ct-th .ct-req .f{ gap:0; border-radius:14px; overflow:hidden; box-shadow:inset 0 0 0 1px var(--at-hair); }
body.atp .ct-th .ct-req .f div{ border-radius:0; padding:12px 14px; background:rgba(7,17,33,0.35); box-shadow:-1px 0 0 var(--at-hair), 0 -1px 0 var(--at-hair); }
body.atp .ct-th .ct-req .f div b{ letter-spacing:.12em; text-transform:uppercase; }
body.atp .ct-th .ct-req .tot b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h1); }
body.atp .ct-th .ct-ln{ border-radius:18px; padding:12px 15px; }
body.atp .ct-th .ct-q{ border-radius:20px; padding:16px 18px; background:linear-gradient(160deg, rgba(221,185,114,0.12), rgba(10,20,40,0.6)); box-shadow:inset 0 0 0 1px rgba(221,185,114,0.45); }
body.atp .ct-th .ct-q .k{ color:var(--at-gold); letter-spacing:.14em; text-transform:uppercase; }
body.atp .ct-th .ct-q strong{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-title); line-height:1.05; }
body.atp .ct-th .ct-q .wq div.big span{ color:var(--at-gold-hi); }
body.atp .ct-th .ct-write textarea{ border-radius:18px; padding:13px 16px; background:rgba(7,17,33,0.55); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .ct-th .ct-write button{ width:48px; height:48px; background:var(--at-btn); box-shadow:0 12px 26px -12px rgba(64,201,190,0.9); }
body.atp .ct-btn{ min-height:44px; padding:0 18px; background:var(--at-btn); color:#062024; box-shadow:0 12px 26px -14px rgba(64,201,190,0.85), inset 0 1px 0 rgba(255,255,255,0.35); }
body.atp .ct-btn.g{ background:rgba(153,189,208,0.07); color:var(--headline); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .ct-btn.a, body.atp .ct-sheet .row .go.a{ color:#2A1C05; background:linear-gradient(180deg, var(--at-gold-hi), var(--at-gold) 55%, var(--at-gold-lo)); box-shadow:0 14px 30px -14px rgba(221,185,114,0.8), inset 0 1px 0 rgba(255,255,255,0.45); }
body.atp .ct-lock{ border-radius:18px; padding:14px 16px; }
body.atp .ct-empty{ border-radius:22px; padding:28px 22px; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), var(--at-shadow); }
body.atp .ct-empty b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2); color:var(--headline); }
body.atp .ct-veil{ background:rgba(3,10,22,0.66); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
body.atp .ct-sheet{ border-radius:28px 28px 0 0; padding:26px 24px calc(24px + env(safe-area-inset-bottom)); background:linear-gradient(180deg, #16294B, #0B1730); box-shadow:0 -30px 80px -20px rgba(0,0,0,0.85), inset 0 0 0 1px var(--at-hair2); }
@media (min-width:700px){ body.atp .ct-sheet{ border-radius:28px; padding-bottom:26px; max-width:560px; } }
body.atp .ct-sheet .eb{ letter-spacing:.16em; text-transform:uppercase; color:var(--at-gold); }
body.atp .ct-sheet h3{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h1); line-height:1.08; }
body.atp .ct-sheet label{ letter-spacing:.12em; text-transform:uppercase; }
body.atp .ct-sheet input, body.atp .ct-sheet textarea{ border-radius:14px; background:rgba(7,17,33,0.55); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .ct-sheet .ct-tot{ border-radius:16px; padding:14px 16px; background:rgba(7,17,33,0.45); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .ct-sheet .ct-tot b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-title); }
body.atp .ct-sheet .row button{ border-radius:14px; min-height:50px; }
body.atp .ct-sheet .row .go:not(.a){ background:var(--at-btn); box-shadow:0 14px 30px -14px rgba(64,201,190,0.85), inset 0 1px 0 rgba(255,255,255,0.35); }
body.atp .ct-sheet .ct-when button.on{ background:var(--at-btn); }
@media (max-width:699px){
  body.atp .ct-card{ padding:14px 14px; border-radius:18px; }
  body.atp .ct-th{ padding:16px 14px 8px; border-radius:20px; }
}

/* ============ THE REGISTER CARDS (regcards.js, 321b): the hospital's Describe it and the
   doctor's Check it read the CDSCO register the same way, so they dress the same way:
   the numbers in serif, the two sections as numbered chapters, each company a glass card ============ */
body.atp #main, body.atp #dxOne{ counter-reset:rgxs; }
body.atp .rgx-sum{ border:0; border-radius:24px; padding:22px 24px 20px; background:linear-gradient(160deg, rgba(64,201,190,0.08), rgba(9,20,40,0) 55%), var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair2), inset 0 1px 0 rgba(255,255,255,0.06), var(--at-shadow); }
body.atp .rgx-sum-t h2{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h2); line-height:1.1; letter-spacing:0; }
body.atp .rgx-sum-t span{ letter-spacing:.16em; color:var(--at-teal); }
body.atp .rgx-stat{ border:0; border-radius:16px; padding:14px 16px 13px; background:rgba(7,17,33,0.5); box-shadow:inset 0 0 0 1px var(--at-hair); }
body.atp .rgx-stat b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h1); line-height:1; letter-spacing:0; }
body.atp .rgx-stat small{ margin-top:6px; }
body.atp .rgx-bar{ border-top-color:var(--at-hair); }
body.atp .rgx-fl{ letter-spacing:.16em; color:var(--at-teal); }
body.atp .rgx-seg{ border:0; box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .rgx-seg button[aria-pressed="true"], body.atp .rgx-chip[aria-pressed="true"]{ background:linear-gradient(160deg, rgba(64,201,190,0.28), rgba(64,201,190,0.12)); border-color:rgba(123,222,214,0.55); color:#F8FEFF; box-shadow:0 0 22px -8px rgba(64,201,190,0.6); }
body.atp .rgx-chip, body.atp .rgx-q input, body.atp .rgx-sort select{ border-color:var(--at-hair2); }
/* the two sections, numbered as chapters */
body.atp .rgx-sec{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:4px 22px; align-items:start; margin:50px 2px 18px; }
body.atp .rgx-sec::before{ counter-increment:rgxs; content:counter(rgxs, decimal-leading-zero); grid-row:1 / span 2; font-family:var(--at-serif); font-size:clamp(calc(var(--t-h1) * 1.5), 4.4vw, calc(var(--t-display) * 1.05)); line-height:.82; color:transparent; -webkit-text-stroke:1px rgba(123,222,214,0.5); }
body.atp .rgx-sec h3{ font-family:var(--at-serif); font-weight:400; font-size:clamp(var(--t-h2), 2.6vw, var(--t-h1)); line-height:1.05; letter-spacing:0; }
body.atp .rgx-sec h3 i{ vertical-align:7px; }
body.atp .rgx-sec p{ margin-top:10px; font-size:var(--t-body); line-height:1.55; color:var(--structure); }
body.atp .rgx-sec .src{ padding-top:10px; letter-spacing:.16em; color:var(--at-teal); }
@media (max-width:699px){
  body.atp .rgx-sec{ grid-template-columns:auto minmax(0,1fr); gap:4px 14px; margin-top:38px; }
  body.atp .rgx-sec::before{ grid-row:1; font-size:calc(var(--t-h1) * 1.3); }
  body.atp .rgx-sec .src{ grid-column:2; padding-top:2px; }
}
/* each company: glass, its name in serif, its numbers in serif */
body.atp .rgx-c{ border:0; border-radius:24px; padding:20px 20px 16px; background:var(--at-glass); box-shadow:inset 0 0 0 1px var(--at-hair), inset 0 1px 0 rgba(255,255,255,0.05), var(--at-shadow); transition:box-shadow .25s ease; }
body.atp .rgx-c:hover{ box-shadow:inset 0 0 0 1px rgba(123,222,214,0.32), inset 0 1px 0 rgba(255,255,255,0.05), var(--at-shadow); }
body.atp .rgx-c.rgx-on{ box-shadow:inset 0 0 0 1.5px rgba(123,222,214,0.75), 0 0 34px -12px rgba(64,201,190,0.55), var(--at-shadow); }
body.atp .rgx-c.near{ background:linear-gradient(180deg, rgba(19,34,62,0.62), rgba(9,20,39,0.7)); box-shadow:inset 0 0 0 1px rgba(255,196,107,0.24), var(--at-shadow); }
body.atp .rgx-mono{ border-radius:15px; font-family:var(--at-serif); font-weight:400; font-size:var(--t-h3); letter-spacing:0; }
body.atp .rgx-who h4{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h3); line-height:1.12; letter-spacing:0; }
body.atp .rgx-facts{ border:0; border-radius:16px; background:rgba(7,17,33,0.5); box-shadow:inset 0 0 0 1px var(--at-hair); }
body.atp .rgx-fact{ border-left-color:var(--at-hair); }
body.atp .rgx-fact b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h3); line-height:1.05; letter-spacing:0; }
body.atp .rgx-lbl{ letter-spacing:.16em; color:var(--at-teal); }
body.atp .rgx-lbl::after{ background:var(--at-hair); }
body.atp .rgx-dv{ border:0; border-radius:16px; background:rgba(153,189,208,0.04); box-shadow:inset 0 0 0 1px rgba(153,189,208,0.11); }
body.atp .rgx-tag.pick{ background:var(--at-btn); }
body.atp .rgx-btn{ border:0; border-radius:12px; padding:10px 16px; font-weight:600; background:var(--at-btn); color:#062024; box-shadow:0 12px 26px -12px rgba(64,201,190,0.8), inset 0 1px 0 rgba(255,255,255,0.35); transition:transform .18s ease, filter .2s ease; }
body.atp .rgx-btn:hover{ transform:translateY(-1px); filter:brightness(1.05); background:var(--at-btn); }
body.atp .rgx-btn.ghost{ font-weight:500; background:rgba(153,189,208,0.06); color:var(--body); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .rgx-btn.on{ background:linear-gradient(160deg, rgba(64,201,190,0.32), rgba(64,201,190,0.14)); color:#F8FEFF; box-shadow:inset 0 0 0 1px rgba(123,222,214,0.7), 0 0 22px -8px rgba(64,201,190,0.6); }
body.atp .rgx-btn.on i.tk{ background:var(--at-teal); color:#062024; }
body.atp .rgx-btn[disabled]{ transform:none; filter:none; }
body.atp .rgx-fold{ border:0; border-radius:22px; background:rgba(7,17,33,0.42); box-shadow:inset 0 0 0 1px var(--at-hair2); }
body.atp .rgx-fold > button b{ font-family:var(--at-serif); font-weight:400; font-size:var(--t-h3); letter-spacing:0; }
body.atp .rgx-fold.amb{ box-shadow:inset 0 0 0 1px rgba(255,196,107,0.3); }
body.atp .rgx-empty, body.atp .rgx-can-empty{ border-radius:18px; border-color:var(--at-hair2); }
body.atp .rgx-more{ border-color:var(--at-hair2); border-radius:14px; }

/* ============ the PDF of the numbers and of a page: white paper, as before ============ */
@media print{
  body.atp .at-hero, body.atp .at-head, body.atp .at-ch, body.atp .path-bar, body.atp .yh-switch{ display:none !important; }
  body.atp *{ box-shadow:none !important; text-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; animation:none !important; }
  body.atp .an-kpi, body.atp .an-ch, body.atp .an-filters, body.atp .pt-card{ background:#fff !important; border:1px solid #d9e2ec !important; }
  body.atp .an-h2 i, body.atp .an-ch h3 i{ color:#137F77 !important; -webkit-text-stroke:0 !important; font-size:inherit !important; }
}

@media (prefers-reduced-motion: reduce){
  body.atp *, body.atp *::before, body.atp *::after{ animation:none !important; transition:none !important; }
}