:root {
  --paper: oklch(97.5% .008 145); --surface: oklch(99.2% .003 145);
  --ink: oklch(27% .022 145); --muted: oklch(48% .022 145);
  --line: oklch(86% .016 145); --accent: oklch(38% .07 150);
  --tint: oklch(93% .028 145); --warning: oklch(42% .095 65);
  --danger: oklch(43% .12 27); --space-sm: .5rem; --space-md: 1rem; --space-lg: 1.5rem;
  font-family: "Avenir Next", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  color: var(--ink); background: var(--paper); font-size: 15px;
}
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button, a, input, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
button, .button-link { border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .65rem 1rem; border-radius: 5px; font-weight: 600; text-decoration: none; }
button:hover:not(:disabled), .button-link:hover { background: var(--tint); }
button.primary { background: var(--accent); color: var(--surface); border-color: var(--accent); }
button.primary:hover:not(:disabled) { background: oklch(31% .065 150); }
button.quiet { background: transparent; border-color: transparent; }
button.danger { color: var(--danger); }
button.small { padding: .35rem .65rem; font-size: .85rem; }
a { color: var(--accent); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid oklch(66% .105 150); outline-offset: 3px; }
input, select, textarea { border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 4px; padding: .65rem .75rem; width: 100%; }
textarea { resize: vertical; min-height: 6rem; line-height: 1.7; }
input[type=checkbox] { width: 1rem; height: 1rem; accent-color: var(--accent); flex-shrink: 0; }
input[type=color] { height: 2.75rem; padding: .25rem; }
label.field { display: grid; gap: .4rem; font-size: .9rem; font-weight: 600; }
.field small { font-weight: 400; }
fieldset { border: 1px solid var(--line); border-radius: 4px; padding: var(--space-md); min-width: 0; }
legend { padding: 0 .4rem; font-size: .88rem; color: var(--muted); }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 1.75rem; letter-spacing: -.045em; line-height: 1.3; }
h2 { font-size: 1.3rem; letter-spacing: -.03em; line-height: 1.4; }
h3 { font-size: 1rem; line-height: 1.5; }
p { line-height: 1.7; }
small, .small-text { font-size: .84rem; line-height: 1.6; }
.muted, small { color: var(--muted); }
.eyebrow { font-size: .73rem; font-weight: 700; letter-spacing: .1em; color: var(--muted); }
.stack { display: grid; gap: var(--space-md); }
.row { display: flex; gap: var(--space-sm); align-items: center; flex-wrap: wrap; }
.usage-balances { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; padding: 1.3rem 0; margin: 0; border-block: 1px solid var(--line); }
.usage-balances dt { color: var(--muted); font-size: .85rem; }
.usage-balances dd { margin: .5rem 0 0; font-size: 1.35rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.usage-table-wrap { overflow-x: auto; min-width: 0; }
.source-cell-grid { min-width: 640px; }
.usage-table { width: 100%; border-collapse: collapse; text-align: left; font-size: .88rem; font-variant-numeric: tabular-nums; }
.usage-table th { color: var(--muted); font-weight: 500; }
.usage-table td, .usage-table th { padding: .7rem .55rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.usage-table td { overflow-wrap: anywhere; }
.usage-table input { min-width: 9rem; }
.usage-table label.field { font-size: .73rem; }
.usage-quote, .usage-receipt { padding: 1.2rem; border: 1px solid var(--line); background: var(--tint); }
#usage-month-form .field { max-width: 12rem; }
.between { justify-content: space-between; }
.grow { flex: 1; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
.version-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; }
.version-pair > section { min-width: 0; overflow-wrap: anywhere; }
.version-block { border-bottom: 1px solid var(--line); padding: .8rem 0; }
@media(max-width:720px) { .version-pair { grid-template-columns: minmax(0,1fr); } }
.full { grid-column: 1 / -1; }
.check { display: flex; align-items: flex-start; gap: .6rem; font-size: .88rem; font-weight: 400; line-height: 1.6; }
.check input { margin-top: .25rem; }
.initial { padding: 3rem; }
.skip-link { position: absolute; top: -5rem; left: 1rem; z-index: 20; background: var(--surface); padding: 1rem; }
.skip-link:focus { top: .5rem; }
.brand { font-family: "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif; font-weight: 700; font-size: 1.65rem; letter-spacing: -.04em; color: var(--ink); }
.brand-mark { display: inline-grid; place-items: center; width: 2rem; height: 2rem; margin-right: .65rem; background: var(--accent); color: var(--surface); font-size: 1.35rem; vertical-align: middle; }
.brand-word { margin-left: .7rem; font-family: "Baskerville", "Palatino Linotype", serif; font-size: .5em; font-weight: 400; letter-spacing: .22em; opacity: .75; }
.topbar { display: flex; align-items: center; justify-content: space-between; min-height: 4.7rem; padding: .8rem 2rem; border-bottom: 1px solid var(--line); background: var(--surface); gap: 1rem; }
.topbar .identity { font-size: .83rem; }
.workspace-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); min-height: calc(100vh - 4.7rem); }
.sidebar { padding: 1.6rem 1rem; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 1.6rem; }
.sidebar section { display: grid; gap: .6rem; }
.sidebar label { font-size: .76rem; color: var(--muted); }
.project-list { display: grid; gap: .3rem; }
.project-link { display: block; border: 0; background: transparent; text-align: left; padding: .7rem; font-size: .91rem; font-weight: 500; }
.project-link[aria-current=true] { background: var(--tint); font-weight: 700; }
.sidebar-footer { margin-top: auto; font-size: .8rem; color: var(--muted); line-height: 1.7; }
.main-area { min-width: 0; }
.project-heading { padding: 1.8rem 2rem 1.2rem; display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.tabs { display: flex; gap: 1.5rem; padding: 0 2rem; border-bottom: 1px solid var(--line); overflow-x: auto; }
.tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; padding: .85rem .1rem; white-space: nowrap; font-size: .9rem; }
.tabs button[aria-current=page] { border-bottom-color: var(--accent); color: var(--accent); }
.view { padding: 1.8rem 2rem; }
.view.narrow { max-width: 1050px; }
.lead { max-width: 68ch; color: var(--muted); font-size: .92rem; }
.section-heading { margin-bottom: 1.5rem; display: grid; gap: .5rem; }
.rule { height: 1px; background: var(--line); margin: .4rem 0; }
.status { display: inline-flex; align-items: center; gap: .3rem; padding: .2rem .5rem; background: var(--tint); color: var(--accent); font-size: .75rem; border-radius: 3px; white-space: nowrap; }
.status.warn { color: var(--warning); background: oklch(95% .03 80); }
.status.bad { color: var(--danger); background: oklch(95% .025 30); }
.status.neutral { color: var(--muted); background: oklch(93% .008 145); }
.banner, .error-box { padding: .85rem 1rem; border: 1px solid var(--line); background: var(--surface); border-radius: 4px; font-size: .9rem; line-height: 1.7; }
.error-box { border-color: oklch(75% .055 30); color: var(--danger); }
.empty { padding: 3rem 1rem; display: grid; gap: .8rem; text-align: center; }
.empty p { max-width: 55ch; justify-self: center; color: var(--muted); }
.empty .row { justify-content: center; }
.document-layout { display: grid; grid-template-columns: minmax(230px, .7fr) minmax(0, 1.6fr); gap: 2rem; }
.document-list { display: grid; gap: .5rem; align-content: start; }
.document-item { text-align: left; display: grid; gap: .6rem; padding: 1rem; }
.document-item[aria-current=true] { background: var(--tint); border-color: var(--accent); }
.document-item .next-step { color: var(--accent); font-weight: 600; }
.source-unit { padding: 1.2rem 0; border-bottom: 1px solid var(--line); }
.source-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .92rem; line-height: 1.85; margin-top: .5rem; }
.source-scroll { max-height: 65vh; overflow: auto; padding-right: 1rem; }
.upload-form { display: grid; grid-template-columns: 1fr 1.8fr auto; gap: .75rem; align-items: end; }
.item-editor { display: grid; gap: 1rem; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.item-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.columns { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.strategy-text { white-space: pre-wrap; font-size: .92rem; line-height: 1.8; }
.workbench { display: grid; grid-template-columns: 220px minmax(380px, 1fr) minmax(270px, .66fr); gap: 0; min-height: 650px; border-bottom: 1px solid var(--line); }
.outline { background: oklch(96% .012 145); padding: 1.3rem 1rem; border-right: 1px solid var(--line); min-width: 0; }
.slide-list { display: grid; gap: .65rem; margin: 1rem 0; }
.slide-item { text-align: left; padding: .8rem; border-radius: 4px; display: grid; gap: .5rem; }
.slide-item[aria-current=true] { border-color: var(--accent); background: var(--tint); }
.slide-mini { aspect-ratio: 16/9; background: var(--surface); border: 1px solid var(--line); padding: .65rem; display: grid; align-content: start; gap: .3rem; overflow: hidden; }
.slide-mini strong { font-size: .73rem; line-height: 1.4; }
.slide-mini span { font-size: .62rem; line-height: 1.5; color: var(--muted); overflow: hidden; max-height: 2.9rem; }
.slide-index { font-size: .75rem; color: var(--muted); }
.editor { padding: 1.4rem 1.5rem 2rem; min-width: 0; }
.editor textarea[name=body] { min-height: 19rem; line-height: 1.9; }
.editor input[name=title] { font-size: 1.25rem; font-weight: 600; }
.editor-tools { margin-bottom: 1.5rem; position: sticky; top: 0; background: var(--paper); padding: .5rem 0; z-index: 2; }
.review-panel { padding: 1.4rem 1.2rem; border-left: 1px solid var(--line); min-width: 0; background: var(--surface); }
.coverage-list { display: grid; margin-top: 1rem; }
.coverage-item { padding: 1rem 0; border-bottom: 1px solid var(--line); display: grid; gap: .55rem; }
.coverage-item button { text-align: left; padding: 0; background: none; border: 0; font-size: .92rem; font-weight: 600; }
.coverage-item .note { font-size: .82rem; color: var(--muted); }
.coverage-select { font-size: .85rem; }
.coverage-item textarea { font-size: .84rem; min-height: 4.3rem; }
.review-controls { display: grid; gap: .75rem; padding-top: 1.2rem; }
.slide-preview { aspect-ratio: 16/9; border: 1px solid var(--line); background: var(--surface); padding: 2rem; display: grid; grid-template-rows: auto 1fr auto; gap: 1rem; overflow: hidden; }
.slide-preview h2 { color: var(--accent); font-size: 1.4rem; }
.slide-preview .preview-body { white-space: pre-wrap; line-height: 1.8; font-size: .95rem; overflow: hidden; }
.preview-footer { display: flex; justify-content: space-between; font-size: .7rem; color: var(--muted); }
.history-item { padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.history-item summary { cursor: pointer; display: flex; gap: 1rem; align-items: center; }
.history-content { padding: 1.2rem 0 0; }
.auth-layout { display: grid; grid-template-columns: 1.1fr 1fr; min-height: 100vh; }
.auth-story { background: var(--accent); color: var(--surface); padding: 3rem 4rem; display: flex; flex-direction: column; justify-content: space-between; gap: 4rem; }
.auth-story .brand { color: var(--surface); }
.auth-story .brand-mark { background: var(--surface); color: var(--accent); }
.auth-story h1 { font-size: 2.5rem; letter-spacing: -.05em; line-height: 1.45; max-width: 15ch; }
.auth-story p { color: oklch(88% .028 145); max-width: 39ch; margin-top: 1.5rem; }
.auth-steps { display: flex; gap: 1.5rem; font-size: .85rem; color: oklch(88% .028 145); }
.auth-form-wrap { display: grid; place-items: center; padding: 2rem; }
.auth-form { width: min(100%, 360px); }
.auth-form .brand { display: none; }
#notice { position: fixed; bottom: 1.5rem; right: 1.5rem; background: var(--ink); color: var(--surface); padding: .9rem 1.2rem; border-radius: 5px; max-width: min(540px, calc(100vw - 3rem)); font-size: .9rem; box-shadow: 0 5px 20px oklch(20% .02 145 / .15); z-index: 10; pointer-events: none; }
#notice.error { background: var(--danger); }
.token-output { word-break: break-all; padding: .8rem; border: 1px solid var(--line); }
.source-detail { font-size: .86rem; }
.conflict { border: 1px solid oklch(74% .075 65); background: oklch(97% .015 80); padding: 1rem; border-radius: 4px; display: grid; gap: 1rem; }
.conflict pre { white-space: pre-wrap; font-family: inherit; font-size: .85rem; max-height: 12rem; overflow: auto; }
.save-state { font-size: .82rem; color: var(--muted); }
.save-state.changed { color: var(--warning); }
@media (min-width: 1600px) { .workbench { grid-template-columns: 250px minmax(480px, 1fr) 370px; } .editor { padding: 1.7rem 2.5rem; } }
@media (max-width: 1200px) { .workspace-layout { grid-template-columns: 190px minmax(0,1fr); } .workbench { grid-template-columns: 170px minmax(0,1fr); } .review-panel { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); } .coverage-list { grid-template-columns: 1fr 1fr; gap: 0 1.5rem; } .auth-story { padding: 3rem; } }
@media (max-width: 850px) { .workspace-layout { display: block; } .sidebar { border-right: 0; border-bottom: 1px solid var(--line); padding: 1rem; gap: 1rem; } .sidebar section { display: flex; flex-wrap: wrap; align-items: center; } .sidebar select { width: auto; min-width: 140px; } .project-list { display: flex; overflow-x: auto; max-width: 100%; } .project-link { white-space: nowrap; } .sidebar-footer { display: none; } .topbar { padding: .8rem 1rem; } .project-heading, .view { padding: 1.4rem 1rem; } .tabs { padding: 0 1rem; } .document-layout, .columns { grid-template-columns: 1fr; } .auth-layout { grid-template-columns: 1fr; } .auth-story { display: none; } .auth-form .brand { display: block; margin-bottom: 2rem; } }
@media (max-width: 580px) { :root { font-size: 14px; } .topbar .identity { display: none; } .workbench { display: block; } .outline { border-right: 0; border-bottom: 1px solid var(--line); } .slide-list { grid-template-columns: repeat(2, minmax(0,1fr)); max-height: 260px; overflow: auto; } .editor, .review-panel { padding: 1rem; } .coverage-list, .form-grid { grid-template-columns: 1fr; } .upload-form { grid-template-columns: 1fr; } .slide-preview { padding: 1.2rem; } .slide-preview h2 { font-size: 1.15rem; } .slide-preview .preview-body { font-size: .8rem; } .project-heading { flex-wrap: wrap; } .auth-steps { flex-wrap: wrap; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }

/* RFP interpretation: source-linked lists, with optional constraints folded away. */
.rfp-view { max-width: 1180px; }
.rfp-overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; padding:1rem 0 1.4rem; }
.rfp-overview div { display:grid; gap:.3rem; border-bottom:2px solid var(--line); padding-bottom:.8rem; }
.rfp-overview strong { font-size:1.65rem; font-variant-numeric:tabular-nums; }
.rfp-overview span { color:var(--muted); font-size:.85rem; }
.rfp-sections { margin-top:1rem; }
.rfp-sections > details { border-top:1px solid var(--line); }
.rfp-sections summary { padding:1rem 0; cursor:pointer; font-weight:600; }
.rfp-sections summary span { float:right; font-size:.85rem; }
.rfp-group-content { padding:0 0 1.5rem; }
.rfp-item { background:var(--surface); }
.rfp-source-links { display:grid; gap:.5rem; overflow-wrap:anywhere; }
.source-picker {width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);color:inherit;padding:24px;}
.source-picker::backdrop {background:rgb(0 0 0 / .35);}
.source-picker-result {display:flex;align-items:start;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);}
.source-picker-result p {margin:0;min-width:0;overflow-wrap:anywhere;}
.source-picker-result button {flex-shrink:0;}
@media(max-width:600px){.source-picker{padding:16px;}.source-picker-result{flex-direction:column;}}
.rfp-save-bar { position:static; background:var(--paper); padding:.9rem 0; border-top:1px solid var(--line); z-index:2; }
.rfp-review { border-top:1px solid var(--line); margin-top:1.5rem; padding-top:1.5rem; }
@media(max-width:580px) { .rfp-overview { grid-template-columns:1fr 1fr; } }
/* Storyboard cards keep allocation visible while details remain optional. */
.board-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,350px),1fr));gap:20px;align-items:start}
#board-operation-form label[hidden] {display:none}
.board-card {min-width:0;background:var(--surface,#fff);border:1px solid var(--line,#d8ded8);border-radius:12px;padding:22px;display:grid;gap:14px}
.board-card h3 {overflow-wrap:anywhere;line-height:1.4;margin:0}
.board-card p {margin:0;overflow-wrap:anywhere}
.board-tools {flex-wrap:wrap;gap:8px}
.board-slot {border-top:1px solid var(--line,#d8ded8);padding:12px 0}
.board-slot summary {display:flex;justify-content:space-between;gap:12px;cursor:pointer;overflow-wrap:anywhere}
.board-slot summary span:first-child {flex:1;min-width:0}
.board-slot summary span:last-child {font-size:11px;flex-shrink:0}
.board-detail {padding-top:16px;min-width:0}
.board-detail .form-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
.board-links {display:grid;gap:8px;max-height:250px;overflow:auto}
.board-links .check {overflow-wrap:anywhere}
.board-section-edit>summary {cursor:pointer;font-size:13px}
.board-blockers {font-size:13px;line-height:1.8;padding-left:20px}
.board-view .rfp-overview {margin:24px 0 12px}
.board-view>form {margin-top:24px}
@media(max-width:600px){.board-card{padding:16px}.board-slot summary{flex-wrap:wrap}.board-slot summary span:last-child{flex-shrink:1}}

.deck-preview { width:100%; height:660px; border:1px solid var(--line); background:#edf0ed; }
[data-deck-block] { min-width:0; }
[data-deck-block] .check { overflow-wrap:anywhere; }
[data-deck-block] textarea { min-height:100px; }

.ai-result {border:1px solid var(--line);padding:24px;min-width:0;border-radius:8px;}
.ai-result p,.ai-result li {overflow-wrap:anywhere;}
.ai-block-review {margin-block:12px 20px;}
.ai-block-review table {width:100%;border-collapse:collapse;font-size:14px;}
.ai-block-review th,.ai-block-review td {text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
.ai-block-review th {background:var(--tint);}
.ai-block-review h5 {font-size:14px;margin-block:12px;}
.ai-source {white-space:pre-wrap;overflow-wrap:anywhere;max-height:400px;overflow:auto;font-size:12px;}
@media(max-width:600px){.ai-result{padding:16px}.ai-result>.row{flex-wrap:wrap}}

.section-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:12px;}
.section-grid > * {min-width:0;}
.section-grid strong,.section-grid small {overflow-wrap:anywhere;}
#evidence-agenda-form .board-card,#evidence-source-form {margin:16px 0;min-width:0;}
#evidence-agenda-form fieldset {min-width:0;}
#evidence-source-form .source-text {white-space:pre-wrap;max-height:240px;overflow:auto;overflow-wrap:anywhere;}
[hidden] {display:none !important;}

/* Conditions and claims can be compared without leaving the storyboard editor. */
.response-map-item {border-bottom:1px solid var(--line);min-width:0;}
.response-map-item>summary {display:flex;justify-content:space-between;gap:12px;cursor:pointer;padding:12px 0;overflow-wrap:anywhere;}
.response-map-item>summary small {color:var(--muted);flex-shrink:0;}
.response-plan-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px;}
.response-plan-grid>div,.response-slide {min-width:0;}
.response-map-item h4 {margin:0;overflow-wrap:anywhere;}
.response-map-item .source-text {margin:0;max-inline-size:72ch;overflow-wrap:anywhere;}
.response-slide {border-top:1px solid var(--line);padding-top:16px;}
.response-location {align-items:end;flex-wrap:wrap;}
@media(max-width:600px){.response-map-item>summary{flex-direction:column;gap:4px;}.response-map-item>summary small{flex-shrink:1;}}

/* 제안 조건표: inline styles are blocked by the page's CSP, so tree depth uses classes. */
.condition-tree{list-style:none;padding-left:0;}
.condition-tree .tree-depth-1{padding-left:1.25rem;}
.condition-tree .tree-depth-2{padding-left:2.5rem;}
.condition-tree .tree-depth-3{padding-left:3.75rem;}
.condition-tree .tree-depth-4{padding-left:5rem;}

/* Strategy candidate cards: the radio sits beside the title, not as a full-width input. */
[data-strategy-card] input[type=radio]{width:auto;padding:0;margin:0 .5rem 0 0;accent-color:var(--accent);}
[data-strategy-card]{cursor:pointer;}

/* Section card tools: the move target sits inline with its button. */
.board-tools select{width:auto;max-width:14rem;padding:.3rem .5rem;}
.agent-page {width:100%;border:1px solid var(--line,#d8ded8);border-radius:6px;background:#fff}
/* The progress strip above the tabs and the section summary card (summary first, details on request). */
.progress-strip {display:flex;gap:.5rem;padding:0 2rem 1rem;align-items:stretch;flex-wrap:wrap}
.stage {display:grid;gap:.15rem;padding:.5rem .8rem;border:1px solid var(--line);border-radius:6px;background:var(--surface);min-width:8.5rem;text-align:left;font-weight:500}
.stage[aria-current=page] {border-color:var(--accent);background:var(--tint)}
.stage-name {font-size:.78rem;font-weight:700}
.stage-text {font-size:.76rem;color:var(--muted)}
.stage.done .stage-name::before {content:"✓ ";color:var(--accent)}
.stage.busy .stage-name::before {content:"● ";color:var(--warning)}
.stage.warn .stage-name::before {content:"! ";color:var(--danger)}
.stage.todo {opacity:.6}
.stage-next {margin-left:auto;align-self:center}
.section-summary {display:grid;gap:.7rem;padding:1.2rem 1.4rem;border:1px solid var(--accent);border-radius:10px;background:var(--surface)}
.section-summary .counts {display:flex;gap:.5rem;flex-wrap:wrap}
.section-summary .next-action {font-size:.95rem}
.view > details > summary {font-weight:600;padding:.6rem 0;cursor:pointer}
.section-grid.compact {grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));gap:8px}
.section-grid.compact .document-item {padding:.5rem .7rem;gap:.15rem}
.section-grid.compact .document-item strong {font-size:.88rem}
.section-grid.compact .next-step {font-size:.76rem}
[data-section-step] > details > summary {cursor:pointer}
.fold {border:1px solid var(--line);border-radius:8px;padding:0 1rem;background:var(--surface)}
.fold > summary {font-weight:600;padding:.75rem 0;cursor:pointer}
.fold[open] > summary {border-bottom:1px solid var(--line);margin-bottom:.8rem}
.fold > .rfp-review {border-top:0;margin-top:0;padding-top:0;margin-bottom:1rem}

/* ===== PC shell (2026-10-23 redesign) ===================================================================== */
:root {
  --bg:#f4f5f7; --surface:#ffffff; --surface-2:#fafbfc; --line-2:#d0d5dd;
  --ink-2:#344054; --faint:#98a2b3;
  --brand:#155e45; --brand-2:#1d7a5a; --brand-soft:#e8f3ee; --brand-ink:#0b3d2c;
  --run:#2563eb; --run-soft:#eaf1fe; --warn:#b54708; --warn-soft:#fef3e7; --bad:#b42318; --bad-soft:#fef0ee;
  --ok:#067647; --ok-soft:#e7f6ee; --auto:#5b3fc4; --auto-soft:#f3f0ff;
  --r:10px; --r-lg:14px; --shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
  --shadow-lg:0 12px 32px -8px rgba(16,24,40,.18),0 4px 8px -4px rgba(16,24,40,.08);
  /* the older screens' names, now on the new palette */
  --paper:var(--bg); --ink:#101828; --muted:#667085; --line:#e4e7ec; --accent:var(--brand); --tint:var(--brand-soft);
  --warning:var(--warn); --danger:var(--bad);
  font-family:"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",system-ui,sans-serif; font-size:14px; background:var(--bg);
}
body { background:var(--bg); color:var(--ink); }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.shell { display:grid; grid-template-columns:256px minmax(0,1fr); min-height:100vh; }
.side { position:sticky; top:0; height:100vh; overflow-y:auto; background:#0f1a17; color:#cfd8d4; display:flex; flex-direction:column; gap:18px; padding:18px 14px; }
.side-brand { display:flex; align-items:center; gap:10px; color:#fff; font-weight:700; font-size:16px; padding:2px 6px; }
.side-mark { width:28px; height:28px; border-radius:8px; background:var(--brand-2); display:grid; place-items:center; font-size:14px; }
.side-team select { background:#17251f; border:1px solid #233a31; color:#e6efeb; border-radius:8px; padding:8px 10px; font-size:13px; }
.side-head { display:flex; justify-content:space-between; align-items:center; margin:0 6px 6px; font-size:11px; letter-spacing:.08em; color:#7c938a; font-weight:700; }
.side-add { background:transparent; border:0; color:#9fb4ab; padding:2px 6px; font-size:15px; }
.side-add:hover:not(:disabled) { background:#1f3a30; color:#fff; }
.side-projects { display:flex; flex-direction:column; gap:2px; }
.proj-link { text-align:left; background:transparent; border:0; color:#cfd8d4; padding:9px 10px; border-radius:8px; font-weight:500; font-size:13.5px; line-height:1.45; }
.proj-link:hover:not(:disabled) { background:#17251f; }
.proj-link[aria-current="true"] { background:#1f3a30; color:#fff; font-weight:700; }
.side-empty { color:#7c938a; font-size:13px; padding:0 6px; }
.side-foot { margin-top:auto; display:flex; flex-direction:column; gap:2px; border-top:1px solid #1f2d28; padding-top:12px; }
.side-link { text-align:left; background:transparent; border:0; color:#a9bab3; padding:8px 10px; border-radius:8px; font-weight:500; font-size:13px; }
.side-link:hover:not(:disabled) { background:#17251f; color:#fff; }
.side-user { display:flex; justify-content:space-between; align-items:center; padding:8px 10px 0; color:#7c938a; font-size:12px; gap:8px; }
.side-user span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.side-user .side-link { padding:4px 6px; }
.main-area { min-width:0; display:flex; flex-direction:column; }
.proj-head { background:var(--surface); border-bottom:1px solid var(--line); padding:18px 32px 0; }
.proj-title { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; }
.proj-name { min-width:0; }
.proj-name .crumb { color:var(--muted); font-size:12.5px; }
.proj-name h1 { font-size:22px; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.chips { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink-2); border-radius:999px; padding:3px 10px; font-size:12px; font-weight:500; }
.chip.ok { background:var(--ok-soft); border-color:#b7e3cb; color:var(--ok); }
.chip.run { background:var(--run-soft); border-color:#c6d8fb; color:var(--run); }
.chip.warn { background:var(--warn-soft); border-color:#f9d3a8; color:var(--warn); }
.chip.bad { background:var(--bad-soft); border-color:#f6c6c0; color:var(--bad); }
.chip.auto { background:var(--auto-soft); border-color:#ddd5fb; color:var(--auto); }
.proj-actions { display:flex; gap:8px; align-items:center; flex:none; }
.btn { white-space:nowrap; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); border-radius:8px; padding:8px 14px; font-weight:600; font-size:13.5px; box-shadow:0 1px 2px rgba(16,24,40,.05); display:inline-flex; gap:8px; align-items:center; text-decoration:none; line-height:1.4; }
.btn:hover:not(:disabled) { background:var(--surface-2); }
.btn.primary { background:var(--brand); border-color:var(--brand); color:#fff; }
.btn.primary:hover:not(:disabled) { background:var(--brand-ink); }
.btn.big { padding:12px 20px; font-size:15px; border-radius:10px; }
.btn.ghost { border-color:transparent; box-shadow:none; background:transparent; color:var(--brand); }
.nav { display:flex; gap:2px; margin-top:14px; }
.nav-item { background:transparent; border:0; border-bottom:2px solid transparent; border-radius:0; color:var(--muted); padding:10px 14px; font-weight:600; font-size:13.5px; display:inline-flex; gap:6px; align-items:center; }
.nav-item:hover:not(:disabled) { background:transparent; color:var(--ink); }
.nav-item[aria-current="page"] { color:var(--brand-ink); border-bottom-color:var(--brand); }
.nav-count { background:var(--warn-soft); color:var(--warn); border-radius:999px; padding:0 7px; font-size:11.5px; font-weight:700; }
.subnav { display:flex; gap:6px; padding:12px 32px 0; }
.sub-item { background:transparent; border:1px solid transparent; border-radius:999px; padding:5px 12px; font-size:13px; font-weight:600; color:var(--muted); }
.sub-item:hover:not(:disabled) { background:var(--surface); border-color:var(--line); }
.sub-item[aria-current="page"] { background:var(--surface); border-color:var(--line-2); color:var(--ink); box-shadow:var(--shadow); }
#view { padding:22px 32px 56px; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow); }
.card-head { padding:14px 20px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:12px; }
.card-head h3 { font-size:15px; }
.card-body { padding:16px 20px; }
.label { font-size:11.5px; letter-spacing:.06em; color:var(--muted); font-weight:700; }
/* home */
.home { display:flex; flex-direction:column; gap:20px; max-width:1360px; }
.hero { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr); overflow:hidden; }
.hero-main { padding:24px 28px; display:flex; flex-direction:column; gap:12px; }
.hero-main h2 { font-size:20px; letter-spacing:-.01em; }
.hero-lead { color:var(--ink-2); max-width:62ch; }
.hero-lead.warn { color:var(--warn); font-weight:600; }
.hero-cost { display:flex; gap:32px; }
.live { display:grid; gap:10px; }
.live-bar { appearance:none; width:100%; height:6px; border:0; border-radius:3px; background:var(--line); overflow:hidden; }
.live-bar::-webkit-progress-bar { background:var(--line); border-radius:3px; }
.live-bar::-webkit-progress-value { background:var(--accent); border-radius:3px; }
.live-bar::-moz-progress-bar { background:var(--accent); border-radius:3px; }
.live-times { display:flex; flex-wrap:wrap; gap:4px 14px; }
.live-preview { display:grid; gap:6px; }
.live-strip { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; }
.live-strip img { height:84px; aspect-ratio:4/3; object-fit:cover; border:1px solid var(--line); border-radius:4px; background:#fff; }
.live-more { align-self:center; color:var(--muted); font-size:12.5px; white-space:nowrap; }
.hero-cost b { display:block; font-size:24px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.hero-cost span { color:var(--muted); font-size:12.5px; }
.hero-cta { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin-top:4px; }
.hero-cta .small { max-width:44ch; }
.hero-approve { display:grid; gap:4px; font-size:12.5px; color:var(--muted); font-weight:600; }
.usd-input { display:flex; align-items:center; border:1px solid var(--line-2); border-radius:10px; background:var(--surface); padding-left:10px; }
.usd-input b { color:var(--muted); font-size:13px; }
.usd-input input { border:0; width:7.5rem; padding:11px 10px; font-size:15px; font-weight:700; background:transparent; }
.hero-side { background:linear-gradient(180deg,#f6faf8,#eef6f1); border-left:1px solid var(--line); padding:22px 24px; display:flex; flex-direction:column; gap:10px; }
.note { font-size:12.5px; color:var(--ink-2); padding-left:16px; position:relative; }
.note::before { content:""; position:absolute; left:2px; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--brand); }
.track { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); }
.stage { padding:14px 16px 16px; border-right:1px solid var(--line); }
.stage:last-child { border-right:0; }
.stage-k { display:flex; align-items:center; gap:8px; font-weight:700; font-size:13.5px; }
.dot { width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:11px; color:#fff; flex:none; background:#cbd2dc; }
.dot.ok { background:var(--ok); } .dot.run { background:var(--run); } .dot.warn { background:var(--warn); }
.stage-s { margin-top:8px; font-size:12.5px; color:var(--ink-2); line-height:1.5; }
.stage.wait .stage-s { color:var(--muted); }
.bar { appearance:none; display:block; width:100%; height:4px; border:0; background:#eef1f4; border-radius:4px; margin-top:10px; overflow:hidden; }
.bar::-webkit-progress-bar { background:#eef1f4; border-radius:4px; }
.bar::-webkit-progress-value { background:var(--run); border-radius:4px; }
.bar::-moz-progress-bar { background:var(--run); border-radius:4px; }
.grid2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.files, .todos { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.file { display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.file-ic { width:36px; height:36px; border-radius:8px; background:#eef2ff; color:#3538cd; display:grid; place-items:center; font-size:10.5px; font-weight:800; flex:none; }
.file-ic.hwp, .file-ic.hwpx { background:var(--brand-soft); color:var(--brand); }
.file-ic.pptx, .file-ic.ppt { background:#fff1e7; color:#c4320a; }
.file-t { min-width:0; display:flex; flex-direction:column; }
.file-t b { font-size:13.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.file-t span { font-size:12px; color:var(--muted); }
.todo { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.todo:last-child { border-bottom:0; }
.todo-b { width:30px; height:30px; border-radius:8px; background:var(--warn-soft); color:var(--warn); display:grid; place-items:center; font-weight:800; flex:none; }
.todo-t { flex:1; min-width:0; display:flex; flex-direction:column; }
.todo-t b { font-size:13.5px; } .todo-t span { font-size:12.5px; color:var(--muted); }
.empty-line { color:var(--muted); font-size:13px; padding:6px 0; }
.readiness-list { list-style:none; margin:0; padding:0; display:grid; gap:.5rem; }
.readiness-list li { display:grid; gap:.15rem; padding:.55rem .7rem; border:1px solid var(--line); border-radius:8px; }
.readiness-list li.warn { border-color:var(--warn); }
.readiness-list li span, .readiness-list li small { color:var(--ink-2); font-size:13px; }
.hero-reasons { margin:.2rem 0 .6rem; padding-left:1.1rem; color:var(--ink-2); font-size:14px; }
