:root {
  --ink: #242522;
  --muted: #7b7d77;
  --soft-muted: #a5a69f;
  --paper: #f6f4ef;
  --surface: #fffefa;
  --surface-deep: #eeece5;
  --line: #e3e1d9;
  --accent: #d65a3a;
  --accent-dark: #b6422b;
  --accent-soft: #fae4dc;
  --sage: #75836a;
  --sage-soft: #e8ece2;
  --shadow: 0 18px 42px rgba(50, 45, 34, 0.06);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--paper); }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar {
  width: 244px; flex: 0 0 244px; padding: 30px 20px 22px; background: #eae8e0;
  border-right: 1px solid var(--line); display: flex; flex-direction: column;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 36px; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: var(--ink); color: #fff; font-size: 18px; font-weight: 700; }
.brand strong, .brand span { display: block; }
.brand strong { font-size: 14px; letter-spacing: 0.01em; }
.brand span { color: var(--muted); font-size: 10px; margin-top: 3px; letter-spacing: 0.06em; text-transform: uppercase; }
.workspace-label, .sidebar-section { color: var(--soft-muted); font-size: 11px; letter-spacing: 0.04em; }
.workspace-label { padding: 0 10px 11px; }
.primary-nav { display: grid; gap: 4px; }
.nav-item { border: 0; background: transparent; width: 100%; min-height: 42px; padding: 0 10px; display: flex; align-items: center; gap: 11px; border-radius: 8px; color: #62645e; text-align: left; font-size: 13px; }
.nav-item:hover { background: rgba(255,255,255,0.45); color: var(--ink); }
.nav-item.is-active { background: var(--surface); color: var(--ink); box-shadow: 0 4px 12px rgba(50,45,34,0.04); }
.nav-icon { width: 15px; color: var(--accent); font-size: 17px; line-height: 1; }
.nav-count { margin-left: auto; color: var(--soft-muted); font-size: 11px; }
.sidebar-section { margin-top: 35px; }
.section-heading { padding: 0 9px 12px; display: flex; justify-content: space-between; align-items: center; }
.icon-button { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--surface); display: inline-grid; place-items: center; font-size: 19px; line-height: 1; }
.icon-button:hover { border-color: #c6c3ba; background: #fff; }
.icon-button.subtle { width: 24px; height: 24px; border: 0; background: transparent; color: var(--muted); }
.edit-square-button { color: #474b5c; }
.square-pen-icon { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.directory-edit-button { width: 20px !important; height: 20px !important; color: #989991 !important; }
.directory-edit-button .square-pen-icon { width: 14px; height: 14px; stroke-width: 1.8; }
.directory-edit-button:hover { color: #6e7069 !important; background: transparent; }
.category-list { display: grid; gap: 3px; }
.category-button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 7px; color: #666861; background: transparent; font-size: 12px; text-align: left; }
.category-button:hover, .category-button.is-active { background: rgba(255,255,255,0.6); color: var(--ink); }
.category-swatch { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.category-button:nth-child(2) .category-swatch { background: #7f8fa6; }
.category-button:nth-child(3) .category-swatch { background: #a98666; }
.category-button:nth-child(4) .category-swatch { background: #8f8a69; }
.category-count { margin-left: auto; color: var(--soft-muted); font-size: 11px; }
.experience-tree { display: grid; gap: 8px; }
.experience-tree-group { display: grid; gap: 2px; }
.experience-tree-header { display: flex; align-items: center; min-height: 29px; }
.tree-collapse-button { width: 18px; height: 29px; padding: 0; border: 0; background: transparent; color: #92938d; display: grid; place-items: center; }
.tree-collapse-button:hover { color: #62645e; }
.tree-collapse-chevron { width: 6px; height: 6px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 160ms ease; }
.tree-collapse-button[aria-expanded="false"] .tree-collapse-chevron { transform: rotate(-45deg) translate(-1px, 1px); }
.experience-tree-button, .project-tree-button, .category-tree-button { width: 100%; border: 0; border-radius: 6px; background: transparent; color: #555750; text-align: left; }
.experience-tree-button { flex: 1; display: flex; align-items: center; justify-content: space-between; min-height: 29px; padding: 0 8px 0 3px; font-size: 13px; font-weight: 700; }
.experience-tree-button > span:last-child, .project-tree-button > span:last-child, .category-tree-button > span:last-child { color: var(--soft-muted); font-size: 10px; font-weight: 400; }
.experience-tree-button:hover, .experience-tree-button.is-active { background: rgba(255,255,255,0.6); color: var(--ink); }
.project-tree-list { display: grid; gap: 1px; padding-left: 6px; }
.project-tree-list[hidden] { display: none; }
.project-tree-group { display: grid; gap: 1px; }
.project-tree-header { display: flex; align-items: center; min-height: 27px; }
.project-tree-collapse-button { height: 27px; }
.project-tree-button { flex: 1; display: flex; align-items: center; justify-content: space-between; min-height: 27px; padding: 0 8px 0 8px; color: #777970; font-size: 12px; }
.project-tree-button::before { content: ""; width: 4px; height: 4px; margin-right: 7px; border-radius: 50%; background: #b5b2a7; }
.project-tree-button > span:first-child { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.project-tree-button:hover, .project-tree-button.is-active { background: var(--surface); color: var(--accent-dark); }
.project-tree-button.is-active::before { background: var(--accent); }
.category-tree-list { display: grid; gap: 1px; padding: 0 8px 1px 24px; }
.category-tree-list[hidden] { display: none; }
.category-tree-button { display: flex; align-items: center; justify-content: space-between; min-height: 24px; padding: 0 7px; color: #85867f; font-size: 11px; }
.category-tree-button::before { content: ""; width: 3px; height: 3px; margin-right: 7px; border-radius: 50%; background: #c2c0b7; }
.category-tree-button > span:first-child { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.category-tree-button:hover, .category-tree-button.is-active { background: var(--surface); color: var(--accent-dark); }
.category-tree-button.is-active::before { background: var(--accent); }
.directory-tree-node { min-width: 0; }
.directory-tree-header { display: flex; align-items: center; min-height: 28px; }
.directory-tree-collapse-button { flex: 0 0 18px; }
.tree-collapse-placeholder { display: block; width: 18px; height: 28px; }
.directory-tree-button { display: flex; align-items: center; justify-content: space-between; flex: 1; min-width: 0; min-height: 28px; padding: 0 8px 0 6px; border: 0; border-radius: 6px; background: transparent; color: #62645e; text-align: left; font-size: 12px; }
.directory-tree-depth-0 > .directory-tree-header .directory-tree-button { color: #4f514b; font-size: 13px; font-weight: 700; }
.directory-tree-depth-1 > .directory-tree-header .directory-tree-button,
.directory-tree-depth-2 > .directory-tree-header .directory-tree-button,
.directory-tree-depth-3 > .directory-tree-header .directory-tree-button,
.directory-tree-depth-4 > .directory-tree-header .directory-tree-button { font-size: 13px; }
.directory-tree-button > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.directory-tree-button > span:last-child { margin-left: 8px; color: var(--soft-muted); font-size: 10px; font-weight: 400; }
.directory-tree-button:hover, .directory-tree-button.is-active { background: var(--surface); color: var(--accent-dark); }
.directory-tree-button.is-active > span:last-child { color: var(--accent-dark); }
.directory-tree-children { display: grid; gap: 1px; margin-left: 16px; padding-left: 0; }
.sidebar-footer { margin-top: auto; padding: 18px 9px 0; border-top: 1px solid rgba(123,125,119,0.2); display: flex; align-items: center; gap: 11px; flex-wrap: wrap; }
.sync-status { width: 100%; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.status-dot { width: 6px; height: 6px; background: #7c9c72; border-radius: 50%; }
.text-button { border: 0; padding: 0; color: #777970; background: transparent; font-size: 11px; }
.text-button:hover { color: var(--accent-dark); }

.main-content { flex: 1; min-width: 0; }
.topbar { height: 72px; padding: 0 3.4vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.breadcrumb { color: var(--soft-muted); font-size: 12px; }
.breadcrumb strong { color: var(--ink); font-weight: 600; }
.breadcrumb-separator { margin: 0 8px; color: #c6c5be; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.profile-button { width: 31px; height: 31px; border: 1px solid #c7c5bd; background: #dddcd4; color: #575950; border-radius: 50%; font-weight: 700; }
.auth-button { min-height: 31px; padding: 0 11px; border: 1px solid #c8c6be; border-radius: 7px; background: var(--surface); color: #555750; font-size: 11px; }
.auth-button:hover { border-color: #aeadA4; background: #fff; color: var(--accent-dark); }
.content-wrap { max-width: 1390px; padding: 45px 3.4vw 70px; margin: 0 auto; }
.overview { display: flex; gap: 30px; justify-content: space-between; align-items: end; padding-bottom: 40px; }
.eyebrow { margin: 0 0 12px; color: var(--accent); font-size: 10px; letter-spacing: 0.13em; font-weight: 700; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 640px; margin-bottom: 13px; font-size: clamp(29px, 3.2vw, 42px); line-height: 1.16; letter-spacing: 0; font-weight: 700; }
.overview-copy { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.primary-button, .secondary-button { min-height: 42px; border-radius: 7px; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-size: 12px; }
.primary-button { border: 1px solid var(--accent); background: var(--accent); color: white; box-shadow: 0 8px 16px rgba(214,90,58,0.16); }
.primary-button:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.secondary-button { border: 1px solid var(--line); background: var(--surface); color: var(--ink); }
.secondary-button:hover { border-color: #c6c3ba; }
.metrics { display: grid; grid-template-columns: 1fr 1fr 1fr 1.8fr; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 43px; }
.metric-block, .progress-block { min-height: 124px; padding: 22px 25px; border-right: 1px solid var(--line); }
.metric-block:first-child { padding-left: 0; }
.progress-block { border-right: 0; }
.metric-label { color: var(--muted); display: block; font-size: 11px; margin-bottom: 12px; }
.metric-block strong { display: block; font-size: 29px; font-weight: 700; }
.metric-note { display: block; margin-top: 7px; color: var(--soft-muted); font-size: 10px; }
.progress-topline { display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; }
.progress-topline strong { color: var(--ink); font-size: 11px; font-weight: 600; }
.progress-track { height: 6px; overflow: hidden; border-radius: 99px; background: var(--surface-deep); margin: 21px 0 12px; }
.progress-track span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--accent); transition: width 300ms ease; }
.section-toolbar { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin-bottom: 20px; }
h2 { margin-bottom: 5px; font-size: 22px; font-weight: 700; }
.library-overview { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 24px; }
.library-overview[hidden], .library-summary[hidden] { display: none; }
.library-overview h1 { margin-bottom: 8px; font-size: 38px; }
.library-overview .primary-button { flex: 0 0 auto; }
.library-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 28px; }
.library-stat { min-height: 88px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 7px 18px rgba(50, 45, 34, 0.035); }
.library-stat span { display: block; color: var(--muted); font-size: 11px; }
.library-stat strong { display: block; margin-top: 7px; font-size: 25px; font-weight: 700; }
.result-count { color: var(--soft-muted); font-size: 11px; }
.library-path { display: inline-block; margin-left: 8px; color: var(--accent-dark); font-size: 10px; }
.select-all-control { display: inline-flex; align-items: center; gap: 6px; margin-left: 12px; color: var(--muted); font-size: 11px; cursor: pointer; }
.select-all-control input { accent-color: var(--accent); }
.bulk-actions { display: flex; align-items: center; gap: 9px; margin-left: auto; color: var(--muted); font-size: 11px; }
.bulk-actions[hidden] { display: none; }
.compact-danger-button { min-height: 32px; padding: 0 11px; }
.toolbar-controls { display: flex; gap: 10px; align-items: center; }
.library-add-button { min-height: 36px; padding: 0 13px; white-space: nowrap; }
.search-box { width: min(270px, 31vw); height: 36px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #c9c7bf; color: var(--muted); }
.search-box input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 11px; }
.search-box input::placeholder { color: #aaa9a2; }
.select-control { height: 36px; border: 1px solid var(--line); border-radius: 6px; padding: 0 10px; background: var(--surface); color: var(--muted); font-size: 11px; }
.library-grid { max-width: 1080px; }
.question-list { display: grid; gap: 12px; }
.experience-list-group { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: rgba(255, 254, 250, 0.65); }
.experience-list-heading { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 45px; padding: 0 16px; border: 0; border-bottom: 1px solid var(--line); background: #faf8f3; color: var(--ink); text-align: left; }
.experience-list-heading > span, .project-list-heading span { color: var(--accent-dark); font-size: 9px; letter-spacing: 0.06em; }
.experience-list-heading h3 { margin: 0; color: #393a35; font-size: 15px; font-weight: 700; }
.experience-list-heading small { margin-left: auto; color: var(--soft-muted); font-size: 10px; white-space: nowrap; }
.project-list-group + .project-list-group { border-top: 1px solid var(--surface-deep); }
.project-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 35px; padding: 0 16px; border: 0; background: transparent; color: var(--ink); text-align: left; }
.project-list-heading > div { display: flex; align-items: center; gap: 7px; min-width: 0; }
.project-list-heading h4 { margin: 0; color: #565850; font-size: 12px; font-weight: 700; }
.project-list-heading small { color: var(--soft-muted); font-size: 10px; }
.collapse-indicator { display: inline-block; width: 13px; margin-left: 5px; color: var(--accent-dark); font-size: 14px; font-style: normal; text-align: center; }
.question-list > .project-list-group { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: rgba(255, 254, 250, 0.65); }
.question-list > .project-list-group .project-list-heading { min-height: 45px; border-bottom: 1px solid var(--line); background: #faf8f3; }
.question-list > .project-list-group .project-list-heading h4 { color: #393a35; font-size: 15px; }
.category-question-group + .category-question-group { border-top: 1px solid var(--surface-deep); }
.question-category-heading { display: flex; align-items: center; gap: 7px; min-height: 31px; padding: 0 16px; border-bottom: 1px solid var(--surface-deep); background: #fcfbf7; }
.question-category-heading > span { color: #9a6a5e; font-size: 9px; letter-spacing: 0.06em; }
.question-category-heading h5 { margin: 0; color: #64665f; font-size: 12px; font-weight: 700; }
.question-category-heading small { margin-left: auto; color: var(--soft-muted); font-size: 10px; }
.category-question-group .question-row-list { border-top: 0; }
.question-row-list { border-top: 1px solid var(--surface-deep); }
.question-item { border-bottom: 1px solid var(--surface-deep); }
.question-item:last-child { border-bottom: 0; }
.question-item.is-expanded { background: #fbfaf6; }
.question-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 53px; background: transparent; }
.question-row-select { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 8px; width: 100%; min-width: 0; min-height: 56px; padding: 10px 16px; border: 0; background: transparent; color: var(--ink); text-align: left; }
.question-row:hover .question-row-select, .question-row.is-selected .question-row-select { color: var(--accent-dark); }
.question-number { color: #aaa9a2; font-size: 10px; font-variant-numeric: tabular-nums; font-weight: 700; }
.question-row-main { min-width: 0; }
.question-row-main strong { display: block; overflow: hidden; color: inherit; font-size: 14px; font-weight: 600; line-height: 1.5; white-space: nowrap; text-overflow: ellipsis; }
.question-row-main small { display: block; margin-top: 4px; color: #898a84; font-size: 11px; }
.question-row-actions { display: flex; align-items: center; gap: 2px; padding-right: 12px; }
.question-select-control { width: 27px; height: 27px; display: grid; place-items: center; cursor: pointer; }
.question-select-control input { width: 14px; height: 14px; accent-color: var(--accent); }
.question-row-favorite, .question-row-icon { width: 27px; height: 27px; border: 0; border-radius: 4px; background: transparent; color: #bcbab2; font-size: 18px; line-height: 1; }
.question-row-favorite:hover { background: var(--surface-deep); color: var(--accent-dark); }
.question-row-favorite.is-favorite { color: var(--accent); }
.question-row-icon { display: inline-grid; place-items: center; color: #a5a69f; font-size: 17px; }
.question-row-icon:hover { background: var(--surface-deep); color: var(--accent-dark); }
.question-row-icon .square-pen-icon { width: 16px; height: 16px; }
.question-answer-panel { padding: 0 16px 24px; color: #30322d; }
.question-answer-content { display: grid; grid-template-columns: 1fr; gap: 13px; padding-top: 3px; }
.inline-answer-block h4 { margin: 0 0 7px; color: var(--accent-dark); font-size: 11px; letter-spacing: 0.06em; }
.inline-answer-block p { margin: 0; color: #484a44; font-size: 14px; line-height: 1.8; white-space: pre-line; }
.inline-answer-main { min-width: 0; }
.inline-answer-main .rich-answer { color: #363833; font-size: 16px; line-height: 1.9; }
.question-answer-follow-up { margin-top: 14px; padding-top: 11px; border-top: 1px solid var(--surface-deep); }
.question-answer-follow-up strong { display: block; margin-bottom: 5px; color: var(--accent-dark); font-size: 11px; letter-spacing: 0.06em; }
.question-answer-follow-up p { margin: 0; color: #565850; font-size: 14px; line-height: 1.75; }
.question-card { position: relative; padding: 18px 19px 17px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,254,250,0.62); transition: border-color 160ms ease, transform 160ms ease, background 160ms ease; }
.question-card:hover { border-color: #cbc8bf; transform: translateY(-1px); }
.question-card.is-selected { background: var(--surface); border-color: var(--accent); box-shadow: var(--shadow); }
.question-card-top { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.question-card h3 { margin: 0; font-size: 14px; line-height: 1.55; font-weight: 600; }
.favorite-button { border: 0; padding: 0; background: transparent; color: #bcbab2; font-size: 19px; line-height: 1; }
.favorite-button.is-favorite { color: var(--accent); }
.question-card-meta { display: flex; align-items: center; gap: 8px; margin-top: 15px; }
.category-tag, .status-tag, .tag { display: inline-flex; align-items: center; border-radius: 4px; padding: 4px 7px; font-size: 10px; }
.category-tag { color: var(--accent-dark); background: var(--accent-soft); }
.status-tag { color: var(--sage); background: var(--sage-soft); }
.status-tag.is-draft { color: #907453; background: #f1e9dc; }
.question-card-date { margin-left: auto; color: var(--soft-muted); font-size: 10px; }
.empty-state { padding: 55px 25px; border: 1px dashed #d2d0c8; border-radius: 8px; text-align: center; color: var(--muted); }
.empty-state strong { display: block; margin-bottom: 7px; color: var(--ink); font-size: 14px; }
.empty-state span { font-size: 11px; }
.detail-panel { position: sticky; top: 18px; min-height: 0; max-height: calc(100vh - 108px); overflow: auto; padding: 21px 25px 24px; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow); }
.detail-empty { min-height: 460px; display: grid; place-items: center; text-align: center; color: var(--muted); }
.detail-empty strong { display: block; margin-bottom: 8px; color: var(--ink); font-size: 22px; font-weight: 700; }
.detail-head { display: flex; justify-content: space-between; align-items: start; gap: 16px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.detail-head h2 { max-width: 650px; margin: 0; font-size: 22px; line-height: 1.35; }
.detail-actions { display: flex; gap: 7px; flex-shrink: 0; }
.detail-actions .icon-button { width: 30px; height: 30px; background: var(--paper); font-size: 15px; }
.detail-actions .favorite-detail-button { color: #aaa89f; }
.detail-actions .favorite-detail-button.is-favorite { border-color: #edc1b5; color: var(--accent); background: #fff9f6; }
.detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; }
.hierarchy-tag { color: #676960; font-size: 10px; }
.detail-section { padding: 16px 0 0; }
.detail-section h3 { margin-bottom: 7px; color: var(--accent-dark); font-size: 10px; letter-spacing: 0.06em; }
.detail-section p { margin-bottom: 0; color: #53554f; font-size: 12px; line-height: 1.75; white-space: pre-line; }
.answer-section { padding-top: 17px; }
.rich-answer { color: #3d3f39; font-size: 16px; line-height: 1.9; }
.rich-answer > :first-child { margin-top: 0; }
.rich-answer > :last-child { margin-bottom: 0; }
.rich-answer p { margin: 0 0 10px; }
.rich-answer h3, .rich-answer h4 { margin: 15px 0 7px; color: #393b35; font-family: inherit; font-size: 13px; font-weight: 700; }
.rich-answer ul, .rich-answer ol { margin: 7px 0 11px; padding-left: 20px; }
.rich-answer li + li { margin-top: 4px; }
.rich-answer blockquote { margin: 10px 0; padding: 2px 0 2px 11px; border-left: 3px solid var(--accent); color: #686a63; }
.rich-answer hr { height: 1px; margin: 15px 0; border: 0; background: var(--line); }
.rich-answer a { color: var(--accent-dark); }
.empty-answer { color: var(--soft-muted); }
.tag-list { display: flex; flex-wrap: wrap; gap: 7px; }
.tag { color: #696b65; background: var(--surface-deep); }
.follow-up { padding-top: 16px; margin-top: 17px; border-top: 1px solid var(--line); }
.follow-up p { color: var(--muted); }

.modal-backdrop { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 20px; background: rgba(36,37,34,0.28); }
.modal-backdrop[hidden] { display: none; }
.editor-modal, .tree-editor-modal { width: min(760px, 100%); max-height: 92vh; overflow: auto; padding: 25px 29px; border: 1px solid rgba(255,255,255,0.8); border-radius: 8px; background: var(--surface); box-shadow: 0 30px 75px rgba(37,35,28,0.22); }
.modal-header { display: flex; justify-content: space-between; align-items: start; margin-bottom: 25px; }
.modal-header h2 { margin: 0; font-size: 27px; }
.question-form { display: grid; gap: 17px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 7px; }
.field span { color: #5e6059; font-size: 11px; }
.field em { color: var(--accent); font-style: normal; }
.field small { color: var(--soft-muted); margin-left: 4px; }
.field input, .field textarea, .field select { width: 100%; border: 1px solid var(--line); border-radius: 6px; outline: 0; padding: 10px 11px; background: #fbfaf6; color: var(--ink); font-size: 12px; line-height: 1.6; }
.field textarea { resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(214,90,58,0.08); }
.readiness-field { align-content: start; padding: 10px 11px; border: 1px solid var(--line); border-radius: 6px; background: #fbfaf6; }
.readiness-field strong { color: #907453; font-size: 14px; font-weight: 700; }
.readiness-field strong.is-ready { color: var(--sage); }
.readiness-field small { margin: 0; color: var(--soft-muted); font-size: 10px; line-height: 1.45; }
.answer-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-height: 35px; padding: 5px; border: 1px solid var(--line); border-bottom: 0; border-radius: 6px 6px 0 0; background: var(--paper); }
.format-button { width: 27px; height: 26px; border: 0; border-radius: 4px; background: transparent; color: #5e6059; font-size: 12px; font-weight: 700; }
.format-button-italic { font-family: inherit; font-style: italic; font-size: 15px; }
.format-button-underline { text-decoration: underline; }
.format-separator { width: 1px; height: 16px; margin: 0 1px; background: var(--line); }
.format-button:hover { background: transparent; color: var(--ink); }
.format-button:focus-visible { outline: 2px solid rgba(214,90,58,0.35); outline-offset: 1px; }
.format-button.is-active { background: var(--accent-soft); color: var(--accent-dark); }
.format-menu { position: relative; }
.format-icon-button { position: relative; }
.format-size-icon { display: inline-flex; align-items: end; gap: 1px; color: currentColor; font-family: Georgia, "Times New Roman", serif; font-size: 15px; line-height: 1; }
.format-size-icon span { font-size: 9px; }
.format-line-height-icon { position: relative; display: inline-block; width: 16px; color: currentColor; font-size: 16px; line-height: 1; letter-spacing: -3px; text-align: left; }
.format-line-height-icon span { position: absolute; top: -2px; right: -4px; font-size: 8px; letter-spacing: 0; }
.format-popover { position: absolute; top: calc(100% + 6px); right: 0; z-index: 4; display: grid; gap: 3px; padding: 5px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 10px 22px rgba(50, 45, 34, 0.14); }
.format-popover[hidden] { display: none; }
.format-size-menu { grid-template-columns: repeat(3, 34px); }
.format-line-height-menu { grid-template-columns: repeat(2, 39px); }
.format-popover button { min-height: 27px; border: 0; border-radius: 4px; background: transparent; color: #5e6059; font-size: 11px; }
.format-popover button:hover, .format-popover button.is-selected { background: var(--accent-soft); color: var(--accent-dark); }
.format-color-button { position: relative; overflow: hidden; display: inline-grid; place-items: center; cursor: pointer; }
.format-color-swatch { width: 14px; height: 14px; border: 1px solid rgba(36, 37, 34, 0.25); background: #363833; }
.format-color-button input { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; opacity: 0; cursor: pointer; }
.answer-editor { min-height: 250px; outline: 0; overflow: auto; padding: 12px; border: 1px solid var(--line); border-radius: 0 0 6px 6px; background: #fbfaf6; color: var(--ink); font-size: 15px; font-weight: 400; line-height: 1.75; }
.answer-editor:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(214,90,58,0.08); }
.answer-editor:empty::before { content: attr(data-placeholder); color: #aaa9a2; pointer-events: none; }
.answer-editor p { margin: 0 0 10px; }
.answer-editor em, .answer-editor i, .rich-answer em, .rich-answer i { font-style: oblique 4deg; font-synthesis: style; }
.answer-editor h3 { margin: 13px 0 7px; font-size: 14px; }
.answer-editor ul, .answer-editor ol { margin: 6px 0 10px; padding-left: 20px; }
.answer-editor blockquote { margin: 9px 0; padding-left: 10px; border-left: 3px solid var(--accent); color: #6b6d65; }
.answer-editor hr { height: 1px; margin: 14px 0; border: 0; background: var(--line); }
.checkbox-field { display: flex; align-items: center; gap: 8px; color: #62645e; font-size: 11px; }
.checkbox-field input { accent-color: var(--accent); }
.form-actions { display: flex; justify-content: end; gap: 9px; padding-top: 7px; }
.confirm-modal { display: flex; align-items: start; gap: 14px; width: min(470px, 100%); padding: 24px; border: 1px solid rgba(255,255,255,0.8); border-radius: 8px; background: var(--surface); box-shadow: 0 30px 75px rgba(37,35,28,0.22); }
.confirm-mark { width: 28px; height: 28px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--accent-dark); background: var(--accent-soft); font-size: 16px; font-weight: 700; }
.confirm-copy { min-width: 0; flex: 1; }
.confirm-copy h2 { margin: 2px 0 7px; font-size: 19px; }
.confirm-copy p { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.confirm-copy strong { display: block; overflow: hidden; color: #454740; font-size: 13px; font-weight: 600; line-height: 1.55; white-space: nowrap; text-overflow: ellipsis; }
.confirm-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; align-self: end; }
.danger-button { min-height: 36px; padding: 0 13px; border: 1px solid var(--accent); border-radius: 7px; background: var(--accent); color: #fff; font-size: 12px; }
.danger-button:hover { border-color: var(--accent-dark); background: var(--accent-dark); }
.toast { position: fixed; left: 50%; bottom: 28px; z-index: 20; transform: translate(-50%, 18px); opacity: 0; pointer-events: none; padding: 10px 15px; border-radius: 7px; background: var(--ink); color: #fff; font-size: 12px; transition: opacity 180ms ease, transform 180ms ease; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.tree-editor-note { margin: -9px 0 17px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.tree-manager-list { display: grid; gap: 11px; }
.tree-manager-node { display: grid; gap: 6px; }
.tree-manager-node-row { display: grid; grid-template-columns: 23px minmax(0, 1fr) 28px 28px; align-items: center; gap: 6px; padding: 7px; border: 1px solid var(--line); border-radius: 7px; background: #fbfaf6; }
.tree-manager-node-row.is-dragging { opacity: 0.45; }
.tree-manager-node-row.is-drag-over { border-color: var(--accent); background: #fff8f4; }
.tree-manager-node-row input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 5px; padding: 8px 9px; background: var(--surface); color: var(--ink); font-size: 12px; outline: 0; }
.tree-manager-node-row input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(214,90,58,0.08); }
.tree-manager-node-row .icon-button { width: 28px; height: 28px; font-size: 15px; }
.tree-manager-children { display: grid; gap: 6px; margin-left: 22px; padding-left: 13px; border-left: 1px solid var(--line); }
.tree-drag-handle { color: var(--soft-muted); cursor: grab; font-size: 13px; letter-spacing: -3px; user-select: none; }
.tree-drag-handle:active { cursor: grabbing; }
.tree-add-experience-button { margin-top: 12px; }
.context-menu { position: fixed; z-index: 30; min-width: 180px; padding: 4px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: 0 12px 30px rgba(37,35,28,0.15); }
.context-menu[hidden] { display: none; }
.context-menu button { width: 100%; padding: 9px 10px; border: 0; border-radius: 5px; background: transparent; color: var(--accent-dark); font-size: 11px; text-align: left; }
.context-menu button:hover { background: var(--accent-soft); }
.move-modal { width: min(520px, 100%); padding: 25px 29px; border: 1px solid rgba(255,255,255,0.8); border-radius: 8px; background: var(--surface); box-shadow: 0 30px 75px rgba(37,35,28,0.22); }
.move-description { margin: -8px 0 18px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.resume-section[hidden] { display: none; }
.resume-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 25px; }
.resume-toolbar h1 { margin-bottom: 8px; font-size: 38px; }
.resume-toolbar-actions { display: flex; align-items: center; gap: 11px; flex: 0 0 auto; }
.resume-save-status { color: var(--soft-muted); font-size: 11px; }
.resume-workspace { display: grid; grid-template-columns: minmax(336px, 0.94fr) minmax(460px, 1.06fr); gap: 16px; align-items: start; }
.resume-form, .resume-preview { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.resume-form { display: grid; gap: 16px; }
.resume-form-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 5px; border-bottom: 1px solid var(--surface-deep); }
.resume-form-heading h2 { margin: 0; font-size: 18px; }
.resume-form-heading span { color: var(--soft-muted); font-size: 10px; }
.resume-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.resume-format-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 3px; padding: 8px; border: 1px solid var(--line); border-radius: 7px; background: #fbfaf6; }
.resume-color-control { display: inline-flex; align-items: center; gap: 5px; height: 27px; padding-left: 5px; color: var(--muted); font-size: 10px; }
.resume-color-control input { width: 22px; height: 22px; padding: 1px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); cursor: pointer; }
.resume-section-editor { display: grid; gap: 7px; }
.resume-section-editor .field { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 10px; }
.resume-section-editor .field > span { margin: 0; font-size: 11px; }
.resume-section-editor .field input { height: 32px; }
.resume-rich-editor { min-height: 108px; padding: 11px 12px; overflow: auto; border: 1px solid var(--line); border-radius: 7px; outline: 0; color: #3d3f39; background: #fffefa; font-size: 13px; line-height: 1.7; }
.resume-rich-editor:focus { border-color: #c79a8c; box-shadow: 0 0 0 3px rgba(214, 90, 58, 0.1); }
.resume-rich-editor:empty::before { content: attr(data-placeholder); color: #aaa9a2; pointer-events: none; white-space: pre-line; }
.resume-rich-editor p { margin: 0 0 7px; }
.resume-rich-editor ul, .resume-rich-editor ol { margin: 5px 0 8px; padding-left: 20px; }
.resume-rich-editor li + li { margin-top: 3px; }
.resume-rich-editor .resume-entry-date { float: right; }
.resume-save-button { justify-self: end; }
.resume-preview { width: min(100%, 652px); min-height: 964px; margin: 0 auto; padding: 22px 28px 26px; border-color: #d7d6cf; border-radius: 0; color: #181914; background: #fff; box-shadow: 0 12px 28px rgba(50, 45, 34, 0.09); }
.resume-preview-header { position: relative; min-height: 130px; padding: 20px 110px 15px 0; border-bottom: 2px solid #20211d; }
.resume-preview-identity { min-width: 0; }
.resume-preview-header h2 { margin: 0; color: #1f201c; font-size: 27px; line-height: 1.1; letter-spacing: 0.12em; font-weight: 700; }
.resume-preview-title { margin: 6px 0 0; color: #33342f; font-size: 11px; font-weight: 600; }
.resume-preview-contact { position: absolute; right: 112px; bottom: 16px; left: 0; margin: 0; color: #20211d; font-size: 11px; line-height: 1.5; text-align: center; }
.resume-preview-photo { position: absolute; top: 0; right: 0; width: 92px; height: 128px; object-fit: cover; }
.resume-preview-section { padding-top: 12px; }
.resume-preview-section h3 { margin: 0 0 7px; padding-bottom: 5px; border-bottom: 2px solid #20211d; color: #171813; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; }
.resume-preview-content { color: #272823; font-size: 10px; line-height: 1.62; }
.resume-preview-content p { margin: 0 0 6px; }
.resume-preview-content .resume-entry-line { display: flow-root; color: #1f201c; font-weight: 600; }
.resume-entry-date { float: right; font-weight: 700; white-space: nowrap; }
.resume-preview-content ul, .resume-preview-content ol { margin: 4px 0 7px; padding-left: 16px; }
.resume-preview-content li + li { margin-top: 2px; }
.resume-preview-content h3, .resume-preview-content h4 { margin: 8px 0 4px; color: #1f201c; font-size: 10px; }
.resume-preview-content blockquote { margin: 6px 0; padding-left: 8px; border-left: 2px solid #777870; color: #555750; }
.question-item[draggable="true"] { cursor: grab; }
.question-item.is-dragging { opacity: 0.48; }
.question-item.is-drag-over { outline: 2px solid rgba(214,90,58,0.45); outline-offset: -2px; }
.question-item.is-drag-over .question-row { background: #fff8f4; }
.focus-mode .sidebar { display: none; }
.focus-mode .topbar { padding-left: 7vw; padding-right: 7vw; }
.focus-mode .content-wrap { max-width: 1180px; }
.focus-mode .detail-panel { min-height: 650px; }

.plan-workspace { min-width: 0; }
.dashboard-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 25px; }
.dashboard-heading h1 { margin-bottom: 8px; font-size: 38px; }
.dashboard-heading-actions { display: flex; gap: 9px; flex-shrink: 0; }
.dashboard-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.dashboard-stat { min-height: 112px; padding: 19px 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 7px 18px rgba(50, 45, 34, 0.035); }
.dashboard-stat span { display: block; color: var(--muted); font-size: 11px; }
.dashboard-stat strong { display: block; margin-top: 11px; font-size: 29px; font-weight: 700; }
.dashboard-stat small { display: block; margin-top: 5px; color: var(--soft-muted); font-size: 10px; }
.dashboard-grid { display: grid; gap: 14px; margin-top: 14px; }
.dashboard-grid-primary { grid-template-columns: minmax(0, 1.5fr) minmax(310px, 1fr); }
.dashboard-grid-secondary { grid-template-columns: 1fr 1fr; }
.dashboard-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.progress-card, .task-card { min-height: 252px; }
.compact-card { min-height: 192px; }
.dashboard-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.dashboard-card-heading h2 { margin: 0 0 4px; font-size: 19px; }
.dashboard-card-heading > div > span { color: var(--soft-muted); font-size: 10px; }
.card-caption { color: var(--soft-muted); font-size: 10px; white-space: nowrap; }
.bar-list { display: grid; gap: 13px; margin-top: 24px; }
.bar-row { display: grid; grid-template-columns: 80px minmax(0, 1fr) 18px; align-items: center; gap: 10px; }
.bar-row > span { overflow: hidden; color: #62645e; font-size: 11px; white-space: nowrap; text-overflow: ellipsis; }
.bar-row strong { color: #55574f; font-size: 11px; font-weight: 600; text-align: right; }
.bar-track { height: 7px; overflow: hidden; border-radius: 99px; background: var(--surface-deep); }
.bar-track i { display: block; height: 100%; border-radius: inherit; background: var(--sage); transition: width 260ms ease; }
.bar-track .tone-1 { background: var(--accent); }
.bar-track .tone-2 { background: #9b9b77; }
.bar-track .tone-3 { background: #b17d66; }
.upcoming-list { display: grid; margin-top: 15px; }
.upcoming-item { display: grid; grid-template-columns: 42px minmax(0, 1fr) 18px; gap: 10px; align-items: center; min-height: 47px; padding: 8px 0; border: 0; border-bottom: 1px solid var(--surface-deep); background: transparent; color: var(--ink); text-align: left; }
.upcoming-item:last-child { border-bottom: 0; }
.upcoming-item:hover, .upcoming-item.is-selected { color: var(--accent-dark); }
.upcoming-date { color: var(--accent-dark); font-size: 10px; font-weight: 700; }
.upcoming-content { min-width: 0; }
.upcoming-content strong { display: block; overflow: hidden; color: inherit; font-size: 11px; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; }
.upcoming-content small { display: block; overflow: hidden; margin-top: 3px; color: var(--soft-muted); font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
.upcoming-mark { color: #bdb9ae; font-size: 14px; text-align: right; }
.upcoming-item:hover .upcoming-mark, .upcoming-item.is-selected .upcoming-mark { color: var(--accent); }
.dashboard-empty { padding: 42px 8px; color: var(--soft-muted); font-size: 11px; text-align: center; }
.todo-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 25px; }
.todo-heading h1 { margin-bottom: 8px; font-size: 38px; }
.todo-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.todo-stat-card { min-width: 0; min-height: 112px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.todo-stat-card span { display: block; color: var(--muted); font-size: 11px; }
.todo-stat-card strong { display: block; margin-top: 9px; color: var(--ink); font-size: 29px; line-height: 1; }
.todo-stat-card small { display: block; margin-top: 9px; color: var(--soft-muted); font-size: 10px; }
.todo-layout { display: grid; grid-template-columns: minmax(300px, 0.7fr) minmax(420px, 1.3fr); gap: 16px; align-items: start; }
.todo-form, .todo-list-panel { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.todo-form { display: grid; gap: 15px; }
.todo-form-heading, .todo-list-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--surface-deep); }
.todo-form-heading h2, .todo-list-heading h2 { margin: 0; font-size: 18px; }
.todo-list-heading > div { display: flex; align-items: baseline; gap: 9px; }
.todo-list-heading span { color: var(--soft-muted); font-size: 10px; }
.todo-form > .primary-button { justify-self: start; }
.todo-list { display: grid; gap: 0; }
.todo-item { display: grid; grid-template-columns: 25px minmax(0, 1fr) auto; gap: 10px; align-items: start; min-height: 82px; padding: 15px 0; border-bottom: 1px solid var(--surface-deep); }
.todo-item:last-child { border-bottom: 0; }
.todo-check { display: grid; place-items: center; padding-top: 2px; cursor: pointer; }
.todo-check input { position: absolute; opacity: 0; pointer-events: none; }
.todo-check span { width: 17px; height: 17px; border: 1px solid #bdbbb2; border-radius: 4px; background: #fff; }
.todo-check input:checked + span { border-color: var(--sage); background: var(--sage); box-shadow: inset 0 0 0 4px #fff; }
.todo-item-main { min-width: 0; }
.todo-item-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.todo-item-title strong { color: #35372f; font-size: 14px; line-height: 1.45; }
.todo-type { padding: 2px 6px; border-radius: 4px; color: var(--accent-dark); background: var(--accent-soft); font-size: 10px; }
.todo-item-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 5px; color: var(--muted); font-size: 11px; }
.todo-item-meta .is-overdue { color: var(--accent-dark); font-weight: 700; }
.todo-item-main p { margin: 7px 0 0; color: #6d6f67; font-size: 12px; line-height: 1.55; white-space: pre-line; }
.todo-item-actions { display: flex; align-items: center; gap: 2px; }
.todo-item-actions .icon-button { width: 26px; height: 26px; font-size: 15px; }
.todo-item.is-completed .todo-item-title strong { color: var(--soft-muted); text-decoration: line-through; }
.todo-item.is-completed .todo-item-meta, .todo-item.is-completed .todo-item-main p { color: #b0afa8; }
.review-table-card { margin-top: 14px; padding-bottom: 12px; }
.table-actions { display: flex; align-items: center; gap: 10px; }
.table-actions .icon-button { width: 29px; height: 29px; font-size: 16px; }
.review-table { margin-top: 16px; border-top: 1px solid var(--surface-deep); }
.review-table-row { display: grid; grid-template-columns: minmax(250px, 2fr) 78px 98px minmax(135px, 1fr) 54px; align-items: center; gap: 14px; width: 100%; min-height: 62px; padding: 10px 4px; border: 0; border-bottom: 1px solid var(--surface-deep); background: transparent; color: var(--ink); text-align: left; }
.review-table-row:hover, .review-table-row.is-selected { background: #fcf6f1; }
.table-question { min-width: 0; }
.table-question strong { display: block; overflow: hidden; color: #45463f; font-size: 12px; line-height: 1.42; white-space: nowrap; text-overflow: ellipsis; }
.table-question small { display: block; margin-top: 4px; color: var(--soft-muted); font-size: 10px; }
.table-status { justify-self: start; border-radius: 4px; padding: 4px 6px; color: var(--sage); background: var(--sage-soft); font-size: 9px; }
.table-status.is-draft { color: #907453; background: #f1e9dc; }
.table-status.is-reviewed { color: var(--accent-dark); background: var(--accent-soft); }
.table-day { color: var(--muted); font-size: 10px; }
.table-tags { display: flex; gap: 5px; min-width: 0; overflow: hidden; }
.table-tags span { overflow: hidden; border-radius: 4px; padding: 3px 5px; color: #6c6c63; background: var(--surface-deep); font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
.table-action { color: var(--accent-dark); font-size: 10px; text-align: right; white-space: nowrap; }
.review-panel { min-height: 0; margin-top: 14px; padding: 22px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow); }
.review-panel-header { display: flex; justify-content: space-between; gap: 13px; }
.review-panel .eyebrow { color: var(--accent); }
.review-panel h2 { margin: 0; color: #383a34; font-size: 22px; line-height: 1.4; }
.review-panel .icon-button { flex: 0 0 auto; width: 30px; height: 30px; background: var(--paper); color: var(--accent-dark); font-size: 15px; }
.review-tags { display: flex; gap: 7px; margin: 16px 0 19px; }
.review-block { padding-top: 15px; border-top: 1px solid var(--surface-deep); }
.review-block span { color: var(--accent-dark); font-size: 10px; }
.review-block p { margin: 7px 0 0; color: #5d5f57; font-size: 12px; line-height: 1.75; white-space: pre-line; }
.answer-preview p { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 7; -webkit-box-orient: vertical; }
.review-keywords { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.review-complete-button { width: 100%; min-height: 39px; margin-top: 20px; border: 1px solid #df9b88; border-radius: 7px; background: #fff; color: var(--accent-dark); font-size: 11px; }
.review-complete-button:hover { background: var(--accent); color: #fff; }
.review-complete-button.is-complete { border-color: #b9c5ad; background: var(--sage-soft); color: #58684f; }
.review-empty { min-height: 240px; display: grid; place-content: center; text-align: center; }
.review-empty strong { color: #41433d; font-size: 20px; font-weight: 700; }
.review-empty span { margin-top: 8px; color: var(--soft-muted); font-size: 11px; }

@media (max-width: 1000px) {
  .sidebar { width: 210px; flex-basis: 210px; }
  .content-wrap, .topbar { padding-left: 3vw; padding-right: 3vw; }
  .detail-panel { position: static; max-height: none; min-height: 0; }
  .dashboard-metrics { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid-primary, .dashboard-grid-secondary { grid-template-columns: 1fr; }
  .todo-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .todo-layout { grid-template-columns: 1fr; }
  .review-table-row { grid-template-columns: minmax(230px, 2fr) 76px 92px minmax(110px, 1fr) 48px; gap: 10px; }
}
@media (max-width: 700px) {
  .app-shell { display: block; }
  .sidebar { width: 100%; padding: 17px 17px 12px; border-right: 0; border-bottom: 1px solid var(--line); }
  .brand { padding: 0 2px 14px; }
  .workspace-label, .sidebar-section, .sidebar-footer { display: none; }
  .primary-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .nav-item { justify-content: center; padding: 0 5px; gap: 6px; font-size: 11px; }
  .nav-count { margin-left: 1px; }
  .topbar { height: 58px; padding: 0 14px; }
  .content-wrap { padding: 31px 14px 45px; }
  .overview { display: block; padding-bottom: 30px; }
  .overview .primary-button { margin-top: 22px; width: 100%; }
  h1 { font-size: 32px; }
  .section-toolbar { display: block; }
  .library-overview { display: block; padding-bottom: 20px; }
  .library-overview h1 { font-size: 32px; }
  .library-overview .primary-button { width: 100%; margin-top: 18px; }
  .library-summary { grid-template-columns: repeat(2, 1fr); margin-bottom: 22px; }
  .library-stat { min-height: 72px; padding: 13px; }
  .bulk-actions { margin: 14px 0 0; }
  .select-all-control { display: flex; margin: 13px 0 0; }
  .toolbar-controls { margin-top: 17px; }
  .search-box { flex: 1; width: auto; }
  .select-control { width: 112px; }
  .library-add-button { min-height: 36px; padding: 0 11px; }
  .detail-panel { padding: 20px; }
  .detail-head { display: block; }
  .detail-actions { margin-top: 17px; }
  .form-row { grid-template-columns: 1fr; }
  .editor-modal, .tree-editor-modal { padding: 22px 18px; }
  .confirm-modal { padding: 20px; }
  .confirm-actions { flex-direction: column; }
  .confirm-actions button { width: 100%; }
  .dashboard-heading { display: block; padding-bottom: 24px; }
  .dashboard-heading h1 { font-size: 32px; }
  .dashboard-heading-actions { margin-top: 19px; }
  .dashboard-heading-actions .primary-button { flex: 1; }
  .todo-heading { display: block; padding-bottom: 24px; }
  .todo-heading h1 { font-size: 32px; }
  .todo-stat-card { min-height: 96px; padding: 14px; }
  .todo-stat-card strong { font-size: 25px; }
  .todo-form > .primary-button { width: 100%; }
  .todo-list-heading { align-items: start; }
  .resume-toolbar { display: block; }
  .resume-toolbar-actions { margin-top: 18px; }
  .resume-workspace { grid-template-columns: 1fr; }
  .resume-preview { min-height: 0; padding: 28px 24px; }
  .resume-preview-photo { width: 60px; height: 89px; }
  .resume-form-grid { grid-template-columns: 1fr; }
  .dashboard-stat { min-height: 96px; padding: 16px; }
  .dashboard-stat strong { font-size: 25px; }
  .dashboard-card { padding: 16px; }
  .progress-card, .task-card, .compact-card { min-height: 0; }
  .bar-row { grid-template-columns: 76px minmax(0, 1fr) 18px; gap: 8px; }
  .review-table-card { overflow: hidden; }
  .review-table-row { grid-template-columns: minmax(0, 1fr) 62px; gap: 10px; min-height: 58px; }
  .table-day, .table-tags, .table-action { display: none; }
  .table-status { justify-self: end; }
}

@media print {
  @page { size: 652pt 964pt; margin: 0; }
  html, body { width: 652pt; min-width: 0; height: 964pt; margin: 0; background: #fff; }
  body.print-resume { background: #fff; }
  body.print-resume .sidebar,
  body.print-resume .topbar,
  body.print-resume .resume-toolbar,
  body.print-resume .resume-form { display: none !important; }
  body.print-resume .app-shell,
  body.print-resume .main-content { display: block; min-height: 0; }
  body.print-resume .content-wrap { width: 652pt; max-width: none; padding: 0; margin: 0; }
  body.print-resume .resume-section { display: block !important; }
  body.print-resume .resume-workspace { display: block; }
  body.print-resume .resume-preview { width: 652pt; min-height: 964pt; padding: 22pt 28pt 26pt; border: 0; border-radius: 0; box-shadow: none; }
  body.print-resume .resume-preview-header { min-height: 130pt; padding-right: 110pt; }
  body.print-resume .resume-preview-header h2 { font-size: 27pt; }
  body.print-resume .resume-preview-contact { right: 112pt; bottom: 16pt; font-size: 11pt; }
  body.print-resume .resume-preview-title { font-size: 11pt; }
  body.print-resume .resume-preview-content { font-size: 10pt; line-height: 1.45; }
  body.print-resume .resume-preview-section { padding-top: 8pt; }
  body.print-resume .resume-preview-section h3 { margin-bottom: 5pt; font-size: 13pt; }
  body.print-resume .resume-preview-photo { width: 92pt; height: 128pt; }
}