:root {
    --ink: #243346; --muted: #607087; --line: #dce3ed; --surface: #fff; --accent: #245cc4;
}
html { font-size: 15px; }
body { color: var(--ink); background: #f5f7fa; }
a { color: var(--accent); text-underline-offset: .18em; }
h1, h2, h3 { font-weight: 650; line-height: 1.25; }
h1 { font-size: clamp(1.65rem, 3vw, 2.15rem); margin-bottom: 0; overflow-wrap: anywhere; }
h2 { font-size: 1.2rem; margin: 0; }
h3 { font-size: 1rem; }
.container { max-width: 1180px; }
.hero { padding: 5rem 0; max-width: 760px; }
.hero h1 { font-size: clamp(3rem, 8vw, 5rem); }
.eyebrow { text-transform: uppercase; letter-spacing: .1em; font-size: .75rem; color: var(--muted); margin-bottom: .35rem; }
.navbar { padding: .65rem 0; }
.navbar-brand { font-weight: 700; letter-spacing: -.03em; }
.navbar-nav { gap: .2rem; }
.nav-link { padding: .4rem .6rem !important; }
.context { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; border-left: 3px solid var(--accent); padding: .65rem .85rem; background: #e7eefb; margin-bottom: 1.2rem; font-size: .9rem; }
.context a { margin-left: auto; }
.page-heading, .section-heading { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; }
.page-heading { margin: .9rem 0 1rem; }
.section-heading { margin: 1.4rem 0 .65rem; }
.breadcrumb-nav { display: flex; align-items: center; gap: .55rem; font-size: .85rem; color: var(--muted); }
.metrics { display: grid; grid-template-columns: repeat(3, 1fr); background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; margin: 1rem 0; }
.metrics > div { display: flex; align-items: baseline; gap: .65rem; padding: .8rem 1rem; }
.metrics > div + div { border-left: 1px solid var(--line); }
.metrics strong { font-size: 1.6rem; line-height: 1; }
.metrics span { color: var(--muted); font-size: .85rem; }
.company-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 1rem; }
.card { border: 1px solid var(--line); border-radius: .5rem; box-shadow: none; }
.filters { display: flex; flex-wrap: wrap; align-items: end; gap: .7rem; background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; padding: .8rem; margin: 1rem 0; }
.filters > div:not(.form-check) { flex: 1 1 160px; min-width: 0; }
.filters .form-check { padding-bottom: .35rem; }
.filters label { margin-top: 0; font-size: .8rem; }
.filters .form-select { font-size: .85rem; padding-block: .4rem; }
.filters > a { padding-bottom: .3rem; font-size: .85rem; }
.compact-filter { justify-content: flex-start; padding: .65rem .85rem; }
.form-panel { background: var(--surface); padding: 1.4rem; border: 1px solid var(--line); border-radius: .5rem; max-width: 520px; margin: 1rem 0; }
.form-panel.wide { max-width: 800px; }
label { margin-top: .8rem; margin-bottom: .3rem; font-weight: 550; }
.form-check label { margin: 0; }
.btn { font-weight: 550; border-radius: .35rem; }
.btn-sm { padding: .35rem .65rem; }
.empty { padding: .85rem 1rem; border: 1px dashed #aab8c9; border-radius: .4rem; background: var(--surface); color: var(--muted); }
.work-list, .project-overview { border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); overflow: clip; }
.work-list > .work-row + .work-row { border-top: 1px solid var(--line); }
.list-columns { display: grid; gap: .8rem; background: #eef2f7; padding: .5rem .9rem .5rem 2.3rem; color: #52647b; font-size: .72rem; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.project-columns, .milestone-columns { grid-template-columns: minmax(0, 2.2fr) minmax(100px, 1fr) minmax(0, 1.1fr) 120px; }
.task-columns { grid-template-columns: minmax(0, 2fr) minmax(170px, 1.25fr) minmax(0, 1fr) 120px; }
.work-row > summary { position: relative; display: grid; align-items: center; gap: .8rem; list-style: none; padding: .7rem .9rem .7rem 2.3rem; cursor: pointer; font-size: .88rem; min-height: 48px; }
.work-row > summary::-webkit-details-marker { display: none; }
.work-row > summary::before { content: ""; position: absolute; left: 1rem; top: 1.05rem; width: .45rem; height: .45rem; border-right: 2px solid #63758b; border-bottom: 2px solid #63758b; transform: rotate(-45deg); transition: transform .12s ease; }
.work-row[open] > summary::before { transform: rotate(45deg); }
.work-row > summary:hover { background: #f3f6fb; }
.work-row[open] > summary { background: #edf3fc; }
.row-title { font-weight: 600; overflow-wrap: anywhere; min-width: 0; }
.row-owner { color: var(--muted); overflow-wrap: anywhere; min-width: 0; }
.row-date { color: #52647b; font-variant-numeric: tabular-nums; }
.row-badges { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.work-badge, .type-label, .archived-label, .count { display: inline-flex; align-items: center; gap: .3rem; border-radius: .3rem; padding: .18rem .4rem; font-size: .73rem; line-height: 1.3; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.type-label { color: #52647b; background: #edf0f5; margin-left: .3rem; font-weight: 500; }
.archived-label { color: #52647b; background: #e5e9ef; margin-left: .3rem; }
.count { color: var(--muted); background: #edf0f5; margin-left: .3rem; }
.status-planned { background: #edf0f5; color: #52647b; }
.status-active { background: #e4edfc; color: #204e99; }
.status-blocked { background: #fbe8eb; color: #a72432; }
.status-completed { background: #e3f2e9; color: #24643c; }
.priority-low { background: #eef2f6; color: #52647b; }
.priority-normal { background: #e8edf4; color: #43566d; }
.priority-high { background: #fff0d2; color: #825608; }
.priority-critical { background: #fbe8eb; color: #a72432; }
.priority-dot { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; }
.row-detail { border-top: 1px solid var(--line); padding: .9rem 1rem; }
.row-detail > p { margin-bottom: .7rem; }
.description { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9rem; }
.record-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-bottom: .8rem; font-size: .8rem; }
.record-meta dt { color: var(--muted); font-weight: 500; }
.record-meta dd { margin-bottom: 0; }
.record-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.record-actions form { margin: 0; }
.project-overview > summary { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.overview-meta { color: var(--muted); font-size: .85rem; overflow-wrap: anywhere; }
.nested-heading { margin: 1rem 0 .6rem; font-size: .9rem; }
.task-group + .task-group { margin-top: 1rem; }
.group-heading { margin: .8rem 0 .5rem; font-size: .9rem; }
.mobile-label { display: none; font-weight: 500; }
.internal-only { border: 2px solid #6b5e91; border-radius: .5rem; padding: 1rem; background: #f0ecf8; margin: 1rem 0; }
.break-all, .audit-details { overflow-wrap: anywhere; }
.audit-details { max-width: 450px; }
.validation-summary-valid { display: none; }
.validation-summary-errors { margin-bottom: .75rem; }
.notification { padding: .85rem 1rem; border: 1px solid; border-left-width: 4px; border-radius: .4rem; margin-bottom: 1rem; overflow-wrap: anywhere; }
.notification-success { color: #24643c; background: #e3f2e9; border-color: #7ba98b; }
.notification-error { color: #922533; background: #fceff1; border-color: #c98791; }
.notification ul { margin-bottom: 0; padding-left: 1.2rem; }
.notification p:last-child { margin-bottom: 0; }
.notification:focus { outline: 3px solid #a56500; outline-offset: 2px; }
.submit-progress { display: inline-block; font-size: .8rem; margin: .5rem; color: var(--muted); }
form[aria-busy="true"] { cursor: progress; }
.order-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: .65rem; }
.feedback-message { margin-block: .75rem; overflow-wrap: anywhere; }
.rich-content img,.rich-editor img { max-width: 100%; height: auto; }
.rich-content table,.rich-editor table { width: 100%; border-collapse: collapse; }
.rich-content td,.rich-content th,.rich-editor td,.rich-editor th { border: 1px solid var(--line); padding: .4rem; }
.rich-content { overflow: auto; }
.rich-editor { min-height: 150px; padding: .75rem; background: white; border: 1px solid var(--line); border-radius: .35rem; overflow-wrap: anywhere; }
.rich-editor:focus-visible { outline: 3px solid #a56500; outline-offset: 2px; }
.rich-toolbar { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0; }
.specification dd { white-space: pre-wrap; overflow-wrap: anywhere; }
.order-save { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
[hidden] { display: none !important; }
.order-instruction { color: var(--muted); font-size: .8rem; }
.reorder-controls { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; grid-column: 1 / -1; }
.drag-handle { touch-action: none; cursor: grab; border: 1px solid var(--line); border-radius: .3rem; padding: .3rem .65rem; background: white; color: var(--ink); min-height: 36px; }
.drag-handle:active { cursor: grabbing; }
.dragging > summary { background: #dce9ff !important; outline: 2px solid var(--accent); outline-offset: -2px; }
.rearranging > .work-list > .work-row > summary { cursor: default; }
.rearranging > .work-list > .work-row > summary::before { display: none; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #a56500; outline-offset: 2px; }
.work-row > summary:focus-visible { outline-offset: -3px; }
@media (max-width: 900px) {
    .list-columns { display: none; }
    .project-columns, .milestone-columns, .task-columns { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
    .row-owner, .row-date { font-size: .8rem; }
    .mobile-label { display: inline; }
    .metrics > div { align-items: flex-start; flex-direction: column; gap: .3rem; }
    .project-overview > summary { grid-template-columns: 1fr; gap: .3rem; }
}
@media (max-width: 575px) {
    .container { padding-inline: .85rem; }
    main.container { padding-top: 1rem !important; }
    .navbar .container { gap: .45rem; }
    .navbar-nav { width: 100%; order: 3; font-size: .8rem; gap: 0; }
    .navbar form { margin-left: auto; }
    .nav-link { padding: .35rem .45rem !important; }
    .context { padding: .6rem .7rem; }
    .context a { margin-left: 0; }
    .metrics > div { padding: .7rem .55rem; }
    .metrics strong { font-size: 1.4rem; }
    .metrics span { font-size: .73rem; }
    .form-panel { padding: 1rem; }
    .work-row > summary { grid-template-columns: minmax(0, 1fr); gap: .4rem; padding: .7rem .7rem .7rem 2rem; }
    .work-row > summary::before { left: .75rem; }
    .row-title { font-size: .92rem; }
    .row-owner, .row-date { font-size: .78rem; }
    .row-detail { padding: .75rem; }
    .record-meta { gap: .5rem 1rem; }
    .section-heading > .record-actions { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .work-row > summary::before { transition: none; } }