/*
 * 3ds Company Brief: form stylesheet.
 * Port of reference/extracted/brief.css (verbatim rules, same order) with:
 *   - colours, radii, motion and sizes as --q-* tokens (docs/design-analysis.md §6)
 *   - the prototype's inline style="{{…}}" states as attribute/class rules (D-040)
 *   - self-hosted fonts, licensed fallbacks dropped (D-029, D-038)
 * The asymmetric radius (big bottom-right corner) is the brand signature: never make it uniform.
 */

/* ---------- fonts (original unicode-ranges; variable woff2) ---------- */
@font-face {
  font-family: 'Commissioner'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/commissioner-variable-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Commissioner'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/commissioner-variable-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope'; font-style: normal; font-weight: 700 800; font-display: swap;
  src: url("../fonts/manrope-variable-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope'; font-style: normal; font-weight: 700 800; font-display: swap;
  src: url("../fonts/manrope-variable-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- tokens ---------- */
:root {
  --q-blue: #004CFA;
  --q-yellow: #FFDB4E;
  --q-grey: #E2E2E2;
  --q-black: #000000;
  --q-white: #FFFFFF;
  --q-error: #C8001E;
  --q-border: rgba(0,0,0,.4);
  --q-border-soft: rgba(0,0,0,.18);
  --q-muted: rgba(0,0,0,.64);
  --q-muted-2: rgba(0,0,0,.7);
  --q-muted-3: rgba(0,0,0,.72);
  --q-unfilled: rgba(0,0,0,.6);
  --q-placeholder: rgba(0,0,0,.55);
  --q-elbow: rgba(0,0,0,.45);
  --q-on-blue-track: rgba(255,255,255,.26);
  --q-on-blue-locked-name: rgba(255,255,255,.62);
  --q-on-blue-locked-num: rgba(255,255,255,.6);
  --q-on-blue-locked-bd: rgba(255,255,255,.4);
  --q-on-blue-bd: rgba(255,255,255,.8);
  --q-nav-bg: rgba(255,255,255,.94);

  --q-font-body: 'Commissioner', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --q-font-display: 'Manrope', system-ui, sans-serif;

  --q-r-btn: 5px 5px 20px 5px;
  --q-r-input: 5px 5px 18px 5px;
  --q-r-chip: 5px 5px 16px 5px;
  --q-r-drop: 6px 6px 26px 6px;
  --q-r-badge-mobile: 5px 5px 22px 5px;
  --q-r-tile: 6px 6px 34px 6px;
  --q-r-swatch: 6px 6px 30px 6px;
  --q-r-sitemap: 6px 6px 28px 6px;
  --q-r-step: 4px 4px 15px 4px;
  --q-r-icon: 4px 4px 18px 4px;
  --q-r-icon-sm: 4px 4px 14px 4px;
  --q-r-skipbtn: 4px 4px 12px 4px;
  --q-r-mini: 3px 3px 10px 3px;
  --q-r-scroll: 4px 4px 10px 4px;
  --q-r-track: 2px 2px 6px 2px;

  --q-ease-out: cubic-bezier(.16,1,.3,1);
  --q-t-fast: .16s;
  --q-t-step: .2s;
  --q-t-enter: .62s;
  --q-t-progress: .7s;

  --q-rail-w: 360px;
  --q-stage-max: 900px;
}

[hidden]{display:none!important}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
html{color-scheme:light;scroll-padding-top:24px;scroll-padding-bottom:120px}
button,a,label,input,textarea{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.q-skip{
  position:absolute;left:12px;top:12px;z-index:20;background:var(--q-yellow);color:var(--q-blue);font-weight:700;font-size:15px;
  padding:12px 18px;border-radius:var(--q-r-icon-sm);text-decoration:none;transform:translateY(-220%);
}
.q-skip:focus{transform:none}
.q-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.q-err{display:flex;align-items:flex-start;gap:8px;margin:10px 0 0;font-size:14px;font-weight:700;color:var(--q-error);line-height:1.45}
.q-err svg{width:16px;height:16px;flex-shrink:0;margin-top:2px}
.q-in[aria-invalid="true"],.q-ta[aria-invalid="true"]{border-color:var(--q-error);box-shadow:0 0 0 1px var(--q-error)}
.q-undo{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;font-size:14px;padding:6px 6px 0}
.q-skipbtn{
  margin-top:12px;border:1px dashed;border-radius:var(--q-r-skipbtn);background:none;font-family:inherit;
  font-size:13.5px;font-weight:700;padding:9px 15px;min-height:42px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;transition:background var(--q-t-fast) ease,border-color var(--q-t-fast) ease,color var(--q-t-fast) ease;
  /* state: off (prototype skip.*.bg/fg/bd) */
  background:transparent;color:var(--q-muted-3);border-color:var(--q-border);
}
.q-skipbtn[aria-pressed="true"]{background:var(--q-yellow);color:var(--q-blue);border-color:var(--q-yellow)}
.q-skipbtn:hover{border-color:var(--q-blue)}
.q-skipbtn[aria-pressed="false"] .q-skip-on,.q-skipbtn[aria-pressed="true"] .q-skip-off{display:none}
body{
  background:var(--q-white);color:var(--q-black);
  font-family:var(--q-font-body);
  font-weight:400;font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;caret-color:var(--q-blue);
}
::selection{background:var(--q-yellow);color:var(--q-blue)}
a{color:var(--q-blue);text-underline-offset:3px;text-decoration-thickness:1.5px}
a:hover{color:var(--q-black)}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--q-white)}
::-webkit-scrollbar-thumb{background:var(--q-grey);border:3px solid var(--q-white);border-radius:var(--q-r-scroll)}
::-webkit-scrollbar-thumb:hover{background:var(--q-blue)}
:focus-visible{outline:2px solid var(--q-blue);outline-offset:3px}
.q-rail :focus-visible,.q-top :focus-visible{outline-color:var(--q-yellow)}

/* ---------- app root (prototype canvas div) ---------- */
.q-app{width:100%;min-height:100vh;display:flex;align-items:stretch;background:var(--q-white);position:relative}

/* ---------- display type ---------- */
.q-display{font-family:var(--q-font-display);font-weight:800;letter-spacing:-.025em}
.q-bar{display:block;width:46px;height:5px;background:var(--q-blue)}

/* ---------- rail (primary-blue, full bleed) ---------- */
.q-rail{
  width:var(--q-rail-w);flex-shrink:0;background:var(--q-blue);color:var(--q-white);
  display:flex;flex-direction:column;position:relative;
}
.q-rail-in{position:sticky;top:0;display:flex;flex-direction:column;padding:40px 36px 40px}
.q-logo{display:block;width:196px;height:auto;margin:-12px 0 0 -2px}
.q-logo-compact{display:block;width:62px;height:auto;margin:-6px 0 -6px -2px}
.q-rail-title{font-size:36px;line-height:1.02;margin:28px 0 0;color:var(--q-white)}
.q-rail .q-bar{background:var(--q-yellow);margin-top:14px}
.q-rail-sub{font-size:15px;font-weight:300;color:var(--q-white);margin:18px 0 34px;max-width:27ch;line-height:1.5}
.q-spine{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.q-step{
  width:100%;display:flex;align-items:center;gap:14px;background:none;border:0;
  padding:8px 10px 8px 0;cursor:pointer;text-align:left;font-family:inherit;font-size:15px;line-height:1.3;
  color:var(--q-white);font-weight:400;
}
.q-step:disabled{cursor:default}
.q-step:hover:not(:disabled) .q-step-name{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.q-step-n{
  width:36px;height:36px;flex-shrink:0;border:1.5px solid;border-radius:var(--q-r-step);padding:6px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--q-font-display);font-size:13px;font-weight:800;
  transition:background var(--q-t-step) ease,border-color var(--q-t-step) ease,color var(--q-t-step) ease;
  background:transparent;border-color:var(--q-on-blue-bd);color:var(--q-white);
}
.q-step-n svg{width:16px;height:16px;display:block}
/* states (prototype stepList numBg/numBd/numFg/nameFg/nameW) */
.q-step:disabled{color:var(--q-on-blue-locked-name)}
.q-step:disabled .q-step-n{border-color:var(--q-on-blue-locked-bd);color:var(--q-on-blue-locked-num)}
.q-step.is-done .q-step-n{background:var(--q-yellow);border-color:var(--q-yellow);color:var(--q-blue)}
.q-step[aria-current="step"]{font-weight:700}
.q-step[aria-current="step"] .q-step-n{background:var(--q-white);border-color:var(--q-white);color:var(--q-blue)}
.q-step .q-step-tick,.q-step.is-done .q-step-num{display:none}
.q-step.is-done .q-step-tick{display:block}
.q-prog{margin-top:30px}
.q-prog-row{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;margin-bottom:10px}
.q-prog-num{font-family:var(--q-font-display);font-size:22px;font-weight:800}
.q-prog-track{height:6px;background:var(--q-on-blue-track);border-radius:var(--q-r-track)}
.q-prog-fill{height:100%;width:100%;background:var(--q-yellow);border-radius:var(--q-r-track);transform-origin:left center;transform:scaleX(0);transition:transform var(--q-t-progress) var(--q-ease-out)}
.q-rail-note{font-size:13px;font-weight:300;margin:14px 0 0;line-height:1.5;color:var(--q-white)}

/* ---------- mobile bar ---------- */
.q-top{display:none;background:var(--q-blue);color:var(--q-white);padding:18px 20px 18px;flex-direction:column;gap:12px}
.q-top-row{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px}

/* ---------- main ---------- */
.q-main{flex-grow:1;min-width:0;display:flex;flex-direction:column;background:var(--q-white)}
.q-main:focus{outline:none}
.q-stage{flex-grow:1;padding:72px 88px 48px;max-width:var(--q-stage-max);width:100%;animation:qIn var(--q-t-enter) var(--q-ease-out) both}
@keyframes qIn{from{opacity:0;transform:translateY(18px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
@media (prefers-reduced-motion:reduce){.q-stage{animation:none}.q-prog-fill{transition:none}}

.q-head{display:flex;align-items:flex-start;gap:22px;margin-bottom:26px}
.q-badge{
  width:62px;height:62px;flex-shrink:0;background:var(--q-yellow);color:var(--q-blue);border-radius:var(--q-r-drop);padding:8px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--q-font-display);font-size:22px;font-weight:800;letter-spacing:-.02em;
}
.q-badge svg{width:28px;height:28px}
.q-h1{font-size:46px;line-height:1.04;color:var(--q-blue);margin:4px 0 0;text-wrap:balance}
.q-h1:focus{outline:none}
.q-h1--hero{font-size:60px}
.q-head .q-bar{margin-top:16px}
.q-lead{font-size:18px;font-weight:300;line-height:1.6;margin:0 0 44px;max-width:60ch;text-wrap:pretty}
.q-lead strong{font-weight:700}
.q-legend{font-size:13.5px;color:var(--q-muted);margin:-28px 0 36px}

.q-field{margin-bottom:42px}
.q-lbl{display:block;font-size:16.5px;font-weight:700;margin-bottom:5px}
.q-req{color:var(--q-blue);font-weight:700}
.q-opt{font-weight:300;color:var(--q-muted);font-size:14px}
.q-hint{font-size:14px;color:var(--q-muted);margin:0 0 14px;max-width:64ch;line-height:1.5}
.q-hint--after{margin:8px 0 0}
.q-in,.q-ta{
  width:100%;font-family:inherit;font-size:16px;font-weight:400;color:var(--q-black);line-height:1.55;
  background:var(--q-white);border:1px solid var(--q-border);border-radius:var(--q-r-input);padding:14px 16px;
  transition:border-color var(--q-t-fast) ease,box-shadow var(--q-t-fast) ease;
}
.q-ta{min-height:128px;resize:vertical;display:block}
.q-ta--88{min-height:88px}
.q-ta--96{min-height:96px}
.q-ta--104{min-height:104px}
.q-in:hover,.q-ta:hover{border-color:var(--q-black)}
.q-in:focus,.q-ta:focus{outline:none;border-color:var(--q-blue);box-shadow:0 0 0 1px var(--q-blue)}
.q-in::placeholder,.q-ta::placeholder{color:var(--q-placeholder)}
.q-note{margin-top:14px;min-height:88px}
.q-note--palette{margin-top:18px}

.q-chips{display:flex;flex-wrap:wrap;gap:9px}
.q-chip{
  font-family:inherit;font-size:15px;font-weight:400;cursor:pointer;
  border:1px solid;border-radius:var(--q-r-chip);padding:9px 18px;min-height:44px;
  display:inline-flex;align-items:center;gap:8px;
  transition:border-color var(--q-t-fast) ease,background var(--q-t-fast) ease,color var(--q-t-fast) ease;
  /* state: off (prototype c.bg/fg/bd) */
  background:var(--q-white);color:var(--q-black);border-color:var(--q-border);
}
.q-chip[aria-pressed="true"]{background:var(--q-blue);color:var(--q-white);border-color:var(--q-blue)}
.q-chip:hover{border-color:var(--q-blue)}
.q-chip-tick{width:14px;height:14px;flex-shrink:0}
.q-chip[aria-pressed="false"] .q-chip-tick{display:none}

/* ---------- upload ---------- */
.q-drop{
  position:relative;display:flex;align-items:center;gap:18px;padding:22px 24px;
  border:1.5px dashed var(--q-border);border-radius:var(--q-r-drop);background:var(--q-white);
  cursor:pointer;transition:border-color var(--q-t-fast) ease;
}
.q-drop:hover{border-color:var(--q-blue)}
.q-drop:focus-within{border-color:var(--q-blue);border-style:solid}
.q-drop.is-over{border-color:var(--q-blue);border-style:solid}
.q-drop:has(input[aria-invalid="true"]){border-color:var(--q-error)}
.q-drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.q-drop-ico{
  width:48px;height:48px;flex-shrink:0;background:var(--q-yellow);color:var(--q-blue);border-radius:var(--q-r-icon);padding:12px;
  display:flex;align-items:center;justify-content:center;
}
.q-drop-ico svg{width:22px;height:22px}
.q-drop-txt{display:flex;flex-direction:column;gap:2px}
.q-drop-t{font-size:15.5px;font-weight:700}
.q-drop-t--sm{font-size:14.5px}
.q-drop-s{font-size:13.5px;color:var(--q-muted)}
.q-drop-sm{padding:16px 20px;margin-top:12px}
.q-drop--flush{margin-top:0}
.q-drop-sm .q-drop-ico{width:38px;height:38px;padding:9px;border-radius:var(--q-r-icon-sm)}
.q-drop-sm .q-drop-ico svg{width:18px;height:18px}
.q-files{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.q-file{display:flex;align-items:center;flex-wrap:wrap;gap:12px;background:var(--q-grey);border-radius:var(--q-r-icon-sm);padding:11px 16px;font-size:14.5px}
.q-file-n{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.q-file-s{font-size:13px;color:var(--q-muted-2);font-variant-numeric:tabular-nums;flex-shrink:0}
.q-file-ok{width:17px;height:17px;color:var(--q-blue);flex-shrink:0}
/* product states (D-042) */
.q-file.is-busy .q-file-ok{opacity:.35}
.q-file.is-err{background:var(--q-white);box-shadow:inset 0 0 0 1px var(--q-error)}
.q-file.is-err .q-file-ok{color:var(--q-error)}
.q-file-e{flex-basis:100%;font-size:13.5px;font-weight:700;color:var(--q-error);margin-top:-4px}

/* ---------- sitemap ---------- */
.q-sitemap{margin-top:16px;background:var(--q-grey);border-radius:var(--q-r-sitemap);padding:10px;display:flex;flex-direction:column;gap:6px}
.q-pages{display:flex;flex-direction:column;gap:6px}
.q-pages:empty{display:none}
.q-page{display:flex;align-items:center;gap:14px;background:var(--q-white);border-radius:4px;padding:10px 10px 10px 16px}
.q-page{outline-offset:-1.5px}
.q-page--l1{margin-left:30px}
.q-page--l2{margin-left:60px}
.q-page.is-target{outline:1.5px solid var(--q-blue)}
.q-page-n{font-family:var(--q-font-display);font-size:14px;font-weight:800;color:var(--q-blue);font-variant-numeric:tabular-nums;min-width:24px;flex-shrink:0}
.q-page-t{flex-grow:1;min-width:0;font-size:15.5px;overflow-wrap:anywhere}
.q-page--l0 .q-page-t{font-weight:700}
.q-elbow{width:14px;height:14px;color:var(--q-elbow);flex-shrink:0;margin-left:-4px}
.q-page-acts{display:flex;align-items:center;gap:2px;flex-shrink:0}
.q-sub{
  border:0;background:none;font-family:inherit;font-size:13.5px;font-weight:700;color:var(--q-blue);cursor:pointer;
  padding:6px 10px;min-height:34px;border-radius:var(--q-r-mini);display:inline-flex;align-items:center;gap:6px;
  transition:background var(--q-t-fast) ease;
}
.q-sub:hover{background:var(--q-yellow)}
.q-sub svg{width:13px;height:13px}
.q-addctx{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;font-size:14px;padding:6px 6px 0}
.q-cancel{background:none;border:0;font-family:inherit;font-size:14px;font-weight:700;color:var(--q-blue);cursor:pointer;padding:4px 6px;text-decoration:underline;text-underline-offset:3px}
.q-tree-help{font-size:13px;color:var(--q-muted-2);padding:4px 6px 2px;margin:0}

/* ---------- domain ---------- */
.q-seg{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:16px}
.q-err--seg{margin:-4px 0 14px}
.q-skipbtn--seg{margin-top:0;margin-bottom:14px}
.q-dom-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px}
.q-sublbl{display:block;font-size:14px;font-weight:700;margin-bottom:6px}
.q-sublbl--gap{margin-top:20px}
.q-url{display:flex;align-items:stretch}
.q-url-pre{display:flex;align-items:center;padding:0 12px 0 16px;background:var(--q-grey);border:1px solid var(--q-border);border-right:0;border-radius:5px 0 0 5px;font-size:15px;color:var(--q-muted-3)}
.q-url .q-in{border-radius:0 5px 18px 0}
.q-page-empty{padding:14px 16px;font-size:14.5px;color:var(--q-muted-2)}
.q-x{
  width:34px;height:34px;flex-shrink:0;border:0;background:none;border-radius:var(--q-r-skipbtn);color:var(--q-muted);
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:8px;transition:background var(--q-t-fast) ease,color var(--q-t-fast) ease;
}
.q-x:hover{background:var(--q-grey);color:var(--q-black)}
.q-x svg{width:15px;height:15px}
.q-addrow{display:flex;gap:8px;padding-top:4px}
.q-addrow .q-in{border-color:transparent}
.q-addrow .q-in:focus{border-color:var(--q-blue)}
.q-add{
  flex-shrink:0;min-height:48px;padding:0 20px;border:0;border-radius:var(--q-r-input);
  background:var(--q-yellow);color:var(--q-blue);font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;transition:background var(--q-t-fast) ease,color var(--q-t-fast) ease;
}
.q-add:hover{background:var(--q-blue);color:var(--q-white)}
.q-add svg{width:16px;height:16px}

/* ---------- palette ---------- */
.q-sw-row{display:flex;flex-wrap:wrap;gap:14px}
.q-sw{display:flex;flex-direction:column;gap:8px;width:112px}
.q-sw-box{position:relative;height:88px;border-radius:var(--q-r-swatch);border:1.5px dashed var(--q-border);background:var(--q-white)}
.q-sw.is-set .q-sw-box{border-style:solid;border-color:var(--q-border-soft)}
.q-sw-box input{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;opacity:0;cursor:pointer}
.q-sw-box:focus-within{outline:2px solid var(--q-blue);outline-offset:3px}
.q-sw-l{font-size:13.5px;font-weight:700}
.q-sw-h{font-size:12.5px;color:var(--q-muted);font-variant-numeric:tabular-nums;letter-spacing:.02em}

/* ---------- nav ---------- */
.q-nav{
  position:sticky;bottom:0;display:flex;align-items:center;gap:16px;
  padding:18px 88px max(18px, env(safe-area-inset-bottom));border-top:1px solid var(--q-grey);background:var(--q-nav-bg);backdrop-filter:blur(10px);
}
.q-blocked{font-size:14px;color:var(--q-muted-2);flex-grow:1;display:flex;align-items:center;gap:10px}
.q-blocked-ico{width:26px;height:26px;flex-shrink:0;background:var(--q-yellow);color:var(--q-blue);border-radius:var(--q-r-mini);padding:5px;display:flex;align-items:center;justify-content:center}
.q-blocked-ico svg{width:15px;height:15px}
.q-spacer{flex-grow:1}
.q-btn{
  min-height:50px;padding:0 28px;border-radius:var(--q-r-btn);font-family:inherit;font-size:16px;font-weight:700;
  cursor:pointer;display:inline-flex;align-items:center;gap:10px;border:1.5px solid;
  transition:background var(--q-t-fast) ease,border-color var(--q-t-fast) ease,color var(--q-t-fast) ease;
}
.q-btn svg{width:18px;height:18px;transition:transform var(--q-t-step) var(--q-ease-out)}
.q-btn:hover:not(:disabled) svg{transform:translateX(3px)}
.q-ghost{background:var(--q-white);border-color:var(--q-border);color:var(--q-black)}
.q-ghost:hover{border-color:var(--q-black)}
.q-ghost:hover svg{transform:translateX(-3px)}
.q-primary{color:var(--q-white);background:var(--q-blue);border-color:var(--q-blue)}
.q-primary:hover:not(:disabled){background:var(--q-black);border-color:var(--q-black)}
.q-primary:disabled{cursor:not-allowed}
.q-btn[aria-busy="true"]{cursor:progress;opacity:.75}

/* ---------- intro tiles ---------- */
.q-kit{list-style:none;margin:0 0 44px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.q-kit li{padding:22px 24px 26px;border-radius:var(--q-r-tile);display:flex;flex-direction:column;gap:12px}
.q-kit-1{background:var(--q-blue);color:var(--q-white)}
.q-kit-2{background:var(--q-yellow);color:var(--q-black)}
.q-kit-3{background:var(--q-grey);color:var(--q-black)}
.q-kit-4{background:var(--q-white);color:var(--q-black);border:1.5px solid var(--q-blue)}
.q-kit svg{width:24px;height:24px}
.q-kit-t{font-size:16px;font-weight:700;display:block;margin-bottom:3px}
.q-kit-t--blue{color:var(--q-blue)}
.q-kit-s{font-size:14px;font-weight:300;line-height:1.5}
.q-start{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.q-start-note{font-size:14px;color:var(--q-muted)}

/* ---------- review & done ---------- */
.q-sum{list-style:none;margin:0 0 36px;padding:0}
.q-sum li{display:flex;gap:22px;align-items:baseline;padding:16px 4px;border-bottom:1px solid var(--q-grey)}
.q-sum li:first-child{border-top:1px solid var(--q-grey)}
.q-sum-l{width:220px;flex-shrink:0;font-size:14.5px;font-weight:700}
.q-sum-v{flex-grow:1;min-width:0;font-size:15px;font-weight:300;line-height:1.55;overflow-wrap:anywhere;color:var(--q-black)}
.q-sum-v.is-empty{color:var(--q-unfilled)}
.q-edit{background:none;border:0;padding:4px 8px;font-family:inherit;font-size:14px;font-weight:700;color:var(--q-blue);cursor:pointer;flex-shrink:0;border-radius:var(--q-r-mini)}
.q-edit:hover{background:var(--q-yellow)}
.is-submitted .q-edit{display:none}
.q-done{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.q-done .q-bar{margin-top:16px}
.q-done .q-lead{margin:0}
.q-done-note{font-size:15px;font-weight:300;margin:0}
.q-done .q-btn{margin-top:6px}

/* ---------- product additions (D-037, PLAN §4) ---------- */
.q-consent{margin:0 0 8px}
.q-check{display:flex;align-items:flex-start;gap:12px;font-size:15px;font-weight:300;line-height:1.55;max-width:64ch;cursor:pointer}
.q-check input{width:22px;height:22px;margin:1px 0 0;flex-shrink:0;accent-color:var(--q-blue);cursor:pointer}
.q-check input[aria-invalid="true"]{outline:2px solid var(--q-error);outline-offset:2px}
.is-submitted .q-consent{display:none}
.q-hp{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.q-noscript{margin:24px 22px;padding:16px 20px;background:var(--q-yellow);color:var(--q-blue);font-weight:700;border-radius:var(--q-r-input)}

/* ---------- v3 additions (D-051): status rows, grids, table rows ---------- */
/* status option row: the prototype's skip toggle, one per offered status, mutually exclusive */
.q-status{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.q-status .q-skipbtn{margin-top:0}
.q-status--seg{margin:0 0 14px}
.q-chip:disabled{opacity:.42;cursor:not-allowed;border-color:var(--q-border)}
.q-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 14px}
.q-grid2 .q-err{margin-top:6px}
.q-note-in{margin-top:14px}
input[type="date"].q-in{min-height:54px}
.q-rows{display:flex;flex-direction:column;gap:10px}
.q-rowcard{
  position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;
  background:var(--q-grey);border-radius:var(--q-r-sitemap);padding:16px 56px 18px 18px;
}
.q-rowcard--references{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.q-rowcell .q-in{border-color:transparent}
.q-rowcell .q-in:focus{border-color:var(--q-blue)}
.q-rowx{position:absolute;top:10px;right:10px}
.q-rows[aria-invalid="true"] .q-rowcard{box-shadow:inset 0 0 0 1px var(--q-error)}
.q-add--row{margin-top:10px}
.q-sum li.q-sum-step{
  display:block;padding:26px 4px 10px;border:0;font-family:var(--q-font-display);font-weight:800;
  font-size:15px;color:var(--q-blue);letter-spacing:-.01em
}
.q-sum li.q-sum-step:first-child{border-top:0;padding-top:0}

/* ---------- unsaved-answers warning (D-061), completion link (D-058), message page ---------- */
.q-warn{display:flex;align-items:flex-start;gap:10px;margin:28px 0 0;max-width:62ch;font-size:14.5px;line-height:1.5;
  background:#FFF7D6;color:var(--q-black);padding:12px 16px;border-radius:var(--q-r-skipbtn)}
.q-warn svg{width:18px;height:18px;flex-shrink:0;margin-top:1px;color:var(--q-blue)}
.q-top-note{margin:0;font-size:12.5px;font-weight:300;opacity:.9;line-height:1.45}
.q-complete-banner{display:flex;flex-direction:column;gap:2px;margin:24px 88px 0;max-width:724px;padding:14px 18px;
  background:var(--q-yellow);color:var(--q-black);border-radius:var(--q-r-input);font-size:14.5px;line-height:1.5}
.q-complete-banner b{color:var(--q-blue);font-family:var(--q-font-display);font-weight:800}
.is-completing .q-legend{display:none}
.q-later{background:var(--q-grey);border-radius:var(--q-r-drop);padding:18px 20px;max-width:62ch}
.q-later p{margin:0 0 12px;font-size:15px;line-height:1.55}
.q-later-row{display:flex;gap:8px}
.q-later-row .q-in{font-size:14px;background:var(--q-white)}
.q-msg{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;
  padding:40px 20px;background:var(--q-blue)}
.q-msg-logo{width:150px;height:auto}
.q-msg-card{background:var(--q-white);border-radius:6px 6px 40px 6px;padding:36px 40px 40px;max-width:560px;width:100%}
.q-msg-card .q-h1{font-size:34px}
.q-msg-card .q-bar{margin:14px 0 18px}
.q-msg-card .q-lead{margin:0}

@media (max-width:1000px){
  .q-complete-banner{margin:20px 22px 0}
  .q-later-row{flex-direction:column}
  .q-grid2,.q-rowcard,.q-rowcard--references{grid-template-columns:minmax(0,1fr)}
  .q-rail{display:none}
  .q-top{display:flex}
  .q-stage{padding:40px 22px 32px}
  .q-nav{padding:14px 22px}
  .q-h1{font-size:34px}
  .q-h1--hero{font-size:60px}
  .q-badge{width:50px;height:50px;font-size:18px;border-radius:var(--q-r-badge-mobile)}
  .q-head{gap:16px}
  .q-kit{grid-template-columns:minmax(0,1fr)}
  .q-sum li{flex-wrap:wrap;gap:6px 14px}
  .q-sum-l{width:100%}
  .q-drop{padding:18px}
  .q-dom-grid{grid-template-columns:minmax(0,1fr)}
  .q-sub-t{display:none}
}