/* Open-book quote (/quote). Dark page; the document itself is a deliberate light object ("paper")
   because it is forwarded and printed. Split colours as everywhere: professional / YRproject / client. */
.qt-grid { display: grid; gap: var(--s7); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 62rem) { .qt-grid { grid-template-columns: minmax(18rem, 25rem) minmax(0, 1fr); } .qt-preview { position: sticky; top: 5.5rem; } }
.qt-side { display: grid; gap: var(--s6); min-width: 0; }
.qt-form { display: grid; gap: var(--s4); padding: var(--s5); border: 1px solid var(--line); border-radius: var(--r); background: var(--surface), var(--sea-2); box-shadow: var(--hi); min-width: 0; }
.qt-field { display: grid; gap: var(--s2); font-size: var(--fs-small); font-weight: 500; min-width: 0; }
.qt-field input, .qt-field select { width: 100%; min-width: 0; }
.qt-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4); }
.qt-set { border: 0; border-top: 1px solid var(--line); padding: var(--s4) 0 0; margin: 0; display: grid; gap: var(--s3); min-width: 0; }
.qt-set legend { font-size: var(--fs-micro); letter-spacing: .08em; text-transform: uppercase; color: var(--fg-muted); padding: 0 var(--s2) 0 0; }
.qt-check { display: flex; gap: var(--s3); align-items: flex-start; font-size: var(--fs-small); cursor: pointer; }
.qt-check input { margin-top: .25em; accent-color: var(--pro); width: 1.05rem; height: 1.05rem; flex: none; }
.qt-suggest { color: var(--warn); margin: 0; }
.qt-error { color: var(--bad); margin: 0; font-size: var(--fs-small); }
.qt-actions { align-items: center; }
.qt-names a { overflow-wrap: anywhere; }
.qt-preview { min-width: 0; }
.qt-preview.is-stale .qt-paper { opacity: .45; }

.qt-paper { --ink: #0B101C; --mut: #5C6678; --rul: #D0D5DE; --p: #0B8F87; --y: #E8431A; --c: #5C48D6;
  background: #FCFCFA; color: var(--ink); border-radius: .4rem; padding: clamp(1.25rem, 4.5vw, 2.75rem); font-size: .875rem; line-height: 1.45;
  box-shadow: 0 0 0 1px rgb(255 255 255 / .08), 0 40px 80px -40px rgb(0 0 0 / .8), 0 0 60px rgb(157 140 255 / .12);
  font-variant-numeric: tabular-nums; max-width: 46rem; margin-inline: auto; transition: opacity 160ms; }
.qt-paper p { margin: 0; max-width: none; color: inherit; }
.qt-top { display: flex; justify-content: space-between; gap: var(--s4); align-items: flex-start; padding-bottom: .9rem; border-bottom: 1.5px solid var(--ink); flex-wrap: wrap; }
.qt-brand { display: flex; align-items: center; gap: .55rem; font-weight: 600; font-size: 1.35rem; letter-spacing: -.01em; }
.qt-doc { display: grid; text-align: right; font-size: .75rem; color: var(--mut); gap: .1rem; margin-left: auto; }
.qt-doc b { font-size: 1rem; color: var(--ink); font-weight: 600; }
.qt-role { font-size: clamp(1.3rem, 1rem + 1.6vw, 1.75rem); line-height: 1.15; font-weight: 600; margin: 1.4rem 0 .35rem; color: var(--ink); letter-spacing: -.01em; overflow-wrap: anywhere; }
.qt-sub { font-weight: 500; }
.qt-meta { display: flex; flex-wrap: wrap; gap: .2rem 1.2rem; font-size: .78rem; margin-top: .4rem !important; }
.qt-meta:empty { display: none; }
.qt-meta b { font-weight: 400; color: var(--mut); }
.qt-meta span span { font-weight: 500; }
.qt-mode { color: var(--mut) !important; font-size: .78rem; margin-top: .45rem !important; }
.qt-bar { display: flex; gap: 2px; height: 2.4rem; margin-top: 1.3rem; }
.qt-bar i { display: block; height: 100%; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
.qt-bar__pro { background: var(--p); transition: width 240ms cubic-bezier(.2, .7, .2, 1); }
.qt-bar__yr { background: var(--y); flex: 1; }
.qt-legend { display: flex; justify-content: space-between; font-size: .75rem; font-weight: 500; margin-top: .35rem; padding-bottom: .35rem; border-bottom: 1.5px solid var(--c); }
.qt-legend .is-pro { color: var(--p); } .qt-legend .is-yr { color: var(--y); }
.qt-table { width: 100%; border-collapse: collapse; margin-top: 1.4rem; font-size: .875rem; background: none; }
.qt-table th { font-family: inherit; font-size: .7rem; font-weight: 500; color: var(--mut); text-align: left; padding: 0 0 .4rem; border-bottom: 1.5px solid var(--ink); background: none; text-transform: none; letter-spacing: 0; }
.qt-table td { padding: .5rem 0; border-bottom: 1px solid var(--rul); color: var(--ink); background: none; }
.qt-table .num { text-align: right; white-space: nowrap; padding-left: .75rem; }
.qt-table tfoot td { font-weight: 600; border-bottom: 0; }
.qt-table .qt-bonus td { font-weight: 400; color: var(--mut); font-size: .78rem; padding-top: 0; }
.qt-lines { display: grid; gap: .45rem; margin: 1.2rem 0 .9rem; }
.qt-lines > div { display: flex; justify-content: space-between; align-items: center; gap: var(--s4); background: #F2F4F8; border-left: 5px solid var(--p); padding: .6rem .9rem; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
.qt-lines > .is-yr { border-left-color: var(--y); } .qt-lines > .is-client { border-left-color: var(--c); }
.qt-lines dt { font-weight: 500; font-size: .95rem; }
.qt-lines dd { margin: 0; display: grid; text-align: right; }
.qt-lines dd b { font-size: 1.3rem; font-weight: 600; line-height: 1.2; }
.qt-lines dd span { font-size: .72rem; color: var(--mut); }
.qt-small { font-size: .76rem; color: var(--mut) !important; margin-top: .3rem !important; }
.qt-same { font-weight: 600; font-size: .95rem; margin-top: 1rem !important; }
.qt-verify span { color: var(--ink); font-weight: 500; overflow-wrap: anywhere; }
.qt-foot { margin-top: 1.6rem; padding-top: .7rem; border-top: 1px solid var(--rul); font-size: .75rem; color: var(--mut); }
.qt-printview { display: grid; gap: var(--s7); }

@media (max-width: 30rem) { .qt-lines > div { flex-direction: column; align-items: flex-start; } .qt-lines dd { text-align: left; } .qt-doc { text-align: left; margin-left: 0; } }

@media print {
  @page { size: A4; margin: 14mm; }
  .pagehead, .qt-side, .qt-noprint, .share, [data-q-example], .skip-link { display: none !important; }
  .section, .wrap, .qt-grid, .qt-preview { padding: 0 !important; margin: 0 !important; display: block !important; max-width: none !important; position: static !important; }
  .qt-paper { box-shadow: none !important; padding: 0; max-width: none; background: #fff; font-size: 10.5pt; }
}