/* Hallmark · genre: modern-minimal · shape: app screen · signature: 과제 현황표 */
/* Critique: the selected record is the unit of work on both large and small screens. */
html { scroll-padding-top: calc(var(--top-height) + 12px); }
.sidebar, .drawer .sidebar-content { background: var(--nav); color: var(--nav-text); }
.sidebar { border-right: 0; }
.side-heading { padding: 24px 20px 20px; font-size: 18px; font-weight: 620; letter-spacing: -.025em; }
.section-nav { padding: 0 12px; }
.nav-group > p { margin: 8px 12px 8px; color: var(--nav-muted); font-size: 12px; font-weight: 500; }
.nav-group + .nav-group { border-color: var(--nav-line); margin-top: 20px; padding-top: 16px; }
.nav-link { color: var(--nav-text); border-radius: 3px; min-height: 40px; gap: 12px; font-weight: 470; }
.nav-link .icon { color: var(--nav-muted); width: 16px; height: 16px; }
.nav-link:hover, .nav-link[aria-current] { background: var(--nav-selected); color: var(--paper); }
.nav-link[aria-current] { font-weight: 650; }
.nav-link[aria-current] .icon { color: var(--paper); }
.nav-link:focus-visible { outline-color: var(--paper); outline-offset: 0; }
.side-bottom .nav-link { color: var(--nav-text); border-color: var(--nav-line); }
.side-bottom { padding-bottom: 20px; }
.drawer .side-heading { display: none; }
.drawer .section-nav { padding-top: 12px; }
.drawer .nav-link { min-height: 44px; }
.topbar { border-bottom-color: var(--rule); }
.brand-space { padding-left: 20px; }
.workspace-tabs a { padding-inline: 16px; }
.workspace-tabs a[aria-current]::after { left: 8px; right: 8px; height: 2px; }
.demo-badge { background: transparent; border: 0; padding: 0; }
.account { font-size: 12px; font-weight: 450; }
.button { border-radius: 4px; min-height: 44px; font-weight: 590; }
.text-link { min-height: 44px; }
.fine-print, .task-field, .task-company { font-size: 13px; }
.task-copy strong, .compact .task-copy strong { font-weight: 560; }
.field-icon { width: 34px; height: 34px; border-radius: 4px; background: var(--surface); color: var(--muted); }
.ledger-page-head { margin-bottom: 20px; align-items: center; }
.ledger-page-head .asof { font-size: 13px; color: var(--muted); margin-top: 4px; }
.asof time { margin-left: 4px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ledger-workspace { display: grid; grid-template-columns: minmax(0, 2.25fr) minmax(272px, .93fr); gap: 20px; align-items: start; }
.register-book, .record-preview { min-width: 0; background: var(--paper); border: 1px solid var(--border); border-top: 2px solid var(--nav); }
.state-tabs { display: flex; gap: 20px; padding: 0 16px; border-bottom: 1px solid var(--border); }
.state-tabs button { min-height: 45px; padding: 8px 2px; font-size: 14px; background: transparent; border: 0; border-bottom: 2px solid transparent; color: var(--muted); font-weight: 500; }
.state-tabs button span { margin-left: 4px; font-variant-numeric: tabular-nums; }
.state-tabs button[aria-pressed=true] { color: var(--active-ink); font-weight: 650; border-bottom-color: var(--active); }
.state-tabs button:hover { color: var(--active-ink); }
.ledger-filter { display: flex; gap: 8px; padding: 12px 16px; }
.ledger-filter .search-box, .ledger-filter .filter-select { min-height: 40px; border-radius: 4px; }
.ledger-filter .filter-select { flex: 0 1 150px; }
.ledger-filter .filter-select select { min-height: 38px; }
.ledger-table { width: 100%; table-layout: fixed; border-collapse: collapse; text-align: left; }
.ledger-table .title-col { width: 48%; }
.ledger-table .company-col { width: 23%; }
.ledger-table .deadline-col { width: 15%; }
.ledger-table .status-col { width: 14%; }
.ledger-table thead { background: var(--surface); }
.ledger-table thead th { font-size: 12.5px; font-weight: 560; padding: 8px 8px; white-space: nowrap; color: var(--muted); border-block: 1px solid var(--border); }
.ledger-table thead th:first-child { padding-left: 16px; }
.ledger-table th[scope=row], .ledger-table td { border-bottom: 1px solid var(--faint-border); vertical-align: middle; }
.ledger-table td { padding: 12px 8px; color: var(--text); font-size: 13.5px; }
.ledger-table th[scope=row] { text-align: left; font-weight: 550; }
.ledger-table tbody tr:hover { background: var(--surface); }
.company-cell small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.deadline-cell, .mobile-record-meta time { white-space: nowrap; font-variant-numeric: tabular-nums; }
.record-button, .record-link { min-height: 66px; min-width: 0; width: 100%; border: 0; border-radius: 0; background: transparent; text-align: left; padding: 12px 8px 12px 16px; color: var(--ink); font-size: 15px; line-height: 1.45; font-weight: 550; letter-spacing: -.015em; }
.record-button { display: flex; gap: 8px; align-items: center; min-height: 48px; padding-block: 2px; }
.record-button > span:last-child { min-width: 0; }
.record-button small, .record-link small, .mobile-status > span:first-child { display: block; margin-bottom: 4px; color: var(--muted); font-size: 12px; font-weight: 450; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.record-button:focus-visible { outline-offset: -3px; }
.selection-mark { flex: none; width: 10px; height: 10px; border: 1px solid var(--rule); border-radius: 50%; }
.direct-trigger, .ledger-mobile { display: none; }
.ledger-status { font-size: 12.5px; font-weight: 580; white-space: nowrap; }
.ledger-status.open { color: var(--teal); }
.ledger-status.pilot { color: var(--active-ink); }
.ledger-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 37px; padding: 8px 16px; font-size: 12.5px; color: var(--muted); }
.preview-heading { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.preview-heading h2, .references-head h2 { font-size: 17px; font-weight: 640; letter-spacing: -.02em; }
.preview-heading > span { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.preview-body { padding: 16px 16px 16px; }
.preview-body h3 { font-size: 19px; line-height: 1.45; font-weight: 620; letter-spacing: -.022em; text-wrap: balance; }
.preview-body > p { margin-top: 8px; color: var(--muted); font-size: 13.5px; line-height: 1.65; }
.equipment-photo { margin: 12px 0 0; overflow: hidden; }
.equipment-photo img { width: 100%; height: 105px; object-fit: cover; object-position: right 61%; }
.equipment-photo figcaption { margin-top: 4px; color: var(--muted); font-size: 12px; }
.preview-body .facts { margin: 12px 0 12px; }
.preview-body .facts > div { grid-template-columns: 64px minmax(0, 1fr); gap: 8px; padding: 4px 0; }
.preview-body .facts dt, .preview-body .facts dd { font-size: 13px; }
.preview-body .button { width: 100%; color: var(--active-ink); }
.preview-blank { padding: 16px; }
.preview-blank h2 { font-size: 17px; }
.preview-blank p { font-size: 14px; color: var(--muted); margin-top: 8px; }
.work-references { margin-top: 24px; }
.references-head { display: flex; align-items: center; justify-content: space-between; }
.work-references ul { list-style: none; background: var(--paper); border-top: 1px solid var(--rule); }
.work-references li { border-bottom: 1px solid var(--border); }
.work-references li a { min-height: 44px; display: grid; grid-template-columns: 84px minmax(0, 1fr) 16px; gap: 12px; align-items: center; padding: 8px 16px; }
.work-references li a:hover { background: var(--surface); }
.work-references li span { color: var(--muted); font-size: 13px; }
.work-references li strong { font-size: 14px; font-weight: 520; }
.work-references li .icon { width: 14px; height: 14px; color: var(--muted); }
.erp-modules { border-radius: 0; border-top: 2px solid var(--nav); margin-top: 0; }
.new-module { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border-top: 1px solid var(--border); background: var(--selected-row); }
.new-marker { color: var(--active-ink); font-size: 12px; font-weight: 620; }
.new-module h3 { margin-top: 4px; font-size: 20px; font-weight: 650; }
.new-module p { margin-top: 4px; color: var(--muted); font-size: 14px; }
.module-list dt { font-weight: 560; }
.module-list dd { padding-left: 0; }

@media (min-width: 1151px) {
  .ledger-table th[scope=row] { padding-block: 8px; }
  .ledger-table tr[data-record] { cursor: pointer; }
  .ledger-table tr[data-current] { background: var(--selected-row); }
  tr[data-current] .selection-mark { border: 3px solid var(--active); background: var(--paper); }
}
.search-box, .filter-select, .form-field input, .form-field select, .form-field textarea { border-color: var(--control-edge); }
.form-field :user-invalid { border-color: var(--error); }
@media (max-width: 1150px) {
  .ledger-workspace { grid-template-columns: minmax(0, 1fr); }
  .record-preview, .preview-trigger, .preview-hint { display: none; }
  .direct-trigger { display: flex; flex-direction: column; justify-content: center; min-height: 60px; }
}
@media (max-width: 960px) {
  .brand-space { padding-left: 8px; }
}
@media (max-width: 660px) {
  .ledger-table { display: none; }
  .ledger-mobile { display: block; list-style: none; border-top: 1px solid var(--border); }
  .ledger-mobile li { border-bottom: 1px solid var(--border); }
  .ledger-mobile a { display: block; padding: 12px 16px; }
  .ledger-mobile a:hover { background: var(--surface); }
  .mobile-status, .mobile-record-meta { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
  .mobile-status > span:first-child { margin-bottom: 0; }
  .ledger-mobile strong { display: block; margin: 4px 0 4px; font-size: 15.5px; font-weight: 560; line-height: 1.5; letter-spacing: -.015em; }
  .mobile-record-meta { color: var(--muted); font-size: 12.5px; }
  .ledger-page-head { flex-wrap: nowrap; align-items: center; }
  .ledger-page-head > .button { min-height: 44px; }
  .state-tabs { gap: 16px; padding: 0 12px; }
  .ledger-filter { flex-wrap: wrap; gap: 8px; padding: 12px 12px; }
  .ledger-filter .search-box { flex: 1 1 165px; }
  .ledger-filter .filter-select { flex: 0 1 auto; }
  .ledger-filter .search-box, .ledger-filter .filter-select, .ledger-filter select { min-height: 44px; }
  .search-box input, .filter-select select, .form-field input, .form-field select, .form-field textarea { font-size: 16px; }
  .ledger-foot { min-height: 34px; padding: 8px 16px; }
  .work-references { margin-top: 16px; }
  .work-references li a { grid-template-columns: 62px minmax(0, 1fr) 13px; gap: 8px; padding: 8px 12px; }
  .new-module { padding: 16px; flex-wrap: wrap; }
}
@media (max-width: 540px) {
  .brand-space { padding-left: 4px; }
  .workspace-tabs a { padding-inline: 12px; }
  .page-body { padding-top: 20px; }
  .ledger-page-head { margin-bottom: 16px; }
  .ledger-page-head h1 { font-size: 25px; }
  .ledger-page-head .asof { font-size: 12.5px; }
  .form-header .example-button, .form-actions .button { min-height: 44px; }
}