/* ============================================================
   BlueSystm — quiz.css   ** GENERATED — DO NOT HAND-EDIT **
   Emitted by scripts/port-quiz.py from Design's two quiz files:
     design-handoff/quiz/delivered/B2B Contractor Quiz Web v2.dc.html
     design-handoff/quiz/delivered/B2B Contractor Quiz Mobile.dc.html
   Re-run the script after any new handoff; do not patch this file.

   Every rule here came off an inline style attribute. That is the whole
   point: with the page carrying no inline styles, the inline styles
   quiz-behaviors.js writes at runtime outrank this sheet by the cascade,
   so nothing here needs !important and nothing here can freeze a feature
   the script is trying to drive.

   .qN classes are positional — they are regenerated wholesale each run and
   mean nothing on their own. Reach for an id or a data- attribute in any
   hand-written rule, never a .qN.
   ============================================================ */


.q0 { position: relative; overflow: hidden; display: flex; flex-direction: column; background: var(--bg); }
.q1 { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.q2 { display: flex; align-items: center; flex-shrink: 0; height: 40px; margin-left: -4px; overflow: hidden; }
.q3 { height: 142px; width: auto; margin: 1px -14px 0 -16px; }
.q4 { display: none; font-weight: 500; letter-spacing: 0.02em; color: var(--muted); }
.q5 { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: var(--r-pill); background: rgba(255,255,255,.7); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); transition: color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard); }
.q6 { position: relative; z-index: 1; flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: flex-start; width: 100%; margin: 0 auto; }
.q7 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.q8 { display: flex; align-items: center; flex-shrink: 0; }
.q9 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q10 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q11 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q12 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q13 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q14 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q15 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q16 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q17 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q18 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q19 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q20 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q21 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q22 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q23 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q24 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q25 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q26 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q27 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q28 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q29 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q30 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q31 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q32 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q33 { display: none; align-items: center; gap: 7px; padding: 7px 12px; background: rgba(255,255,255,.86); border-width: 1px; border-style: solid; border-color: rgba(37,99,235,.2); border-radius: var(--r-pill); box-shadow: var(--e1); }
.q34 { font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.q35 { font-size: 13px; font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); white-space: nowrap; }
.q36 { position: relative; }
.q37 { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.q38 { display: flex; align-items: center; gap: 14px; }
.q39 { position: relative; display: inline-flex; width: 46px; height: 46px; align-items: center; justify-content: center; flex-shrink: 0; }
.q40 { position: absolute; inset: 0; transform: rotate(-90deg); }
.q41 { transition: stroke-dashoffset var(--dur-base) var(--ease-standard); }
.q42 { position: relative; font-size: 13px; font-weight: 800; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q43 { font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--blue); }
.q44 { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 15px 0 12px; border-width: 1px; border-style: solid; border-color: transparent; border-radius: var(--r-pill); font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); opacity: 0; pointer-events: none; transition: opacity var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard); }
.q45 { position: relative; margin: 0 -4px; padding: 0 4px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; transition: height var(--dur-base) var(--ease-standard); }
.q46 { position: relative; }
.q47 { display: block; }
.q48 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q49 { color: var(--muted); }
.q50 { margin-top: var(--sp-5); display: flex; flex-direction: column; gap: 8px; }
.q51 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q52 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q53 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q54 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q55 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q56 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q57 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q58 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q59 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q60 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q61 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q62 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q63 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q64 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q65 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q66 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q67 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q68 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q69 { display: none; }
.q70 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q71 { color: var(--muted); }
.q72 { margin-top: var(--sp-6); display: grid; gap: var(--sp-6); align-items: start; }
.q73 { display: block; font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); }
.q74 { margin-top: 12px; width: 100%; background: var(--bg); border-width: 1.5px; border-style: solid; border-color: var(--border); font-weight: 800; letter-spacing: var(--ls-tight); color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q75 { margin-top: 12px; min-height: 22px; font-size: 14px; font-weight: 600; color: var(--blue); }
.q76 { padding: var(--sp-4) var(--sp-5) var(--sp-5); background: var(--panel); border-width: 1px; border-style: solid; border-color: var(--panel-border); border-radius: 14px; box-shadow: var(--panel-inset); }
.q77 { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
.q78 { font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); }
.q79 { font-weight: 800; letter-spacing: var(--ls-tight); color: var(--dark); font-variant-numeric: tabular-nums; }
.q80 { font-size: 15px; color: var(--muted); font-weight: 600; }
.q81 { margin-top: var(--sp-4); width: 100%; }
.q82 { margin-top: 10px; display: flex; justify-content: space-between; }
.q83 { font-size: 12px; font-weight: 500; color: var(--muted); }
.q84 { font-size: 12px; font-weight: 500; color: var(--muted); }
.q85 { margin-top: var(--sp-4); font-size: 12px; line-height: 1.5; color: var(--muted); }
.q86 { margin-top: var(--sp-6); display: inline-flex; align-items: center; gap: 11px; min-height: 58px; padding: 0 34px; background-color: var(--blue); border-radius: var(--r-pill); color: #FFFFFF; font-size: 13px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-out); }
.q87 { display: none; }
.q88 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q89 { color: var(--muted); }
.q90 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q91 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q92 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q93 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q94 { margin-top: var(--sp-4); display: flex; flex-direction: column; gap: 8px; }
.q95 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q96 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q97 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q98 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q99 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q100 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q101 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q102 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q103 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q104 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q105 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q106 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q107 { display: none; }
.q108 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q109 { color: var(--muted); }
.q110 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q111 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q112 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q113 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q114 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q115 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q116 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q117 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q118 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q119 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q120 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q121 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q122 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q123 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q124 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q125 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q126 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q127 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q128 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q129 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q130 { display: none; }
.q131 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q132 { color: var(--muted); }
.q133 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q134 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q135 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q136 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q137 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q138 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q139 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q140 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q141 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q142 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q143 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q144 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q145 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q146 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q147 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q148 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q149 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); }
.q150 { display: none; }
.q151 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q152 { color: var(--muted); }
.q153 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q154 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q155 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q156 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q157 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q158 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q159 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q160 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q161 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q162 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q163 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q164 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q165 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q166 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q167 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q168 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q169 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q170 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q171 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q172 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q173 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q174 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q175 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q176 { display: none; }
.q177 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q178 { color: var(--muted); }
.q179 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q180 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q181 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q182 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q183 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q184 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q185 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q186 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q187 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q188 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q189 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q190 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q191 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q192 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q193 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q194 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q195 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q196 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q197 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q198 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q199 { display: none; }
.q200 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q201 { color: var(--muted); }
.q202 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q203 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q204 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q205 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q206 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q207 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q208 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q209 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q210 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q211 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q212 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q213 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q214 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q215 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q216 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q217 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q218 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q219 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q220 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q221 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q222 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q223 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q224 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q225 { display: none; }
.q226 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q227 { color: var(--muted); }
.q228 { margin-top: var(--sp-5); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); }
.q229 { font-size: 12px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.q230 { flex: 1; min-width: 0; min-height: 46px; background: var(--bg); border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 11px; font-size: 16px; font-weight: 600; color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q231 { width: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background-color: var(--blue); border-radius: 11px; color: #FFFFFF; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q232 { margin-top: var(--sp-4); display: grid; gap: 8px; }
.q233 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q234 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q235 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q236 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q237 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q238 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q239 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q240 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q241 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q242 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q243 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q244 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q245 { display: flex; align-items: center; border-width: 1px; border-style: solid; border-color: var(--border); border-radius: 14px; text-align: left; box-shadow: none; background-color: var(--card); transition: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.q246 { font-size: 11px; font-weight: 700; letter-spacing: var(--ls-wide); color: #C4C9D4; font-variant-numeric: tabular-nums; min-width: 16px; transition: color var(--dur-fast) var(--ease-standard); }
.q247 { font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); font-variant-numeric: tabular-nums; }
.q248 { display: none; }
.q249 { font-weight: 800; color: var(--dark); text-wrap: pretty; }
.q250 { color: var(--muted); }
.q251 { margin-top: var(--sp-5); display: grid; gap: var(--sp-5); align-items: start; }
.q252 { display: block; font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--muted); }
.q253 { margin-top: 12px; width: 100%; background: var(--bg); border-width: 1.5px; border-style: solid; border-color: var(--border); font-weight: 700; letter-spacing: var(--ls-snug); color: var(--dark); outline: none; transition: border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q254 { margin-top: var(--sp-4); display: flex; align-items: flex-start; gap: 11px; cursor: pointer; }
.q255 { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--blue); flex-shrink: 0; cursor: pointer; }
.q256 { font-size: 13px; line-height: 1.5; color: var(--muted); }
.q257 { margin-top: var(--sp-5); width: 100%; min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 11px; background-color: var(--blue); border-radius: var(--r-pill); color: #FFFFFF; font-size: 13px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; opacity: .45; transition: opacity var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard); }
.q258 { padding: var(--sp-5); background: var(--panel); border-width: 1px; border-style: solid; border-color: var(--panel-border); border-radius: 14px; box-shadow: var(--panel-inset); }
.q259 { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--blue); }
.q260 { width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.q261 { margin-top: var(--sp-4); font-size: 13px; color: var(--muted); }
.q262 { margin-top: 8px; font-size: 46px; font-weight: 800; letter-spacing: var(--ls-tight); color: var(--dark); font-variant-numeric: tabular-nums; filter: blur(12px); user-select: none; }
.q263 { margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--panel-border); font-size: 13px; line-height: 1.55; color: var(--body); }
.q264 { display: none; }
.q265 { display: inline-flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--blue); }
.q266 { width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.q267 { color: var(--muted); }
.q268 { margin-top: var(--sp-3); display: flex; }
.q269 { display: flex; align-items: baseline; gap: 5px; }
.q270 { font-weight: 700; color: var(--blue); letter-spacing: var(--ls-tight); }
.q271 { line-height: .9; font-weight: 800; letter-spacing: -0.05em; color: var(--dark); font-variant-numeric: tabular-nums; }
.q272 { margin-top: var(--sp-5); display: grid; gap: var(--sp-5); align-items: start; }
.q273 { padding: var(--sp-4) var(--sp-5) var(--sp-5); background: var(--panel); border-width: 1px; border-style: solid; border-color: var(--panel-border); border-radius: 14px; box-shadow: var(--panel-inset); }
.q274 { font-size: 11px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--blue); }
.q275 { margin-top: 10px; font-size: 15px; line-height: 1.55; color: var(--dark); text-wrap: pretty; }
#resultBar { display: none; }

@media (min-width: 768px) {
  .q0 { height: 100vh; }
  .q1 { height: 62px; padding: 0 var(--sp-7); }
  .q4 { font-size: 12px; }
  .q5 { padding: 0 18px; }
  .q6 { max-width: 1180px; padding: var(--sp-3) var(--sp-7) var(--sp-5); }
  .q8 { flex-wrap: nowrap; gap: 8px; height: 44px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; margin-bottom: 10px; }
  .q37 { gap: var(--sp-4); padding: 0 0 var(--sp-4); }
  .q46 { padding: var(--sp-5) 0 var(--sp-4); }
  .q48 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q49 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q51 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q53 { font-size: 21px; }
  .q54 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q56 { font-size: 21px; }
  .q57 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q59 { font-size: 21px; }
  .q60 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q62 { font-size: 21px; }
  .q63 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q65 { font-size: 21px; }
  .q66 { gap: 16px; min-height: 62px; padding: 0 22px; }
  .q68 { font-size: 21px; }
  .q70 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q71 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q72 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  .q74 { min-height: 68px; padding: 0 20px; border-radius: 14px; font-size: 34px; }
  .q79 { font-size: 30px; }
  .q88 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q89 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q92 { padding: 0 16px; }
  .q95 { gap: 16px; min-height: 60px; padding: 0 22px; }
  .q97 { font-size: 21px; }
  .q98 { gap: 16px; min-height: 60px; padding: 0 22px; }
  .q100 { font-size: 21px; }
  .q101 { gap: 16px; min-height: 60px; padding: 0 22px; }
  .q103 { font-size: 21px; }
  .q104 { gap: 16px; min-height: 60px; padding: 0 22px; }
  .q106 { font-size: 21px; }
  .q108 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q109 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q112 { padding: 0 16px; }
  .q114 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
  .q115 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q117 { font-size: 19px; }
  .q118 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q120 { font-size: 19px; }
  .q121 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q123 { font-size: 19px; }
  .q124 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q126 { font-size: 19px; }
  .q127 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q129 { font-size: 19px; }
  .q131 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q132 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q135 { padding: 0 16px; }
  .q137 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
  .q138 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q140 { font-size: 19px; }
  .q141 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q143 { font-size: 19px; }
  .q144 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q146 { font-size: 19px; }
  .q147 { gap: 14px; min-height: 58px; padding: 0 20px; }
  .q149 { font-size: 19px; }
  .q151 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q152 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q155 { padding: 0 16px; }
  .q157 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .q158 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q160 { font-size: 20px; }
  .q161 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q163 { font-size: 20px; }
  .q164 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q166 { font-size: 20px; }
  .q167 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q169 { font-size: 20px; }
  .q170 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q172 { font-size: 20px; }
  .q173 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q175 { font-size: 20px; }
  .q177 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q178 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q181 { padding: 0 16px; }
  .q183 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .q184 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q186 { font-size: 20px; }
  .q187 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q189 { font-size: 20px; }
  .q190 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q192 { font-size: 20px; }
  .q193 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q195 { font-size: 20px; }
  .q196 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q198 { font-size: 20px; }
  .q200 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q201 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 50ch; }
  .q204 { padding: 0 16px; }
  .q206 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .q207 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q209 { font-size: 20px; }
  .q210 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q212 { font-size: 20px; }
  .q213 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q215 { font-size: 20px; }
  .q216 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q218 { font-size: 20px; }
  .q219 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q221 { font-size: 20px; }
  .q222 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q224 { font-size: 20px; }
  .q226 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q227 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 52ch; }
  .q230 { padding: 0 16px; }
  .q232 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  .q233 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q235 { font-size: 20px; }
  .q236 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q238 { font-size: 20px; }
  .q239 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q241 { font-size: 20px; }
  .q242 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q244 { font-size: 20px; }
  .q245 { gap: 14px; min-height: 60px; padding: 0 20px; }
  .q247 { font-size: 20px; }
  .q249 { font-size: 56px; line-height: 1.0; letter-spacing: -0.038em; }
  .q250 { margin-top: 12px; font-size: 16px; line-height: 1.55; max-width: 52ch; }
  .q251 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  .q253 { min-height: 68px; padding: 0 20px; border-radius: 14px; font-size: 30px; }
  .q268 { align-items: baseline; gap: 5px; flex-wrap: wrap; }
  .q270 { font-size: 34px; }
  .q271 { font-size: 72px; }
  .q272 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  .q276 { margin-top: var(--sp-4); width: 100%; min-height: 54px; display: flex; align-items: center; justify-content: center; gap: 10px; background-color: var(--blue); border-radius: var(--r-pill); color: #FFFFFF; font-size: 13px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-out); }
  .q277 { margin-top: 12px; text-align: center; font-size: 12px; line-height: 1.5; color: var(--muted); }
}

@media (max-width: 767px) {
  .q0 { width: 100%; height: 100vh; height: 100dvh; }
  .q1 { height: calc(56px + env(safe-area-inset-top, 0px)); padding: env(safe-area-inset-top, 0px) 20px 0; }
  .q4 { font-size: 11px; }
  .q5 { padding: 0 14px; }
  .q6 { overflow: hidden; padding: 10px 20px 18px; }
  .q8 { flex-wrap: wrap; align-content: flex-start; gap: 6px; min-height: 78px; margin-bottom: 8px; }
  .q37 { gap: var(--sp-3); padding: 0 0 12px; }
  .q45 { -webkit-overflow-scrolling: touch; }
  .q46 { padding: 18px 0 12px; }
  .q48 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q49 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q51 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q53 { font-size: 17px; }
  .q54 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q56 { font-size: 17px; }
  .q57 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q59 { font-size: 17px; }
  .q60 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q62 { font-size: 17px; }
  .q63 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q65 { font-size: 17px; }
  .q66 { gap: 12px; min-height: 56px; padding: 0 16px; }
  .q68 { font-size: 17px; }
  .q70 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q71 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q72 { grid-template-columns: 1fr; }
  .q74 { min-height: 56px; padding: 0 16px; border-radius: 12px; font-size: 26px; }
  .q79 { font-size: 24px; }
  .q88 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q89 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q92 { padding: 0 12px; }
  .q95 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q97 { font-size: 17px; }
  .q98 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q100 { font-size: 17px; }
  .q101 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q103 { font-size: 17px; }
  .q104 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q106 { font-size: 17px; }
  .q108 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q109 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q112 { padding: 0 12px; }
  .q114 { grid-template-columns: 1fr; }
  .q115 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q117 { font-size: 16px; }
  .q118 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q120 { font-size: 16px; }
  .q121 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q123 { font-size: 16px; }
  .q124 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q126 { font-size: 16px; }
  .q127 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q129 { font-size: 16px; }
  .q131 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q132 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q135 { padding: 0 12px; }
  .q137 { grid-template-columns: 1fr; }
  .q138 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q140 { font-size: 16px; }
  .q141 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q143 { font-size: 16px; }
  .q144 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q146 { font-size: 16px; }
  .q147 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q149 { font-size: 16px; }
  .q151 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q152 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q155 { padding: 0 12px; }
  .q157 { grid-template-columns: 1fr; }
  .q158 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q160 { font-size: 16px; }
  .q161 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q163 { font-size: 16px; }
  .q164 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q166 { font-size: 16px; }
  .q167 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q169 { font-size: 16px; }
  .q170 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q172 { font-size: 16px; }
  .q173 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q175 { font-size: 16px; }
  .q177 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q178 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q181 { padding: 0 12px; }
  .q183 { grid-template-columns: 1fr; }
  .q184 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q186 { font-size: 16px; }
  .q187 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q189 { font-size: 16px; }
  .q190 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q192 { font-size: 16px; }
  .q193 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q195 { font-size: 16px; }
  .q196 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q198 { font-size: 16px; }
  .q200 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q201 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q204 { padding: 0 12px; }
  .q206 { grid-template-columns: 1fr; }
  .q207 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q209 { font-size: 16px; }
  .q210 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q212 { font-size: 16px; }
  .q213 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q215 { font-size: 16px; }
  .q216 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q218 { font-size: 16px; }
  .q219 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q221 { font-size: 16px; }
  .q222 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q224 { font-size: 16px; }
  .q226 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q227 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q230 { padding: 0 12px; }
  .q232 { grid-template-columns: 1fr; }
  .q233 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q235 { font-size: 16px; }
  .q236 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q238 { font-size: 16px; }
  .q239 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q241 { font-size: 16px; }
  .q242 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q244 { font-size: 16px; }
  .q245 { gap: 12px; min-height: 54px; padding: 0 16px; }
  .q247 { font-size: 16px; }
  .q249 { font-size: 30px; line-height: 1.08; letter-spacing: var(--ls-tight); }
  .q250 { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .q251 { grid-template-columns: 1fr; }
  .q253 { min-height: 56px; padding: 0 16px; border-radius: 12px; font-size: 24px; }
  .q268 { flex-direction: column; align-items: flex-start; }
  .q270 { font-size: 24px; }
  .q271 { font-size: 46px; }
  .q272 { grid-template-columns: 1fr; }
  .q276 { display: none; }
  .q277 { display: none; }
  .q278 { position: relative; z-index: 2; flex-shrink: 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--frost); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-top: 1px solid var(--border); }
  .q279 { width: 100%; min-height: 52px; display: flex; align-items: center; justify-content: center; gap: 10px; background-color: var(--blue); border-radius: var(--r-pill); color: #FFFFFF; font-size: 13px; font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; box-shadow: var(--e1); transition: background-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
  .q280 { margin-top: 8px; text-align: center; font-size: 11px; line-height: 1.45; color: var(--muted); }
}

/* BlueSystm — quiz: rail follows the pills (phone only). The Q1 tile grid was reverted 2026-09-12.
   Source of truth: design/B2B Contractor Quiz Mobile v2.dc.html (2026-08-31).

   APPEND THIS BLOCK TO THE END of assets/css/quiz.css (or fold each rule into
   the existing @media (max-width: 767px) block). All selectors are the
   generated .qN classes from scripts/port-quiz.py at commit bb76f92 — if the
   port is re-run and the numbering shifts, re-map: .q8 = #chipRail,
   .q50 = Q1's option container, .q51/.q54/.q57/.q60/.q63/.q66 = the six trade
   buttons, .q52… = their key spans, .q53… = their label spans.

   No JS change: quiz-behaviors.js syncRail() already hides the rail on step 1
   at phone width. Desktop is untouched — everything here is inside the phone
   media query. */

@media (max-width: 767px) {
  /* THE RAIL FOLLOWS THE PILLS. Drop the two reserved wrap-rows: the header
     divider now sits directly under however many pill rows exist — top of the
     card on Q1 (rail hidden), one row down on Q2, two once the chips wrap.
     The step-swap curtain absorbs the shift; the bay's ResizeObserver already
     watches #chipRail, so the card re-measures on every wrap. */
  .q8 { min-height: 0; margin-bottom: 12px; }

  /* Q1 stays as ROWS. The 2×3 tile grid that lived here (2026-08-31) was
     taken back out on 2026-09-12 — David wants the six trades as the full-width
     rows Design shipped. Nothing else in this block changed. */
}