:root {
  --orange: #f77400;
  --action: #b94c00;
  --link: #a64500;
  --ink: #302d29;
  --muted: #67635e;
  --line: #e9e5df;
  --wash: #fff6ed;
  --surface: #faf9f7;
  --page: min(91.03vw, 72.8125rem);
  --header: 5.5rem;
  --section-gap: clamp(2.8rem, 5vw, 4.5rem);
  font-family: "Microsoft Yahei", "PingFang SC", Tahoma, sans-serif;
  font-size: 16px;
  line-height: 1.8;
  color: var(--ink);
  background: #fff;
  scroll-padding-top: calc(var(--header) + 1.3rem);
}
* { box-sizing: border-box; }
body { margin: 0; }
main, .top, footer { width: var(--page); margin-inline: auto; }
a { color: var(--link); text-underline-offset: .22em; }
p { margin: .5em 0 1em; overflow-wrap: break-word; }
h1,h2,h3,h4,h5 { margin: 0 0 .55em; color: #292723; line-height: 1.45; }
h1 { font-size: clamp(2.6rem, 4.2vw, 3.5rem); letter-spacing: -.045em; }
h1 span { color: var(--action); }
h2 { font-size: clamp(2rem, 3vw, 2.6rem); letter-spacing: -.025em; font-weight: 750; }
h3 { font-size: clamp(1.3rem, 2vw, 1.6rem); }
h4 { font-size: 1.18rem; }
h5 { font-size: 1rem; }
.section-intro { font-size: 1.14rem; color: var(--muted); margin: 0 0 1.8em; }
.small { font-size: .875rem; color: var(--muted); }
button,input { font: inherit; }
button,.button { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 2.8em; padding: .7em 1.15em; border: 1px solid #d8d2cb; border-radius: .5em; background: #fff; color: var(--ink); font-size: .94rem; font-weight: 600; line-height: 1.5; cursor: pointer; text-decoration: none; transition: background .15s, border-color .15s; }
button:hover,.button:hover { background: var(--wash); border-color: var(--orange); }
.primary { background: var(--action); border-color: var(--action); color: #fff; }
.primary:hover { background: #963d00; border-color: #963d00; color: #fff; }
button:disabled { cursor: wait; opacity: .65; }
:is(a,button,input,summary):focus-visible { outline: 3px solid var(--link); outline-offset: .22em; }
[hidden] { display: none !important; }
code { font: .9em Consolas, monospace; overflow-wrap: anywhere; }
pre { margin: 1em 0; white-space: pre-wrap; overflow-wrap: anywhere; font: .88rem/1.85 Consolas, monospace; tab-size: 2; }
pre code { font: inherit; }
.skip { position: fixed; left: 1em; top: -8em; z-index: 99; background: #fff; }
.skip:focus { top: 1em; padding: 1em; }
.site-header { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid var(--line); }
.top { display: flex; align-items: center; justify-content: space-between; gap: 1.5em; min-height: var(--header); }
.brand { display: flex; align-items: center; gap: .8em; color: var(--ink); white-space: nowrap; text-decoration: none; }
.brand strong { font-size: 1.18rem; }
.official-logo { display: block; width: clamp(6rem, 10vw, 8rem); height: auto; aspect-ratio: 170/103; object-fit: contain; }
.top nav { display: flex; gap: clamp(.7em, 1.5vw, 1.5em); align-items: center; }
.top nav a { padding-block: .65em; white-space: nowrap; font-size: .91rem; font-weight: 600; text-decoration: none; color: var(--ink); }
.top nav a:hover { color: var(--link); }
#nav-toggle { display: none; }
.actions { display: flex; align-items: center; gap: 1.5em; flex-wrap: wrap; }
.section { padding-top: var(--section-gap); scroll-margin-top: .6em; }
main > .section { border-top: 1px solid var(--line); margin-bottom: var(--section-gap); }
.journey { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .7em; margin: 1.8em 0 2em; }
.journey a { display: flex; gap: .8em; align-items: center; border: 1px solid var(--line); border-radius: .55em; padding: 1.05em; color: var(--ink); font-size: .9rem; text-decoration: none; font-weight: 600; background: var(--surface); }
.journey a:hover { border-color: var(--orange); background: var(--wash); }
.journey b { color: var(--link); font-size: 1.3rem; font-weight: 600; }
.step { padding: clamp(1.6em, 3vw, 2.4em); border: 1px solid var(--line); border-radius: .7em; margin-top: 1.3em; scroll-margin-top: 1em; }
.step-heading { display: flex; align-items: center; gap: 1em; margin-bottom: 1.25em; }
.step-heading h3 { margin: 0; }
.step-number { display: grid; place-items: center; width: 2.1em; aspect-ratio: 1; flex-shrink: 0; background: var(--wash); border-radius: .5em; font-size: 1.4rem; font-weight: 650; color: var(--link); }
.step-body { margin-left: 0; min-width: 0; }
.step-body h3 { font-size: 1.12rem; margin-top: 1.5em; }
.step-body > p,.step-intro { color: var(--muted); }
.tabs { display: flex; gap: .75em; flex-wrap: wrap; margin: 1em 0; }
.tabs button { flex: 1 1 auto; padding: .9em 1.2em; }
.tabs button[aria-selected=true] { background: var(--wash); border-color: var(--orange); color: var(--link); }
#client-panel { padding: .8em 1.2em; border-left: .2em solid var(--orange); background: var(--surface); }
#client-panel p { margin: .25em 0; color: var(--muted); }
.steps { counter-reset: step; list-style: none; margin: 1em 0 1.5em; padding: 0; }
.steps li { counter-increment: step; position: relative; padding-left: 2.1em; margin: 1em 0; line-height: 1.9; }
.steps li::before { content: counter(step); position: absolute; left: 0; top: .23em; display: grid; place-items: center; width: 1.65em; height: 1.65em; background: var(--wash); border: 1px solid #f5d8bd; color: var(--link); border-radius: 50%; font-size: .8rem; font-weight: 700; line-height: 1; }
.copy-box { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1.5em; align-items: center; border: 1px solid #efd8c4; border-radius: .6em; padding: 1.35em; margin: 1.15em 0; background: var(--wash); }
.copy-box p { margin: 0; overflow-wrap: anywhere; }
.copy-box button { white-space: nowrap; }
.feedback,.inline-question-feedback { font-size: .875rem; color: var(--link); margin: .6em 0 0; overflow-wrap: anywhere; }
.feedback:empty,.inline-question-feedback:empty { display: none; }
.manual-pair { margin-top: 1.3em; }
.manual-part { border-top: 1px solid var(--line); padding-top: 1.5em; }
.manual-part + .manual-part { margin-top: 2em; }
.part-heading { display: flex; align-items: center; gap: .85em; margin-bottom: 1.25em; }
.part-heading > span { display: grid; place-items: center; width: 2.1em; aspect-ratio: 1; background: var(--wash); color: var(--link); border-radius: 50%; font-size: 1.05rem; font-weight: 700; }
.part-heading h4 { margin: 0; }
.manual-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(1.5em, 3vw, 2.5em); }
.manual-grid > *,.benefit-grid > * { min-width: 0; }
.manual-grid .steps { margin-top: 0; }
.config-box { background: var(--surface); border: 1px solid var(--line); border-radius: .55em; padding: 1.2em; align-self: start; }
.config-heading { display: flex; align-items: center; justify-content: space-between; gap: 1em; font-size: .94rem; padding-bottom: .9em; border-bottom: 1px solid var(--line); }
.config-heading button { font-size: .84rem; flex-shrink: 0; }
.config-box .small { margin-bottom: 0; }
.existing-config { color: var(--muted); margin-top: 1.25em; font-size: .9rem; }
.existing-config h5 { margin-bottom: .4em; }
.existing-config details { border: 1px solid var(--line); border-radius: .5em; padding: .9em 1.1em; }
.existing-config pre { font-size: .82rem; }
.skill-material { align-self: start; border: 1px solid #efd8c4; background: var(--wash); border-radius: .55em; padding: 1.3em; }
.skill-material strong { overflow-wrap: anywhere; }
.skill-material p { color: var(--muted); font-size: .9rem; }
.skill-material .button { margin: .3em 0 .6em; }
.completion { display: flex; align-items: center; justify-content: space-between; gap: 1.5em; padding: 1.3em; margin-top: 1.5em; border-radius: .55em; background: var(--surface); }
.completion h4 { font-size: 1.05rem; color: var(--link); }
.completion ul { margin: .3em 0; padding-left: 1.2em; font-size: .91rem; }
.completion .button { flex-shrink: 0; }
.connection-check { margin-top: 1.5em; padding-top: 1.3em; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; gap: .5em 1em; align-items: center; }
.connection-check h4 { margin: 0; font-size: 1rem; }
.connection-check p { margin: .3em 0; font-size: .875rem; color: var(--muted); }
#check-result { grid-column: 1/-1; color: var(--link); }
#check-result:empty { display: none; }
.table-wrap { width: 100%; overflow-x: auto; margin: 1.4em 0; }
table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th,td { border-bottom: 1px solid var(--line); padding: .9em; text-align: left; vertical-align: top; }
th { background: var(--surface); }
td { overflow-wrap: anywhere; }
.question-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .85em; margin: 1.2em 0 1.8em; }
.question-item { min-width: 0; }
.question { width: 100%; text-align: left; justify-content: space-between; gap: .75em; padding: 1em; background: var(--surface); border-color: var(--line); font-weight: 500; line-height: 1.75; }
.question span { min-width: 0; }
.question small { flex-shrink: 0; white-space: nowrap; font-size: .76rem; color: var(--link); }
.scene-tabs { display: flex; flex-wrap: wrap; gap: .6em; margin: 1.4em 0 1.8em; }
.scene-tabs button { font-size: .88rem; padding: .75em 1.1em; }
.scene-tabs button[aria-selected=true] { background: var(--wash); color: var(--link); border-color: var(--orange); }
[data-scene-panel] { background: #fff; }
.scene-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 2em; margin: 1.2em 0 2em; }
.question-list { display: grid; gap: .75em; }
.scene-help { background: var(--wash); border-radius: .65em; padding: 1.6em; align-self: start; }
.scene-help p { margin: 0; color: var(--muted); }
.answer-structure { border-top: 1px solid var(--line); padding-top: 1.4em; }
.answer-structure p { color: var(--muted); }
.usage-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.2em; }
.usage-grid article { border: 1px solid var(--line); border-radius: .6em; padding: 1.4em; }
.usage-grid article h3 { font-size: 1.1rem; }
.usage-grid p { color: var(--muted); margin-bottom: 0; }
details { border-bottom: 1px solid var(--line); padding: 1.15em 0; }
summary { display: flex; justify-content: space-between; gap: 1.2em; cursor: pointer; list-style: none; font-weight: 600; }
summary::after { content: '＋'; flex-shrink: 0; color: var(--link); }
summary::-webkit-details-marker { display: none; }
details[open] > summary::after { content: '−'; }
details > p { margin: 1em 0 .2em; color: var(--muted); max-width: 68ch; }
.faq { border-top: 1px solid var(--line); }
.reward-summary { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2em; padding: 1.8em 2em; border: 1px solid #efd8c4; border-radius: .7em; background: var(--wash); margin: 1.5em 0 2em; }
.reward-summary > div { padding-inline: 1em; }
.reward-summary strong { font-size: 1.22rem; }
.reward-summary b { color: var(--action); font-size: 2.8rem; line-height: 1.2; }
.reward-summary p { margin: .6em 0 0; color: var(--muted); font-size: .94rem; }
.reward-summary em { font-style: normal; font-weight: 700; color: var(--ink); }
.reward-plus { color: var(--orange); font-size: 1.8rem; }
.benefit-grid { display: grid; grid-template-columns: 1.12fr 1fr; gap: 3em; align-items: start; margin: 2em 0; }
.benefit-grid h3 { font-size: 1.35rem; }
.eligibility { padding: .9em 1em; background: var(--surface); border-left: .2em solid var(--orange); font-size: .94rem; }
.eligibility strong { display: block; margin-bottom: .2em; }
.claim-rule { font-size: .92rem; }
.claim-box { padding: 1.5em; border: 1px solid var(--line); border-radius: .65em; background: var(--surface); }
.claim-box label { display: block; font-weight: 650; margin-bottom: .6em; }
.claim-box input { width: 100%; padding: .7em .9em; color: var(--ink); background: #fff; border: 1px solid #bfb8b0; border-radius: .4em; }
.claim-box input[aria-invalid=true] { border-color: #a42619; }
.error { color: #a42619; font-size: .875rem; }
.error:empty { display: none; }
.claim-prompt { padding: 1em; border: 1px solid var(--line); border-radius: .4em; background: #fff; overflow-wrap: anywhere; font-size: .94rem; }
#copy-claim { width: 100%; }
.claim-box > .small:last-child { margin-bottom: 0; }
.support { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 4em; align-items: center; }
.support-copy > p { color: var(--muted); }
.support .section-intro { color: var(--ink); }
.support-tip { padding: 1.1em 1.3em; background: var(--surface); border-radius: .5em; margin: 1.4em 0 .9em; }
.support-tip strong { font-size: .94rem; }
.support-tip p { color: var(--muted); margin: .4em 0 0; font-size: .91rem; }
.support-contact { margin: 0; padding: 1.4em; text-align: center; border: 1px solid var(--line); border-radius: .7em; justify-self: center; background: #fff; }
.support-contact img { display: block; width: clamp(13rem,20vw,16rem); max-width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; margin-inline: auto; }
.support-contact figcaption { display: grid; gap: .2em; margin-top: .8em; }
.support-contact figcaption strong { font-size: 1rem; }
.support-contact figcaption span { color: var(--muted); font-size: .83rem; }
footer { display: flex; justify-content: space-between; align-items: center; gap: 2em; border-top: 1px solid var(--line); margin-top: var(--section-gap); padding: 1.8em 0; }
footer > div { display: flex; gap: 1.5em; flex-wrap: wrap; }
footer a { font-size: .875rem; color: var(--muted); }
noscript { display: block; text-align: center; }
@media (max-width: 1050px) {
  :root { --header: 5rem; }
  .top { position: relative; }
  #nav-toggle { display: inline-flex; }
  .top nav { display: none; position: absolute; top: 100%; left: 0; right: 0; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .6em; padding: 1em; border: 1px solid var(--line); background: #fff; }
  .top nav.is-open { display: grid; }
  .top nav a { text-align: center; }
  .manual-grid { grid-template-columns: 1fr 1fr; gap: 1.3em; }
  .config-heading { display: block; }
  .config-heading button { margin-top: .6em; }
  .copy-box { grid-template-columns: 1fr; gap: 1em; }
  .copy-box button { justify-self: start; }
  .benefit-grid,.support { gap: 2em; }
}
@media (max-width: 700px) {
  :root { --header: 4.6rem; --page: 91vw; }
  .brand { gap: .6em; }
  .brand strong { font-size: 1rem; }
  .section-intro { font-size: 1.05rem; }
  .journey { grid-template-columns: 1fr 1fr; gap: .6em; }
  .journey a { padding: .9em .7em; gap: .6em; font-size: .86rem; }
  .step { padding: 1.2em; }
  .step-heading { gap: .75em; }
  .step-number { font-size: 1.2rem; }
  .tabs { gap: .5em; }
  .tabs button { flex: 1 1 30%; font-size: .85rem; padding: .8em .7em; }
  #client-panel { padding: .7em .9em; font-size: .92rem; }
  .manual-grid,.scene-grid,.benefit-grid,.usage-grid,.support { grid-template-columns: minmax(0,1fr); gap: 1.4em; }
  .manual-part + .manual-part { margin-top: 1.6em; }
  .manual-grid .steps { margin-bottom: .25em; }
  .config-box,.skill-material { padding: 1em; }
  .config-heading { display: flex; flex-wrap: wrap; gap: .6em; }
  .config-heading button { margin: 0; }
  .completion { display: block; padding: 1em; }
  .completion .button { margin-top: 1em; }
  .connection-check { grid-template-columns: 1fr; gap: .8em; }
  .connection-check button { justify-self: start; }
  .question-grid { grid-template-columns: 1fr; }
  .question { padding: .9em; }
  .question small { font-size: .72rem; }
  .scene-tabs { gap: .5em; }
  .scene-tabs button { flex: 1 1 40%; font-size: .83rem; padding: .75em .6em; }
  .scene-help { padding: 1.2em; }
  .reward-summary { gap: .55em; padding: 1.3em 1em; }
  .reward-summary > div { padding-inline: 0; }
  .reward-summary strong { font-size: 1rem; }
  .reward-summary b { font-size: 2.25rem; }
  .reward-summary p { font-size: .84rem; }
  .reward-plus { font-size: 1.2rem; }
  .benefit-grid { margin-top: 1.5em; }
  .claim-box { padding: 1.2em; }
  .support { gap: 1em; }
  .support-contact { width: min(100%,22rem); padding: 1.2em; }
  .support-contact img { width: 15rem; }
  footer { display: block; padding-block: 1.5em; }
  footer > div { margin-top: .8em; gap: .7em 1.3em; }
}
@media (prefers-reduced-motion: reduce) {
  button,.button { transition: none; }
}

/* Reading cues keep the complete guidance visible. */
.usage-grid .usage-card { display: flex; flex-direction: column; padding: 1.6em; }
.usage-heading { display: flex; align-items: center; gap: 1em; margin-bottom: 1.1em; }
.usage-icon { display: grid; place-items: center; width: 2.8em; aspect-ratio: 1; flex-shrink: 0; border-radius: .65em; background: var(--wash); color: var(--link); }
.usage-icon svg { width: 1.5em; height: 1.5em; }
.usage-step { display: block; color: var(--link); font-size: .78rem; font-weight: 650; margin-bottom: .35em; }
.usage-grid .usage-heading h3 { margin: 0; font-size: 1.15rem; line-height: 1.5; }
.usage-body { flex: 1; }
.usage-body p:first-child { margin-top: 0; }
.usage-example { background: var(--surface); border-left: .2em solid var(--orange); padding: .9em 1.1em; margin-top: 1.3em; border-radius: 0 .4em .4em 0; }
.usage-example strong { color: var(--link); font-size: .8rem; }
.usage-example p { color: var(--ink); font-size: .94rem; margin: .25em 0 0; }
.usage-card:last-child { grid-column: 1/-1; display: grid; grid-template-columns: 1fr 1fr; gap: .6em 2em; background: var(--surface); }
.usage-card:last-child .usage-heading { grid-column: 1/-1; margin-bottom: .3em; }
.usage-card:last-child .usage-example { align-self: start; margin: 0; background: #fff; }
.account-links { display: flex; flex-wrap: wrap; gap: .75em; margin: 1em 0 1.25em; }
.account-links a { border: 1px solid #efd8c4; border-radius: .45em; padding: .6em .95em; color: var(--link); background: var(--wash); text-decoration: none; font-size: .9rem; font-weight: 600; }
.account-links a:hover { border-color: var(--orange); }
.claim-label { display: flex; justify-content: space-between; align-items: baseline; gap: .75em; margin-bottom: .6em; }
.claim-label label { margin: 0; }
.claim-label a { flex-shrink: 0; font-size: .8rem; }
@media (max-width: 700px) {
 .usage-grid .usage-card { padding: 1.2em; }
 .usage-card:last-child { display: flex; gap: .7em; }
 .usage-heading { gap: .75em; }
 .usage-grid .usage-heading h3 { font-size: 1.06rem; }
 .usage-card:last-child .usage-example { align-self: stretch; }
}


/* Compact section headings and customer contact, preserving QR original. */
.section > h2 { margin-bottom: .75em; }
main > .support { grid-template-columns: minmax(0,1fr) auto; gap: clamp(1em,3vw,2em); padding-top: 2em; margin-bottom: 2em; }
.support-copy h2 { font-size: clamp(1.65rem,2.4vw,2rem); margin-bottom: .6em; }
.support-copy > p { margin: .55em 0; }
.support-detail { font-size: .92rem; }
.support-contact { padding: .9em 1.2em; }
.support-contact img { width: 10.5rem; }
.support-contact figcaption { gap: .1em; margin-top: .4em; }
.support-contact figcaption strong { font-size: .88rem; }
.support-contact figcaption span { font-size: .72rem; }
@media (max-width: 700px) {
 main > .support { grid-template-columns: minmax(0,1fr); gap: .75em; padding-top: 1.5em; }
 .support-contact { width: auto; max-width: 100%; padding: .8em 1.1em; }
 .support-contact img { width: 10.5rem; }
}

/* Single-column product introduction; the details sit beneath it. */
.hero { display: block; padding: 0 0 var(--section-gap); }
.hero-intro { position: relative; isolation: isolate; text-align: center; padding: clamp(2.7rem,5.5vw,5rem) 1em clamp(2.5rem,4.5vw,4rem); }
.hero-intro::before { content: ''; position: absolute; z-index: -1; inset: 4% 13% 0; pointer-events: none; background: radial-gradient(ellipse at 50% 48%,#fff2e5 0,rgba(255,246,237,.6) 35%,rgba(255,255,255,0) 70%); }
.hero-kicker { display: inline-flex; align-items: center; gap: .65em; font-size: .94rem; font-weight: 650; letter-spacing: .04em; color: var(--link); margin: 0 0 1.2em; }
.hero-kicker > span { width: .5em; aspect-ratio: 1; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 .35em #ffebd6; }
.hero h1 { font-size: clamp(2.5rem,4.6vw,4rem); line-height: 1.28; letter-spacing: -.035em; font-weight: 800; margin: 0; }
.hero h1 span { color: #cc5800; }
.hero-description { color: var(--muted); font-size: clamp(1rem,1.35vw,1.125rem); line-height: 1.9; margin: 1.35em auto 0; max-width: 37em; }
.hero-actions { display: flex; justify-content: center; align-items: center; gap: .9em; flex-wrap: wrap; margin: 1.75em 0 1.1em; }
.hero-actions .button { min-width: 10em; font-size: 1rem; padding: .85em 1.5em; gap: 1.1em; }
.hero-actions .primary { box-shadow: 0 .35em .9em #a645001a; }
.hero-secondary { border-color: #e2d9ce; }
.hero-assurances { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .45em 1.6em; font-size: .81rem; color: var(--muted); }
.hero-assurances > span::before { content: '✓'; color: var(--link); margin-right: .45em; }
.hero-assurances a { text-decoration: none; font-weight: 600; }
.hero-overview { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.25em; }
.overview-card { padding: 1.1em 1.3em 1.3em; border: 1px solid var(--line); border-radius: .75em; background: #fff; min-width: 0; }
.overview-card h2 { font-size: 1.12rem; letter-spacing: -.015em; margin: 1.15em 0 .6em; }
.overview-card > p { font-size: .9rem; line-height: 1.85; color: var(--muted); margin: 0; }
.overview-art { min-height: 8.2em; background: var(--surface); border-radius: .5em; display: flex; align-items: center; justify-content: center; gap: .7em; padding: .85em; color: var(--link); }
.overview-art svg { width: 1.5em; height: 1.5em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.topic-art { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65em; }
.topic-tile { display: flex; align-items: center; justify-content: center; gap: .6em; border: 1px solid #efdfcf; background: #fff; border-radius: .4em; padding: .65em .4em; font-size: .86rem; font-weight: 600; }
.source-art { flex-direction: column; gap: 0; }
.source-pair { display: flex; justify-content: center; align-items: center; gap: .6em; width: 100%; font-size: .76rem; }
.source-pair > span { padding: .45em .7em; border-radius: .4em; background: #fff; border: 1px solid #efdfcf; color: var(--muted); white-space: nowrap; }
.source-pair > span:last-child { color: var(--link); background: var(--wash); }
.source-connector { width: 70%; display: flex; align-items: center; justify-content: center; gap: .5em; line-height: 1.65; color: #c9aa8b; }
.source-connector span { border-top: 1px solid #e1c9b0; flex: 1; }
.source-connector i { font-style: normal; }
.source-answer { display: flex; align-items: center; justify-content: center; gap: .5em; background: #fff; padding: .6em .8em; border-radius: .4em; border: 1px solid #e8d1ba; font-size: .79rem; font-weight: 600; }
.source-answer svg { width: 1.25em; height: 1.25em; }
.source-link { color: var(--link); margin-left: .5em; }
.install-art { gap: .8em; }
.install-unit { display: grid; justify-items: center; gap: .65em; width: 6.7em; padding: 1em .6em; background: #fff; border: 1px solid #efdfcf; border-radius: .6em; font-size: .8rem; font-weight: 600; }
.install-unit svg { width: 1.75em; height: 1.75em; }
.install-plus { font-size: 1.1rem; font-weight: 400; color: var(--link); }
@media (min-width: 701px) and (max-width: 1050px) {
 .hero-overview { gap: .75em; }
 .overview-card { padding: .85em; }
 .overview-art { padding: .6em; }
 .source-pair { gap: .3em; font-size: .65rem; }
 .source-answer { font-size: .69rem; padding-inline: .45em; }
 .install-art { gap: .4em; }
}
@media (max-width: 700px) {
 .hero-intro { padding: 2.8em .3em 2.3em; }
 .hero-intro::before { inset-inline: 0; }
 .hero h1 { font-size: clamp(2.2rem,7.4vw,3rem); }
 .hero-kicker { font-size: .86rem; }
 .hero-description { font-size: .94rem; }
 .hero-actions { gap: .65em; }
 .hero-actions .button { min-width: 0; padding: .85em 1.05em; font-size: .94rem; gap: .5em; }
 .hero-assurances { gap: .5em 1em; font-size: .76rem; }
 .hero-overview { grid-template-columns: 1fr; gap: .85em; }
 .overview-card { display: grid; grid-template-columns: minmax(7.5em,34%) minmax(0,1fr); gap: .25em 1em; padding: 1em; align-items: center; }
 .overview-card h2 { font-size: 1.01rem; margin: 0; align-self: end; }
 .overview-card > p { font-size: .84rem; align-self: start; margin-top: .25em; }
 .overview-art { grid-row: 1 / span 2; min-height: 8.5em; padding: .55em; }
 .topic-art { gap: .35em; }
 .topic-tile { flex-direction: column; gap: .3em; padding: .5em; font-size: .7rem; }
 .source-pair { flex-direction: column; gap: .15em; font-size: .6rem; }
 .source-pair b { line-height: 1; }
 .source-pair > span { padding: .3em .4em; }
 .source-connector { line-height: 1; width: 80%; }
 .source-answer { font-size: .65rem; padding: .4em; gap: .3em; text-align: center; }
 .source-answer svg,.source-link { display: none; }
 .install-art { flex-direction: column; gap: .2em; }
 .install-unit { display: flex; gap: .5em; width: auto; font-size: .65rem; padding: .6em; }
 .install-unit svg { width: 1.2em; height: 1.2em; }
 .install-plus { line-height: 1; font-size: .9rem; }
}

/* The product name replaces the removed promotional headline. */
.hero-intro { padding-top: clamp(2rem,3.6vw,3rem); padding-bottom: clamp(2rem,3.6vw,3rem); }
.hero .hero-product-title { font-size: clamp(1.9rem,3vw,2.6rem); line-height: 1.4; letter-spacing: -.025em; }
.hero-description { margin-top: .85em; }
@media (max-width: 700px) { .hero-intro { padding-top: 2em; padding-bottom: 2em; } }

/* Installation ends with one action; diagnostics are available on demand. */
.quick-start .step-heading { margin-bottom: .8em; }
.quick-start-label { font-size: .94rem; margin: 0 0 .8em; }
.quick-start .question { background: var(--wash); border-color: #efd8c4; }
.quick-start-links,.quick-start-links > div { display: flex; align-items: center; flex-wrap: wrap; gap: .65em 1.5em; }
.quick-start-links { justify-content: space-between; margin-top: 1em; font-size: .875rem; }
.quick-start-links a { text-decoration: none; }
.quick-start-links a:hover { text-decoration: underline; }
.quick-start-links .verification-link { color: var(--muted); text-decoration: underline; }
.verification-content { padding-top: .6em; color: var(--muted); }
.verification-content h3 { font-size: 1.05rem; color: var(--ink); margin: 1.2em 0 .5em; }
.verification-content p { margin: .65em 0; max-width: 75ch; }
.verification-content li { margin: .4em 0; }

/* Keep the install and benefit actions ahead of optional instructions. */
.step-heading h3 { display: flex; align-items: center; flex-wrap: wrap; gap: .6em; }
.step-badge { font-size: .75rem; font-weight: 600; color: var(--link); background: var(--wash); border-radius: .35em; padding: .25em .7em; }
.auto-lead { margin: 0 0 1em; color: var(--muted); }
.install-prompt { margin-top: 0; border-left: .2em solid var(--orange); }
.auto-steps { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1em; list-style: none; padding: 0; counter-reset: auto; margin: 1.3em 0; }
.auto-steps li { position: relative; counter-increment: auto; padding: 1em 1em 1em 3em; border: 1px solid var(--line); border-radius: .5em; background: var(--surface); }
.auto-steps li::before { content: counter(auto); position: absolute; left: 1em; top: 1.2em; display: grid; place-items: center; width: 1.6em; aspect-ratio: 1; border-radius: 50%; color: var(--link); background: var(--wash); font-size: .875rem; }
.auto-steps strong,.auto-steps span { display: block; }
.auto-steps strong { font-size: .94rem; }
.auto-steps span { margin-top: .5em; font-size: .9rem; line-height: 1.85; color: var(--muted); }
.auto-next { display: flex; align-items: center; flex-wrap: wrap; gap: .8em 1.5em; font-size: .875rem; }
.auto-next > a:last-child { color: var(--muted); }
.auto-more { margin-top: 1.4em; padding: .8em 0 0; border-top: 1px solid var(--line); border-bottom: 0; font-size: .875rem; }
.auto-more > summary { color: var(--muted); font-weight: 500; }
.manual-disclosure { background: var(--surface); }
.manual-disclosure[open] { background: #fff; }
.manual-summary { align-items: center; justify-content: flex-start; gap: 1em; }
.manual-summary::after { margin-left: auto; }
.manual-summary-copy { display: grid; gap: .3em; min-width: 0; }
.manual-summary-copy > strong { font-size: 1.6rem; line-height: 1.45; }
.manual-summary-copy > span { font-size: .875rem; font-weight: 400; color: var(--muted); }
.manual-disclosure[open] > .step-body { margin-top: 1.25em; }
.benefit-grid .eligibility { border-color: var(--orange); background: var(--wash); }
.benefit-steps strong,.benefit-steps li > span { display: block; }
.benefit-steps li > span { font-size: .9rem; color: var(--muted); }
.benefit-steps li { margin: .9em 0; }
.claim-box { background: #fff; border-color: #efd8c4; border-top: .2em solid var(--orange); }
.claim-box h3 { margin: 0 0 1em; }
.claim-box .claim-next { font-size: .875rem; color: var(--muted); margin: .8em 0 0; }
.claim-next strong { color: var(--ink); }
.claim-rule { border-top: 1px solid var(--line); padding-top: 1em; }
@media (max-width: 640px) {
 .auto-steps { grid-template-columns: 1fr; gap: .75em; }
 .auto-steps li { padding-left: 3em; }
 .auto-next { align-items: flex-start; flex-direction: column; gap: .8em; }
 .manual-summary { gap: .75em; }
 .manual-summary-copy > strong { font-size: 1.35rem; }
}

/* Keep primary routes distinct within the existing one-row header. */
.top nav { gap: clamp(.5em, 1.05vw, 1em); }
.top nav a { display: inline-flex; align-items: center; justify-content: center; gap: .4em; }
.top nav a.nav-install, .top nav a.nav-benefits { padding: .6em .85em; border: 1px solid var(--action); border-radius: .5em; }
.top nav a.nav-install { background: var(--action); color: #fff; }
.top nav a.nav-install:hover { background: #963d00; border-color: #963d00; }
.top nav a.nav-benefits { background: var(--wash); color: var(--link); border-color: #efd8c4; }
.top nav a.nav-benefits:hover { border-color: var(--orange); }
.nav-icon { width: 1.1em; height: 1.1em; flex: 0 0 auto; }
.top nav a.nav-faq { border-left: 1px solid var(--line); padding-left: 1em; }
.top nav a.nav-faq, .top nav a.nav-support { color: var(--muted); font-size: .85rem; }
.top nav a.nav-faq:hover, .top nav a.nav-support:hover { color: var(--link); }

/* Explicit actions supplement native disclosure semantics and the chevron. */
summary { align-items: center; }
summary::after, details[open] > summary::after { content: none; }
.disclosure-label { min-width: 0; }
.disclosure-action { display: inline-flex; align-items: center; gap: .35em; flex-shrink: 0; margin-left: auto; color: var(--link); font-size: .82rem; font-weight: 600; }
.disclosure-action svg { width: 1em; height: 1em; }
.disclosure-action .when-open { display: none; }
details[open] > summary > .disclosure-action .when-closed { display: none; }
details[open] > summary > .disclosure-action .when-open { display: inline; }
details[open] > summary > .disclosure-action svg { transform: rotate(180deg); }
.manual-summary > .disclosure-action { border: 1px solid #efd8c4; border-radius: .5em; background: #fff; padding: .55em .8em; }
summary:hover > .disclosure-action { text-decoration: underline; text-underline-offset: .2em; }
@media (max-width: 1050px) {
 .top nav a.nav-faq { border-left: 0; padding-left: 0; }
}
@media (max-width: 700px) {
 .top nav a { font-size: .85rem; }
 .top nav a.nav-install, .top nav a.nav-benefits { padding-inline: .5em; }
 .top nav .nav-icon, .top nav .nav-install > [aria-hidden] { display: none; }
 .manual-summary { display: grid; grid-template-columns: auto minmax(0,1fr); }
 .manual-summary > .disclosure-action { grid-column: 2; margin-left: 0; justify-self: start; }
 .verification-guide > summary { align-items: flex-start; flex-wrap: wrap; gap: .4em; }
 .verification-guide > summary > .disclosure-action { margin-left: 0; }
}

.auto-ready { padding: 1.2em; margin: 1.3em 0; border-left: .2em solid var(--orange); background: var(--wash); border-radius: .35em; }
.auto-ready h4 { font-size: .94rem; margin-bottom: .65em; }
.auto-ready ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.2em; padding: 0; margin: 0; list-style: none; font-size: .875rem; color: var(--muted); }
.auto-ready strong { display: block; margin-bottom: .3em; color: var(--ink); }
@media (max-width: 700px) { .auto-steps,.auto-ready ul { grid-template-columns: 1fr; } }

.claim-intro { font-size: .9rem; color: var(--muted); margin: -.25em 0 1.2em; }
.claim-output-label { font-size: .875rem; font-weight: 600; margin: 1em 0 .5em; }
.claim-box .claim-next { padding: 1em; margin-top: 1.2em; border-radius: .45em; background: var(--wash); }
.claim-next > strong { display: block; margin-bottom: .35em; }
.claim-next > p { margin: 0; }
.benefit-steps li { margin: 1.05em 0; }
.benefit-steps li > span { margin-top: .35em; line-height: 1.85; }

/* Public claim availability uses the existing notice and disclosure scale. */
.benefit-status{padding:1em 1.25em;margin-bottom:1.5em;background:var(--accent-soft,#fff6ee);border-left:.2em solid var(--accent,#ef7600);border-radius:.5em}
.benefit-status strong{font-size:1.1em}.benefit-status p{margin:.4em 0 0}.benefit-preview .benefit-grid{margin-top:1.5em}
