/* ============ GPSR Listing Fixer — Agilex+ Labs ============ */
:root{
  --navy:#0D1F3C;
  --navy-mid:#132A4F;
  --navy-soft:#1A3560;
  --amber:#E8A020;
  --amber-soft:rgba(232,160,32,.14);
  --blue:#1A5FB4;
  --blue-soft:rgba(26,95,180,.22);
  --text:#EAF0F8;
  --text-dim:#A9B8CE;
  --line:rgba(234,240,248,.12);
  --ok:#3FB47E;
  --warn:#E8A020;
  --bad:#E05A5A;
  --radius:14px;
  --font-head:"DM Sans",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--navy);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;line-height:1.6;
  min-height:100vh;display:flex;flex-direction:column;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(26,95,180,.28), transparent 60%),
    radial-gradient(700px 420px at -10% 30%, rgba(232,160,32,.07), transparent 55%);
}
h1,h2,h3,legend{font-family:var(--font-head)}
a{color:var(--amber)}
.hidden{display:none!important}

/* ---------- topbar ---------- */
.topbar{position:sticky;top:0;z-index:50;background:rgba(13,31,60,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar-inner{max-width:1120px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text)}
.brand-mark{width:32px;height:32px;flex:none}
.brand-text{font-family:var(--font-head);font-weight:700;font-size:1.05rem;letter-spacing:.01em}
.brand-text em{font-style:normal;color:var(--amber)}
.topbar-tag{font-size:.78rem;color:var(--text-dim);white-space:nowrap}

/* ---------- layout ---------- */
#app{flex:1;position:relative;z-index:1;width:100%;max-width:1120px;margin:0 auto;padding:36px 20px 64px}
.view{animation:fadeup .35s ease}
@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- hero ---------- */
.hero{text-align:center;padding:36px 0 20px;max-width:780px;margin:0 auto}
.hero-kicker{display:inline-block;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--amber);background:var(--amber-soft);border:1px solid rgba(232,160,32,.35);padding:5px 14px;border-radius:999px;margin-bottom:22px}
.hero h1{font-size:clamp(1.7rem,4.4vw,2.7rem);line-height:1.18;font-weight:700}
.hero .accent{color:var(--amber)}
.hero-sub{margin:20px auto 0;color:var(--text-dim);max-width:640px}
.hero-sub strong{color:var(--text)}
.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.hero-privacy{margin-top:18px;font-size:.85rem;color:var(--text-dim)}

.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.feature-card{background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.feature-num{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:var(--amber-soft);color:var(--amber);font-family:var(--font-head);font-weight:700;margin-bottom:12px}
.feature-card h3{font-size:1.02rem;margin-bottom:6px}
.feature-card p{font-size:.88rem;color:var(--text-dim)}

/* ---------- buttons ---------- */
.btn{font-family:var(--font-head);font-weight:600;font-size:.95rem;border:none;border-radius:10px;padding:11px 22px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .12s ease;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.btn-primary{background:var(--amber);color:#20222B}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(232,160,32,.3)}
.btn-primary:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn-ghost:hover{border-color:rgba(234,240,248,.35);background:rgba(234,240,248,.04)}
.btn-lg{padding:14px 28px;font-size:1.02rem}
.btn-link{background:none;border:none;color:var(--amber);cursor:pointer;font-size:.85rem;padding:6px 0;text-decoration:underline;font-family:var(--font-body)}
.btn-copy{background:var(--blue);color:#fff;padding:7px 16px;font-size:.85rem}
.btn-copy:hover{background:#2470cd}
.btn-copy.copied{background:var(--ok)}

/* ---------- wizard ---------- */
.wizard-head{max-width:680px;margin:0 auto 26px}
.progress-track{height:6px;background:var(--navy-mid);border-radius:999px;overflow:hidden}
.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--amber));border-radius:999px;transition:width .3s ease}
.wizard-step-label{margin-top:10px;font-size:.82rem;color:var(--text-dim);text-align:right}
.q-card{max-width:680px;margin:0 auto;background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px}
.q-title{font-family:var(--font-head);font-size:1.28rem;font-weight:700;line-height:1.35}
.q-help{margin-top:8px;font-size:.88rem;color:var(--text-dim)}
.q-options{margin-top:22px;display:grid;gap:10px}
.q-opt{display:flex;gap:12px;align-items:flex-start;background:var(--navy);border:1px solid var(--line);border-radius:10px;padding:14px 16px;cursor:pointer;transition:border-color .12s,background .12s;width:100%;text-align:left;color:var(--text);font-family:var(--font-body);font-size:.95rem}
.q-opt:hover{border-color:rgba(232,160,32,.5)}
.q-opt[aria-checked="true"]{border-color:var(--amber);background:var(--amber-soft)}
.q-opt .radio{flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;border:2px solid var(--text-dim);position:relative}
.q-opt[aria-checked="true"] .radio{border-color:var(--amber)}
.q-opt[aria-checked="true"] .radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--amber)}
.q-opt .opt-label{font-weight:500}
.q-opt .opt-sub{display:block;font-size:.82rem;color:var(--text-dim);margin-top:2px}
.wizard-nav{max-width:680px;margin:24px auto 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---------- verdict ---------- */
.verdict-card{max-width:680px;margin:0 auto;background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px}
.verdict-badge{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:1rem;padding:8px 18px;border-radius:999px;margin-bottom:18px}
.verdict-badge.v-applies{background:rgba(26,95,180,.25);color:#8FBBEF;border:1px solid rgba(26,95,180,.55)}
.verdict-badge.v-excluded{background:rgba(63,180,126,.15);color:#7DDCAF;border:1px solid rgba(63,180,126,.45)}
.verdict-badge.v-edge{background:var(--amber-soft);color:var(--amber);border:1px solid rgba(232,160,32,.45)}
.verdict-card h2{font-size:1.45rem;line-height:1.3;margin-bottom:12px}
.verdict-card p{color:var(--text-dim);margin-bottom:10px}
.verdict-card p strong{color:var(--text)}
.verdict-cites{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.cite-pill{font-family:var(--font-mono);font-size:.75rem;background:var(--navy);border:1px solid var(--line);color:var(--text-dim);padding:5px 10px;border-radius:7px;text-decoration:none}
.cite-pill:hover{border-color:var(--amber);color:var(--amber)}
.verdict-flags{margin-top:16px;display:grid;gap:10px}

/* ---------- callouts ---------- */
.callout{border-radius:10px;padding:14px 16px;font-size:.88rem;line-height:1.55;border:1px solid}
.callout-warn{background:var(--amber-soft);border-color:rgba(232,160,32,.4);color:#F2CE93}
.callout-info{background:var(--blue-soft);border-color:rgba(26,95,180,.5);color:#B9D4F3}
.callout a{color:inherit;text-decoration:underline}

/* ---------- details form ---------- */
.section-title{font-size:1.55rem;margin-bottom:6px}
.section-sub{color:var(--text-dim);margin-bottom:26px;max-width:640px}
.req{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--amber);background:var(--amber-soft);padding:2px 7px;border-radius:5px;vertical-align:middle}
.hint-inline{font-size:.8rem;color:var(--text-dim);font-weight:400}
.form-group{border:1px solid var(--line);background:var(--navy-mid);border-radius:var(--radius);padding:22px;margin-bottom:18px}
.form-group legend{font-weight:700;font-size:1.02rem;padding:0 10px;margin-left:-10px}
.cite-chip{font-family:var(--font-mono);font-size:.68rem;color:var(--text-dim);background:var(--navy);border:1px solid var(--line);padding:2px 8px;border-radius:6px;margin-left:8px;vertical-align:middle;font-weight:400}
.group-note{font-size:.87rem;color:var(--text-dim);margin:6px 0 16px;max-width:70ch}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field-wide{grid-column:1/-1}
.field label{font-size:.86rem;font-weight:500}
.field input[type=text],.field input[type=email],.field textarea{
  background:var(--navy);border:1px solid var(--line);border-radius:9px;color:var(--text);
  font-family:var(--font-body);font-size:.93rem;padding:11px 13px;width:100%;
  transition:border-color .12s;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--amber)}
.field input.invalid,.field textarea.invalid{border-color:var(--bad)}
.field-hint{font-size:.8rem;color:var(--text-dim)}
.field-check{grid-column:1/-1;justify-content:center}
.check-label{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;cursor:pointer;color:var(--text)}
.check-label input{accent-color:var(--amber);width:17px;height:17px;margin-top:2px;flex:none}
.rp-toggle{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:16px}

/* ---------- chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--navy);border:1px solid var(--line);color:var(--text-dim);border-radius:999px;padding:7px 15px;font-size:.85rem;cursor:pointer;font-family:var(--font-body);transition:all .12s}
.chip:hover{border-color:rgba(232,160,32,.5);color:var(--text)}
.chip[aria-pressed="true"]{background:var(--amber-soft);border-color:var(--amber);color:var(--amber);font-weight:600}
.chip-row-mkt .chip[aria-pressed="true"]{background:var(--blue-soft);border-color:var(--blue);color:#9CC4F0}

/* ---------- results ---------- */
.results-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.col-title{font-size:1.05rem;margin-bottom:14px;color:var(--text)}
.matrix{list-style:none;display:grid;gap:10px}
.matrix li{display:flex;gap:12px;align-items:flex-start;background:var(--navy-mid);border:1px solid var(--line);border-radius:10px;padding:13px 15px;font-size:.89rem}
.matrix .m-icon{flex:none;width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;margin-top:1px}
.matrix .m-req .m-icon{background:var(--amber-soft);color:var(--amber)}
.matrix .m-ok .m-icon{background:rgba(63,180,126,.15);color:var(--ok)}
.matrix .m-na .m-icon{background:rgba(169,184,206,.12);color:var(--text-dim)}
.matrix .m-body strong{display:block;font-weight:600}
.matrix .m-body span{color:var(--text-dim);font-size:.83rem}
.matrix .m-body a{font-family:var(--font-mono);font-size:.73rem;color:var(--blue);text-decoration:none;border-bottom:1px dotted var(--blue)}
.matrix .m-body a:hover{color:var(--amber);border-color:var(--amber)}

.block-card{background:#0A1830;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.block-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--navy-mid)}
.block-label{font-size:.8rem;color:var(--text-dim);font-family:var(--font-head);font-weight:600}
.block-card pre{padding:18px;font-family:var(--font-mono);font-size:.78rem;line-height:1.65;white-space:pre-wrap;word-break:break-word;color:#D7E3F4;max-height:480px;overflow:auto}
.micro-note{font-size:.8rem;color:var(--text-dim);margin-top:10px}

/* ---------- marketplace tabs ---------- */
.mkt-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.mkt-tab{background:var(--navy-mid);border:1px solid var(--line);color:var(--text-dim);border-radius:9px;padding:8px 14px;font-size:.85rem;cursor:pointer;font-family:var(--font-head);font-weight:600;transition:all .12s}
.mkt-tab:hover{color:var(--text)}
.mkt-tab[aria-selected="true"]{background:var(--amber);color:#20222B;border-color:var(--amber)}
.mkt-panel{background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.mkt-panel h4{font-family:var(--font-head);font-size:1.05rem;margin-bottom:4px}
.mkt-panel .mkt-enf{font-size:.8rem;color:var(--amber);margin-bottom:14px}
.mkt-steps{list-style:none;counter-reset:step;display:grid;gap:12px;margin-bottom:14px}
.mkt-steps li{counter-increment:step;display:flex;gap:12px;font-size:.87rem;color:var(--text-dim)}
.mkt-steps li::before{content:counter(step);flex:none;width:22px;height:22px;border-radius:50%;background:var(--blue-soft);color:#9CC4F0;font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px;font-family:var(--font-head)}
.mkt-steps li strong{color:var(--text)}
.mkt-src{font-size:.78rem;color:var(--text-dim);border-top:1px solid var(--line);padding-top:12px}
.mkt-src a{color:var(--blue)}

/* ---------- CTA band ---------- */
.cta-band{margin-top:44px;background:linear-gradient(135deg,var(--navy-mid),var(--navy-soft));border:1px solid rgba(232,160,32,.3);border-radius:var(--radius);padding:28px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-band h3{font-size:1.15rem;margin-bottom:6px}
.cta-band p{font-size:.88rem;color:var(--text-dim);max-width:60ch}

/* ---------- footer ---------- */
.site-footer{position:relative;z-index:1;border-top:1px solid var(--line);padding:26px 20px 34px;text-align:center}
.disclaimer{max-width:760px;margin:0 auto 14px;font-size:.76rem;color:var(--text-dim);line-height:1.6}
.footer-brand{font-size:.85rem;color:var(--text-dim)}
.footer-brand strong{color:var(--text)}
.footer-brand a{color:var(--amber);text-decoration:none}
.footer-brand a:hover{text-decoration:underline}

/* ---------- toast ---------- */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ok);color:#08281A;font-family:var(--font-head);font-weight:600;font-size:.9rem;padding:11px 22px;border-radius:10px;opacity:0;pointer-events:none;transition:all .25s ease;z-index:100}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .results-grid{grid-template-columns:1fr}
  .feature-row{grid-template-columns:1fr}
}
@media(max-width:620px){
  .form-grid{grid-template-columns:1fr}
  .topbar-tag{display:none}
  .cta-band{flex-direction:column;align-items:flex-start}
  .q-card{padding:22px 18px}
  .verdict-card{padding:24px 20px}
  #app{padding:24px 14px 48px}
  .wizard-nav .btn{flex:1;justify-content:center}
}