:root {
  --ink: #111827;
  --muted: #6b7280;
  --line: #e3e6eb;
  --canvas: #f5f6f8;
  --paper: #fff;
  --primary: #4f46d8;
  --primary-dark: #3f37b8;
  --green: #12805c;
  --amber: #a86108;
  --red: #c83e57;
  --shadow: 0 5px 18px rgba(25, 31, 48, .055);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { min-width: 320px; min-height: 100vh; margin: 0; color: var(--ink); background: var(--canvas); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif; font-size: 14px; line-height: 1.5; font-variant-numeric: tabular-nums; }
body.screen-open { overflow: hidden; }
body.board-view-open { height: 100vh; overflow: hidden; }
button, input, select, textarea { font: inherit; line-height: 1.45; }
button, select { cursor: pointer; }
button { color: inherit; }
a { color: inherit; }
.hidden { display: none !important; }
.cloud-auth-gate { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 20px; background: rgba(244, 246, 250, .94); backdrop-filter: blur(8px); }
.cloud-auth-card { width: min(420px, 100%); padding: 30px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 24px 70px rgba(14, 18, 28, .14); }
.cloud-auth-card h1 { margin: 0; font-size: 24px; }
.cloud-auth-card > p { margin: 8px 0 22px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.cloud-auth-card form { display: grid; gap: 14px; }
.cloud-auth-card label { display: grid; gap: 6px; color: #4f5866; font-size: 12px; font-weight: 700; }
.cloud-auth-card input { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; }
.cloud-auth-card button { min-height: 40px; }
.cloud-auth-card .cloud-auth-toggle { width: 100%; margin-top: 13px; border: 0; color: var(--primary); background: transparent; font-size: 12px; cursor: pointer; }
.cloud-auth-message { min-height: 18px; margin: 0; color: #9a4b24; font-size: 12px; line-height: 1.5; }
.cloud-account-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; padding: 18px 20px; }
.cloud-account-identity { display: flex; align-items: center; gap: 13px; min-width: 0; }
.cloud-account-avatar { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 12px; color: #5149bd; background: #efedff; font-size: 20px; font-weight: 700; }
.cloud-account-details { display: grid; gap: 2px; min-width: 0; }
.cloud-account-label { color: var(--muted); font-size: 11px; font-weight: 700; }
.cloud-account-details strong { overflow: hidden; font-size: 14px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.cloud-account-panel > button { flex: 0 0 auto; }

.app-shell { display: grid; grid-template-columns: 210px minmax(0, 1fr); width: 100%; min-height: 100vh; margin: 0; transition: grid-template-columns .2s ease; }
.app-shell > main { min-width: 0; padding: 0 30px; }
.sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; padding: 22px 16px 18px; overflow: hidden; border-right: 1px solid var(--line); background: #fff; transition: padding .2s ease; }
.topbar { min-height: 68px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 10px; width: fit-content; padding: 0; border: 0; background: transparent; text-align: left; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; color: #fff; background: var(--ink); font-weight: 850; }
.brand-mark.small { width: 29px; height: 29px; border-radius: 8px; font-size: 12px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 15px; letter-spacing: -.01em; }
.brand small { margin-top: 2px; color: var(--muted); font-size: 10px; letter-spacing: .08em; }
.workspace-month-picker { width: 100%; padding: 0 2px; }
.workspace-month-controls { display: grid; grid-template-columns: 32px minmax(0, 1fr) 32px; align-items: center; gap: 2px; min-height: 40px; padding: 4px; border: 1px solid #e1e3e9; border-radius: 12px; background: #f7f8fa; box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 2px 8px rgba(35,36,65,.04); }
.workspace-month-controls button { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 9px; color: #7a8290; background: transparent; transition: color .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease; }
.workspace-month-controls button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.workspace-month-controls button:hover:not(:disabled) { border-color: #e2e0fa; color: var(--primary); background: #fff; box-shadow: 0 2px 7px rgba(58,52,135,.11); }
.workspace-month-controls button:active:not(:disabled) { transform: scale(.92); color: var(--primary-dark); background: #eeecff; box-shadow: none; }
.workspace-month-controls button:focus-visible { outline: 2px solid rgba(79,70,216,.4); outline-offset: 1px; }
.workspace-month-controls button:disabled { color: #c5cad2; cursor: not-allowed; opacity: .62; }
.workspace-month-controls strong { overflow: hidden; color: #303442; font-size: 12px; font-weight: 800; letter-spacing: .01em; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.workspace-month-compact { display: none; }

.main-nav { display: grid; gap: 5px; margin-top: 34px; }
.nav-button { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 10px; border: 0; border-radius: 8px; padding: 11px 12px; color: #687080; background: transparent; font-size: 13px; font-weight: 700; text-align: left; white-space: nowrap; }
.nav-icon { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nav-button.active { color: #4338b0; background: #eeecff; }
.sidebar-footer { display: grid; gap: 9px; margin-top: auto; }
.sidebar-footer small { padding-left: 3px; color: #8b93a0; font-size: 10px; }
.sidebar-toggle { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 9px; width: 100%; padding: 9px 10px; border: 0; border-radius: 8px; color: #687080; background: transparent; font-size: 11px; font-weight: 700; text-align: left; white-space: nowrap; }
.sidebar-toggle:hover { color: #4338b0; background: #f3f2ff; }
.sidebar-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.app-shell.sidebar-collapsed { grid-template-columns: 72px minmax(0, 1fr); }
.app-shell.sidebar-collapsed .sidebar { padding-right: 10px; padding-left: 10px; }
.app-shell.sidebar-collapsed .brand { width: 100%; justify-content: center; }
.app-shell.sidebar-collapsed .brand > span:last-child, .app-shell.sidebar-collapsed .nav-button span, .app-shell.sidebar-collapsed .sidebar-toggle span, .app-shell.sidebar-collapsed .sidebar-footer small { display: none; }
.app-shell.sidebar-collapsed .workspace-month-picker { padding: 0; }
.app-shell.sidebar-collapsed .workspace-month-controls { grid-template-columns: 1fr; border-color: #dedbfd; background: #f0efff; box-shadow: none; }
.app-shell.sidebar-collapsed .workspace-month-controls button { display: none; }
.app-shell.sidebar-collapsed .workspace-month-controls strong { display: grid; place-items: center; height: 34px; color: #4f46c8; font-size: 11px; }
.app-shell.sidebar-collapsed .workspace-month-full { display: none; }
.app-shell.sidebar-collapsed .workspace-month-compact { display: inline; }
.app-shell.sidebar-collapsed .nav-button, .app-shell.sidebar-collapsed .sidebar-toggle { grid-template-columns: 1fr; justify-items: center; gap: 0; padding-right: 0; padding-left: 0; }
.app-shell.sidebar-collapsed .sidebar-toggle svg { transform: rotate(180deg); }
.topbar > .button { justify-self: end; }

.button { border: 0; border-radius: 9px; padding: 9px 15px; font-size: 13px; font-weight: 700; transition: background .15s, border-color .15s; }
.button-primary { color: #fff; background: var(--primary); box-shadow: 0 2px 7px rgba(79, 70, 216, .22); }
.button-primary:hover { background: var(--primary-dark); }
.button-ghost { border: 1px solid var(--line); background: #fff; }
.button-dark { color: #fff; background: var(--ink); }

.view-panel { padding: 20px 0 34px; }
.project-search { height: 43px; padding: 0 15px; border-color: #dfe3e8; border-radius: 10px; background: #fff; box-shadow: 0 2px 8px rgba(25,31,48,.035); font-size: 13px; }
.project-search::placeholder { color: #9299a5; }
input, select, textarea { width: 100%; border: 1px solid #dfe3e8; border-radius: 9px; padding: 9px 11px; color: var(--ink); background: #f8f9fb; outline: none; font-size: 13px; }
input:focus, select:focus, textarea:focus { border-color: #9790eb; background: #fff; box-shadow: 0 0 0 3px rgba(79, 70, 216, .1); }

.status-board { display: grid; grid-template-columns: repeat(4, minmax(250px, 1fr)); align-items: stretch; gap: 14px; margin-top: 16px; overflow-x: auto; }
#projectsView { height: 100%; min-height: 0; }
#projectsView .status-board { height: 100%; min-height: 0; margin-top: 0; overflow-y: hidden; }
body.board-view-open .app-shell { height: 100vh; min-height: 0; overflow: hidden; }
body.board-view-open .app-shell > main { height: 100%; min-height: 0; overflow: hidden; }
.status-column { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding: 10px; border: 1px solid #e1e4e9; border-radius: 14px; background: #eceef2; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.status-column.is-drag-over { border-color: #8d85e8; background: #e9e7fb; box-shadow: inset 0 0 0 2px rgba(103,94,224,.14); }
.status-column > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 7px 14px; }
.status-column > header div { display: flex; align-items: center; gap: 8px; }
.status-column > header i { width: 7px; height: 7px; border-radius: 50%; background: var(--primary); }
.status-column.revision > header i { background: #db6677; }
.status-column.pending > header i { background: #e2a343; }
.status-column.completed > header i { background: #31a278; }
.status-column > header strong { font-size: 14px; }
.status-column > header > span { display: grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 7px; color: var(--muted); background: #fff; font-size: 12px; }
.status-column-body { display: grid; flex: 1 1 0; grid-auto-rows: max-content; min-height: 0; max-height: none; align-content: start; gap: 10px; padding-right: 2px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c8ccd4 transparent; }
.column-empty { display: grid; place-items: center; min-height: 110px; border: 1px dashed #d3d7de; border-radius: 10px; color: #7f8794; background: rgba(255,255,255,.45); font-size: 12px; }
.project-card { position: relative; display: flex; align-self: start; flex: 0 0 auto; flex-direction: column; width: 100%; height: max-content; min-height: 91px; padding: 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: #fff; box-shadow: var(--shadow); cursor: grab; transition: border-color .18s, box-shadow .18s, opacity .16s ease, transform .16s ease; }
.project-card:active { cursor: grabbing; }
.project-card.is-dragging { opacity: .35; transform: scale(.985); }
.project-card.is-drop-before { box-shadow: 0 -4px 0 -1px var(--primary), var(--shadow); }
.project-card.is-drop-after { box-shadow: 0 4px 0 -1px var(--primary), var(--shadow); }
.status-board.is-dragging .status-column.is-drag-over .column-empty { border-color: #8d85e8; color: #5d55c2; background: rgba(255,255,255,.56); }
.project-card:hover { border-color: #c8cad1; box-shadow: 0 7px 20px rgba(35, 36, 65, .07); }
.project-card::after { display: none; }
.status-column.active .project-card { border-color: #dedbfd; background: #f5f4ff; }
.status-column.revision .project-card { border-color: #f0ced4; background: #fff3f5; }
.status-column.pending .project-card { border-color: #f2dfbd; background: #fff8ec; }
.status-column.completed .project-card { border-color: #cfe9de; background: #f0faf6; }
.status-column .project-card.deadline-urgent { border-color: #efb4bd; background: #fff0f2; box-shadow: 0 5px 16px rgba(190,48,72,.08); }
.status-column .project-card.deadline-urgent:hover { border-color: #df8997; box-shadow: 0 7px 20px rgba(190,48,72,.13); }
.project-card-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.project-card-top span { color: var(--muted); font-size: 10px; }
.project-card-top i { color: var(--primary); font-style: normal; font-size: 16px; }
.status-pill { display: inline-flex; width: fit-content; padding: 4px 8px; border-radius: 6px; font-size: 10px; font-weight: 750; }
.status-pill.active { color: #4338b0; background: #eceaff; }
.status-pill.revision { color: #a6364a; background: #ffe3e8; }
.status-pill.pending { color: #985b07; background: #fff1d8; }
.status-pill.completed { color: #087554; background: #ddf5eb; }
.status-pill.archived { color: #687180; background: #e7e9ed; }
.month-label { color: var(--muted); font-size: 10px; }
.project-card h2 { min-width: 0; margin: 0; overflow: hidden; font-size: 15px; letter-spacing: -.015em; text-overflow: ellipsis; white-space: nowrap; }
.project-card-main { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.project-card-main > strong { flex: 0 0 auto; color: var(--primary); font-size: 13px; }
.project-card-caption { margin-top: 3px; color: var(--muted); font-size: 9px; }
.project-card-links { display: grid; gap: 5px; margin-top: 10px; }
.project-card-primary, .project-card-prompts { display: flex; flex-wrap: nowrap; gap: 5px; overflow: hidden; }
.project-card-primary .project-card-pill { flex: 1 1 0; width: auto; min-width: 0; }
.project-card-prompts .project-card-pill { flex: 0 1 auto; min-width: 0; }
.project-card-pill { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; gap: 5px; padding: 5px 9px; overflow: hidden; border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; }
.project-card-pill span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.project-card-pill.request { color: #5144bd; background: #eceaff; }
.project-card-pill.flow { color: #087554; background: #ddf5eb; }
.project-card-pill.prompt { color: #1f61aa; background: #e1efff; }
.project-card-pill:hover { filter: brightness(.96); }
.project-card-pill.disabled { color: #9299a5; background: #eef0f3; opacity: .65; }
.project-card > p { min-height: 29px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.project-card-meta { display: flex; gap: 14px; margin-top: 11px; color: var(--muted); font-size: 9px; }
.project-card-meta strong { color: var(--ink); font-size: 13px; }
.project-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: auto; padding-top: 11px; border-top: 1px solid #eef0f3; color: #5d6573; font-size: 9px; }
.project-card-footer span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-card-footer i { color: var(--primary); font-style: normal; font-size: 17px; }
.empty-state { grid-column: 1/-1; display: grid; gap: 5px; place-items: center; padding: 90px 20px; border: 1px dashed #d7dae0; border-radius: 14px; color: var(--muted); }
.empty-state strong { color: var(--ink); }
.empty-state span { font-size: 12px; }

.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 17px 0 20px; }
.section-heading h1 { margin: 0 0 5px; font-size: 28px; line-height: 1.2; letter-spacing: -.025em; }
.section-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.heading-actions { display: flex; align-items: center; gap: 9px; }
.month-switcher { display: grid; grid-template-columns: 36px minmax(130px, auto) 36px; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.month-switcher button { height: 36px; border: 0; background: transparent; }
.month-switcher button:hover:not(:disabled) { color: var(--primary); background: #f3f2ff; }
.month-switcher button:disabled { color: #c5cad2; cursor: default; }
.month-switcher strong { padding: 0 14px; font-size: 13px; text-align: center; }
.table-display-filter { position: relative; }
.summary-columns-menu { position: fixed; inset: auto; z-index: 1000; display: grid; width: 245px; margin: 0; padding: 7px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #fff; box-shadow: 0 16px 42px rgba(17,24,39,.15); }
.summary-columns-menu > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 9px 10px; border-bottom: 1px solid #eceef1; }
.summary-columns-menu > div:first-child strong { font-size: 12px; }
.summary-columns-menu > div:first-child span { color: var(--muted); font-size: 9px; }
.summary-columns-options { display: grid; gap: 5px; padding-top: 7px; }
.summary-column-option { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; min-height: 34px; border: 1px solid transparent; border-radius: 8px; cursor: grab; transition: background-color .15s ease, border-color .15s ease, opacity .15s ease; }
.summary-column-option:hover { background: #f6f5ff; }
.summary-column-option.is-dragging { opacity: .45; }
.summary-column-option.is-drag-over { border-color: #bcb6f5; background: #efedff; }
.summary-drag-handle { color: #a1a8b3; font-size: 13px; text-align: center; user-select: none; }
.summary-column-option label { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; padding: 8px 9px 8px 2px; color: #4f5866; font-size: 11px; font-weight: 700; cursor: pointer; }
.summary-column-option.is-fixed { cursor: default; background: #f7f8fa; }
.summary-column-option.is-fixed:hover { background: #f7f8fa; }
.summary-column-option.is-fixed label { cursor: default; }
.summary-column-option.is-fixed label small { margin: 0; color: #969da8; font-size: 9px; font-weight: 650; }
.summary-fixed-mark { color: #aeb5c0; font-size: 7px; text-align: center; }

.settlement-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.settlement-table { width: max-content; min-width: 100%; }
.settlement-table th { padding-top: 15px; padding-bottom: 15px; vertical-align: middle; background: #f3f2ff; letter-spacing: 0; }
.settlement-header-content { color: #39338f; font-size: 13px; font-weight: 750; line-height: 1.4; white-space: nowrap; }
.settlement-table td { max-width: none; padding-top: 16px; padding-bottom: 16px; vertical-align: top; }
.settlement-table tbody tr:last-child td { border-bottom: 0; }
.settlement-table tbody tr:hover { background: #fbfbfe; }
.settlement-project-cell { min-width: 150px; }
.settlement-project-cell strong { font-size: 14px; }
.commission-list { display: grid; grid-template-columns: repeat(var(--commission-columns), max-content); gap: 6px; width: max-content; }
.commission-pill { display: inline-flex; align-items: center; gap: 7px; width: fit-content; padding: 6px 9px; border: 1px solid #e1defa; border-radius: 999px; color: #5149b7; background: #f4f2ff; white-space: nowrap; }
.commission-pill time { font-size: 10px; }
.commission-pill strong { font-size: 11px; }
.settlement-number { display: inline-block; color: var(--ink); font-size: 17px; }
.settlement-inline-number { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.settlement-inline-number .settlement-number, .settlement-inline-number small { display: inline; margin: 0; }
.settlement-amount { color: #157456; font-size: 14px; white-space: nowrap; }
.entry-panel { border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.recording-layout { display: grid; grid-template-columns: minmax(330px, .7fr) minmax(560px, 1.3fr); align-items: start; gap: 14px; }
#manageView[data-create-mode="project"] .recording-layout, #manageView[data-create-mode="batch"] .recording-layout { display: block; max-width: 900px; }
.compact-entry-section { grid-template-columns: 1fr; gap: 18px; }
.single-fields { grid-template-columns: 1fr; }
.single-fields .full { grid-column: auto; }
.recording-layout .batch-fields { grid-template-columns: 1fr 1fr; }
.entry-section { display: grid; grid-template-columns: 220px 1fr; gap: 35px; padding: 28px; border-bottom: 1px solid var(--line); }
.entry-section-title { display: flex; align-items: flex-start; gap: 12px; }
.entry-section-title > span { display: grid; place-items: center; flex: 0 0 auto; width: 29px; height: 29px; border-radius: 8px; color: #4d45c8; background: #efedff; font-size: 9px; font-weight: 800; }
.entry-section-title h2 { margin: 1px 0 5px; font-size: 14px; }
.entry-section-title p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.entry-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.entry-fields label { display: flex; flex-direction: column; gap: 6px; color: #5b6472; font-size: 10px; font-weight: 750; }
.entry-fields .full { grid-column: 1/-1; }
.new-project-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; grid-column: 1/-1; }
.new-project-fields .full { grid-column: 1/-1; }
.batch-fields { grid-template-columns: repeat(3, 1fr); }
.prompt-entry-block { margin-top: 4px; padding-top: 15px; border-top: 1px solid #eceef1; }
.entry-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 18px 28px 22px; }
.manage-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.manage-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px; border-bottom: 1px solid var(--line); }
.compact-search { max-width: 380px; }
.manage-toolbar > span { padding-right: 4px; color: var(--muted); font-size: 11px; }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 16px; border-bottom: 1px solid #eceef1; text-align: left; font-size: 12px; vertical-align: middle; }
th { color: #687180; background: #fafbfc; font-size: 11px; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
td { max-width: 230px; color: #565f6e; }
td strong { display: block; color: var(--ink); font-size: 13px; }
td small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.clickable-project-row { cursor: pointer; transition: background-color .15s ease, box-shadow .15s ease; }
.clickable-project-row:hover { background: #f7f6ff; box-shadow: inset 3px 0 0 #766ee4; }
.clickable-project-row:focus-visible { outline: 2px solid rgba(79,70,216,.55); outline-offset: -2px; background: #f7f6ff; }
.clickable-project-row:active { background: #efedff; }
.clickable-project-row a, .clickable-project-row button { cursor: pointer; }
.settlement-table tbody tr.clickable-project-row:hover, .settlement-table tbody tr.clickable-project-row:focus-visible { background: #f7f6ff; }
.settlement-table tbody tr.clickable-project-row:active { background: #efedff; }
.manage-table tr:last-child td { border-bottom: 0; }
.row-actions { display: flex; gap: 6px; justify-content: flex-end; }
.row-actions button { border: 1px solid var(--line); border-radius: 7px; padding: 5px 8px; background: #fff; font-size: 10px; }
.row-actions button.danger { color: var(--red); border-color: #f1d9df; background: #fff8f9; }
.table-empty { padding: 60px; color: var(--muted); text-align: center; }

.content-search { margin-bottom: 14px; }
.content-management-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.content-table td { max-width: 300px; }
.content-table tr.is-archived { background: #fafafa; }
.content-table tr.is-archived:hover, .content-table tr.is-archived:focus-visible { background: #f4f3fa; }
.content-table tr.is-archived td { color: #858c97; }
.content-docs { display: flex; flex-wrap: wrap; gap: 5px; min-width: 210px; }
.content-doc-pill { display: inline-flex; align-items: center; width: fit-content; gap: 5px; padding: 5px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.content-doc-pill.request { color: #5144bd; background: #eceaff; }
.content-doc-pill.flow { color: #087554; background: #ddf5eb; }
.content-doc-pill.prompt { color: #1f61aa; background: #e1efff; }
.content-doc-pill.disabled, .content-doc-pill.is-hidden { opacity: .48; }
.archive-state { display: inline-flex; padding: 5px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.archive-state.active { color: #087554; background: #ddf5eb; }
.archive-state.archived { color: #687180; background: #eceef1; }
.content-row-actions { display: flex; justify-content: flex-end; gap: 5px; }
.content-row-actions button { padding: 6px 8px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 11px; font-weight: 700; white-space: nowrap; }
.content-row-actions button:last-child { color: #8b5b17; }

.document-type-icon { flex: 0 0 auto; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.data-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.data-stats article { min-width: 0; min-height: 118px; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: var(--shadow); }
.data-stats span { color: var(--muted); font-size: 12px; font-weight: 700; }
.data-stats strong { display: block; margin-top: 8px; overflow: hidden; font-size: 27px; line-height: 1.2; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.data-stats small { display: block; margin-top: 8px; overflow: hidden; color: #858d9a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.data-overview-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .8fr); gap: 14px; }
.data-panel { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.data-panel-heading { padding: 18px 20px; border-bottom: 1px solid var(--line); }
.data-panel-heading h2 { margin: 0 0 4px; font-size: 16px; }
.data-panel-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.data-distribution { display: grid; grid-template-columns: 210px minmax(0, 1fr); align-items: center; gap: 28px; padding: 28px; }
.data-donut { display: grid; place-items: center; width: 184px; aspect-ratio: 1; margin: auto; border-radius: 50%; background: #e7e9ed; }
.data-donut > div { display: grid; place-items: center; width: 116px; aspect-ratio: 1; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(227,230,235,.7); }
.data-donut strong { max-width: 100px; overflow: hidden; font-size: 21px; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.data-donut span { margin-top: -17px; color: var(--muted); font-size: 10px; }
.data-breakdown { display: grid; gap: 14px; }
.data-breakdown-item { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; }
.data-breakdown-label { display: flex; grid-column: 1/-1; align-items: center; justify-content: space-between; gap: 16px; font-size: 12px; }
.data-breakdown-label > span { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.data-breakdown-label i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.data-breakdown-label strong { font-size: 12px; }
.data-breakdown-bar { height: 6px; overflow: hidden; border-radius: 999px; background: #eef0f3; }
.data-breakdown-bar i { display: block; height: 100%; border-radius: inherit; }
.data-breakdown-item small { min-width: 50px; color: var(--muted); font-size: 10px; text-align: right; }
.data-transfer-panel { align-self: start; }
.data-transfer-actions { display: grid; gap: 9px; padding: 22px 20px 12px; }
.data-transfer-actions .button { width: 100%; min-height: 42px; }
.data-warning { margin: 0; padding: 4px 20px 22px; color: #8b5b17; font-size: 10px; line-height: 1.7; }

.project-screen { position: fixed; z-index: 30; inset: 0; overflow: hidden; background: #f6f7f9; }
.screen-header { display: none; }
.floating-back-button { position: fixed; z-index: 6; top: 20px; left: 22px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.94); box-shadow: 0 8px 24px rgba(17,24,39,.1); backdrop-filter: blur(10px); font-size: 17px; font-weight: 700; }
.floating-back-button:hover { color: var(--primary); border-color: #c5c1ef; }
.back-button { justify-self: start; display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; font-size: 12px; font-weight: 700; }
.back-button:hover { background: #f1f2f5; }
.back-button span { font-size: 17px; }
.screen-brand { display: flex; align-items: center; gap: 9px; font-size: 12px; }
.screen-header > .button { justify-self: end; }
.screen-content { display: flex; flex-direction: column; width: min(1380px, calc(100% - 56px)); height: 100%; margin: 0 auto; padding: 72px 0 28px; overflow: hidden; }
.project-hero { display: block; padding: 0 0 30px; border: 0; }
.project-title-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.project-title-row h1 { min-width: 0; margin: 0; }
.project-title-row .button { flex: 0 0 auto; }
.project-title-actions { display: flex; align-items: center; gap: 8px; }
.hero-labels { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 11px; }
.project-hero h1 { margin: 0 0 20px; font-size: clamp(28px, 2.5vw, 36px); line-height: 1.18; letter-spacing: -.025em; }
.project-hero p { margin: 0; color: var(--muted); font-size: 13px; }
.batch-card { flex: 0 0 260px; padding: 17px 19px; border: 1px solid #dedfe5; border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.batch-card span, .batch-card strong { display: block; }
.batch-card span { margin-bottom: 7px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.batch-card strong { font-size: 14px; }

.latest-resource-links { display: grid; gap: 8px; }
.latest-resource-primary, .latest-resource-prompts { display: flex; flex-wrap: wrap; gap: 8px; }
.latest-resource-link { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; gap: 7px; padding: 8px 12px; overflow: hidden; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.25; text-decoration: none; }
.latest-resource-link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.latest-resource-link .document-type-icon { width: 16px; height: 16px; }
.latest-resource-link.request { color: #5144bd; background: #eceaff; }
.latest-resource-link.flow { color: #087554; background: #ddf5eb; }
.latest-resource-link.prompt { color: #1f61aa; background: #e1efff; }
.latest-resource-link:hover { filter: brightness(.96); }
.latest-resource-link.disabled { opacity: .48; }
.latest-resource-empty { padding: 22px; border: 1px dashed #d4d8df; border-radius: 10px; color: var(--muted); font-size: 11px; text-align: center; }

.resource-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 22px 0 45px; }
.resource-card { position: relative; display: flex; flex-direction: column; min-height: 118px; padding: 18px 52px 18px 19px; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-decoration: none; box-shadow: var(--shadow); transition: border-color .15s, transform .15s; }
.resource-card:not(.disabled):hover { border-color: #aaa6df; }
.resource-card > span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.resource-card strong { margin: 12px 0 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.resource-card small { color: var(--muted); font-size: 10px; }
.resource-card i { position: absolute; top: 18px; right: 19px; color: var(--primary); font-style: normal; font-size: 17px; }
.resource-card.disabled { opacity: .7; }

.document-section { margin: 22px 0 42px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: var(--shadow); }
.document-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.document-section-heading h2 { margin: 0 0 4px; font-size: 16px; }
.document-section-heading p { margin: 0; color: var(--muted); font-size: 10px; }
.document-section-heading select { width: min(340px, 45%); background: #fff; }
.document-editor-grid { display: grid; grid-template-columns: 1fr 1fr; }
.document-editor { display: grid; gap: 11px; padding: 20px; }
.document-editor + .document-editor { border-left: 1px solid var(--line); }
.document-editor-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 2px; }
.document-editor-title strong { font-size: 12px; }
.document-open { color: var(--primary); font-size: 10px; font-weight: 700; text-decoration: none; }
.document-editor label { display: flex; flex-direction: column; gap: 6px; color: #5b6472; font-size: 9px; font-weight: 750; }
.document-editor textarea { line-height: 1.6; }
.document-actions { display: flex; justify-content: flex-end; padding: 14px 20px 18px; border-top: 1px solid var(--line); }

.batch-section { margin: 0 0 45px; }
.batch-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 11px; }
.batch-item { padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.batch-item > div:first-child { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.batch-item > div:first-child span { color: var(--muted); font-size: 11px; }
.batch-item > div:first-child strong { font-size: 17px; }
.batch-item dl { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0; padding: 12px 0; border-top: 1px solid #edf0f2; border-bottom: 1px solid #edf0f2; }
.batch-item dl div { display: flex; justify-content: space-between; gap: 8px; }
.batch-item dt, .batch-item dd { margin: 0; font-size: 12px; }
.batch-item dt { color: var(--muted); }
.batch-item dd { color: var(--ink); font-weight: 750; }
.batch-item footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.batch-item footer small { color: var(--muted); font-size: 11px; }

.prompt-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 23px; }
.prompt-heading h2 { margin: 0 0 5px; font-size: 22px; letter-spacing: -.025em; }
.prompt-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.history-sort-button { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: #5f6875; background: #fff; font-size: 10px; }
.history-sort-button span { color: #9097a2; }
.history-sort-button strong { color: var(--ink); font-size: 11px; }
.history-sort-button i { color: var(--primary); font-style: normal; font-size: 13px; }
.pin-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--primary); }
.prompt-timeline { position: relative; }
.prompt-timeline::before { content: ""; position: absolute; top: 8px; bottom: 0; left: 6px; width: 1px; background: #d7dae0; }
.timeline-group { position: relative; display: grid; grid-template-columns: 110px 1fr; gap: 24px; padding-bottom: 35px; }
.timeline-date { position: relative; display: flex; align-items: center; align-self: start; gap: 13px; color: #535c6a; font-size: 12px; font-weight: 700; }
.timeline-date i { position: relative; z-index: 1; flex: 0 0 auto; width: 13px; height: 13px; border: 3px solid #fff; border-radius: 50%; background: #a6adb8; box-shadow: 0 0 0 1px #cfd3d9; }
.timeline-group:first-child .timeline-date i { background: var(--primary); }
.prompt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.prompt-card { display: flex; flex-direction: column; min-height: 225px; padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.prompt-card.is-pinned { border-color: #c8c4f0; box-shadow: inset 0 3px 0 #675ee0, var(--shadow); }
.prompt-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 11px; }
.pin-button { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 7px; color: #8b93a0; background: #fff; font-size: 14px; }
.pin-button.active { color: #fff; border-color: var(--primary); background: var(--primary); }
.prompt-card h3 { margin: 17px 0 9px; font-size: 16px; line-height: 1.45; letter-spacing: -.01em; }
.prompt-card > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.prompt-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 15px; border-top: 1px solid #edf0f2; }
.prompt-card-actions button, .prompt-card-actions a { padding: 0; border: 0; color: #606978; background: transparent; font-size: 12px; text-decoration: none; }
.prompt-card-actions a { color: var(--primary); font-weight: 700; }
.timeline-empty { padding: 80px 20px; border: 1px dashed #d7dae0; border-radius: 12px; color: var(--muted); text-align: center; }

.project-history-section { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; margin-top: 8px; }
.project-history-timeline { display: grid; flex: 1 1 auto; min-height: 0; padding-right: 8px; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(129, 136, 148, .38) transparent; }
.project-history-timeline::-webkit-scrollbar { width: 7px; }
.project-history-timeline::-webkit-scrollbar-track { background: transparent; }
.project-history-timeline::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background: rgba(129, 136, 148, .38); background-clip: padding-box; }
.history-batch-item { min-width: 0; }
.history-batch-content { min-width: 0; padding: 18px 2px 20px; border-bottom: 1px solid #dfe2e7; }
.history-batch-item:first-child .history-batch-content { padding-top: 4px; }
.history-batch-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.history-batch-header span { color: var(--primary); font-size: 10px; font-weight: 700; }
.history-batch-header h3 { margin: 3px 0 0; font-size: 17px; line-height: 1.35; }
.history-batch-actions { display: flex; flex: 0 0 auto; gap: 5px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s ease, visibility .15s ease; }
.history-batch-item:hover .history-batch-actions, .history-batch-item:focus-within .history-batch-actions { opacity: 1; visibility: visible; pointer-events: auto; }
.history-batch-actions button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid #dde1e7; border-radius: 8px; color: #646d7a; background: #fff; }
.history-batch-actions button:hover { color: var(--primary); border-color: #c9c5ef; background: #f5f4ff; }
.history-batch-actions button.memo-action { color: #8a6500; border-color: #efd889; background: #fff9df; }
.history-batch-actions button.memo-action:hover { color: #8a6500; border-color: #efd889; background: #fff6c9; }
.history-batch-actions button.status-action { color: #596372; border-color: #d7dce3; background: #f8f9fb; }
.history-batch-actions button.status-action.revision { color: #a6364a; border-color: #f0ced4; background: #fff3f5; }
.history-batch-actions button.status-action.pending { color: #986200; border-color: #efd8a8; background: #fff8e9; }
.history-batch-actions button.status-action.completed { color: #087554; border-color: #c5e4d8; background: #effaf5; }
.history-batch-actions button.status-action.archived { color: #687180; border-color: #d8dce2; background: #eceef1; }
.history-batch-actions button.status-action:hover { color: var(--primary); border-color: #c9c5ef; background: #f5f4ff; }
.history-batch-actions button.danger:hover { color: var(--red); border-color: #efc7c7; background: #fff3f3; }
.history-batch-actions svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.history-document-list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; margin-top: 15px; }
.history-document-pill { display: inline-flex; align-items: center; max-width: 100%; border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 1.35; }
.history-document-pill.request { color: #5144bd; background: #eceaff; }
.history-document-pill.flow { color: #087554; background: #ddf5eb; }
.history-document-pill.prompt { color: #1f61aa; background: #e1efff; }
.history-document-pill.other { color: #ad3d72; background: #ffe4f0; }
.history-memo { display: inline-flex; align-items: flex-start; max-width: min(100%, 520px); gap: 7px; padding: 8px 11px; border: 1px solid #efd889; border-radius: 10px; color: #76580a; background: #fff6c9; font: inherit; font-size: 11px; line-height: 1.45; text-align: left; cursor: pointer; }
.history-memo:hover { border-color: #dfbd45; background: #ffefad; }
.history-memo:focus-visible { outline: 2px solid #b58400; outline-offset: 2px; }
.history-memo .document-type-icon { flex: 0 0 auto; width: 15px; height: 15px; margin-top: 1px; }
.history-memo span { min-width: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.history-memo strong { margin-right: 5px; }
.memo-view-content { min-height: 140px; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--ink); font-size: 14px; line-height: 1.75; }
.history-document-main { display: inline-flex; align-items: flex-start; gap: 6px; max-width: 100%; padding: 7px 10px; color: inherit; text-decoration: none; }
.history-document-main span { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.history-document-main.disabled { opacity: .55; }
.history-document-pill .document-type-icon { width: 14px; height: 14px; margin-top: 1px; }
.history-document-empty { width: 100%; padding: 15px; border: 1px dashed #d7dae0; border-radius: 9px; color: var(--muted); font-size: 11px; text-align: center; }

.modal { width: min(760px, calc(100% - 28px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: 16px; color: var(--ink); background: #fff; box-shadow: 0 28px 85px rgba(14, 18, 28, .25); }
.modal::backdrop { background: rgba(17, 24, 39, .5); backdrop-filter: blur(5px); }
.modal form { margin: 0; }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 21px 24px 17px; border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 0; font-size: 20px; line-height: 1.3; }
.modal-draft-status { order: 1; margin-left: auto; color: #8b93a0; font-size: 10px; font-weight: 650; white-space: nowrap; }
.modal-header > .icon-button { order: 2; }
.icon-button { display: grid; place-items: center; width: 31px; height: 31px; padding: 0; border: 0; border-radius: 8px; color: #6f7784; background: #f1f2f4; font-size: 21px; }
.form-scroll { max-height: calc(100vh - 175px); overflow-y: auto; }
.form-section { padding: 21px 24px; border-bottom: 1px solid #eceef1; }
.form-section h3 { margin: 0 0 15px; font-size: 13px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.form-grid label, .prompt-editor-fields label { display: flex; flex-direction: column; gap: 6px; color: #4f5866; font-size: 12px; font-weight: 700; }
.form-grid .full { grid-column: 1/-1; }
textarea { resize: vertical; }
.modal .form-grid > label, .modal .prompt-editor-fields > label, .modal .project-finance-editor label { display: grid; grid-template-columns: minmax(92px, max-content) minmax(0, 1fr); align-items: center; gap: 14px; min-height: 38px; }
.modal .form-grid > label.full, .modal .prompt-editor-fields > label.wide { grid-template-columns: minmax(92px, max-content) minmax(0, 1fr); }
.inline-choice-field { display: grid; grid-template-columns: minmax(92px, max-content) minmax(0, 1fr); align-items: center; gap: 14px; min-height: 38px; color: #4f5866; font-size: 12px; font-weight: 700; }
.price-options { display: inline-flex; justify-self: start; gap: 6px; padding: 3px; border-radius: 9px; background: #f0f1f4; }
.price-options button { min-width: 52px; padding: 6px 14px; border: 0; border-radius: 7px; color: #747c88; background: transparent; font-size: 12px; font-weight: 750; }
.price-options button.active { color: #4338b0; background: #fff; box-shadow: 0 2px 7px rgba(28,32,45,.09); }
.batch-label-input { display: flex; align-items: center; min-width: 0; gap: 7px; }
.batch-label-input input { flex: 1; }
.batch-label-input button { flex: 0 0 auto; padding: 5px 9px; border: 1px solid #dedaf8; border-radius: 999px; color: #5149b7; background: #f2f0ff; font-size: 10px; font-weight: 750; white-space: nowrap; }
.modal input:not([type="checkbox"]), .modal textarea { min-width: 0; padding: 8px 2px 7px; border: 0; border-bottom: 1px solid #cfd4dc; border-radius: 0; color: var(--ink); background: transparent; box-shadow: none; outline: none; }
.modal input:not([type="checkbox"]):hover, .modal textarea:hover { border-bottom-color: #aeb5c0; }
.modal input:not([type="checkbox"]):focus, .modal textarea:focus { border-bottom-color: var(--primary); background: transparent; box-shadow: 0 1px 0 var(--primary); }
.modal input:not([type="checkbox"])::placeholder, .modal textarea::placeholder { color: #a0a7b2; }
.modal input:disabled, .modal textarea:disabled { color: #9aa1ac; cursor: not-allowed; }
.native-select { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; padding: 0 !important; overflow: hidden; opacity: 0; pointer-events: none; }
.custom-select { position: relative; z-index: 2; display: grid; width: max-content; max-width: 100%; }
.custom-select.open { z-index: 60; }
.custom-select-trigger, .custom-select-sizer { grid-area: 1/1; min-width: 0; padding: 8px 25px 7px 2px; border: 0; border-bottom: 1px solid #cfd4dc; background: transparent; font-size: 13px; line-height: 1.45; white-space: nowrap; text-align: left; }
.custom-select-trigger { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; color: var(--ink); }
.custom-select-trigger i { color: #858d99; font-style: normal; font-size: 12px; }
.custom-select-sizer { visibility: hidden; pointer-events: none; }
.custom-select.open .custom-select-trigger { border-bottom-color: var(--primary); box-shadow: 0 1px 0 var(--primary); }
.custom-select.is-disabled { opacity: .58; }
.top-layer-menu { position: fixed; inset: auto; z-index: 1000; gap: 4px; margin: 0; padding: 6px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: #fff; box-shadow: 0 18px 48px rgba(17,24,39,.2); }
.top-layer-menu:popover-open { display: grid; }
.custom-select-top-layer { width: max-content; max-height: min(320px, calc(100vh - 20px)); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.custom-select-top-layer button { padding: 9px 11px; border: 0; border-radius: 7px; color: #4f5866; background: transparent; font-size: 12px; white-space: nowrap; text-align: left; }
.custom-select-top-layer button:hover, .custom-select-top-layer button[aria-selected="true"] { color: #4338b0; background: #f1efff; }
.custom-select-top-layer button:disabled { color: #aeb4bd; background: transparent; cursor: not-allowed; }
.switch-control { position: relative; display: inline-flex; flex: 0 0 auto; width: 36px; height: 20px; }
.switch-control input { position: absolute; z-index: 2; inset: 0; width: 100% !important; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.switch-control i { position: absolute; inset: 0; border-radius: 999px; background: #cfd4dc; cursor: pointer; transition: background-color .16s ease; }
.switch-control i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(17,24,39,.28); transition: transform .16s ease; }
.switch-control input:checked + i { background: var(--primary); }
.switch-control input:checked + i::after { transform: translateX(16px); }
.switch-control input:focus-visible + i { box-shadow: 0 0 0 3px rgba(79,70,216,.14); }
.switch-control.small { width: 30px; height: 17px; }
.switch-control.small i::after { top: 3px; left: 3px; width: 11px; height: 11px; }
.switch-control.small input:checked + i::after { transform: translateX(13px); }
.switch-row { justify-content: space-between; cursor: pointer; }
.editor-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; }
.editor-heading h3 { margin: 0; }
.editor-heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.prompt-editor-list { display: grid; gap: 10px; }
.prompt-editor { display: grid; grid-template-columns: 48px 1fr; border: 1px solid #e2e5e9; border-radius: 11px; overflow: hidden; }
.prompt-editor-number { display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 13px 6px; color: #7d8592; background: #f5f6f8; font-size: 11px; }
.prompt-editor-number button { border: 0; padding: 0; color: var(--red); background: transparent; font-size: 10px; }
.prompt-editor-fields { display: grid; grid-template-columns: 1fr 150px; gap: 10px; padding: 13px; }
.prompt-editor-fields .wide { grid-column: 1/-1; }
.prompt-editor-fields .pin-check { grid-column: 1/-1; }
.editor-empty { padding: 30px; border: 1px dashed #d7dae0; border-radius: 10px; color: var(--muted); text-align: center; font-size: 12px; }
.editor-empty.compact { padding: 18px; }
.batch-prompt-item { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 54px; padding: 10px 11px; border: 1px solid #e1e4e9; border-radius: 10px; background: #fafbfc; }
.batch-prompt-main { display: flex; align-items: center; min-width: 0; gap: 9px; }
.batch-prompt-main > .document-type-icon { flex: 0 0 auto; width: 16px; height: 16px; color: #2873cf; }
.batch-prompt-main > div { display: grid; min-width: 0; gap: 2px; }
.batch-prompt-main strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.batch-prompt-main small { margin: 0; color: var(--muted); font-size: 9px; }
.batch-prompt-controls, .batch-prompt-pin, .batch-prompt-hover-actions { display: flex; align-items: center; }
.batch-prompt-controls { flex: 0 0 auto; gap: 10px; }
.batch-prompt-pin { gap: 6px; color: var(--muted); font-size: 10px; font-weight: 700; cursor: pointer; }
.batch-prompt-hover-actions { gap: 4px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s ease, visibility .15s ease; }
.batch-prompt-item:hover .batch-prompt-hover-actions, .batch-prompt-item:focus-within .batch-prompt-hover-actions { opacity: 1; visibility: visible; pointer-events: auto; }
.batch-prompt-hover-actions button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid #dfe2e7; border-radius: 7px; color: #66707d; background: #fff; }
.batch-prompt-hover-actions button:hover { color: var(--primary); border-color: #c9c5ef; background: #f5f4ff; }
.batch-prompt-hover-actions button.danger:hover { color: var(--red); border-color: #efc7c7; background: #fff3f3; }
.batch-prompt-hover-actions svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.modal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 15px 24px 20px; }
.small-modal { width: min(460px, calc(100% - 28px)); }
.entry-modal { width: min(760px, calc(100% - 28px)); }
.entry-modal .form-section:last-child { border-bottom: 0; }
.project-edit-modal { width: min(720px, calc(100% - 28px)); }
.project-finance-editor { background: #f8f8fc; }
.finance-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.finance-editor-heading h3 { margin: 0 0 4px; font-size: 13px; }
.finance-editor-heading p { margin: 0; color: var(--muted); font-size: 10px; }
.finance-editor-heading > span { padding: 5px 9px; border-radius: 999px; color: #5149b7; background: #eceaff; font-size: 10px; font-weight: 700; white-space: nowrap; }
.project-finance-editor label { display: flex; flex-direction: column; gap: 6px; color: #4f5866; font-size: 12px; font-weight: 700; }
.project-finance-editor input[readonly] { color: #5149b7; background: #efedff; font-weight: 750; }
.capsule-edit-list { display: grid; gap: 11px; }
.capsule-edit-item { padding: 15px; border: 1px solid var(--line); border-radius: 11px; background: #fafbfc; }
.capsule-edit-item.request { box-shadow: inset 3px 0 0 #6754d9; }
.capsule-edit-item.flow { box-shadow: inset 3px 0 0 #18845f; }
.capsule-edit-item.prompt { box-shadow: inset 3px 0 0 #2873cf; }
.capsule-edit-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.capsule-edit-heading strong { font-size: 13px; }
.capsule-edit-heading label { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 700; }
.capsule-edit-heading input { width: auto; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.section-heading h3 { margin: 0 0 4px; }
.section-heading p { margin: 0; color: var(--muted); font-size: 10px; }
.latest-document-preview { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.editor-document-preview { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 7px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; text-decoration: none; }
.editor-document-preview.request { color: #5144bd; background: #eceaff; }
.editor-document-preview.flow { color: #087554; background: #ddf5eb; }
.editor-document-preview .document-type-icon { width: 14px; height: 14px; }
.editor-document-preview span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.editor-document-empty { display: inline-flex; padding: 7px 10px; border: 1px dashed #d8dce2; border-radius: 999px; color: var(--muted); font-size: 10px; }
.featured-prompt-list { display: grid; gap: 7px; }
.featured-prompt-option { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 52px; padding: 9px 11px; border: 1px solid #e3e5ea; border-radius: 10px; background: #fafbfc; cursor: pointer; }
.featured-prompt-copy { display: flex; align-items: center; min-width: 0; gap: 9px; }
.featured-prompt-copy > .document-type-icon { flex: 0 0 auto; width: 16px; height: 16px; color: #2873cf; }
.featured-prompt-copy > span { display: grid; min-width: 0; gap: 2px; }
.featured-prompt-copy strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.featured-prompt-copy small { margin: 0; color: var(--muted); font-size: 9px; font-weight: 500; }
.board-link-edit-list { display: grid; gap: 9px; }
.board-link-edit-item { display: grid; grid-template-columns: 1fr 1.45fr; gap: 8px 14px; padding: 11px 12px; border: 1px solid #e2e5e9; border-radius: 11px; background: #fafbfc; }
.board-link-edit-item header { display: flex; grid-column: 1/-1; align-items: center; gap: 7px; }
.board-link-edit-item header > .document-type-icon { width: 15px; height: 15px; }
.board-link-edit-item.request header > .document-type-icon { color: #5a4ec4; }
.board-link-edit-item.flow header > .document-type-icon { color: #16805e; }
.board-link-edit-item.prompt header > .document-type-icon { color: #2873cf; }
.board-link-edit-item header strong { font-size: 12px; }
.board-link-edit-item header > small { min-width: 0; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.board-visibility { display: inline-flex !important; grid-template-columns: none !important; align-items: center !important; gap: 7px !important; min-height: 0 !important; margin-left: auto; color: #7b828d !important; font-size: 10px !important; cursor: pointer; }
.board-link-edit-item > label { display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: center; gap: 9px; color: #656d79; font-size: 10px; font-weight: 700; }
.board-link-edit-item > label input { font-size: 11px; }
.file-button { display: inline-flex; align-items: center; justify-content: center; }
.file-button input { display: none; }

.batch-archive-dropzone { position: fixed; z-index: 75; left: 50%; bottom: 22px; display: flex; align-items: center; min-width: 270px; gap: 11px; padding: 12px 18px; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; color: #fff; background: rgba(28,34,45,.9); box-shadow: 0 16px 42px rgba(17,24,39,.24); backdrop-filter: blur(14px); opacity: 0; pointer-events: none; transform: translate(-50%, 26px) scale(.96); transition: opacity .16s ease, transform .16s ease, background .16s ease, box-shadow .16s ease; }
.batch-archive-dropzone.show { opacity: 1; pointer-events: auto; transform: translate(-50%, 0) scale(1); }
.batch-archive-dropzone.is-drag-over { background: rgba(190,48,72,.96); box-shadow: 0 16px 46px rgba(190,48,72,.32); transform: translate(-50%, -4px) scale(1.04); }
.batch-archive-dropzone svg { flex: 0 0 auto; width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.batch-archive-dropzone span { display: grid; gap: 1px; }
.batch-archive-dropzone strong { font-size: 12px; }
.batch-archive-dropzone small { color: rgba(255,255,255,.68); font-size: 9px; }

.quick-create { position: fixed; z-index: 70; right: 25px; bottom: 24px; }
.quick-create-button { display: grid; place-items: center; width: 52px; height: 52px; padding: 0 0 4px; border: 0; border-radius: 50%; color: #fff; background: var(--primary); box-shadow: 0 12px 30px rgba(79,70,216,.32); font-size: 34px; font-weight: 300; line-height: 1; transition: transform .18s, background .18s; }
.quick-create-button:hover { background: var(--primary-dark); }
.quick-create-button[aria-expanded="true"] { transform: rotate(45deg); }
.quick-create-menu { position: absolute; right: 0; bottom: 64px; display: grid; gap: 4px; width: 178px; padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: 0 18px 48px rgba(17,24,39,.16); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(12px) scale(.94); transform-origin: right bottom; transition: opacity .2s ease, transform .24s cubic-bezier(.2,.8,.2,1), visibility 0s linear .24s; }
.quick-create-menu.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); transition-delay: 0s; }
.quick-create-menu button { opacity: 0; transform: translateY(5px); transition: opacity .16s ease, transform .2s ease, background .15s ease; }
.quick-create-menu.is-open button { opacity: 1; transform: translateY(0); }
.quick-create-menu.is-open button:nth-child(2) { transition-delay: .025s; }
.quick-create-menu.is-open button:nth-child(3) { transition-delay: .05s; }
.quick-create-menu.is-open button:nth-child(4) { transition-delay: .075s; }
.quick-create-menu button { display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 9px; padding: 9px; border: 0; border-radius: 8px; background: transparent; text-align: left; }
.quick-create-menu button:hover { background: #f3f2ff; }
.quick-create-menu button > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 7px; color: var(--primary); background: #eeecff; font-size: 10px; font-weight: 800; }
.quick-create-menu .memo-create-item:hover { background: #fff8d8; }
.quick-create-menu .memo-create-item > span { color: #8a6500; background: #fff0a6; }
.quick-create-menu strong { font-size: 12px; }
.document-create-modal { width: min(680px, calc(100% - 28px)); }
.quick-pin-option { grid-column: 1/-1; }
.source-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 18px 24px 0; padding: 4px; border-radius: 10px; background: #f0f1f4; }
.source-choice button { padding: 8px 12px; border: 0; border-radius: 7px; color: #707887; background: transparent; font-size: 12px; font-weight: 750; }
.source-choice button.active { color: #4038b6; background: #fff; box-shadow: 0 2px 7px rgba(28,32,45,.08); }
.prompt-source-modal #promptLinkFields > .switch-row { grid-template-columns: max-content auto; justify-content: start; gap: 10px; }
.prompt-reuse-list { display: grid; gap: 8px; max-height: min(460px, calc(100vh - 210px)); padding: 18px 24px; overflow-y: auto; }
.prompt-reuse-option { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: 10px; padding: 11px 12px; border: 1px solid #e1e4e9; border-radius: 10px; background: #fafbfc; cursor: pointer; }
.prompt-reuse-option:hover { border-color: #c9c5ef; background: #f7f6ff; }
.prompt-reuse-option.is-added { opacity: .52; cursor: default; }
.prompt-reuse-option input { width: 16px; height: 16px; margin: 2px 0 0; }
.prompt-reuse-option span { display: grid; min-width: 0; gap: 3px; }
.prompt-reuse-option strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.prompt-reuse-option small { color: var(--muted); font-size: 10px; }
.prompt-reuse-empty { padding: 34px 18px; border: 1px dashed #d7dae0; border-radius: 10px; color: var(--muted); font-size: 12px; text-align: center; }
.memo-modal { width: min(720px, calc(100vw - 40px), calc(100vh - 96px)); height: min(860px, calc(100vh - 32px)); max-width: none; max-height: none; overflow: hidden; }
.memo-modal form { display: flex; flex-direction: column; width: 100%; height: 100%; max-height: none; overflow: hidden; }
.memo-modal .form-scroll { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; max-height: none; overflow-x: hidden; overflow-y: auto; }
.memo-modal .form-section { min-width: 0; background: #fff; }
.memo-modal .form-grid, .memo-modal .form-grid > label { min-width: 0; }
.memo-content-section { display: flex; flex: 1 1 auto; min-height: 360px; padding-top: 18px; background: #fff !important; }
.memo-content-section label { display: grid; flex: 1 1 auto; grid-template-rows: auto minmax(0, 1fr); min-width: 0; gap: 10px; color: #4f5866; font-size: 12px; font-weight: 750; }
.memo-modal .memo-content-section textarea { width: 100%; height: 100%; max-width: 100%; min-height: 320px; resize: none; color: var(--ink); line-height: 1.65; white-space: pre-wrap; }
.status-modal { width: min(860px, calc(100vw - 40px)); height: min(680px, calc(100vh - 32px)); max-width: none; max-height: none; overflow: hidden; }
.status-modal form { display: flex; flex-direction: column; width: 100%; height: 100%; overflow: hidden; }
.status-modal .form-scroll { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; max-height: none; overflow-x: hidden; overflow-y: auto; }
.status-modal .modal-header > div { min-width: 0; }
.status-modal .modal-header p { margin: 3px 0 0; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.status-time-heading { margin-bottom: 16px; }
.status-time-heading h3 { margin-bottom: 4px; }
.status-time-heading p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.status-time-section { flex: 1 1 auto; background: #fafbfc; }
.status-time-section .form-grid { gap: 22px 28px; }
.editor-coming-soon { display: grid; place-items: center; min-height: 190px; margin: 18px 24px; border: 1px dashed #d5d9e0; border-radius: 12px; color: var(--muted); text-align: center; }
.editor-coming-soon strong { color: var(--ink); font-size: 15px; }
.editor-coming-soon p { margin: -45px 0 0; font-size: 11px; }
.modal-actions button:disabled { color: #a6acb5; background: #eceef1; box-shadow: none; cursor: not-allowed; }
.custom-date-input { cursor: pointer; }
.custom-date-top-layer { width: min(286px, calc(100vw - 16px)); padding: 12px; border: 1px solid #e2e5ea; border-radius: 14px; box-shadow: 0 18px 48px rgba(28,34,45,.16); }
.custom-date-top-layer.datetime-mode { width: min(326px, calc(100vw - 16px)); }
.date-picker-heading { display: grid; grid-template-columns: 32px 1fr 32px; align-items: center; gap: 6px; margin-bottom: 8px; }
.date-picker-heading button { height: 32px; padding: 0; border: 0; border-radius: 9px; color: #66707d; background: #f7f8fa; }
.date-picker-heading button:hover { color: var(--primary); background: #f1efff; }
.date-picker-heading strong { color: #242b37; font-size: 14px; text-align: center; }
.date-picker-weekdays, .date-picker-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.date-picker-weekdays span { padding: 4px 0 6px; color: #9199a5; font-size: 10px; font-weight: 750; text-align: center; }
.date-picker-days button, .date-picker-months button { border: 0; border-radius: 7px; color: #4f5866; background: transparent; font-size: 12px; }
.date-picker-days button { width: 100%; aspect-ratio: 1; max-height: 32px; padding: 0; }
.date-picker-days button:hover, .date-picker-months button:hover { color: #4338b0; background: #f1efff; }
.date-picker-days button.selected, .date-picker-months button.selected { color: #fff; background: var(--primary); }
.date-picker-days button.today:not(.selected) { color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); font-weight: 800; }
.date-picker-months { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.date-picker-months button { padding: 9px 5px; }
.date-picker-months button.today:not(.selected) { color: var(--primary); box-shadow: inset 0 0 0 1px rgba(91,77,220,.45); font-weight: 750; }
.date-picker-today-hint { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding: 7px 2px 0; border-top: 1px solid #eceef2; color: #7b8490; font-size: 9px; }
.date-picker-today-hint i { width: 6px; height: 6px; border-radius: 50%; background: var(--primary); }
.datetime-picker-time { display: grid; grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 8px; margin-top: 8px; padding: 10px 0; border-top: 1px solid #e4e7eb; border-bottom: 1px solid #e4e7eb; }
.datetime-picker-time > span { color: #727b87; font-size: 10px; font-weight: 750; }
.datetime-picker-time > i { color: #6a7280; font-style: normal; font-weight: 800; }
.datetime-picker-time label { position: relative; display: block; }
.datetime-picker-time label small { position: absolute; top: 50%; right: 9px; color: #9299a3; font-size: 9px; transform: translateY(-50%); pointer-events: none; }
.datetime-picker-time input { width: 100%; height: 30px; padding: 0 25px 0 9px; border: 1px solid #dfe3e8; border-radius: 8px; color: #303846; background: #fff; font-size: 12px; font-weight: 750; outline: none; }
.datetime-picker-time input:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(91,77,220,.12); }
.datetime-picker-time input::-webkit-inner-spin-button, .datetime-picker-time input::-webkit-outer-spin-button { margin: 0; appearance: none; }
.datetime-picker-time input[type="number"] { appearance: textfield; -moz-appearance: textfield; }
.datetime-picker-actions { display: flex; justify-content: flex-end; gap: 5px; margin-top: 7px; }
.datetime-picker-actions button { min-width: 44px; padding: 7px 10px; border: 0; border-radius: 8px; color: #66707d; background: #f1f2f4; font-size: 10px; font-weight: 750; }
.datetime-picker-actions button:hover { color: var(--primary); background: #eeecff; }
.datetime-picker-actions button.primary { color: #fff; background: var(--primary); }
.datetime-picker-actions button.primary:hover { background: var(--primary-dark); }
.date-picker-footer { padding-top: 8px; border-top: 1px solid #eceef2; }
.date-picker-today-hint + .date-picker-footer { padding-top: 0; border-top: 0; }

.toast { position: fixed; z-index: 80; left: 50%; bottom: 28px; transform: translate(-50%, 15px); padding: 9px 15px; border-radius: 8px; color: #fff; background: #171d29; box-shadow: 0 10px 28px rgba(0,0,0,.2); font-size: 12px; opacity: 0; pointer-events: none; transition: .2s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1000px) {
  .prompt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .data-stats { grid-template-columns: repeat(2, 1fr); }
  .data-overview-grid { grid-template-columns: 1fr; }
  .recording-layout { grid-template-columns: 1fr; }
  .entry-section { grid-template-columns: 170px 1fr; gap: 24px; }
  .compact-entry-section { grid-template-columns: 1fr; }
  .batch-fields { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 720px) {
  .cloud-account-panel { align-items: flex-start; }
  .cloud-account-details strong { overflow-wrap: anywhere; white-space: normal; }
  .app-shell { display: block; }
  .app-shell > main { padding: 0 15px; }
  .sidebar { position: relative; flex-direction: row; align-items: center; gap: 12px; width: 100%; height: auto; padding: 11px 15px; border-right: 0; border-bottom: 1px solid var(--line); }
  .workspace-month-picker { flex: 0 0 148px; }
  .main-nav { grid-template-columns: repeat(4, 1fr); flex: 1; margin: 0; }
  .nav-button { padding: 8px 7px; text-align: center; }
  .sidebar-footer { display: none; }
  .sidebar-footer small { display: none; }
  .app-shell.sidebar-collapsed { display: block; }
  .app-shell.sidebar-collapsed .sidebar { padding: 11px 15px; }
  .app-shell.sidebar-collapsed .nav-button span { display: inline; }
  .app-shell.sidebar-collapsed .nav-button { grid-template-columns: 19px minmax(0, 1fr); justify-items: initial; gap: 6px; padding: 8px 7px; }
  .sidebar-toggle { display: none; }
  body.board-view-open .app-shell > main { height: calc(100vh - 67px); }
  .status-board { grid-template-columns: repeat(4, minmax(270px, 1fr)); padding-bottom: 5px; }
  .section-heading { align-items: center; }
  .section-heading p { display: none; }
  .heading-actions { align-items: stretch; flex-direction: column; }
  .entry-section { grid-template-columns: 1fr; gap: 18px; padding: 20px; }
  .entry-fields, .new-project-fields, .batch-fields { grid-template-columns: 1fr; }
  .entry-fields .full, .new-project-fields .full { grid-column: auto; }
  .screen-content { width: calc(100% - 30px); padding-top: 27px; }
  .floating-back-button { top: 12px; left: 12px; }
  .screen-content { padding-top: 67px; }
  .project-hero h1 { font-size: 27px; }
  .latest-resource-primary { grid-template-columns: 1fr; }
  .batch-card { flex: auto; }
  .resource-grid { grid-template-columns: 1fr; margin-bottom: 35px; }
  .document-section-heading { align-items: stretch; flex-direction: column; }
  .document-section-heading select { width: 100%; }
  .document-editor-grid { grid-template-columns: 1fr; }
  .document-editor + .document-editor { border-top: 1px solid var(--line); border-left: 0; }
  .prompt-heading { align-items: start; }
  .timeline-group { grid-template-columns: 1fr; gap: 12px; padding-left: 23px; }
  .prompt-timeline::before { left: 6px; }
  .timeline-date { margin-left: -23px; }
  .prompt-grid { grid-template-columns: 1fr; }
  .history-batch-actions, .batch-prompt-hover-actions { opacity: 1; visibility: visible; pointer-events: auto; }
  .history-document-list { align-items: stretch; flex-direction: column; }
  .history-document-pill { width: fit-content; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: auto; }
  .board-link-edit-item { grid-template-columns: 1fr; }
  .board-link-edit-item header { grid-column: auto; }
  .prompt-editor-fields { grid-template-columns: 1fr; }
  .prompt-editor-fields .wide, .prompt-editor-fields .pin-check { grid-column: auto; }
  .quick-create { right: 16px; bottom: 16px; }
}

@media (max-width: 460px) {
  .cloud-account-panel { flex-wrap: wrap; }
  .cloud-account-panel > button { margin-left: 55px; }
  .sidebar .brand { display: none; }
  .workspace-month-picker { flex-basis: 106px; padding: 4px; }
  .workspace-month-controls { grid-template-columns: 24px minmax(0, 1fr) 24px; gap: 0; min-height: 36px; padding: 3px; border-radius: 10px; }
  .workspace-month-controls button { width: 24px; height: 28px; border-radius: 7px; }
  .workspace-month-controls button svg { width: 14px; height: 14px; }
  .workspace-month-controls strong { font-size: 10px; }
  .workspace-month-full { display: none; }
  .workspace-month-compact { display: inline; }
  .main-nav .nav-button { grid-template-columns: 1fr; justify-items: center; padding-right: 4px; padding-left: 4px; }
  .main-nav .nav-button span { display: none; }
  .screen-header > .button { font-size: 0; }
  .screen-header > .button::after { content: "数据"; font-size: 11px; }
  .data-stats { grid-template-columns: 1fr; }
  .data-distribution { grid-template-columns: 1fr; padding: 22px 18px; }
  th, td { padding: 11px 9px; }
}

.quick-links { display: flex; flex-direction: column; min-height: 70px; overflow: hidden; margin: 24px 0 16px; }
.quick-links-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 10px 8px; flex-shrink: 0; font-size: 11px; color: var(--muted); }
.quick-links-heading button { border: 0; background: transparent; color: var(--primary); font-size: 11px; padding: 5px; }
#quickLinksList { overflow-y: auto; display: grid; gap: 2px; }
#quickLinksList a { display: flex; align-items: center; gap: 10px; padding: 7px 12px; border-radius: 7px; text-decoration: none; font-size: 12px; }
#quickLinksList a:hover { background: #f3f2ff; }
#quickLinksList i { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
#quickLinksList span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar > .main-nav, .sidebar > .workspace-month-picker, .sidebar-footer { flex-shrink: 0; }
.sidebar-collapsed .quick-links-heading { padding: 0 0 8px; justify-content: center; }
.sidebar-collapsed .quick-links-heading strong, .sidebar-collapsed #quickLinksList span { display: none; }
.sidebar-collapsed #quickLinksList a { justify-content: center; min-height: 30px; }
@media (max-width: 900px) {
  .sidebar { flex-wrap: wrap; }
  .quick-links { flex-basis: 100%; margin: 0; }
  .quick-links-heading { justify-content: flex-start; gap: 12px; padding-bottom: 2px; }
  #quickLinksList { display: flex; overflow-x: auto; }
  #quickLinksList a { flex-shrink: 0; }
  .sidebar-collapsed .quick-links-heading strong, .sidebar-collapsed #quickLinksList span { display: inline; }
}


/* Status details stay compact; handoff notes have a dedicated writing area. */
.status-modal .status-state-section, .status-modal .status-note-section, .status-modal .status-time-section { flex: 0 0 auto; }
.status-note-section { padding-top: 18px; }
.status-note-section > label { display: block; font-size: 13px; font-weight: 700; }
.status-note-section > p { margin: 6px 0 12px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.status-modal #statusHandoffNote { display: block; width: 100%; min-height: 180px; padding: 14px 16px; border: 1px solid #e0e3eb; border-radius: 12px; background: #f8f9fc; line-height: 1.8; resize: vertical; }
.status-modal #statusHandoffNote:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 3px #efedff; }
.status-time-section summary { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; font-size: 13px; font-weight: 700; }
.status-time-section summary::-webkit-details-marker { display: none; }
.status-time-section summary small { margin-left: auto; color: var(--muted); font-size: 11px; font-weight: 400; }
.status-time-chevron { font-size: 18px; transition: transform .15s; }
.status-time-section[open] .status-time-chevron { transform: rotate(180deg); }
.status-times-help { margin: 14px 0 18px; color: var(--muted); font-size: 12px; }
.status-time-section summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 6px; border-radius: 4px; }
.quick-links-modal { width: min(760px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; }
.quick-links-modal form { display: flex; flex-direction: column; max-height: calc(100dvh - 32px); }
.quick-links-modal .modal-header, .quick-links-modal .modal-actions, .quick-links-toolbar { flex: 0 0 auto; }
.quick-links-modal .modal-header p { margin: 7px 0 0; color: var(--muted); font-size: 12px; }
.quick-links-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; border-bottom: 1px solid var(--line); }
#quickLinksCount { color: var(--muted); font-size: 12px; }
.quick-links-modal .form-scroll { min-height: 0; max-height: none; flex: 1 1 auto; overflow: auto; background: #f6f7fa; padding: 16px 24px; }
#quickLinksEditor { display: grid; gap: 12px; }
.quick-link-row { min-width: 0; padding: 14px 16px 16px; border: 1px solid #e4e7ee; border-radius: 12px; background: #fff; }
.quick-link-row-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.quick-link-number { font-size: 11px; font-weight: 700; color: #7a8190; letter-spacing: .04em; }
.quick-link-actions { display: flex; gap: 6px; }
.quick-link-actions button { height: 30px; min-width: 32px; border: 1px solid #e5e7ed; border-radius: 7px; background: #fff; font-size: 16px; }
.quick-link-actions button:hover:not(:disabled) { background: #f0eeff; border-color: #c8c2f2; }
.quick-link-actions button:disabled { opacity: .3; cursor: default; }
.quick-link-actions .quick-link-remove { margin-left: 6px; padding: 0 10px; color: #b05757; font-size: 11px; }
.quick-link-fields { display: grid; grid-template-columns: minmax(0, 1fr) 64px; gap: 12px 16px; }
.quick-link-fields label { display: grid; gap: 6px; min-width: 0; font-size: 11px; font-weight: 600; color: #747b89; }
.quick-link-field-url { grid-column: 1 / -1; grid-row: 2; }
.quick-link-field-color { grid-column: 2; grid-row: 1; }
.quick-links-modal .quick-link-fields input { width: 100%; min-width: 0; height: 38px; padding: 8px 10px; border: 1px solid #e0e4ec; border-radius: 8px; background: #fafbfe; font-size: 13px; }
.quick-links-modal .quick-link-fields input:focus { border-color: var(--primary); background: #fff; box-shadow: 0 0 0 2px #efedff; }
.quick-links-modal .quick-link-fields input[type="color"] { padding: 5px; cursor: pointer; }
#quickLinksError { flex: 0 0 auto; margin: 0; padding: 0 24px; color: #b52a2a; font-size: 12px; }
#quickLinksError:not(:empty) { padding-top: 12px; }
.quick-links-storage-hint { flex: 0 0 auto; margin: 0; padding: 12px 24px; font-size: 11px; color: var(--muted); }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 600px) {
  .quick-links-modal .form-scroll { padding: 12px; }
  .quick-links-toolbar { padding: 10px 16px; }
  .quick-link-row { padding: 12px; }
  .status-time-section .form-grid { grid-template-columns: 1fr; }
  .status-modal #statusHandoffNote { min-height: 180px; }
}

/* Shared vector controls and compact shortcut rows. */
.ui-icon { display: block; width: 18px; height: 18px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.select-chevron { width: 14px; height: 14px; color: #858d99; transition: transform .15s; }
.custom-select-trigger[aria-expanded="true"] .select-chevron { transform: rotate(180deg); }
.status-time-chevron { width: 18px; height: 18px; }
.history-sort-button .ui-icon { width: 15px; height: 15px; color: var(--primary); }
#addQuickLink { display: inline-flex; align-items: center; gap: 6px; }
.quick-links-modal { width: min(960px, calc(100vw - 32px)); }
.quick-links-modal .form-scroll { padding: 0 20px 12px; background: #fff; }
.quick-links-columns, .quick-link-row { display: grid; grid-template-columns: 30px minmax(130px, 1fr) minmax(220px, 2fr) 44px 124px; align-items: center; gap: 12px; min-width: 650px; }
.quick-links-columns { position: sticky; top: 0; z-index: 1; padding: 12px 8px; color: #7a8190; background: #fff; border-bottom: 1px solid var(--line); font-size: 11px; }
#quickLinksEditor { gap: 0; }
.quick-link-row { padding: 9px 8px; border: 0; border-bottom: 1px solid #eceef3; border-radius: 0; }
.quick-link-row:hover { background: #fafbfe; }
.quick-link-row-header, .quick-link-fields { display: contents; }
.quick-link-number { grid-column: 1; grid-row: 1; text-align: center; }
.quick-link-field-name { grid-column: 2; grid-row: 1; }
.quick-link-field-url { grid-column: 3; grid-row: 1; }
.quick-link-field-color { grid-column: 4; grid-row: 1; }
.quick-link-actions { grid-column: 5; grid-row: 1; align-items: center; gap: 5px; }
.quick-link-actions button { display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.quick-link-actions .quick-link-remove { margin-left: 0; padding: 0 8px; }
.quick-links-modal .quick-link-fields input { height: 36px; font-size: 12px; font-weight: 400; }
@media (max-width: 600px) { .quick-links-modal .form-scroll { padding: 0 12px 12px; } }