.quote-app { background: #f8f6f0; font-size: 15px; }
.app-header { display:flex; justify-content:space-between; align-items:center; padding:16px max(24px,calc((100vw - 1280px)/2)); gap:20px; background:var(--cream); }
.app-brand { display:flex; align-items:center; gap:12px; font-weight:800; line-height:1.3; color:var(--navy); }
.app-brand img { width:54px; height:54px; object-fit:contain; }
.app-brand small { display:block; font-size:10px; letter-spacing:.13em; font-weight:400; margin-top:5px; }
.phone { font-size:13px; white-space:nowrap; }
#app { max-width:1280px; margin:0 auto; padding:36px 24px 64px; min-height:70vh; }
.intro-page { max-width:790px; margin:auto; }
.eyebrow { color:var(--red); font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; }
.quote-app h1 { font-size:clamp(28px,4vw,42px); color:var(--navy); line-height:1.2; margin:12px 0 16px; letter-spacing:-.025em; }
.quote-app h2 { font-size:23px; color:var(--navy); line-height:1.3; margin:0 0 16px; }
.quote-app h3 { font-size:17px; margin:0 0 12px; }
.lede { font-size:17px; color:#536174; max-width:650px; margin-bottom:28px; }
.card { background:white; border:1px solid #dce0e4; border-radius:16px; padding:26px; margin-bottom:22px; box-shadow:0 5px 18px #082b5005; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.full { grid-column:1/-1; }
.quote-app label { display:block; font-weight:700; font-size:13px; }
.quote-app input,.quote-app select,.quote-app textarea { width:100%; min-height:45px; border:1px solid #b8c2cd; border-radius:7px; padding:10px 12px; background:white; color:var(--ink); font:inherit; font-weight:400; margin-top:6px; }
.quote-app textarea { resize:vertical; }
.quote-app input[type=checkbox] { width:18px; min-height:18px; height:18px; margin:0; flex-shrink:0; }
.check { display:flex!important; align-items:center; gap:10px; margin:18px 0; font-weight:400!important; }
.hint,.muted { color:#647084; font-size:13px; font-weight:400; }
.hint { display:block; margin-top:7px; }
.quote-app button,.button { border:0; border-radius:8px; background:var(--navy); color:white; font:inherit; font-size:14px; font-weight:700; cursor:pointer; padding:12px 18px; display:inline-flex; align-items:center; justify-content:center; min-height:44px; gap:7px; }
.quote-app button:hover,.button:hover { filter:brightness(1.15); }
.quote-app button:disabled { opacity:.5; cursor:wait; }
.quote-app .secondary { background:#eaf0f5; color:var(--navy); }
.quote-app .quiet { background:transparent; color:var(--navy); border:1px solid #cbd3dc; }
.quote-app .danger { background:#fff0ef; color:#9b2626; }
.quote-app .accent { background:var(--red); }
.quote-app :focus-visible { outline:3px solid #428bd2; outline-offset:3px; }
.actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:22px; }
.workspace { display:block; }
.summary-bar { display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; background:var(--navy); color:white; border-radius:16px; padding:18px 24px; margin-bottom:14px; }
.summary-total { display:flex; flex-direction:column; gap:2px; min-width:0; }
.summary-total .label { font-size:12px; letter-spacing:.1em; text-transform:uppercase; opacity:.8; }
.summary-total strong { font-size:32px; font-weight:800; letter-spacing:-.03em; line-height:1.1; }
.summary-total .range { font-size:13px; opacity:.9; }
.summary-total .note { font-size:12px; opacity:.75; }
.summary-side { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.summary-bar .button.quiet { color:white; border-color:#ffffff55; }
.save-status { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; padding:6px 11px; border-radius:999px; background:#ffffff22; color:white; max-width:min(60vw,360px); }
.save-status::before { content:''; width:8px; height:8px; border-radius:50%; background:#8be09a; flex-shrink:0; }
.save-status[data-status=pending]::before,.save-status[data-status=saving]::before { background:#f5cf6b; }
.save-status[data-status=saving]::before { animation:pulse 1s infinite; }
.save-status[data-status=attention]::before,.save-status[data-status=conflict]::before { background:#ff8a80; }
.save-status[data-status=attention],.save-status[data-status=conflict] { background:#ffffff33; }
form .save-status,.card .save-status { background:#eaf0f5; color:var(--navy); }
@keyframes pulse { 50% { opacity:.3; } }
.tabs { display:flex; gap:6px; overflow-x:auto; scrollbar-width:thin; padding:4px 2px 10px; margin-bottom:12px; -webkit-overflow-scrolling:touch; }
.tabs a,.tabs .tab-add { flex:0 0 auto; padding:10px 15px; border-radius:999px; border:1px solid #cbd3dc; background:white; color:var(--navy); font-weight:700; font-size:14px; line-height:1.2; white-space:nowrap; max-width:220px; overflow:hidden; text-overflow:ellipsis; min-height:40px; }
.tabs a[aria-current] { background:var(--navy); color:white; border-color:var(--navy); }
.tabs a.needs-info::after { content:''; display:inline-block; width:7px; height:7px; border-radius:50%; background:#d59632; margin-left:7px; vertical-align:middle; }
.tabs .tab-add { background:#eaf0f5; border-style:dashed; }
.view { min-width:0; }
.outstanding { border-color:#ecd9a6; background:#fffaf0; }
.room-card.needs-info { border-style:dashed; }
.door-row { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)) auto; gap:10px; align-items:end; margin:12px 0; }
.door-row button { margin-bottom:0; }
#geometry { grid-column:1/-1; margin:0; }
#notice button { margin-left:8px; min-height:32px; padding:5px 12px; font-size:12px; }
.stack { display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.stack button,.passkey button { min-height:32px; padding:5px 10px; font-size:12px; }
.passkey { margin:4px 0; }
#staff-card td { vertical-align:top; }
.status { display:inline-block; background:#eaf0f5; border-radius:5px; padding:4px 8px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.heading-row { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:18px; }
.heading-row h1,.heading-row h2 { margin:0; }
.room-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.room-card { display:block; border:1px solid #dce0e4; border-radius:10px; padding:18px; background:#fbfcfe; }
.room-card:hover { border-color:var(--navy); }
.room-card h3 { margin-bottom:6px; }
.room-card small { display:block; color:#637184; }
.empty { padding:30px; text-align:center; border:2px dashed #d6dee5; border-radius:12px; color:#647084; }
.window-row { display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:10px; align-items:end; margin:12px 0; }
.window-row button { margin-bottom:0; }
.section-break { margin-top:26px; padding-top:22px; border-top:1px solid #e4e8ed; }
#notice { position:sticky; top:87px; z-index:19; }
#notice:not(:empty) { padding:12px 24px; background:#e5f2eb; color:#184833; border-bottom:1px solid #a3c9b1; }
#notice.error { background:#fff0ec; color:#8e3021; }
.notice { background:#fff6dd; color:#695421; padding:14px 18px; border-radius:9px; font-size:13px; margin-bottom:18px; }
.photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:18px 0; }
.photo-grid figure { margin:0; }
.photo-grid img { width:100%; height:150px; object-fit:cover; border-radius:9px; }
.photo-grid figcaption { font-size:12px; margin-top:6px; }
.message { border-left:3px solid #d9e2ea; padding:8px 15px; margin:16px 0; background:#fbfcfd; overflow-wrap:anywhere; }
.message.question { border-color:#d59632; }
.message.private { border-color:#9c6eb8; background:#fcf7ff; }
.message p { white-space:pre-wrap; margin:8px 0; }
.message small { font-size:11px; color:#687589; }
.message .actions { margin-top:10px; }
.message .actions button { min-height:32px; padding:5px 10px; font-size:12px; }
.table-wrap { overflow:auto; }
.quote-app table { width:100%; border-collapse:collapse; font-size:13px; }
.quote-app th,.quote-app td { text-align:left; padding:12px 8px; border-bottom:1px solid #e2e7eb; }
.quote-app td input { min-width:85px; }
.phase th { background:#edf2f6; font-weight:700; }
.line-label { min-width:150px; }
.quote-app ul { padding-left:22px; }
.quote-app li { margin:7px 0; }
.quote-app details { margin:15px 0; }
.quote-app summary { cursor:pointer; font-weight:700; }
.quote-app dialog { width:min(580px,calc(100vw - 32px)); border:0; border-radius:16px; padding:28px; box-shadow:var(--shadow); }
.quote-app dialog::backdrop { background:#082b5080; }
.app-footer { background:transparent; color:#667386; font-size:12px; text-align:center; padding:24px; }
.estimate { white-space:normal; }
.estimate .scope { white-space:pre-wrap; }
.estimate-total { font-size:30px; font-weight:800; color:var(--navy); }
.loading { text-align:center; padding:60px 20px; }
@media(max-width:850px) {
  .summary-bar { padding:16px 18px; }
  .summary-total strong { font-size:27px; }
  .door-row { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .door-row button { grid-column:1/-1; }
}
@media(max-width:540px) {
  #app { padding:24px 14px 40px; }
  .app-header { padding:12px 14px; }
  .app-brand { font-size:13px; gap:8px; }
  .app-brand img { width:40px; height:40px; }
  .phone { font-size:11px; }
  .card { padding:19px; }
  .grid,.grid.three,.room-cards { grid-template-columns:1fr; }
  .window-row { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .window-row button { grid-column:1/-1; }
  .door-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .door-row label:first-child,.door-row label:nth-child(4),.door-row label:nth-child(5) { grid-column:1/-1; }
  .summary-side { width:100%; justify-content:space-between; }
  .save-status { max-width:100%; }
  .photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .heading-row { align-items:flex-start; }
  .heading-row h1 { font-size:27px; }
}
@media print {
  .app-header,.summary-bar,.tabs,.app-footer,#notice,.no-print,button { display:none!important; }
  #app { padding:0; max-width:none; }
  .workspace { display:block; }
  .card { box-shadow:none; border:0; }
  .estimate { break-after:page; }
  body { background:white; }
}
