/* Functional workspace. Login and printed dossiers retain their own layouts. */
@media screen {
  body:has(#appView:not([hidden])) {
    color-scheme: dark;
    --paper: #0c0a09; --surface: #171411; --surface-2: #12100e; --surface-3: #262019;
    --ink: #f1eae1; --ink-2: #d8ccbe; --muted: #b0a293; --muted-2: #948678;
    --hair: #443628; --hair-soft: #30271f;
    --bronze: #c59b6d; --bronze-deep: #e2bd93; --bronze-lift: #dbb68b; --bronze-wash: #342619;
    --navy-900: #0c0a09; --navy-800: #17130f; --navy-700: #5b412b; --navy-600: #765437;
    --crit: #ffaaa1; --crit-wash: #391e1b; --high: #f4c078; --high-wash: #342619;
    --low: #a6c9ff; --low-wash: #182537; --normal: #92d5b0; --normal-wash: #172c22;
    --info: #a9cbed; --info-wash: #1b2833;
    --r-sm: 9px; --r: 12px; --r-lg: 17px; --bar-h: 76px; --rail: 316px;
    --mono: var(--sans);
    --jp: 'Plus Jakarta Sans', 'Noto Sans JP', sans-serif;
    --shadow-1: 0 2px 12px #00000014; --shadow-2: 0 8px 24px #0003; --shadow-3: 0 24px 80px #0008;
    background: radial-gradient(ellipse at 10% 0, #39261922, transparent 55%), var(--paper);
    font-size: 14px;
  }
  #appView { min-height: 100svh; }
  #appView .appbar {
    height: var(--bar-h); padding: 0 clamp(20px, 3vw, 52px); gap: 20px;
    background: #0c0a09f5; border-bottom: 1px solid var(--hair-soft); backdrop-filter: blur(16px);
  }
  #appView .appbar .company-logo { width: 125px; height: 50px; }
  .workspace-title { border-left: 1px solid var(--hair); padding-left: 24px; font-size: 13px; color: var(--muted); font-weight: 500; }
  #appView .appbar .who { color: var(--ink-2); font-size: 12px; gap: 10px; }
  #appView .appbar .avatar { width: 32px; height: 32px; background: #36271b; color: #e4c29b; border: 1px solid #8d674650; }
  #appView .appbar .ghost-light { border-color: var(--hair); color: var(--ink-2); min-height: 36px; border-radius: 9px; }
  #appView .shell { max-width: 1900px; padding: 28px clamp(20px, 3vw, 52px) 48px; gap: 26px; }
  #appView .shell > aside { position: sticky; top: calc(var(--bar-h) + 28px); overflow: hidden; }
  #appView .shell > aside .panel-head { padding: 20px 18px; }
  #appView .rail-filters { padding: 16px; gap: 10px; }
  #appView .plist { max-height: calc(100svh - 290px); padding: 4px 9px 12px; }
  #appView .pitem { padding: 15px 12px; margin-bottom: 5px; border: 1px solid transparent; border-radius: 11px; }
  #appView .pitem:hover { background: #ffffff04; border-color: var(--hair-soft); }
  #appView .pitem[aria-current="true"], #appView .pitem[aria-selected="true"] { background: linear-gradient(110deg, #b7834f24, #b7834f0c); border-color: #c59b6d66; box-shadow: inset 3px 0 #c59b6d; }
  #appView .pitem .nm { font-size: 14px; color: var(--ink); }
  #appView .pitem .row2 { margin-top: 8px; font-size: 11px; flex-wrap: wrap; }
  #appView .panel { overflow: clip; border-color: var(--hair-soft); }
  #appView .panel-head, .overlay .panel-head { padding: 18px 22px; font-size: 14px; gap: 10px; flex-wrap: wrap; }
  #appView .panel-head svg { color: var(--bronze); flex-shrink: 0; }
  #appView .panel-body, .overlay .panel-body { padding: 24px; }
  #appView .panel-body.tight { padding: 0; }
  #appView .stack { gap: 22px; }
  #appView .grid-2, #appView .grid-3, #appView .grid-4 { gap: 20px; }
  #appView .section-title { font-size: 12px; color: var(--bronze-deep); letter-spacing: .06em; margin-bottom: 20px; }
  #appView .section-title::after { display: none; }
  #appView .patient-banner { background: linear-gradient(110deg, #231c16, #171411); border-color: #c59b6d40; border-radius: 17px 17px 0 0; }
  #appView .pb-main { padding: 24px; gap: 18px; }
  #appView .pb-name { font-size: 25px; font-weight: 600; letter-spacing: -.04em; }
  #appView .pb-facts { margin-top: 10px; line-height: 1.8; font-size: 12px; }
  #appView .pb-actions { gap: 10px; }
  #appView .alert-strip { padding: 12px 24px; gap: 12px; line-height: 1.6; }
  #appView .alert-strip button { min-height: 30px; flex-shrink: 0; }
  #appView .tabs { gap: 5px; padding: 9px 12px; border-color: #c59b6d40; background: #17130f; }
  #appView .tab { border: 1px solid transparent; border-radius: 8px; padding: 10px 13px; font-size: 12px; }
  #appView .tab[aria-selected="true"] { background: #c59b6d1c; border-color: #c59b6d4a; color: #e6c6a0; }
  #appView .tab:hover { background: #ffffff05; }
  #appView .tabs + div { height: 22px !important; }
  #appView .kv { grid-template-columns: minmax(100px, .7fr) minmax(0, 1.3fr); gap: 14px 18px; font-size: 13px; }
  #appView .kv dd { overflow-wrap: anywhere; line-height: 1.7; }
  #appView .field, .overlay .field { margin-bottom: 20px; }
  #appView label, #appView .lbl, .overlay label { color: var(--muted); font-size: 12px; font-weight: 500; margin-bottom: 8px; }
  #appView input, #appView select, #appView textarea, .overlay input, .overlay select, .overlay textarea {
    min-height: 42px; padding: 10px 12px; background-color: #100e0c; border-color: var(--hair); border-radius: 9px; font-family: var(--sans);
  }
  #appView .search input { padding-left: 34px; }
  #appView select, .overlay select { padding-right: 32px; }
  #appView textarea { min-height: 110px; line-height: 1.8; }
  #appView .check { padding: 12px; border-radius: 9px; align-items: center; }
  #appView .check input { min-height: 0; padding: 0; }
  #appView button, .overlay button { min-height: 38px; border-radius: 9px; font-family: var(--sans); }
  #appView button.primary, #appView button.bronze, .overlay button.primary {
    background: linear-gradient(110deg, #d6b084, #b48253); border-color: #d4ac7f; color: #21170e;
  }
  #appView button.primary:hover, #appView button.bronze:hover, .overlay button.primary:hover { background: #dfba90; color: #21170e; }
  #appView button.danger { background: var(--crit-wash); border-color: #ffaaa14d; color: var(--crit); }
  #appView .tag { padding: 4px 9px; font-size: 10.5px; font-weight: 600; }
  #appView .tbl-wrap { border-radius: 0 0 16px 16px; }
  #appView th { background: #201a15; color: #c9b399; font-size: 10px; padding: 13px 16px; }
  #appView td { padding: 14px 16px; line-height: 1.6; }
  #appView tbody tr:hover { background: #c59b6d08; }
  #appView tr.abn-crit:hover { background: var(--crit-wash); }
  #appView .tbl-wrap table { min-width: 580px; }
  #appView .tbl-wrap table th:nth-child(4), #appView .tbl-wrap table td:nth-child(4) { display: table-cell; }
  #appView .empty { min-height: 140px; color: var(--muted); }
  #appView #detailEmpty, #appView #caseEmpty { min-height: 480px; display: grid; place-items: center; background: radial-gradient(ellipse at 50% 40%, #c59b6d08, transparent 70%), var(--surface); border-style: dashed; }
  #appView #detailEmpty .empty svg, #appView #caseEmpty .empty svg { width: 40px; height: 40px; margin-bottom: 10px; color: var(--bronze); }
  #appView .notice { border: 1px solid #ffffff09; padding: 13px 16px; }
  #appView .chip { padding: 7px 10px; border-radius: 8px; }
  #appView .tl { padding-left: 30px; }
  #appView .tl-item { padding-bottom: 28px; }
  #appView .tl-title { font-size: 14px; margin-top: 5px; }
  #appView .tl-body { line-height: 1.7; }
  #appView details { border-color: var(--hair-soft) !important; border-radius: 11px !important; }
  #appView summary { cursor: pointer; color: var(--ink-2); min-height: 44px; }
  #appView .bilingual > div { padding: 18px; }
  #appView .dossier { padding: 20px; line-height: 1.9; }
  .overlay { background: #080604bb; backdrop-filter: blur(8px); padding-top: 8vh; }
  .overlay .modal { border: 1px solid #c59b6d50; border-radius: 18px; }
  .toast.info { background: #342619; color: #f1e2d0 !important; border-color: #c59b6d55; }
  @media (max-width: 1120px) {
    #appView .shell { grid-template-columns: 1fr; }
    #appView .shell > aside { position: static; }
    #appView .plist { max-height: 225px; }
    #appView .rail-filters { display: grid; grid-template-columns: 1fr 220px; }
    #appView .patient-banner { position: static; }
  }
  @media (max-width: 720px) {
    body:has(#appView:not([hidden])) { --bar-h: 66px; }
    #appView .appbar { padding: 0 14px; gap: 10px; }
    #appView .appbar .company-logo { width: 100px; height: 40px; }
    .workspace-title { display: none; }
    #appView .appbar .brand .sub { display: inline; font-size: 9px; padding-left: 8px; }
    #appView .shell { padding: 18px 14px 32px; gap: 18px; }
    #appView .rail-filters { grid-template-columns: 1fr; }
    #appView .panel-body, .overlay .panel-body { padding: 18px; }
    #appView .panel-head, .overlay .panel-head { padding: 16px 18px; }
    #appView .pb-main { padding: 20px 18px; }
    #appView .pb-name { font-size: 22px; }
    #appView .alert-strip { flex-wrap: wrap; padding: 12px 18px; }
    #appView .alert-strip .v { flex: 1 1 180px; }
    #appView .alert-strip button { margin-left: 0; }
    #appView .grid-2, #appView .grid-3, #appView .grid-4 { grid-template-columns: 1fr; }
    #appView .kv { grid-template-columns: 1fr; gap: 4px; }
    #appView .kv dd { margin-bottom: 12px; }
    #appView input, #appView select, #appView textarea, .overlay input { font-size: 16px; }
    #appView #detailEmpty, #appView #caseEmpty { min-height: 260px; }
    .overlay { padding: 18px 12px; }
  }
}
