:root {
  --navy: #0d2238;
  --navy-soft: #183a57;
  --blue: #2b66a1;
  --blue-light: #e9f1f8;
  --ink: #142b40;
  --muted: #62788d;
  --line: #dce6ee;
  --canvas: #f3f6f9;
  --card: #ffffff;
  --success: #117a55;
  --danger: #c33128;
  --shadow: 0 12px 34px rgba(18, 43, 64, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 94px; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: Inter, Aptos, Arial, sans-serif; }
button, input, textarea, select { font: inherit; }
button { border: 0; border-radius: 10px; padding: 11px 15px; color: #fff; background: var(--blue); font-weight: 750; cursor: pointer; transition: transform .15s, background .15s, box-shadow .15s; }
button:hover { background: #215582; transform: translateY(-1px); box-shadow: 0 5px 12px rgba(29, 78, 121, .17); }
button:disabled { cursor: wait; opacity: .58; transform: none; box-shadow: none; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 12px; color: var(--ink); background: #fff; transition: border .15s, box-shadow .15s; }
textarea { resize: vertical; min-height: 48px; }
input:focus, textarea:focus, select:focus { outline: 0; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(43, 102, 161, .14); }

.app-shell { width: min(1120px, calc(100% - 36px)); margin: 0 auto; padding: 20px 0 72px; }
.topbar { display: flex; align-items: center; justify-content: space-between; min-height: 52px; margin-bottom: 18px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--navy); font-size: 1.08rem; font-weight: 850; letter-spacing: -.02em; }
.brand small { display: block; margin-top: 1px; color: var(--muted); font-size: .67rem; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.brand-mark { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(145deg, #2d6da8, #123454); box-shadow: 0 5px 12px rgba(22, 61, 94, .24); }
.secure-badge { border: 1px solid #cbdce9; border-radius: 999px; padding: 7px 10px; color: var(--navy-soft); background: #fafdff; font-size: .76rem; font-weight: 750; }

.hero-card { position: relative; overflow: hidden; padding: 39px 42px; border-radius: 22px; color: #fff; background: linear-gradient(120deg, #0d2238 0%, #173f60 57%, #286b9f 130%); box-shadow: var(--shadow); }
.hero-card::after { content: ''; position: absolute; top: -90px; right: -60px; width: 290px; height: 290px; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; box-shadow: -42px 42px 0 rgba(255,255,255,.035), -84px 84px 0 rgba(255,255,255,.02); }
.eyebrow, .section-label { margin: 0 0 9px; color: #9ec8e7; font-size: .71rem; font-weight: 850; letter-spacing: .12em; }
.hero-card h1 { max-width: 670px; margin: 0; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.06; letter-spacing: -.045em; }
.subtitle { max-width: 610px; margin: 14px 0 0; color: #d5e4f0; line-height: 1.55; }
.focus-strip { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; width: fit-content; max-width: 100%; margin-top: 25px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.18); border-radius: 11px; background: rgba(4, 23, 40, .24); }
.focus-strip span { color: #a7cde8; font-size: .78rem; font-weight: 750; white-space: nowrap; }.focus-strip strong { font-size: .88rem; }
.hero-actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }.hero-actions a { padding: 8px 11px; border: 1px solid rgba(255,255,255,.24); border-radius: 9px; color: #fff; background: rgba(255,255,255,.08); font-size: .81rem; font-weight: 780; text-decoration: none; transition: background .15s, transform .15s; }.hero-actions a:hover { background: rgba(255,255,255,.16); transform: translateY(-1px); }

.workspace-nav { position: sticky; z-index: 4; top: 10px; display: flex; align-items: center; gap: 6px; margin: 14px 0 4px; padding: 8px; overflow-x: auto; border: 1px solid rgba(208, 222, 232, .96); border-radius: 14px; background: rgba(255,255,255,.92); box-shadow: 0 10px 24px rgba(19, 51, 76, .08); backdrop-filter: blur(12px); scrollbar-width: none; }.workspace-nav::-webkit-scrollbar { display: none; }.workspace-nav a { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 9px; color: #4c657a; font-size: .8rem; font-weight: 780; text-decoration: none; transition: background .15s, color .15s; }.workspace-nav a span { color: #7d99ae; font-size: .67rem; font-variant-numeric: tabular-nums; }.workspace-nav a:hover { color: var(--navy); background: #f0f6fa; }.workspace-nav a.is-active { color: #fff; background: var(--blue); box-shadow: 0 4px 10px rgba(43,102,161,.2); }.workspace-nav a.is-active span { color: #dceeff; }

.card { margin-top: 18px; padding: 25px; border: 1px solid rgba(210, 223, 233, .9); border-radius: 18px; background: var(--card); box-shadow: 0 7px 22px rgba(23, 49, 68, .035); }.workspace-section { scroll-margin-top: 94px; }.workspace-group { margin-top: 18px; }.workspace-group > .card { margin-top: 0; }.workspace-group > .card + .card { margin-top: 10px; }.workspace-hidden { display: none !important; }
.card h2 { margin: 0; font-size: 1.22rem; letter-spacing: -.02em; }.card h3 { margin: 26px 0 10px; font-size: 1rem; }
.card > p, .card > div > p { color: var(--muted); line-height: 1.5; }
.section-label { color: var(--blue); }

.profile-card { padding: 0; overflow: hidden; border-top: 3px solid #83afd3; }.profile-card summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 19px 25px; cursor: pointer; list-style: none; }.profile-card summary::-webkit-details-marker { display: none; }.profile-card summary:hover { background: #fafcff; }.summary-hint { color: var(--blue); font-size: .83rem; font-weight: 800; }.summary-hint::after { content: '⌄'; display: inline-block; margin-left: 7px; transition: transform .2s; }.profile-card[open] .summary-hint::after { transform: rotate(180deg); }.profile-content { padding: 0 25px 25px; border-top: 1px solid var(--line); }.profile-content > p { margin: 16px 0; }
.profile-form, .action-form { display: grid; gap: 12px; }.profile-form label, .action-form > label { display: grid; gap: 6px; font-size: .86rem; font-weight: 750; }.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.upload-card { display: grid; grid-template-columns: 1fr auto; gap: 22px; align-items: center; }.upload-card > div p { max-width: 620px; }.file-picker { display: inline-block; }.file-picker input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }.file-picker span { display: inline-block; border-radius: 10px; padding: 11px 15px; color: var(--blue); background: var(--blue-light); font-weight: 800; cursor: pointer; }.file-picker span:hover { background: #dbeaf6; }
.status { min-height: 1.4em; margin: 0; color: var(--blue); font-size: .9rem; font-weight: 700; }.error { color: var(--danger) !important; }
.section-heading { display: flex; align-items: start; justify-content: space-between; gap: 16px; }.button-secondary { color: var(--blue); background: var(--blue-light); }.button-secondary:hover { color: #174c78; background: #dcebf7; }
.book-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; max-height: 265px; margin-top: 17px; overflow: auto; padding-right: 3px; }.book-row { display: flex; align-items: start; justify-content: space-between; gap: 12px; min-height: 72px; padding: 13px; border: 1px solid #e5edf3; border-radius: 12px; background: #fbfdff; }.book-row strong { display: block; line-height: 1.27; }.book-row span { display: block; margin-top: 5px; color: var(--muted); font-size: .79rem; }.book-status { flex: 0 0 auto; margin: 0 !important; color: var(--success) !important; font-size: .73rem !important; font-weight: 800; }

.ask-card { border-top: 4px solid var(--blue); }.ask-card form { margin-top: 16px; }.ask-card label { display: grid; gap: 6px; font-size: .86rem; font-weight: 750; }.book-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 232px; overflow: auto; padding: 3px; }.book-choice { display: grid !important; grid-template-columns: 18px 1fr; gap: 3px 8px !important; align-items: start; min-height: 66px; padding: 10px; border: 1px solid #e1eaf1; border-radius: 11px; color: var(--ink); background: #fbfdff; cursor: pointer; transition: border .15s, background .15s; }.book-choice:has(input:checked) { border-color: #85b0d2; background: #edf6fc; }.book-choice input { grid-row: span 2; width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--blue); }.book-choice span { overflow: hidden; font-size: .85rem; font-weight: 760; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }.book-choice small { color: var(--muted); font-size: .72rem; }.book-filter-actions, .form-actions, .result-actions, .export-actions, .prompt-chips { display: flex; flex-wrap: wrap; gap: 8px; }.book-filter-actions button, .prompt-chips button, .export-actions button { padding: 8px 11px; font-size: .83rem; }.field-help { margin: -2px 0 3px; color: var(--muted); font-size: .82rem; line-height: 1.4; }.prompt-chips { padding-top: 2px; }.prompt-chips button { border: 1px solid #d4e2ec; color: var(--navy-soft); background: #fff; }.prompt-chips button:hover { background: #eff6fb; }

.result-card { border-top: 4px solid #4d95ca; }.answer-text { color: #1a344b; line-height: 1.68; }.answer-text p { margin: 0 0 16px; }.answer-text strong { color: var(--navy); font-size: 1.04em; }.citation-link { display: inline; padding: 0 2px; border: 0; border-radius: 0; color: var(--blue); background: transparent; font: inherit; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }.citation-link:hover { color: #174a7d; background: transparent; box-shadow: none; }.result-actions { margin-top: 20px; }.export-actions { align-items: center; margin-top: 14px; padding: 12px; border-radius: 11px; color: var(--ink); background: var(--blue-light); font-size: .88rem; font-weight: 750; }.source-list { display: grid; gap: 10px; }.source-card { padding: 15px; border-left: 4px solid #8db8d8; border-radius: 0 11px 11px 0; background: #f3f8fc; transition: background .2s, box-shadow .2s; }.source-card.source-highlight { background: #dcefe4; box-shadow: 0 0 0 3px #96cbaa; }.source-card p { margin: 9px 0; color: #35526a; line-height: 1.48; }.source-topline { display: flex; justify-content: space-between; gap: 12px; }.source-topline span, small { color: var(--muted); }.hidden { display: none !important; }.empty-state { color: var(--muted); }

.planning-card { border-top: 4px solid #8aa9c3; }.action-inputs { display: flex; align-items: end; gap: 10px; }.action-inputs label { flex: 1; display: grid; gap: 6px; font-size: .86rem; font-weight: 750; }.action-list, .memory-list { display: grid; gap: 8px; margin-top: 14px; }.action-row, .memory-row { padding: 14px; border: 1px solid #e5edf3; border-radius: 12px; background: #fbfdff; }.action-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.action-row strong, .action-row span { display: block; }.action-row span { margin-top: 4px; color: var(--muted); font-size: .83rem; }.action-row.done { opacity: .68; }.done-label { color: var(--success) !important; font-weight: 800; }.memory-row strong { color: var(--blue); font-size: .75rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.memory-row p { margin: 7px 0 0; line-height: 1.48; }
.development-card { border-top: 4px solid #6e9fc7; }.development-intro { max-width: 660px; margin: 10px 0 0; }.development-import-form { display: flex; flex-wrap: wrap; align-items: center; justify-content: end; gap: 8px; }.compact-picker span { padding: 10px 12px; font-size: .84rem; }.development-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 17px 0; }.development-stat { padding: 11px 12px; border: 1px solid #dbe8f1; border-radius: 11px; background: linear-gradient(155deg, #f7fbfe, #edf5fa); }.development-stat strong, .development-stat span { display: block; }.development-stat strong { color: var(--navy); font-size: 1.22rem; letter-spacing: -.03em; }.development-stat span { margin-top: 2px; color: var(--muted); font-size: .74rem; font-weight: 700; }.development-filters { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr auto; gap: 8px; align-items: center; margin: 16px 0 19px; padding: 12px; border: 1px solid #e1ebf2; border-radius: 13px; background: #f9fcfe; }.development-filters input, .development-filters select { padding: 10px; font-size: .86rem; }.filter-check { display: flex; align-items: center; gap: 7px; color: var(--navy-soft); font-size: .79rem; font-weight: 760; white-space: nowrap; }.filter-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }.development-layout { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.25fr); gap: 20px; }.development-layout > div + div { padding-left: 20px; border-left: 1px solid var(--line); }.subsection-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }.subsection-heading h3 { margin: 0 0 11px; }.subsection-heading span { color: var(--muted); font-size: .76rem; text-align: right; }.recommendation-list, .development-library-list { display: grid; gap: 9px; }.recommendation-card, .development-book { border: 1px solid #e2ebf2; border-radius: 12px; background: #fbfdff; }.recommendation-card { display: grid; grid-template-columns: 27px 1fr; gap: 10px; padding: 13px; }.recommendation-number { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); font-size: .78rem; font-weight: 850; }.recommendation-card h4, .development-book h4 { margin: 0; color: var(--navy); font-size: .93rem; line-height: 1.28; }.recommendation-card p { margin: 7px 0; color: #3d596f; font-size: .83rem; line-height: 1.42; }.recommendation-meta { color: var(--muted) !important; font-size: .76rem !important; font-weight: 700; }.development-book { padding: 13px; }.development-book-topline { display: flex; align-items: start; justify-content: space-between; gap: 12px; }.development-book-topline p { margin: 5px 0 0; color: var(--muted); font-size: .76rem; }.catalog-status { flex: 0 0 108px; width: 108px; padding: 8px; color: var(--blue); background: #f2f8fc; font-size: .78rem; font-weight: 760; }.catalog-badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }.catalog-badge { display: inline-block; padding: 3px 7px; border-radius: 999px; color: #426075; background: #eef4f8; font-size: .7rem; font-weight: 800; }.catalog-badge.must-read { color: #8c5e00; background: #fff4d5; }.catalog-badge.strength-badge { color: #175d8c; background: #e1f1fb; }.development-description { margin: 10px 0; color: #385369; font-size: .82rem; line-height: 1.43; }.catalog-source { padding: 8px 9px; border-left: 3px solid #b8cbd9; color: var(--muted); background: #f5f9fc; font-size: .75rem; line-height: 1.36; }.catalog-source.ready { border-left-color: #45a27c; color: #176b4c; background: #edf9f3; }
.auth-gate { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: 22px; background: rgba(9, 27, 44, .72); backdrop-filter: blur(8px); }.login-card { width: min(100%, 410px); display: grid; gap: 14px; padding: 30px; border-radius: 19px; color: var(--ink); background: #fff; box-shadow: 0 24px 80px rgba(0, 0, 0, .28); }.login-card .brand-mark { margin-bottom: 5px; }.login-card h1 { margin: 0; font-size: 1.65rem; letter-spacing: -.03em; }.login-card p { margin: 0; color: var(--muted); line-height: 1.5; }.login-card label { display: grid; gap: 6px; color: var(--ink); font-size: .86rem; font-weight: 750; }

@media (max-width: 720px) {
  .app-shell { width: min(100% - 24px, 1120px); padding-top: 12px; }.secure-badge { display: none; }.hero-card { padding: 29px 22px; border-radius: 17px; }.hero-card h1 { font-size: 2.15rem; }.focus-strip { align-items: flex-start; flex-direction: column; gap: 4px; }.hero-actions { align-items: stretch; flex-direction: column; }.hero-actions a { text-align: center; }.workspace-nav { top: 5px; margin-top: 11px; border-radius: 12px; }.workspace-nav a { padding: 8px 9px; font-size: .76rem; }.card { padding: 19px; border-radius: 15px; }.profile-card { padding: 0; }.profile-card summary { padding: 17px 19px; }.profile-content { padding: 0 19px 19px; }.profile-grid, .book-list, .book-picker, .development-layout { grid-template-columns: 1fr; }.upload-card { grid-template-columns: 1fr; }.development-import-form { justify-content: start; }.development-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }.development-filters { grid-template-columns: 1fr; }.development-layout > div + div { padding: 17px 0 0; border-top: 1px solid var(--line); border-left: 0; }.subsection-heading { align-items: start; flex-direction: column; gap: 2px; }.subsection-heading span { text-align: left; }.book-list { max-height: 310px; }.action-inputs, .action-row, .source-topline, .development-book-topline { align-items: stretch; flex-direction: column; }.catalog-status { flex: auto; width: 100%; }.form-actions button { width: 100%; }.result-actions button { flex: 1; }.export-actions { align-items: stretch; flex-direction: column; }.export-actions button { width: 100%; }
}
