:root { --ink:#10223f; --muted:#68788d; --line:#dce4ed; --canvas:#f4f7fb; --panel:#ffffff; --brand:#1b6a59; --brand-dark:#104a3d; --accent:#e8f4ee; --steel:#a84f1d; --steel-dark:#753514; --steel-accent:#fff0e7; --warn:#a45113; --warn-bg:#fff2e6; --danger:#a83636; --shadow:0 14px 35px rgba(25,54,83,.08); }
* { box-sizing:border-box; }
body { margin:0; background:var(--canvas); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; line-height:1.5; }
.shell { max-width:1120px; margin:0 auto; padding:54px 24px 72px; }.shell.wide { max-width:1420px; }
.hero,.project-hero { margin-bottom:30px; }.hero h1,.project-hero h1 { font-size:3rem; letter-spacing:0; margin:4px 0 12px; }.hero p:not(.eyebrow),.project-hero p:not(.eyebrow) { color:var(--muted); font-size:1.05rem; max-width:760px; }
.eyebrow { margin:0; color:var(--brand); font-size:.73rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.back { color:var(--brand); font-weight:750; text-decoration:none; display:inline-block; margin-bottom:18px; }
.project-nav { position:sticky; top:0; z-index:30; display:flex; gap:4px; overflow-x:auto; margin:0 -8px 20px; padding:9px 8px; border-block:1px solid var(--line); background:rgba(244,247,251,.96); backdrop-filter:blur(10px); }.project-nav a { flex:0 0 auto; color:#435973; text-decoration:none; padding:7px 10px; border-radius:6px; font-size:.8rem; font-weight:750; }.project-nav a:hover,.project-nav a.active { color:#fff; background:var(--brand); }
.grid { display:grid; gap:20px; }.grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }.top-gap { margin-top:20px; }.panel { border:1px solid var(--line); background:var(--panel); border-radius:20px; padding:25px; box-shadow:var(--shadow); }.panel-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:18px; }.panel h2 { font-size:1.28rem; margin:2px 0 0; }.panel h3 { font-size:1rem; margin:22px 0 8px; }.callout { background:#153a48; color:white; border:0; }.callout .eyebrow { color:#a7e7c7; }.callout h2 { font-size:1.6rem; margin-top:5px; }.callout li { margin:9px 0; }.callout .muted { color:#c9ded6; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.form-grid label { display:grid; gap:6px; color:#33475e; font-size:.82rem; font-weight:750; }.form-grid input,.form-grid select,.form-grid textarea { border:1px solid #cbd7e4; border-radius:9px; padding:10px 11px; background:#fff; font:inherit; color:var(--ink); min-width:0; }.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { outline:3px solid #bde8d8; border-color:var(--brand); }.form-grid .button { grid-column:1/-1; }.compact { gap:11px; }.inline-form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }.inline-form input { max-width:100%; }.research-material-picker { grid-column:1/-1; }
.button { border:0; border-radius:10px; padding:11px 16px; font:inherit; font-weight:800; cursor:pointer; text-decoration:none; text-align:center; }.button.primary { background:var(--brand); color:#fff; }.button.primary:hover { background:var(--brand-dark); }.button.secondary { color:var(--brand-dark); background:var(--accent); }.button.steel { color:#fff; background:var(--steel); }.button.steel:hover { background:var(--steel-dark); }.notice { padding:12px 16px; background:#e5f5ed; color:#14543f; border-radius:10px; margin:0 0 18px; }.notice.error { color:#812d2d; background:#fdebec; }.error { color:var(--danger); }.warning { color:var(--warn); background:var(--warn-bg); border-radius:8px; padding:8px 10px; margin:8px 0; }.warning-inline { color:var(--warn); font-size:.78rem; }.success { color:var(--brand-dark); background:var(--accent); border-radius:8px; padding:8px 10px; }.muted,.empty { color:var(--muted); }.metric { background:#edf3f8; color:#435973; padding:5px 9px; border-radius:99px; font-size:.75rem; font-weight:750; }
.account-bar { display:flex; align-items:center; gap:10px; margin-top:18px; color:var(--muted); font-size:.88rem; }.account-bar form { margin:0; }.account-bar .button { padding:8px 11px; }
.auth-shell { min-height:100vh; display:grid; place-items:center; padding:24px; }.auth-panel { width:min(460px,100%); padding:28px; border:1px solid var(--line); border-radius:8px; background:var(--panel); box-shadow:var(--shadow); }.auth-panel h1 { margin:4px 0 10px; font-size:1.7rem; }.auth-panel p { color:var(--muted); line-height:1.6; }.auth-panel .form-grid { margin-top:22px; }.auth-panel .form-grid .button { margin-top:4px; }.auth-panel .auth-switch { margin-top:18px; font-size:.9rem; }
.button.ai-loading-button { display:inline-flex; align-items:center; justify-content:center; gap:9px; cursor:wait; opacity:.84; }.button.ai-loading-button:disabled { cursor:wait; }.ai-spinner { width:1em; height:1em; flex:0 0 1em; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:ai-spinner-rotate .75s linear infinite; }@keyframes ai-spinner-rotate { to { transform:rotate(360deg); } }
.cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:13px; }.project-card { display:flex; flex-direction:column; gap:12px; border:1px solid var(--line); padding:17px; border-radius:13px; color:inherit; transition:transform .18s,box-shadow .18s; }.project-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }.project-card-link { display:flex; flex-direction:column; gap:4px; color:inherit; text-decoration:none; }.project-card-link:hover h3 { color:var(--brand); }.project-card h3 { margin:0; }.project-card p,.project-card span { margin:0; color:var(--muted); font-size:.86rem; }.project-card strong { margin-top:10px; color:var(--brand); }.project-card:has(.type-badge.steel) strong { color:var(--steel); }.project-card form { margin-top:auto; }.project-card .button.danger { width:100%; }.project-list { margin-top:20px; }.card-kicker,.hero-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }.type-badge { display:inline-flex; align-items:center; padding:4px 8px; border-radius:5px; font-size:.72rem; font-weight:800; white-space:nowrap; }.type-badge.pv { color:var(--brand-dark); background:var(--accent); }.type-badge.steel { color:var(--steel-dark); background:var(--steel-accent); }.steel-start { border-top:4px solid var(--steel); }.steel-start .eyebrow,.steel-workspace .eyebrow,.steel-workspace .back { color:var(--steel); }.distribution-start { border-top:4px solid #245d8c; }.distribution-start .eyebrow { color:#245d8c; }.button.distribution { color:#fff; background:#245d8c; }.button.distribution:hover { background:#173f61; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }.metric-grid article { background:var(--ink); color:#fff; padding:17px; border-radius:15px; }.metric-grid article:nth-child(2) { background:#1b6a59; }.metric-grid article:nth-child(3) { background:#245d8c; }.metric-grid article:nth-child(4) { background:#6e4e99; }.metric-grid span,.metric-grid small { display:block; color:#d2e1f0; font-size:.77rem; }.metric-grid strong { display:block; font-size:1.28rem; margin:7px 0; letter-spacing:-.035em; }
.drawing-card,.recommendation { padding:13px; border:1px solid var(--line); border-radius:11px; margin-top:11px; }.drawing-card>div { display:flex; align-items:center; justify-content:space-between; gap:10px; }.drawing-card p { margin:7px 0; color:var(--muted); font-size:.87rem; }.drawing-card details { color:var(--brand); font-size:.82rem; }.drawing-card pre { max-height:180px; overflow:auto; white-space:pre-wrap; color:#33475e; background:#f3f6f9; padding:10px; border-radius:8px; }.badge { padding:3px 7px; border-radius:99px; font-size:.72rem; font-weight:800; background:#edf3f8; color:#435973; }.badge.parsed { background:#dff3e8; color:#165740; }.badge.needs_review { background:#fff0dd; color:#925113; }.badge.failed { background:#fce4e4; color:#9d3434; }.recommendation.info { border-left:4px solid #2977ae; }.recommendation.warning { border-left:4px solid #d27d1c; background:#fffaf2; }.recommendation p { margin:5px 0; }.recommendation span { color:var(--muted); font-size:.76rem; }.fact-list { margin-top:17px; display:grid; gap:8px; }.fact-list>div { padding:10px 0; border-top:1px solid var(--line); display:grid; gap:2px; }.fact-list span,.fact-list small { color:var(--muted); font-size:.8rem; }
.table-wrap { overflow:auto; } table { width:100%; border-collapse:collapse; font-size:.88rem; min-width:940px; } th { color:#5a6d82; text-align:left; font-size:.74rem; text-transform:uppercase; letter-spacing:.04em; background:#f0f4f8; } th,td { padding:12px 10px; vertical-align:top; border-bottom:1px solid var(--line); } td small { display:block; color:var(--muted); margin-top:3px; }.snapshot { display:flex; gap:15px; padding:12px 0; border-top:1px solid var(--line); color:var(--muted); font-size:.87rem; }.snapshot strong { color:var(--ink); }
.quote-list { margin-top:17px; display:grid; gap:8px; }.quote-list>div { border-top:1px solid var(--line); padding:11px 0; display:grid; gap:3px; }.quote-list span,.quote-list small,.quote-list a { color:var(--muted); font-size:.8rem; }.quote-list a { color:var(--brand); font-weight:700; }.quote-list .button { justify-self:start; margin-top:4px; padding:7px 10px; }
.preset-form { padding:12px; background:#f4f7fb; border:1px solid var(--line); margin:0 0 14px; align-items:end; }.preset-form label { display:grid; gap:4px; color:#33475e; font-size:.8rem; font-weight:750; }.preset-form input,.preset-form select { border:1px solid #cbd7e4; border-radius:6px; padding:8px; background:#fff; font:inherit; color:var(--ink); }
.toolbar-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }.button.danger { color:#963b3b; background:#fdecec; border:1px solid #e8b4b4; }.button.danger:hover { background:#f9dede; }.app-dialog { width:min(920px,calc(100vw - 30px)); max-height:calc(100vh - 40px); overflow:auto; border:1px solid var(--line); border-radius:8px; padding:24px; color:var(--ink); background:var(--panel); box-shadow:0 18px 60px rgba(16,34,63,.25); }.app-dialog::backdrop { background:rgba(16,34,63,.42); }.dialog-head { display:flex; justify-content:space-between; gap:16px; align-items:start; margin-bottom:12px; }.dialog-head h2 { font-size:1.3rem; margin:2px 0 0; }.dialog-close { width:32px; height:32px; border:1px solid var(--line); border-radius:6px; color:var(--ink); background:#fff; cursor:pointer; font-size:1.35rem; line-height:1; }
.research-result-dialog { width:min(860px,calc(100vw - 30px)); }.research-result-summary { margin:0; white-space:pre-wrap; line-height:1.75; }.research-result-details { margin:16px 0; padding:14px 16px; border:1px solid #ead4a9; border-radius:8px; background:#fffaf0; line-height:1.7; }.research-result-details ul { margin:7px 0 0; padding-left:22px; }.research-result-details li + li { margin-top:7px; }
.result-notification-dialog { width:min(760px,calc(100vw - 30px)); }.result-notification-list { display:grid; gap:10px; }.result-notification-item { margin:0; white-space:pre-wrap; line-height:1.75; }
@media (max-width:800px) { .shell { padding:32px 15px 50px; }.grid.two,.grid.three,.metric-grid { grid-template-columns:1fr; }.form-grid { grid-template-columns:1fr; }.hero h1,.project-hero h1 { font-size:2rem; letter-spacing:0; }.panel { padding:18px; }.panel-heading { flex-direction:column; }.snapshot { flex-direction:column; gap:3px; }.project-nav { margin-inline:-3px; } }
.fact-item { grid-template-columns:minmax(0,1fr) auto auto; align-items:start; column-gap:9px; }.fact-item strong,.fact-item span,.fact-item small,.fact-item .analysis-details { grid-column:1; }.fact-item form { grid-row:1 / span 3; align-self:center; }.analysis-details { margin-top:5px; border:1px solid #dbe5ee; border-radius:8px; background:#f8fafc; color:var(--muted); font-size:.8rem; }.analysis-details summary { cursor:pointer; padding:8px 10px; list-style:none; }.analysis-details summary::-webkit-details-marker { display:none; }.analysis-details summary::before { content:'⌄'; display:inline-block; margin-right:7px; color:var(--brand); font-weight:900; transform:rotate(-90deg); transition:transform .16s ease; }.analysis-details[open] summary::before { transform:rotate(0); }.analysis-preview { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3; vertical-align:top; max-width:100%; }.analysis-toggle { display:inline-block; margin-top:7px; color:var(--brand); font-weight:800; }.analysis-details[open] .analysis-toggle { display:none; }.analysis-details p { margin:0; padding:10px; border-top:1px solid #dbe5ee; white-space:pre-wrap; color:#52677f; line-height:1.65; }.icon-action { width:30px; height:30px; border:1px solid #95d4b8; background:#e7f6ee; color:#14543f; border-radius:6px; cursor:pointer; font-weight:800; }.icon-action.danger { border-color:#e8b4b4; color:#963b3b; background:#fdecec; }
.audit-table { min-width:1120px; }.audit-risk { background:#fff7f4; }.audit-review { background:#fffcf4; }.audit-status { display:inline-block; padding:3px 7px; border-radius:5px; font-size:.75rem; font-weight:800; }.audit-status.pass { color:#165740; background:#dff3e8; }.audit-status.review { color:#925113; background:#fff0dd; }.audit-status.risk { color:#963b3b; background:#fdecec; }.audit-table form { display:inline-block; margin:7px 4px 0 0; }
.inline-price-form { display:flex; align-items:center; gap:5px; min-width:170px; }.inline-price-form input { width:92px; border:1px solid #cbd7e4; border-radius:6px; padding:7px; color:var(--ink); font:inherit; }.inline-price-form span { white-space:nowrap; color:var(--muted); font-size:.78rem; }.inline-price-form .icon-action { flex:0 0 30px; }
.price-source-form { display:flex; align-items:center; gap:5px; min-width:162px; }.price-source-form select { min-width:116px; border:1px solid #cbd7e4; border-radius:6px; padding:7px; background:#fff; color:var(--ink); font:inherit; }.price-source-form .icon-action { flex:0 0 30px; }
#section-drawings,#section-inputs,#section-facts,#section-bom,#section-manual-prices,#section-ai-prices,#section-ai-vision,#section-ai-vision-results,#section-material-check,#section-ai-audit,#section-snapshots { scroll-margin-top:62px; }.vision-results { border-color:#b9ddd0; }.vision-result-table { min-width:1020px; }.vision-result-table form { display:inline-block; margin:7px 4px 0 0; }
.steel-workspace .project-nav a:hover,.steel-workspace .project-nav a.active { background:var(--steel); }.steel-workspace .button.primary { background:var(--steel); }.steel-workspace .button.primary:hover { background:var(--steel-dark); }.steel-workspace .button.secondary { color:var(--steel-dark); background:var(--steel-accent); }.steel-metrics article:nth-child(1) { background:#29384a; }.steel-metrics article:nth-child(2) { background:#704022; }.steel-metrics article:nth-child(3) { background:#9a4c21; }.steel-metrics article:nth-child(4) { background:#274f5a; }.project-link-strip,.pv-link-summary { display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid #e7c8b5; background:#fff8f3; padding:13px 16px; }.project-link-strip span { color:var(--muted); font-size:.82rem; }.project-link-strip a { color:var(--steel-dark); font-weight:800; text-decoration:none; }.pv-link-summary dl { display:flex; gap:24px; margin:0 auto; }.pv-link-summary dl div { min-width:90px; }.pv-link-summary dt { color:var(--muted); font-size:.75rem; }.pv-link-summary dd { margin:2px 0 0; font-weight:800; }.steel-member-table { min-width:1240px; }.steel-bom-table { min-width:1320px; }.row-actions { display:flex; gap:5px; align-items:center; }.row-actions form { margin:0; }.steel-form { grid-template-columns:repeat(3,minmax(0,1fr)); }.steel-form .button { grid-column:1/-1; }.steel-workspace #section-drawings,.steel-workspace #section-steel-settings,.steel-workspace #section-steel-members,.steel-workspace #section-bom,.steel-workspace #section-cutting,.steel-workspace #section-manual-prices,.steel-workspace #section-snapshots,.steel-workspace #section-steel-overview { scroll-margin-top:62px; }
.cutting-group { border-top:1px solid var(--line); padding:18px 0 4px; }.cutting-group.blocked { border-left:4px solid var(--danger); padding-left:14px; }.cutting-group-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }.cutting-group-head small { display:block; margin-top:5px; color:var(--muted); }.cutting-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:10px; margin:14px 0; }.cutting-metrics div { background:#f7f9fc; border-radius:9px; padding:9px 11px; }.cutting-metrics dt { color:var(--muted); font-size:.72rem; }.cutting-metrics dd { margin:3px 0 0; font-weight:800; }.cutting-plan-table { min-width:780px; }
@media (max-width:800px) { .hero-title-row,.project-link-strip,.pv-link-summary { align-items:stretch; flex-direction:column; }.project-link-strip { gap:6px; }.project-link-strip a { font-size:1rem; }.pv-link-summary dl { width:100%; margin:0; flex-wrap:wrap; justify-content:space-between; gap:10px; }.pv-link-summary dl div { min-width:calc(50% - 8px); }.steel-form { grid-template-columns:1fr; }.toolbar-actions { width:100%; }.toolbar-actions .inline-form { width:100%; }.toolbar-actions input[type=file] { max-width:100%; }.card-kicker { align-items:center; } }
.consultation-shell { max-width:1000px; }.consultation-panel { max-width:820px; margin:0 auto; }.chat-thread { display:grid; gap:12px; max-height:62vh; overflow:auto; padding:8px 3px 16px; }.chat-message { max-width:min(86%,680px); padding:12px 14px; border-radius:13px; border:1px solid var(--line); }.chat-message.user { justify-self:end; color:#fff; background:var(--brand); border-color:var(--brand); }.chat-message.assistant { justify-self:start; background:#f7fafc; }.chat-message span { display:block; font-size:.74rem; font-weight:800; opacity:.8; }.chat-message p { margin:5px 0 0; white-space:pre-wrap; line-height:1.7; }.consultation-form { display:grid; gap:10px; margin-top:14px; }.consultation-form label { display:grid; gap:6px; font-weight:750; color:#33475e; }.consultation-form textarea { width:100%; resize:vertical; border:1px solid #cbd7e4; border-radius:10px; padding:11px; font:inherit; color:var(--ink); }.consultation-form .button { justify-self:end; }.help-shell { max-width:1220px; }.help-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:22px; align-items:start; }.help-toc { position:sticky; top:66px; display:grid; gap:4px; padding:14px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:var(--shadow); }.help-toc strong { margin-bottom:4px; }.help-toc a { padding:6px 8px; border-radius:6px; color:#435973; font-size:.86rem; text-decoration:none; }.help-toc a:hover { color:#fff; background:var(--brand); }.markdown-guide { line-height:1.8; }.markdown-guide section { scroll-margin-top:70px; padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid var(--line); }.markdown-guide section:last-child { border:0; margin:0; padding:0; }.markdown-guide h2 { margin:0 0 9px; font-size:1.4rem; }.markdown-guide h3 { margin:18px 0 5px; }.markdown-guide p { margin:7px 0; color:#3e536b; }.markdown-guide blockquote { margin:14px 0; padding:12px 15px; border-left:4px solid var(--brand); background:#f2faf6; color:#285a4b; }.markdown-guide code { padding:2px 5px; border-radius:4px; background:#edf3f8; color:#435973; }
@media (max-width:800px) { .help-layout { grid-template-columns:1fr; }.help-toc { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }.chat-message { max-width:94%; }.consultation-form .button { width:100%; } }
.project-nav-action { flex:0 0 auto; margin-left:auto; border:0; border-radius:6px; padding:7px 10px; color:#fff; background:var(--brand); font:inherit; font-size:.8rem; font-weight:750; cursor:pointer; white-space:nowrap; }.project-nav-action:hover { background:var(--brand-dark); }.steel-workspace .project-nav-action { background:var(--steel); }.steel-workspace .project-nav-action:hover { background:var(--steel-dark); }
.form-grid input[type="checkbox"] { appearance:auto; width:16px; height:16px; min-width:16px; padding:0; margin:2px 0 0; accent-color:var(--brand); }.form-grid label:has(input[type="checkbox"]) { display:flex; align-items:center; gap:8px; }.form-grid ul { margin:0; padding:0; list-style:none; }.form-grid li label { display:flex; align-items:center; gap:7px; }.steel-workspace .form-grid input[type="checkbox"] { accent-color:var(--steel); }
.project-nav { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; overflow:visible; }.project-nav-links { display:flex; min-width:0; gap:4px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:thin; padding-bottom:2px; }.project-nav-action { margin-left:0; }
.distribution-start .form-grid label { align-content:start; }.distribution-start .form-grid input,.distribution-start .form-grid select { align-self:start; }
.onboarding-guide { margin-bottom:20px; }.onboarding-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.onboarding-steps article { padding:13px 14px; border:1px solid var(--line); border-radius:11px; background:#f8fafc; }.onboarding-steps article:nth-child(1) { border-top:3px solid var(--brand); }.onboarding-steps article:nth-child(2) { border-top:3px solid var(--steel); }.onboarding-steps article:nth-child(3) { border-top:3px solid #245d8c; }.onboarding-steps strong { display:block; color:var(--ink); }.onboarding-steps p,.onboarding-note { margin:6px 0 0; color:var(--muted); font-size:.86rem; line-height:1.65; }.onboarding-note { margin-top:14px; }.usage-guide { margin:14px 0; padding:11px 13px; border:1px solid #cfe0ec; border-radius:10px; background:#f7fbfe; color:#33475e; }.usage-guide summary { cursor:pointer; color:#245d8c; }.usage-guide ol { margin:10px 0 0; padding-left:22px; }.usage-guide li + li { margin-top:7px; }
/* The menu must remain usable on a phone: its own scroll area takes the full
   width, while the AI entry moves below it instead of covering the last tabs. */
@media (max-width:1280px) {
  .project-nav { grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:8px; overflow:visible; }
  .project-nav-links { display:flex; width:100%; max-width:100%; min-height:39px; flex-wrap:wrap; overflow:visible; }
  .project-nav-action { min-height:39px; }
}
@media (max-width:800px) {
  .project-nav { position:static; grid-template-columns:minmax(0,1fr); align-items:stretch; }
  .project-nav-action { justify-self:start; }
  .onboarding-steps { grid-template-columns:1fr; }
}
@media (max-width:420px) {
  .project-nav { margin-inline:-8px; padding-inline:8px; }
  .project-nav a { padding-inline:9px; }
  .project-nav-action { width:100%; }
}