:root {
  color-scheme: light;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #132f31;
  background: #f4f7f7;
  font-synthesis: none;
  --ink: #132f31;
  --muted: #526a6c;
  --line: #dce7e6;
  --teal: #09675c;
  --dark: #0b3031;
}
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; background: white; color: var(--ink); border: 1px solid #cbdcda; border-radius: 9px; padding: .6rem .86rem; font-weight: 650; font-size: .88rem; }
button:hover { background: #eaf4f2; border-color: #8eb7af; }
:focus-visible { outline: 3px solid #238c7b; outline-offset: 3px; }
[hidden] { display: none !important; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(1.95rem, 4vw, 2.65rem); letter-spacing: -.055em; line-height: 1.09; }
h2 { font-size: 1.16rem; letter-spacing: -.025em; }
h3 { font-size: 1.04rem; letter-spacing: -.018em; }
p { line-height: 1.55; }
small, .muted { color: var(--muted); }
.skip { position: fixed; top: 8px; left: 8px; z-index: 5; transform: translateY(-150%); padding: .6rem; background: white; }
.skip:focus { transform: none; }
.primary { background: var(--teal); border-color: var(--teal); color: white; }
.primary:hover { background: #075349; }
.layout { min-height: 100vh; display: grid; grid-template-columns: 236px minmax(0,1fr); }
.sidebar { background: var(--dark); color: #f1fffc; padding: 28px 17px 18px; display: flex; flex-direction: column; gap: 36px; position: sticky; top: 0; height: 100vh; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 1.31rem; font-weight: 800; letter-spacing: -.05em; line-height: 1; }
.sidebar .brand { padding-left: 9px; }
.brand span:not(.brand-icon) { color: #72dac0; }
.brand small { display: block; color: #b2d5d0; font-size: .67rem; font-weight: 650; letter-spacing: .12em; margin-top: 6px; }
.brand-icon { display: grid; place-items: center; background: #74dfc1; border-radius: 11px; width: 40px; height: 40px; color: #0a3934; font-size: 1.85rem; }
nav { display: grid; gap: 5px; }
nav button { display: flex; align-items: center; gap: 12px; text-align: left; color: #c7e1de; background: transparent; border-color: transparent; padding: .69rem .74rem; white-space: nowrap; }
nav button span { width: 18px; font-size: 1.15rem; text-align: center; }
nav button:hover, nav button[aria-current] { background: #19504d; border-color: #28605d; color: #f4fffc; }
.sidebar-bottom { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 14px 6px 0; border-top: 1px solid #37615f; font-size: .88rem; }
.sidebar-bottom small { display: block; color: #b6d1cf; margin-top: 4px; }
.avatar { background: #245653; color: #e5fbf5; border-radius: 50%; width: 36px; height: 36px; display: grid; place-items: center; }
.top { background: white; min-height: 64px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; padding: 10px clamp(16px, 3vw, 44px); gap: 12px; }
.top span { display: block; color: var(--muted); font-size: .82rem; margin-top: 3px; }
.workspace main { padding: 23px clamp(16px, 3vw, 44px); margin: auto; max-width: 1530px; }
.notice { border: 1px solid #eadbb9; background: #fff6e2; color: #624719; padding: 9px 13px; border-radius: 9px; font-size: .81rem; font-weight: 600; }
.notice span { margin-right: 4px; }
.feedback { color: var(--teal); margin: 10px 0 0; font-size: .88rem; }
.feedback:empty { display: none; }
.page-title { margin: 23px 0 24px; }
.page-title p { margin-top: 7px; color: var(--muted); }
.section-head, .round-top, .metric > div, footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.section-head { margin: 0 0 12px; }
.card { border-radius: 14px; border: 1px solid var(--line); background: white; min-width: 0; }
.round-grid, .metric-grid, .bed-grid { display: grid; gap: 14px; }
.round-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 24px; }
.round-card { padding: 16px; display: flex; flex-direction: column; gap: 8px; background: #e6f5ef; border-color: #c8e6da; }
.round-card.afternoon { background: #e9f0fa; border-color: #d4e1f3; }
.round-card.huddle { background: #f8f0e3; border-color: #eedec5; }
.round-card p { color: var(--muted); font-size: .86rem; margin-bottom: 5px; }
.round-link { margin-top: auto; align-self: start; background: #ffffffad; }
.tile-icon { display: grid; place-items: center; height: 36px; width: 36px; border-radius: 9px; font-size: 1.28rem; background: #ffffffa8; }
.chip { display: inline-block; color: #3e5c5d; background: #edf3f3; border-radius: 100px; padding: 4px 9px; font-size: .72rem; font-weight: 700; }
.round-card .chip { background: #ffffffa8; }
.chip.green { color: #086252; background: #e2f5ed; }
.chip.warn { color: #774214; background: #fff0d8; }
.metric-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metric { padding: 12px 14px; }
.metric > div { font-size: .82rem; font-weight: 650; }
.metric-icon { color: var(--teal); }
.metric strong { display: block; font-size: 1.75rem; line-height: 1.15; letter-spacing: -.04em; margin: 7px 0 4px; }
.metric small { font-size: .73rem; }
.text-button { color: var(--teal); background: transparent; border-color: transparent; padding-left: 0; }
.bed-grid { grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); }
.bed, .panel { padding: 17px; }
.bed p { font-size: .89rem; }
.tags, .actions { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.tags, .summary { margin: 9px 0; }
.bed-select { display: block; max-width: 350px; margin-bottom: 14px; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.panel > p { margin: 8px 0 12px; font-size: .9rem; }
.panel h3 { margin: 15px 0 5px; }
.module { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; }
.module > span { background: #e1f5ef; color: var(--teal); font-weight: 800; border-radius: 10px; padding: 10px 14px; }
.module p { font-size: .8rem; color: var(--muted); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; margin-bottom: 15px; }
.full { grid-column: 1 / -1; }
label { font-size: .85rem; font-weight: 650; }
input, select, textarea { width: 100%; min-width: 0; color: var(--ink); border: 1px solid #bdcecd; border-radius: 8px; padding: 9px; margin-top: 5px; background: white; }
textarea { resize: vertical; }
.stack { display: grid; gap: 12px; }
.task-list, .flag-list { list-style: none; padding: 0; margin: 8px 0; }
.task-list li, .flag-list li { border-top: 1px solid var(--line); padding: 11px 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; overflow-wrap: anywhere; }
.task-list li p, .flag-list { font-size: .84rem; }
.task-actions { display: flex; align-items: end; flex-direction: column; gap: 6px; }
.flag-list button { flex: none; }
.empty { color: var(--muted); background: #f3f7f7; border-radius: 8px; padding: 10px; }
footer { color: var(--muted); font-size: .75rem; margin-top: 22px; border-top: 1px solid var(--line); padding-top: 12px; }
dialog { width: min(430px, calc(100% - 28px)); border: 1px solid var(--line); border-radius: 15px; padding: 22px; color: var(--ink); }
dialog::backdrop { background: #0b30317d; }
#task-error { color: #8a331a; }
.login { max-width: 1020px; padding: 24px; margin: clamp(0px, 8vh, 80px) auto; }
.login-layout { display: grid; grid-template-columns: 1.1fr 1fr; margin-top: 15px; border-radius: 18px; overflow: hidden; border: 1px solid var(--line); }
.login-hero { min-height: 430px; background: linear-gradient(145deg, #0b3031, #10594f); color: white; padding: 32px; display: flex; flex-direction: column; justify-content: center; gap: 36px; }
.login-hero h1 { margin: 8px 0 12px; }
.login-hero p { color: #c5e9df; }
.eyebrow { font-size: .72rem; letter-spacing: .09em; font-weight: 750; }
.login-form { background: white; padding: clamp(20px, 4vw, 48px); display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.login-form h2 { font-size: 1.6rem; }
.login-form p { color: var(--muted); }
.login-form .eyebrow { color: var(--teal); }
@media (max-width: 1050px) {
  .layout { grid-template-columns: 192px minmax(0, 1fr); }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .layout, .login-layout { display: block; }
  .sidebar { position: static; height: auto; padding: 12px 14px; gap: 10px; }
  .sidebar .brand { padding-left: 0; }
  nav { display: flex; overflow-x: auto; }
  .sidebar-bottom { display: none; }
  .login-hero { min-height: 0; padding: 24px; gap: 22px; }
}
@media (max-width: 480px) {
  .round-grid, .form-grid { grid-template-columns: 1fr; }
  .login { padding: 12px; }
  .metric-grid { gap: 8px; }
  .metric { padding: 10px; }
}
.suggestion { display: grid; justify-items: start; gap: 7px; margin-top: 8px; padding: 10px; background: #fff6e2; color: #624719; border-radius: 8px; font-size: .82rem; }
.suggestion:empty { display: none; }