:root{
  --paper:#f7f5f2;
  --paper2:#fffdfa;
  --ink:#1a1f2e;
  --ink2:#3d4456;
  --ink3:#6b7185;
  --ink4:#9298a8;
  --line:#e4e0d8;
  --line2:#d8d3c8;
  --surface2:#efece6;
  --border:#e4e0d8;
  --accent:#2563a8;
  --accent-soft:#e8f0f9;
  --accent-tint:#f0f5fb;
  --shadow:0 1px 3px rgba(26,31,46,.06), 0 8px 24px rgba(26,31,46,.04);
  /* spectrum — used only for the refraction signature */
  --spec-1:#5b8def;
  --spec-2:#7c6fd6;
  --spec-3:#c0619e;
}
[data-theme="dark"] {
  --paper: #15171f;
  --paper2: #1c1f29;
  --ink: #f0ece4;
  --ink2: #c4c8d4;
  --ink3: #8a90a0;
  --ink4: #5f6575;
  --line: #2a2e3a;
  --line2: #353a48;
  --surface2: #1c1f29;
  --border: #2a2e3a;
  --accent: #5b9bd8;
  --accent-soft: #1a2838;
  --accent-tint: #16202c;
  --shadow: 0 1px 3px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.2);
  --spec-1:#6b9bff;
  --spec-2:#9182e8;
  --spec-3:#d479b3;
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-behavior:smooth}
body{font-family:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif;-webkit-font-smoothing:antialiased;background:var(--paper);color:var(--ink2);min-height:100vh;line-height:1.6;transition:background .4s ease,color .4s ease}
/* refraction signature */
.refraction{width:100%;max-width:280px;margin:0 auto 4px;height:48px}
.refraction svg{width:100%;height:100%;display:block;overflow:visible}
.logo-img{display:block;width:auto}
.logo-img-dark{display:none}
[data-theme="dark"] .logo-img-light{display:none}
[data-theme="dark"] .logo-img-dark{display:block}
.langbar .brand .logo-img{height:22px}
.welcome .logo .logo-img{height:96px;top:10px}
body[dir="rtl"]{direction:rtl}
.screen{display:none}.screen.active{display:block}

/* language bar */
.langbar{position:sticky;top:0;z-index:20;background:var(--paper2);border-bottom:1px solid var(--line);padding:8px 16px;display:flex;justify-content:flex-end;align-items:center;gap:8px}
.langbar select{background:var(--paper2);color:var(--ink2);border:1px solid var(--line);border-radius:4px;padding:6px 10px;font-size:13px;cursor:pointer}
.langbar .brand{margin-right:auto;font-size:21px;font-family:'Fraunces',serif;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:9px;text-decoration:none}
body[dir="rtl"] .langbar .brand{margin-right:0;margin-left:auto}
.theme-btn{background:none;border:1px solid var(--line2);border-radius:20px;padding:5px 12px;height:30px;box-sizing:border-box;font-size:12px;color:var(--ink3);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px;font-family:inherit}
.theme-btn:hover{border-color:var(--ink4);color:var(--ink2)}
.theme-lbl:empty{display:none}
/* hamburger menu */

/* intro */
.intro{max-width:560px;margin:0 auto;padding:56px 24px 80px}
.intro .label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink4);margin-bottom:14px;text-align:center;font-weight:500}
.intro h1{font-family:'Fraunces',serif;font-size:32px;font-weight:500;line-height:1.2;margin-bottom:18px;color:var(--ink);text-align:center;letter-spacing:-.02em}
.intro h1 em{font-style:italic;font-weight:400}
.intro p{font-size:15px;color:var(--ink2);line-height:1.7;margin-bottom:8px;text-align:center;white-space:pre-line}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin-bottom:28px}
.chip{flex:0 0 calc(33.333% - 5px);font-size:11px;color:var(--ink3);background:var(--paper2);border:1px solid var(--line);border-radius:4px;padding:9px 10px;line-height:1.35;text-align:center;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.chip b{display:block;color:var(--ink2);font-weight:500;margin-bottom:2px;text-align:center}
.disc{font-size:12px;color:var(--ink4);background:var(--paper2);border:1px solid var(--line);border-radius:4px;padding:13px 16px;line-height:1.6;margin-bottom:26px;text-align:center}
.lang-note{font-size:12px;color:var(--ink4);margin-bottom:14px;line-height:1.6;white-space:pre-line;text-align:center}
.btn-primary{background:var(--accent);color:#fff;border:none;padding:15px 30px;font-size:15px;font-weight:600;border-radius:10px;cursor:pointer;transition:all .2s;letter-spacing:.01em}
.btn-primary:hover{filter:brightness(1.08)}
.intro .btn-primary{display:block;margin:0 auto}
.resume{margin-top:14px;font-size:13px;color:var(--ink3);display:flex;gap:8px 14px;align-items:center;justify-content:center;flex-wrap:wrap}
.resume a{color:var(--accent);cursor:pointer;text-decoration:underline}
#i-resume-txt{width:100%;text-align:center}

/* welcome screen */
.welcome{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:26px 24px 40px;max-width:480px;margin:0 auto}
.welcome .logo{font-family:'Fraunces',serif;font-size:38px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);display:flex;flex-direction:column;align-items:center;position:relative;z-index:0;margin-bottom:calc(14px - 174px * (1 - var(--hero-reveal,1)));transition:margin-bottom 1s ease-out}
/* hero intro: --hero-reveal goes 1 → 0, content rises over the fading logo.
   The prism image keeps a 10% watermark on desktop; the wordmark always fades
   fully, mapped to the top 30% of the reveal range so it clears out ~70% faster
   and never sits behind the text. Wheel-up at page top scrubs back (app.js). */
.welcome .logo .logo-img{opacity:var(--hero-reveal,1);transition:opacity 1s ease-out}
.welcome .logo span{opacity:clamp(0, calc((var(--hero-reveal,1) - .7) / .3), 1);transition:opacity .3s ease-out}
.welcome > *:not(.logo){position:relative;z-index:1}
@media (min-width:1024px){.welcome .logo .logo-img{opacity:max(var(--hero-reveal,1), .1)}}
body.hero-scrub .welcome .logo,body.hero-scrub .welcome .logo .logo-img,body.hero-scrub .welcome .logo span{transition:none}
@media (prefers-reduced-motion:reduce){.welcome .logo,.welcome .logo .logo-img,.welcome .logo span{transition:none}}
.welcome .logo span{position:relative;z-index:1;margin-top:26px;line-height:1}
.welcome .logo .logo-img{position:relative;z-index:0}
.welcome h1{font-family:'Fraunces',serif;font-size:30px;font-weight:500;color:var(--ink);margin-bottom:8px;text-align:center;letter-spacing:-.02em;line-height:1.2}
.welcome h1 em{font-style:italic;font-weight:400}
.welcome .sub{font-size:14px;color:var(--ink3);margin-bottom:48px;text-align:center}
.w-body{font-size:15px;color:var(--ink3);line-height:1.7;margin-bottom:10px;text-align:center}
.w-tagline{font-size:16px;font-family:'Fraunces',serif;font-style:italic;color:var(--ink2);line-height:1.6;margin-bottom:32px;text-align:center}
.wblock{width:100%;background:var(--paper2);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:var(--shadow);margin-bottom:16px}
.wlabel{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink4);margin-bottom:14px;font-weight:500;text-align:center}
.wgrid{display:grid;gap:10px}
.wgrid.lang{grid-template-columns:repeat(3,1fr);margin-top:10px}
.wgrid.age{grid-template-columns:1fr 1fr}
.wgrid.age .wopt{padding:16px 14px;font-size:14px;font-weight:500;color:var(--ink)}
.wgrid.age .wopt .wopt-sub{font-size:11px;margin-top:4px;font-weight:400}
.wgrid.age .wopt:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:520px){.wgrid.age{grid-template-columns:1fr}}
.wopt{background:var(--paper);border:1px solid var(--line2);border-radius:10px;padding:14px 12px;font-size:13px;color:var(--ink3);text-align:center;cursor:pointer;transition:all .15s;line-height:1.35}
.wopt:hover{border-color:var(--accent);color:var(--ink2)}
.wopt.sel{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:500}
.wopt.coming{opacity:.4;cursor:default;font-size:11px}
.wopt .wopt-sub{font-size:10px;color:var(--ink4);margin-top:3px;display:block}
.wopt.sel .wopt-sub{color:var(--accent);opacity:.7}
.wopt.coming .wopt-sub{color:var(--ink4)}
.wopt-primary{font-size:14px;padding:18px 16px;font-weight:500}
.wgrid-coming{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
@media (max-width:380px){.wgrid-coming{grid-template-columns:1fr}}
.trust-note{font-size:12px;color:var(--ink4);text-align:center;padding:10px 0 4px;letter-spacing:.01em}
.trust-note span{color:var(--ink3)}
.w-example-link{display:block;text-align:center;font-size:13px;color:var(--accent);text-decoration:none;padding:2px 0 8px;letter-spacing:-.01em}
.w-example-link:hover{text-decoration:underline}
.w-more{margin-top:26px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:12px;color:var(--ink4);letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;gap:6px;transition:color .15s}
.w-more:hover{color:var(--accent)}
.w-more.in-wblock{display:flex;justify-content:center;width:100%;margin:18px 0 2px}
.w-more-ico{display:inline-block;animation:wmore 1.8s ease-in-out infinite}
@keyframes wmore{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
@media (prefers-reduced-motion:reduce){.w-more-ico{animation:none}}

/* showcase — product previews revealed on scroll */
.showcase{max-width:900px;margin:0 auto;padding:24px 24px 100px}
.sc-title{font-family:'Fraunces',serif;font-size:26px;font-weight:500;color:var(--ink);text-align:center;letter-spacing:-.02em;margin-bottom:0}
.sc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
@media (max-width:720px){.sc-grid{grid-template-columns:1fr}}
.sc-tile{background:var(--paper2);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);text-align:left;cursor:pointer;transition:transform .15s,border-color .15s;display:flex;flex-direction:column}
.sc-tile:hover{transform:translateY(-2px);border-color:var(--accent)}
.sc-tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sc-tile.soon{cursor:default;opacity:.9}
.sc-tile.soon:hover{transform:none;border-color:var(--line)}
.sc-badge{align-self:flex-start;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:20px;margin-bottom:12px}
.sc-badge.free{background:var(--accent-soft);color:var(--accent)}
.sc-badge.paid{background:var(--ink);color:var(--paper)}
.sc-badge.soon{background:var(--line2);color:var(--ink3)}
.sc-tile h3{font-family:'Fraunces',serif;font-size:18px;font-weight:500;color:var(--ink);margin:0 0 5px;letter-spacing:-.01em}
.sc-tile p{font-size:13px;color:var(--ink3);line-height:1.55;margin:0 0 14px}
.sc-open{margin-top:auto;align-self:flex-end;font-size:18px;line-height:1;color:var(--accent);opacity:.7;transition:opacity .15s,transform .15s}
.sc-tile:hover .sc-open{opacity:1;transform:translateX(3px)}
[dir="rtl"] .sc-open{align-self:flex-start;transform:scaleX(-1)}
.scm{margin-top:auto;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:14px;position:relative;overflow:hidden}
.scm-row,.scm-drow{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.scm-row:last-of-type,.scm-drow:last-of-type{margin-bottom:0}
.scm-name{font-size:10px;color:var(--ink3);min-width:74px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scm-track{flex:1;height:6px;background:color-mix(in srgb,var(--accent) 7%,var(--paper));border-radius:3px;overflow:hidden}
.scm-fill{display:block;height:100%;background:var(--accent);border-radius:3px}
.scm-fill.b{background:var(--spec-2);opacity:.6}
.scm-bars{flex:1;display:flex;flex-direction:column;gap:4px}
.scm-ex{font-size:9px;color:var(--ink4);letter-spacing:.05em;text-transform:uppercase;margin-top:13px;text-align:right}
.scm-doc-h{height:9px;width:50%;background:var(--ink);opacity:.7;border-radius:3px;margin-bottom:13px}
.scm-line{height:5px;background:var(--line2);border-radius:3px;margin-bottom:8px}
.scm-line.s{width:90%}.scm-line.m{width:68%}
.scm-line.sec{background:var(--accent);opacity:.5;width:32%;height:6px;margin:15px 0 10px}
.scm.locked .scm-line,.scm.locked .scm-doc-h{filter:blur(1.5px)}
.scm-lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22px;background:color-mix(in srgb,var(--paper) 55%,transparent)}
.sc-teaser{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin:4px 0 12px;overflow:hidden}
.sc-teaser.locked .sc-teaser-row{filter:blur(2.2px);user-select:none}
.sc-teaser-row{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink2);padding:6px 0}
.sc-teaser-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0}
.kofi-wrap{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);text-align:center}
.kofi-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border-radius:20px;background:transparent;border:1px solid var(--line2);color:var(--ink4);font-size:12px;text-decoration:none;transition:all .15s;letter-spacing:.02em}
.kofi-btn:hover{border-color:var(--ink4);color:var(--ink3)}
.wcurrent{display:flex;align-items:center;justify-content:space-between;background:none;border:none;border-radius:0;padding:0}
.wcur-name{font-size:14px;color:var(--ink);font-weight:500}
.wchange{background:none;border:none;color:var(--accent);font-size:12px;cursor:pointer;padding:4px 2px;text-decoration:underline;text-underline-offset:3px}
.wchange:hover{color:color-mix(in srgb, var(--accent) 75%, var(--ink))}
/* deep link button */
.btn-deeplink{background:var(--accent);color:#fff;border:1px solid var(--accent);padding:14px 24px;font-size:14px;font-weight:500;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .2s}
.btn-deeplink:hover{filter:brightness(1.08)}
.btn-deeplink .dl-icon{font-size:18px}
.qhead{position:sticky;top:41px;z-index:10;background:var(--paper2);border-bottom:1px solid var(--line);padding:13px 24px;display:flex;align-items:center;gap:16px}
.pbar{flex:1;height:3px;background:var(--line);border-radius:2px}
.pfill{height:100%;background:var(--accent);border-radius:2px;transition:width .35s}
.pcount{font-size:12px;color:var(--ink4);white-space:nowrap;font-variant-numeric:tabular-nums}
.qbody{max-width:620px;margin:0 auto;padding:36px 24px 120px}
.seclabel{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink4);margin-bottom:6px}
.sectitle{font-family:'Fraunces',serif;font-size:23px;font-weight:500;color:var(--ink);margin-bottom:5px;letter-spacing:-.01em}
.secdesc{font-size:13px;color:var(--ink4);margin-bottom:30px;line-height:1.55}
.q{margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--line2)}
.q:last-child{border-bottom:none;margin-bottom:0}
.qtext{font-size:14px;color:var(--ink2);line-height:1.65;margin-bottom:12px}
.scale{display:flex;gap:5px}
.opt{flex:1;background:var(--paper2);border:1px solid var(--line2);border-radius:8px;padding:11px 4px;font-size:11px;color:var(--ink3);text-align:center;cursor:pointer;line-height:1.3;transition:all .15s}
.opt:hover{border-color:var(--accent);color:var(--ink2)}
.opt.sel{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:500}
.opt.wide{flex:none;display:block;width:100%;text-align:left;margin-bottom:6px;padding:11px 14px}
body[dir="rtl"] .opt.wide{text-align:right}
.qfoot{position:fixed;bottom:0;left:0;right:0;background:var(--paper2);border-top:1px solid var(--line);padding:13px 24px;display:flex;justify-content:space-between;align-items:center}
.fbtn{padding:10px 22px;border:1px solid var(--line2);border-radius:10px;background:transparent;color:var(--ink3);font-size:13px;cursor:pointer;transition:all .2s}
.fbtn:hover{border-color:var(--ink4);color:var(--ink2)}
.fbtn.primary{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}
.fbtn.primary:hover{filter:brightness(1.08)}
.fbtn:disabled{opacity:.35;cursor:default}
.fbtn.primary:disabled{background:var(--line2);border-color:var(--line2);color:var(--ink4)}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.fbtn.shake{animation:shake .35s ease}
.scroll-hint{position:fixed;bottom:64px;left:50%;transform:translateX(-50%);background:var(--paper2);border:1px solid var(--line2);border-radius:20px;padding:6px 14px;font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:6px;pointer-events:none;opacity:0;transition:opacity .3s;z-index:25;box-shadow:var(--shadow)}
.scroll-hint.visible{opacity:1}
.fstat{font-size:12px;color:var(--ink4)}

/* results */
.rtop{background:var(--paper2);border-bottom:1px solid var(--line);padding:34px 24px}
.rtop .in{max-width:720px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.rtop-text{flex:1;min-width:0}
.r-specialist-top{padding:10px 20px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;white-space:nowrap;flex-shrink:0}
.r-specialist-top:hover{opacity:.88}
.rtop .label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink4);margin-bottom:10px}
.rtop h2{font-family:'Fraunces',serif;font-size:27px;font-weight:500;color:var(--ink);margin-bottom:6px;letter-spacing:-.01em}
.rtop .sub{font-size:13px;color:var(--ink4)}
/* Youth Briefing part dividers: "For parents" (accent) vs "For the professional" (ink) */
.bf-band{display:flex;align-items:baseline;gap:12px;margin:40px 0 20px;padding-bottom:9px;border-bottom:2px solid var(--ink)}
.bf-band:first-child{margin-top:0}
.bf-band-tag{font-family:'Fraunces',serif;font-size:19px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.bf-band-sub{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink4)}
.bf-band-parents{border-color:var(--accent)}
.bf-band-parents .bf-band-tag{color:var(--accent)}
/* Kids results header: label ↔ date on one row, title below; stacked left on mobile */
.rtop-stack .in{flex-direction:column;align-items:stretch;gap:10px}
.rtop-stack .label,.rtop-stack h2{margin:0}
.rtop-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
@media(max-width:560px){
  .rtop-head{flex-direction:column;align-items:flex-start;gap:6px}
  .rtop-head .sub{order:-1}
}
.rbody{max-width:720px;margin:0 auto;padding:32px 24px 72px}
.rsec{margin-bottom:40px}
.rtitle{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink4);margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--line2)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
@media(max-width:420px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){
  .langbar{gap:5px;padding:6px 10px}
  .langbar .brand{font-size:17px;letter-spacing:.03em}
  .theme-lbl{display:none!important}
  .r-share-btn{padding:9px 12px;font-size:13px}
}
.card{background:var(--paper2);border:1px solid var(--line);border-radius:11px;padding:15px;box-shadow:var(--shadow)}
.card .l{font-size:11px;color:var(--ink3);margin-bottom:8px;line-height:1.4}
.card .v{font-family:'Fraunces',serif;font-size:16px;font-weight:500;line-height:1.3;color:var(--ink)}
.card .v span{font-size:14px;color:var(--ink4);font-family:'Inter',sans-serif}
.card.elevated{border-color:var(--accent-soft);background:var(--accent-tint)}
.card.elevated .v{color:var(--accent)}
.card.high{border-color:var(--accent-soft);background:var(--accent-tint)}
.card.high .v{color:var(--accent)}
/* Aggregate tiles tinted by level, matching the lvl-scale gradation */
.card.bl-0{background:color-mix(in srgb,var(--accent) 4%,var(--paper2))}
.card.bl-1{background:color-mix(in srgb,var(--accent) 7%,var(--paper2))}
.card.bl-2{background:color-mix(in srgb,var(--accent) 11%,var(--paper2))}
.card.bl-3{background:color-mix(in srgb,var(--accent) 16%,var(--paper2));border-color:var(--accent-soft)}
.card.bl-4{background:color-mix(in srgb,var(--accent) 22%,var(--paper2));border-color:var(--accent-soft)}
.card.bl-5{background:color-mix(in srgb,var(--accent) 30%,var(--paper2));border-color:var(--accent-soft)}
.card.bl-6{background:color-mix(in srgb,var(--accent) 38%,var(--paper2));border-color:var(--accent-soft)}
.drow{display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line2)}
.drow:last-child{border-bottom:none}
.dname{font-size:13px;color:var(--ink);min-width:200px}
.dtrack{flex:1;height:8px;background:color-mix(in srgb,var(--accent) 5%,var(--paper));border-radius:4px;overflow:hidden}
.dfill{height:100%;background:var(--accent);border-radius:4px;transition:width .9s}
.dscore{font-size:13px;color:var(--ink2);min-width:38px;text-align:right;font-variant-numeric:tabular-nums;font-weight:500}
/* Mobile: domain name on its own line, bar + value below (bar no longer squished) */
@media(max-width:520px){
  .drow{flex-wrap:wrap;gap:6px 12px}
  .dname{flex-basis:100%;min-width:0}
}
.lvl-scale{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:20px}
.badge{font-size:12px;padding:2px 8px;border-radius:10px;text-align:center;flex-shrink:0;background:var(--accent-soft);color:var(--accent)}
.badge.bl-0{opacity:.35}.badge.bl-1{opacity:.45}.badge.bl-2{opacity:.58}.badge.bl-3{opacity:.70}.badge.bl-4{opacity:.82}.badge.bl-5{opacity:.92}.badge.bl-6{font-weight:600}
.flag{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line2);font-size:13px;color:var(--ink3);line-height:1.55}
.flag:last-child{border-bottom:none}.flag .i{flex-shrink:0;margin-top:1px}.flag b{color:var(--ink);font-weight:600}
.note{background:var(--paper2);border:1px solid var(--line);border-radius:5px;padding:15px 18px;font-size:12px;color:var(--ink3);line-height:1.75;margin-bottom:14px}
.audhd{background:var(--accent-tint);border:1px solid var(--accent-soft);border-radius:5px;padding:13px 17px;font-size:13px;color:var(--ink2);line-height:1.6;margin-bottom:24px}
/* Dynamic summary preamble at the top of free results (all editions) */
.preamble{background:var(--paper2);border:1px solid var(--line);border-left:3px solid var(--ink3);border-radius:8px;padding:18px 20px;margin-bottom:26px}
.pre-title{font-family:'Fraunces',serif;font-size:17px;font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em;line-height:1.35}
.pre-body{font-size:14px;line-height:1.7;color:var(--ink2)}
.pre-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px;line-height:1.6;color:var(--ink3);margin-top:12px;padding-top:11px;border-top:1px solid var(--line2)}
.pre-cta-txt{flex:1;min-width:180px}
.pre-buy{flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px 18px;background:var(--accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-family:inherit;line-height:1.25}
.pre-buy-name{font-size:13px;font-weight:600;white-space:nowrap}
.pre-buy-price{font-size:12px;font-weight:500;opacity:.85}
.pre-buy:hover{opacity:.9}
@media(max-width:520px){.pre-buy{width:100%}}
.pre-C{border-left-color:var(--accent)}
.pre-C .pre-title{color:var(--accent)}
@media print{.preamble{background:none!important;border-left-color:#999}.pre-buy{display:none!important}}
.audhd b{color:var(--accent)}
.ractions{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:8px}
.r-lang-note{font-size:12px;color:var(--ink4);text-align:center;max-width:280px;line-height:1.5;margin:0;white-space:pre-line}
.r-products{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.reli{display:inline-block;font-size:11px;padding:3px 9px;border-radius:10px;margin-left:8px}
.reli-High,.reli-Moderate,.reli-Low{background:var(--accent-soft);color:var(--accent)}

.info{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;border:1px solid var(--ink4);color:var(--ink3);font-size:10px;font-style:normal;cursor:pointer;margin-left:7px;position:relative;vertical-align:middle;user-select:none;flex-shrink:0}
body[dir="rtl"] .info{margin-left:0;margin-right:7px}
.info:hover{border-color:var(--ink2);color:var(--ink2)}
.tip{display:none;position:absolute;top:24px;left:50%;transform:translateX(-50%);width:240px;background:var(--paper2);border:1px solid var(--line2);border-radius:6px;padding:10px 12px;font-size:12px;line-height:1.5;color:var(--ink2);font-weight:400;z-index:50;box-shadow:var(--shadow);text-align:left}
body[dir="rtl"] .tip{text-align:right}
.info:hover .tip,.info.open .tip{display:block}
.tiprow{display:flex;align-items:center}
/* accessory-page nav cluster (pages.js) */
.page-tools{display:inline-flex;align-items:center;gap:8px;margin-left:auto}
body[dir="rtl"] .page-tools{margin-left:0;margin-right:auto}
.pt-wrap{position:relative;display:inline-flex}
.pt-pages{background:none;border:1px solid var(--line2);border-radius:20px;min-width:34px;height:30px;font-size:14px;color:var(--ink3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .2s;font-family:inherit}
.pt-pages:hover{border-color:var(--ink4);color:var(--ink2)}
.pt-menu{position:absolute;top:38px;right:0;z-index:50;background:var(--paper2);border:1px solid var(--line2);border-radius:10px;box-shadow:var(--shadow);padding:6px;min-width:170px;display:none}
body[dir="rtl"] .pt-menu{right:auto;left:0}
.pt-menu.open{display:block}
.pt-menu a{display:block;padding:9px 14px;font-size:14px;color:var(--ink2);text-decoration:none;border-radius:6px;cursor:pointer;transition:background .12s}
.pt-menu a:hover{background:var(--line);color:var(--ink);text-decoration:none}
.pt-lang{background:var(--paper2);color:var(--ink2);border:1px solid var(--line);border-radius:4px;padding:6px 10px;font-size:13px;cursor:pointer;font-family:inherit;max-width:150px}
.print-only{display:none}
.r-qr-print{text-align:center;margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.r-qr-print img{width:160px;height:160px;display:block;margin:0 auto 10px}
.r-qr-print .qr-caption{font-size:10px;color:var(--ink4);margin:0}
.rshare-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.r-share-btn{background:var(--accent);color:#fff;border:none;padding:10px 18px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;transition:filter .15s}
.r-share-btn:hover{filter:brightness(1.1)}
/* Unified report action bar (print / save PDF / save HTML) — top & bottom of every report */
.rbar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:25px 0}
/* Neutralise the container's own top spacing so the top bar sits exactly 25px below the header */
.rbody:has(> .rbar:first-child){padding-top:0}
.sp-rhdr:has(+ .rbar){margin-bottom:25px}
.rbtn{padding:9px 16px;background:transparent;border:1px solid var(--line);border-radius:8px;font-size:13px;color:var(--ink2);cursor:pointer;font-family:inherit;white-space:nowrap;transition:border-color .15s,color .15s}
.rbtn:hover{border-color:var(--accent);color:var(--accent)}
@media print{
  @page{size:A4;margin:20mm}
  .langbar,.qfoot,.qhead,.ractions,.info,.no-print,.page-tools,.rbar{display:none!important}
  .print-only{display:block!important}
  body{background:#fff;color:#111}
  .rtop{background:#fff;border-color:#ddd}.rtop h2,.rtop .label,.rtop .sub{color:#333}
  .card{background:#f7f7f5;border-color:#ddd;box-shadow:none}.card .v{color:#111}
  .note,.audhd{background:#f7f7f5;border-color:#ddd;color:#444}
  .dname,.flag,.rtitle{color:#333}
  .dtrack{background:#eee}
}
