@media screen {
  :root { --primary:#a9401b; --bg:#f3f4f4; --text-main:#20292e; --muted:#637076; --line:#dce1e2; --accent:#c45325; }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; scroll-padding-top:24px; }
  body { background:var(--bg); font-size:16px; line-height:1.5; padding-bottom:30px; }
  button,input,select { font:inherit; }
  button,a,input,select { -webkit-tap-highlight-color:transparent; }
  button { cursor:pointer; transition:background .15s,border-color .15s; }
  button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid #de855c; outline-offset:3px; }
  #app-container { max-width:1480px; margin:0 auto; padding:0 40px; background:transparent; border-radius:0; box-shadow:none; }
  .app-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0; padding:24px 0; border-bottom:1px solid #d4dbdd; }
  .brand { display:flex; align-items:center; gap:22px; }
  .brand img { width:125px; height:84px; object-fit:contain; mix-blend-mode:multiply; }
  .brand>div { padding-left:22px; border-left:1px solid #cfd6d7; }
  .eyebrow,.staff-label { font-size:12px; letter-spacing:.12em; font-weight:750; color:#667278; }
  h1 { font-size:30px; letter-spacing:-1px; color:#20292e; line-height:1.2; margin-top:6px; }
  h2 { font-size:21px; letter-spacing:-.4px; color:#20292e; margin:0; }
  h3 { color:#20292e; }
  .header-meta { text-align:right; }
  #version-tag { font-size:13px; color:#637076; margin-top:6px; }
  .section-nav { display:flex; gap:28px; padding:18px 0 22px; }
  .section-nav a { display:flex; gap:8px; align-items:center; text-decoration:none; color:#9a4625; font-size:12px; font-weight:750; }
  .section-nav span { font-size:14px; color:#47555d; }
  .section-nav a:hover span { color:#a9401b; }
  .quote-workspace { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:26px; align-items:start; }
  .quote-inputs { min-width:0; }
  .card { padding:24px; border:1px solid #dce1e2; border-radius:12px; background:#fff; margin-bottom:22px; box-shadow:0 2px 3px #1c242904; }
  .section-heading { display:flex; gap:12px; align-items:center; margin-bottom:16px; }
  .step { display:grid; place-items:center; width:30px; height:30px; border:1px solid #e2b9a6; border-radius:7px; font-size:12px; color:#a34420; font-weight:750; background:#fcf4ef; flex-shrink:0; }
  .muted { color:#637076; font-size:14px; }
  .subcard { border:1px solid #d9dfe1; border-radius:9px; padding:19px; margin:18px 0; background:#fff; overflow:hidden; }
  .subcard-header { background:#f6f7f7; margin:-19px -19px 18px; padding:14px 18px; border-bottom:1px solid #e2e6e7; }
  .subcard-title { color:#243238; font-size:15px; font-weight:750; }
  .subcard-header .muted { font-size:13px; margin-top:2px; }
  .subcard-header>div:first-child { min-width:0; }
  .card-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
  .collapse-toggle { border:1px solid #cdd5d8; border-radius:6px; padding:6px 9px; color:#526168; font-size:12px; background:#fff; min-height:36px; }
  .is-collapsed>div:not(.subcard-header) { display:none; }
  .is-collapsed .subcard-header { margin-bottom:-19px; border-bottom:0; }
  .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  label { font-size:14px; font-weight:650; color:#39494f; margin-bottom:6px; }
  .input-style { min-height:46px; font-size:16px; color:#25343b; border:1px solid #bcc8cc; border-radius:6px; padding:10px 12px; }
  .input-style:disabled { background:#f1f3f4; border-color:#e0e5e7; color:#889297; }
  .input-style::placeholder { color:#7c898f; }
  .mini-label { font-size:12px; color:#64737a; letter-spacing:.08em; margin-bottom:12px; }
  .border-top { border-color:#e1e6e8; margin-top:20px; padding-top:18px; }
  .primary-btn { background:#fff; border:1px dashed #c7a18f; border-radius:7px; color:#a9401b; padding:12px; font-size:14px; }
  .primary-btn:hover { background:#fff7f1; border-color:#b15129; }
  .secondary-btn { background:#f6f7f7; border:1px solid #d2dadd; color:#394e59; font-size:14px; min-height:40px; }
  .secondary-btn:hover { background:#e9eeee; }
  .remove-btn { background:transparent; color:#8a5d51; border:1px solid #d9c9c4; border-radius:6px; width:36px; min-width:36px; height:36px; font-size:13px; }
  .remove-btn:hover { background:#fff0ed; color:#a9331f; border-color:#b96753; }
  .segment-row { align-items:center; margin-bottom:10px; gap:10px; }
  .checkbox-row { padding:8px 0; margin:0; align-items:center; font-size:14px; }
  input[type=checkbox] { accent-color:#b54d22; width:18px; height:18px; flex-shrink:0; }
  .option-stack { gap:8px; }
  .warning,.grade-warning { font-size:13px; color:#a83220; }
  #summary-card { position:sticky; top:20px; max-height:calc(100vh - 40px); overflow:auto; background:#fff !important; border-top:4px solid var(--accent); padding:23px; scrollbar-width:thin; }
  .summary-heading h2 { margin-top:3px; margin-bottom:18px; font-size:23px; }
  .quantity-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:14px 0; border-block:1px solid #e1e6e8; }
  .quantity-summary .summary-row { display:flex; flex-direction:column; gap:3px; margin:0; font-size:12px; color:#68777e; }
  .quantity-summary .summary-row span:last-child { text-align:left; font-size:19px; font-weight:700; color:#283940; }
  .summary-section-title { font-size:13px; color:#5a6b72; margin:12px 0 10px; }
  .summary-row { gap:15px; font-size:14px; margin-bottom:12px; }
  .summary-row>span:first-child { min-width:0; overflow-wrap:anywhere; }
  .summary-row>span:last-child { font-variant-numeric:tabular-nums; }
  .summary-total { font-size:16px; gap:18px; align-items:baseline; color:#26373f; border-color:#dce3e6; }
  .summary-total>span:last-child { font-size:25px; font-weight:800; white-space:nowrap; }
  .breakdown-box { border:0; padding-left:0; }
  .line-detail,.internal-note { font-size:12px; line-height:1.5; color:#64747c; }
  .breakdown-empty { font-size:13px; color:#6b787f; }
  .price-grid { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
  .pill-card { flex:1 1 40%; padding:13px 8px; margin:0; box-shadow:none; border:1px solid #dce3e6; border-radius:7px; }
  .pill-card h3 { font-size:11px; letter-spacing:.07em; color:#52636d; }
  .pill-card .price { font-size:23px; color:#2b3d45; letter-spacing:-.5px; }
  .pill-card.best { flex-basis:100%; order:-1; border:1px solid #23363d; background:#23363d; padding:18px 12px; }
  .pill-card.best h3 { color:#dce3e7; font-size:12px; }
  .pill-card.best .price { color:#fff; font-size:37px; }
  .pill-card.best .pill-note { color:#d1dade; }
  .pill-note { font-size:12px; color:#62737b; line-height:1.5; }
  .export-btn { background:#b54d22; border-radius:7px; width:100%; font-size:14px; padding:13px 12px; }
  .export-btn:hover { background:#993d18; }
  .mobile-total { display:none; }
  #login-overlay { background:#f0f2f2; padding:24px; }
  .login-card { max-width:400px; padding:38px 32px; border-radius:12px; border:1px solid #d6dcdf; border-top:4px solid #c45325; box-shadow:0 18px 50px #2130390c; }
  .login-card img { max-width:180px !important; }
  .login-card h2 { color:#24363f !important; font-size:24px; }
  .login-card .primary-btn { background:#b54d22; color:#fff; border:1px solid #b54d22; min-height:46px; }
  .login-input { min-height:48px; text-align:left; padding-right:65px; }
  .toggle-password { border:0; padding:5px; background:none; font-size:13px; color:#7b432d; }
  #loading { background:#f3f4f4; }
  #loading>div:last-child { color:#52646c !important; }
  @media(min-width:1400px) { .quote-workspace { grid-template-columns:minmax(0,1fr) 420px; } }
  @media(max-width:1080px) { #app-container { padding:0 22px; } .quote-workspace { grid-template-columns:minmax(0,1fr) 330px; gap:18px; } .card { padding:18px; } #summary-card { padding:18px; } }
  @media(max-width:820px) { .quote-workspace { display:block; } #summary-card { position:static; max-height:none; overflow:visible; } .mobile-total { display:flex; position:fixed; bottom:0; left:0; right:0; justify-content:space-between; align-items:center; padding:11px 22px max(11px,env(safe-area-inset-bottom)); background:#23363d; color:#fff; text-decoration:none; box-shadow:0 -3px 16px #20303b15; z-index:100; font-size:13px; } .mobile-total strong { display:block; font-size:23px; line-height:1.2; } body { padding-bottom:90px; } .header-meta .staff-label { display:none; } .section-nav { justify-content:space-between; gap:8px; } .section-nav a { gap:5px; } .section-nav span { font-size:13px; } .brand img { width:96px; height:65px; } .brand { gap:14px; } .brand>div { padding-left:14px; } .brand .eyebrow { display:none; } h1 { font-size:25px; } }
  @media(max-width:480px) { #app-container { padding:0 14px; } .app-header { padding:17px 0; gap:12px; flex-wrap:wrap; } .header-meta { width:100%; text-align:left; border-top:1px solid #e0e5e7; padding-top:8px; } #version-tag { margin:0; } .brand img { width:92px; height:61px; } h1 { font-size:25px; } .section-nav { padding:16px 0; } .section-nav a { font-size:0; } .section-nav span { font-size:12px; } .card { padding:16px; } .subcard { padding:15px; } .subcard-header { margin:-15px -15px 16px; padding:12px; gap:8px; } .is-collapsed .subcard-header { margin-bottom:-15px; } .grid-4,.grid-2 { grid-template-columns:1fr; gap:13px; } .grid-4>div:empty { display:none; } .subcard-header .muted { font-size:12px; } .remove-btn { min-width:36px; width:36px; height:36px; border-radius:6px; } .card-actions { gap:5px; } .collapse-toggle { padding:6px; } .segment-row.railing { grid-template-columns:minmax(85px,1fr) minmax(80px,1fr) auto; } .summary-row { font-size:14px; } }
  @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }
}
@media print { .app-header,.section-nav,.mobile-total,.collapse-toggle { display:none !important; } }