body[data-design="1"]{background:#f3f5f8}body[data-design="1"] .panel,body[data-design="1"] .section-landing a{border-radius:20px;box-shadow:0 8px 30px #19324908}body[data-design="1"] aside{background:#182b3e}body[data-design="1"] .section-landing a{border-top:3px solid #c23850}body[data-design="2"]{background:#111b2a;color:#e5ecf5}body[data-design="2"] aside,body[data-design="2"] header{background:#0b1320;color:#e5ecf5}body[data-design="2"] .panel,body[data-design="2"] .asset-card,body[data-design="2"] .section-landing a,body[data-design="2"] dialog{background:#1b2a3e;color:#e5ecf5;border-color:#34465e}body[data-design="2"] h1,body[data-design="2"] h2,body[data-design="2"] h3,body[data-design="2"] strong{color:#f4f7fc}body[data-design="2"] button,body[data-design="2"] input,body[data-design="2"] select,body[data-design="2"] textarea{background:#24364d;color:#fff;border-color:#52617a}body[data-design="2"] .meta,body[data-design="2"] .section-landing p{color:#b3c2d7}body[data-design="2"] .section-landing a{border-radius:8px;border-left:3px solid #f16a7a}body[data-design="3"]{background:#f7f3ed}body[data-design="3"] aside{background:#343d38}body[data-design="3"] header{background:#fffdf8}body[data-design="3"] .panel,body[data-design="3"] .section-landing a{background:#fffdf8;border-color:#ded8cc;border-radius:5px;box-shadow:4px 4px 0 #e9e3d8}body[data-design="3"] h1{font-family:Georgia,serif;font-size:38px}body[data-design="3"] .section-landing a{padding:34px}body[data-design="3"] .primary{background:#a83b49} /* AY Hospital: shared day/night visual language */
body[data-mode]{--ink:#183054;--surface:#fff;--edge:#dce5f3;--soft:#eef3ff;--muted:#526788;--accent:#d22f53;background:radial-gradient(ellipse at 95% 0,#bdeff04d,transparent 40%),radial-gradient(ellipse at 35% 0,#cfd8ff80,transparent 48%),#f4f7ff;color:var(--ink)}
body[data-mode=night]{--ink:#edf3ff;--surface:#17233c;--edge:#354766;--soft:#202f4b;--muted:#b2c3de;--accent:#ff758d;background:radial-gradient(ellipse at 95% 0,#12666b40,transparent 40%),radial-gradient(ellipse at 30% 0,#554dbb38,transparent 48%),#0c1429}
body[data-mode] aside{background:linear-gradient(155deg,#142743,#11172e 65%,#342444);border-right:1px solid #ffffff14}
body[data-mode] .brand-symbol{width:58px;height:58px;filter:drop-shadow(0 5px 12px #0005)}
body[data-mode] header{background:var(--surface);color:var(--ink);border-bottom:1px solid var(--edge);gap:12px;flex-wrap:wrap}
body[data-mode] .panel,body[data-mode] .asset-card,body[data-mode] .stat,body[data-mode] dialog,body[data-mode] .section-landing a{background:var(--surface);color:var(--ink);border:1px solid var(--edge);border-radius:20px;box-shadow:0 10px 30px #142a4910}
body[data-mode] h1,body[data-mode] h2,body[data-mode] h3,body[data-mode] strong{color:var(--ink)}
body[data-mode] .muted,body[data-mode] .meta,body[data-mode] .section-landing p,body[data-mode] .field{color:var(--muted)}
body[data-mode] .eyebrow{color:var(--accent);font-weight:700}
body[data-mode] button,body[data-mode] input,body[data-mode] select,body[data-mode] textarea{background:var(--surface);color:var(--ink);border-color:var(--edge);border-radius:12px}
body[data-mode] button:hover{border-color:var(--accent)}
body[data-mode] .primary{background:linear-gradient(120deg,#ce2e50,#e34b51);color:white;border-color:transparent;box-shadow:0 5px 15px #d22f5326}
body[data-mode] .section-landing{gap:22px}
body[data-mode] .section-landing a{position:relative;overflow:hidden;padding:32px;min-height:195px;border-top:0;transition:transform .2s,box-shadow .2s}
body[data-mode] .section-landing a:before{content:'';position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#ee4868,#ff986e)}
body[data-mode] .section-landing a:nth-child(3n+2):before{background:linear-gradient(90deg,#00aca9,#68ded3)}
body[data-mode] .section-landing a:nth-child(3n):before{background:linear-gradient(90deg,#596ff3,#ac83f2)}
body[data-mode] .section-landing a:after{content:none}
body[data-mode] .section-landing a:hover{transform:translateY(-4px);box-shadow:0 16px 35px #142a4922}
body[data-mode] .section-landing span{color:var(--accent);font-weight:650}
body[data-mode] .section-tabs a{color:var(--muted)}body[data-mode] .section-tabs [aria-current=page]{background:var(--soft);color:var(--ink)}
body[data-mode] thead,body[data-mode] th,body[data-mode] .notice,body[data-mode] .work-context{background:var(--soft);color:var(--ink)}
body[data-mode] td,body[data-mode] .document-row{border-color:var(--edge)}
body[data-mode] .operations-banner{background:linear-gradient(115deg,#183858,#284578 60%,#216365);color:white}body[data-mode] .operations-banner h2,body[data-mode] .operations-banner strong{color:white}
body[data-mode] nav a.active{background:linear-gradient(110deg,#c23150,#a33960);border-color:#ff889c;color:white}
body[data-mode] #color-mode-toggle{white-space:nowrap;border-color:var(--accent);font-size:13px;min-height:44px}
body[data-mode] .mobile-dock{background:var(--surface);border-color:var(--edge)}body[data-mode] .mobile-dock a{color:var(--ink)}
@media(prefers-reduced-motion:reduce){body[data-mode] .section-landing a{transition:none;transform:none}}
@media(max-width:650px){body[data-mode] .section-landing a{min-height:160px;padding:24px}body[data-mode] header{gap:8px}.quick-actions{flex-wrap:wrap}}
@media print{body[data-mode]{background:white;color:black}#color-mode-toggle{display:none}}
/* Softer archive row surroundings; action buttons retain their own colors. */
body[data-mode=day] .period-table tbody td{background:#e8eff7;color:#183054}
body[data-mode=day] .period-table tbody tr:nth-child(even) td{background:#e1eaf4}
body[data-mode=night] .period-table tbody td{background:#1d2e46;color:#edf3ff}
body[data-mode=night] .period-table tbody tr:nth-child(even) td{background:#22344e}
body[data-mode] .period-table tbody td{border-color:var(--edge)}
@media print{body[data-mode] .period-table tbody td{background:white!important;color:black!important}}
/* Keep the sticky archive heading opaque and consistent with the active theme. */
body[data-mode] .period-table thead th,
body[data-mode] .period-table thead th:first-child{background:var(--soft);color:var(--ink);border-color:var(--edge)}
@media print{body[data-mode] .period-table thead th{background:#eef1f4!important;color:black!important}}
/* Persistent, theme-aware application footer. */
html{min-height:100%;background:#f4f7ff}
html:has(body[data-mode=night]){background:#0c1429}
body[data-mode]{min-height:100vh;min-height:100dvh}
body[data-mode] .shell{min-height:100vh;min-height:100dvh;padding-bottom:0}
body[data-mode] main{padding-bottom:100px}
body[data-mode] .shell>footer{position:fixed;left:240px;right:0;bottom:0;z-index:19;display:flex;align-items:center;justify-content:space-between;min-height:44px;box-sizing:border-box;padding:12px 36px calc(12px + env(safe-area-inset-bottom));background:var(--surface);color:var(--muted);border-top:1px solid var(--edge);font-size:12px}
body[data-mode] .project-card,body[data-mode] .project-empty{background:var(--surface);color:var(--ink);border-color:var(--edge)}
@media(max-width:1100px) and (min-width:761px){body[data-mode] .shell>footer{left:210px;padding-inline:24px}}
@media(max-width:760px){body[data-mode] .shell>footer{left:0;min-height:30px;height:30px;padding:6px 16px;bottom:calc(65px + env(safe-area-inset-bottom))}body[data-mode] .mobile-dock{height:calc(65px + env(safe-area-inset-bottom));box-sizing:border-box}body[data-mode] main{padding-bottom:calc(140px + env(safe-area-inset-bottom))}}
@media print{body[data-mode] .shell>footer{position:static;display:flex;background:white;color:black;border:0;min-height:0}body[data-mode] main{padding-bottom:0}}

body[data-mode] .section-landing a{min-height:145px;cursor:pointer}body[data-mode] .section-landing a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}body[data-mode] .section-landing a p{margin-bottom:0}
/* Compact selection cards, including Safari's default text sizing. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body[data-mode] .section-landing{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;align-items:start}
body[data-mode] .section-landing a{display:block;box-sizing:border-box;min-height:0;height:auto;padding:22px 24px;border-radius:15px}
body[data-mode] .section-landing a strong{display:block;font-size:18px;line-height:1.3}
body[data-mode] .section-landing a p{font-size:13px;line-height:1.5;margin:8px 0 0}
@media(max-width:1024px){body[data-mode] .section-landing a{padding:19px 20px}}
@media(max-width:600px){body[data-mode] .section-landing{grid-template-columns:1fr;gap:10px}body[data-mode] .section-landing a{padding:16px 18px;min-height:44px;border-radius:13px}body[data-mode] .section-landing a strong{font-size:17px}body[data-mode] .section-landing a p{margin-top:5px;font-size:13px}}
/* Touch navigation: explicit colors for Safari hover/focus/active states. */
body[data-mode] .mobile-dock a{-webkit-tap-highlight-color:transparent;color:var(--ink);background:transparent;touch-action:manipulation}
body[data-mode] .mobile-dock a:hover,body[data-mode] .mobile-dock a:focus,body[data-mode] .mobile-dock a:active{background:var(--soft);color:var(--ink)}
body[data-mode] .mobile-dock a[aria-current=page]{background:#b72c4a;color:#fff}
body[data-mode] .mobile-dock a[aria-current=page] span{color:#fff}
body[data-mode] .mobile-dock a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

.record-select{display:flex;align-items:center;min-width:44px;min-height:44px}.record-select input{width:20px;height:20px;accent-color:#c52c4e}

/* Records use available width without making text columns too narrow. */
body[data-mode] .panel.records-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;padding:0;background:transparent;border:0;box-shadow:none}
body[data-mode] .records-grid>.document-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:start;gap:10px;padding:16px;background:var(--surface);border:1px solid var(--edge);border-radius:14px;margin:0;min-width:0}
.records-grid .record-select{min-width:32px;min-height:44px}.records-grid .document-row strong,.records-grid .document-row .meta{overflow-wrap:anywhere}.records-grid .record-actions{align-self:start}.records-grid>.empty{grid-column:1/-1}
@media(max-width:600px){body[data-mode] .panel.records-grid{grid-template-columns:1fr}}
/* Readable night actions and explicit touch/selection feedback. */
body[data-mode=night] button:not(.primary):not(.period-cell),body[data-mode=night] a.backup-button,body[data-mode=night] .record-actions>summary{background:#203858;color:#f5f8ff;border-color:#526b8d;-webkit-tap-highlight-color:transparent}
body[data-mode=night] button:not(.period-cell) :is(strong,small,span),body[data-mode=night] .discipline-icon{color:inherit}
body[data-mode=night] button:not(:disabled):not(.period-cell):hover,body[data-mode=night] a.backup-button:hover{background:#2b466b;color:#fff}
body[data-mode=night] button:not(:disabled):active,body[data-mode=night] a.backup-button:active,body[data-mode=night] .record-actions>summary:active,body[data-mode=night] button.selected,body[data-mode=night] button[aria-pressed=true]{background:#b72c4a;color:#fff;border-color:#ed708a}
body[data-mode=night] button.selected :is(strong,small,span){color:#fff}
body[data-mode=night] button:focus-visible,body[data-mode=night] a.backup-button:focus-visible{outline:2px solid #ff90a5;outline-offset:3px}
body[data-mode=night] button:disabled{opacity:.5;cursor:not-allowed}
body[data-mode=night] .project-badge{background:#293e5e;color:#f5b1c3}
/* Section navigation uses the same clear selection treatment as the mobile menu. */
body[data-mode] .section-tabs a,body[data-mode] .section-tabs button{background:#203858;color:#f5f8ff;border:1px solid #526b8d;border-radius:10px;padding:10px 16px;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;-webkit-tap-highlight-color:transparent}
body[data-mode] .section-tabs a:hover,body[data-mode] .section-tabs button:hover{background:#2b466b;color:#fff}
body[data-mode] .section-tabs a[aria-current=page],body[data-mode] .section-tabs button[aria-pressed=true],body[data-mode] .section-tabs a:active,body[data-mode] .section-tabs button:active{background:#b72c4a;color:#fff;border-color:#ed708a}
body[data-mode] .section-tabs a:focus-visible,body[data-mode] .section-tabs button:focus-visible{outline:2px solid #ed708a;outline-offset:3px}