/* Pixel / retro theme — tokens from HANDOFF 6.5. Dark is default; .light on <html> switches. */
:root{--accent:#B8F25B;--bg:#0D0B1A;--panel:#17142B;--panel2:#120F24;--panel3:#211D3A;--line:#3A3460;--line2:#2A2550;--lime:var(--accent);--cyan:#5ED6F0;--text:#F1EEFA;--text2:#D9D4EE;--text3:#C9C3E3;--text4:#B3ACD0;--text5:#8F88B0;--on-accent:#0D0B1A;--good:var(--accent);--info:#5ED6F0;--warn:#FFD23F;--bad:#FF7AA8;--lime-line:var(--accent);--shadow:#06050D;--footer:#0A0915;--grid:#1D1938;color-scheme:dark}
:root.light{--bg:#F6F5FA;--panel:#FFFFFF;--panel2:#F1EFF8;--panel3:#ECEAF4;--line:#D6D2E6;--line2:#E6E3F0;--text:#1A1730;--text2:#34304D;--text3:#46415F;--text4:#5B5675;--text5:#6E6A86;--good:#3D7A0B;--info:#0B6F8F;--warn:#8A5D00;--bad:#C42E62;--shadow:#DDD9EC;--footer:#ECEAF4;--grid:#E4E1EF;color-scheme:light}

html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Chakra Petch',sans-serif;overflow-x:hidden}
a{color:var(--info)}a:hover{color:var(--good)}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

.pxgrid{background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px;animation:gridmove 4s steps(8) infinite}
.scan{background-image:repeating-linear-gradient(0deg,rgba(255,255,255,0.035) 0px,rgba(255,255,255,0.035) 1px,transparent 1px,transparent 4px);pointer-events:none}
.a-bob{animation:bob 1.2s steps(2) infinite}
.a-flicker{animation:flicker .3s steps(2) infinite}
.a-twinkle{animation:twinkle 2.4s steps(3) infinite}
.a-blink{animation:blink 1s steps(1) infinite}
.a-float{animation:floatup 3.6s steps(12) infinite}
.a-marquee{animation:marquee 40s linear infinite}
.a-grow{transform-origin:bottom;animation:grow 2.8s steps(6) infinite}
.a-pulse{animation:pulse 1.6s steps(2) infinite}
.a-climb{animation:climb 6s steps(24) infinite}
@keyframes gridmove{from{background-position:0 0}to{background-position:0 24px}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes flicker{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes twinkle{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes blink{50%{opacity:0}}
@keyframes floatup{0%{transform:translateY(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateY(-96px);opacity:0}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes grow{0%{transform:scaleY(.15)}40%,100%{transform:scaleY(1)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 #B8F25B}50%{box-shadow:0 0 0 4px #B8F25B}}
@keyframes climb{0%{transform:translate(0,40px)}70%,100%{transform:translate(0,0)}}
@media (prefers-reduced-motion: reduce){*{animation:none !important;scroll-behavior:auto !important}}

/* nav */
.nav-toggle{display:none}
/* theme toggle: sun in dark mode (switch to light), moon in light mode */
.ic-moon{display:none}
:root.light #theme-toggle .ic-sun{display:none}
:root.light #theme-toggle .ic-moon{display:block}
.show-sm{display:none !important}
.nav-toggle .ic-close{display:none}
.nav-toggle[aria-expanded="true"] .ic-close{display:block}
.nav-toggle[aria-expanded="true"] .ic-open{display:none}
.nav-links a{white-space:nowrap}
/* floating sign-in / sign-up bar (_cta_bar.html) */
.cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:0 16px calc(14px + env(safe-area-inset-bottom));pointer-events:none}
.cta-bar-in{pointer-events:auto;max-width:820px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:10px 12px 10px 18px;background:var(--panel);border:2px solid var(--line);box-shadow:6px 6px 0 var(--shadow)}
.cta-bar-txt{margin:0;flex:1;min-width:0;font-size:14px;line-height:1.4;color:var(--text4)}
.cta-bar-txt strong{display:block;font-size:16px;color:var(--text)}
.cta-bar-btn{display:flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;padding:10px 14px;border:2px solid var(--line);color:var(--text);font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap}
.cta-bar-btn:hover{color:var(--text);border-color:var(--cyan)}
.cta-bar-btn.alt{border-color:var(--cyan)}
.cta-bar-btn.primary{background:var(--lime);color:var(--on-accent);border-color:var(--on-accent);box-shadow:4px 4px 0 var(--cyan);padding:10px 18px}
.cta-bar-btn.primary:hover{color:var(--on-accent);box-shadow:2px 2px 0 var(--cyan)}
body:has(.cta-bar){padding-bottom:100px}

/* waitlist form */
.wl-input{font-size:16px;padding:12px 14px;min-height:52px;box-sizing:border-box;background:var(--bg);color:var(--text);border:2px solid var(--cyan);outline:none;width:100%;font-family:inherit}
.wl-input:focus{border-color:var(--lime)}
.wl-input[aria-invalid="true"]{border-color:var(--bad)}
.wl-error{margin:0;flex-basis:100%;font-size:15px;color:var(--bad);display:flex;gap:8px;align-items:center}
.wl-consent{flex-basis:100%;display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.6;color:var(--text4);cursor:pointer}
.wl-consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.wl-btn{flex:1 0 auto;font-family:inherit;font-size:17px;font-weight:700;padding:0 22px;min-height:52px;background:var(--lime);color:var(--on-accent);border:2px solid var(--on-accent);box-shadow:5px 5px 0 var(--cyan);cursor:pointer}
.wl-btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--cyan)}
.htmx-request .wl-btn{opacity:.6;cursor:progress}

/* pricing toggle: show monthly or yearly figures */
.yearly .p-monthly,.p-yearly{display:none}
.yearly .p-yearly{display:inline}
.bill-btn{font-family:inherit;font-size:15px;font-weight:600;padding:10px 18px;min-height:44px;border:0;cursor:pointer;background:transparent;color:var(--text)}
.bill-btn[aria-pressed="true"]{background:var(--lime);color:var(--on-accent)}

/* FAQ */
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:18px;font-weight:600;padding:18px 20px;min-height:56px;box-sizing:border-box;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary .sign::before{content:"+"}
.faq[open] summary .sign::before{content:"-"}

/* ---------- app (logged in) ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:32px 24px 64px;display:flex;flex-direction:column;gap:24px;box-sizing:border-box}
.card{background:var(--panel);border:2px solid var(--line);padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0;box-sizing:border-box}
.card h2{margin:0;font-size:19px}
.eyebrow{font-family:'Silkscreen',monospace;font-size:13px;color:var(--info)}
.muted{color:var(--text4);font-size:14px}
.btn{font-family:inherit;font-size:15px;font-weight:700;padding:10px 16px;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;cursor:pointer;background:var(--lime);color:var(--on-accent);border:2px solid var(--on-accent);box-shadow:4px 4px 0 var(--cyan)}
[data-install][hidden]{display:none!important}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--cyan)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line);box-shadow:none;font-weight:600}
.btn-ghost:hover{border-color:var(--cyan);color:var(--text)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn-sm{min-height:36px;padding:6px 10px;font-size:13px}
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--text3)}
.field textarea{font-family:inherit;font-size:16px;padding:12px 14px;box-sizing:border-box;background:var(--bg);color:var(--text);border:2px solid var(--cyan);outline:none;width:100%;resize:vertical;line-height:1.6}
.field textarea:focus{border-color:var(--lime)}
.flash{border:2px solid var(--line);background:var(--panel);padding:12px 16px;font-size:15px;display:flex;gap:10px;align-items:center}
.flash::before{content:"";width:10px;height:10px;flex:none;background:var(--info)}
.flash.good::before{background:var(--lime)}.flash.warn::before{background:#FFD23F}.flash.bad::before{background:var(--bad)}
.badge{font-family:'Silkscreen',monospace;font-size:13px;color:var(--on-accent);background:var(--cyan);padding:6px 10px}
.status{font-size:13px;font-weight:600;padding:3px 8px;white-space:nowrap}
.app-nav a{color:var(--text2);text-decoration:none;padding:10px 12px}
.app-nav a[aria-current="page"]{color:var(--on-accent);background:var(--lime);font-weight:700}
.kpis{display:flex;flex-wrap:wrap;gap:16px}
.kpi{flex:1 1 min(200px,100%);box-sizing:border-box;background:var(--panel);border:2px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:8px}
.kpi .v{font-family:'Press Start 2P',monospace;font-size:clamp(20px,2.4vw,26px)}
.kpi .d{font-family:'Silkscreen',monospace;font-size:13px}
.tbl{width:100%;min-width:860px;border-collapse:collapse;font-size:15px}
.tbl th{text-align:left;color:var(--text3);font-size:13px;font-weight:600;padding:10px 8px;border-bottom:2px solid var(--line)}
.tbl td{padding:12px 8px;border-bottom:1px solid var(--line2)}
.tbl .num{text-align:right;font-family:'Silkscreen',monospace}
.filters button{font-family:inherit;font-size:14px;font-weight:600;padding:8px 14px;min-height:40px;border:0;cursor:pointer;background:transparent;color:var(--text)}
.filters button[aria-pressed="true"]{background:var(--lime);color:var(--on-accent)}
.kw-toggle{font:inherit;color:inherit;background:none;border:0;padding:4px 0;cursor:pointer;text-align:left;display:inline-flex;gap:6px;align-items:baseline}
.kw-toggle:hover{color:var(--cyan)}
.kw-toggle .chev{font-size:12px;color:var(--text4);display:inline-block;transition:transform .15s}
.kw-toggle[aria-expanded="true"] .chev{transform:rotate(90deg);color:var(--cyan)}
.tbl-wrap{container-type:inline-size}
.serp-box{position:sticky;left:0;box-sizing:border-box;width:100cqw;display:flex;flex-wrap:wrap;gap:16px 24px;background:var(--panel3);padding:14px 16px;border-left:4px solid var(--cyan)}
.serp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;font-size:14px}
.serp-list li{display:flex;gap:10px;align-items:flex-start;padding:6px 8px;border-bottom:1px solid var(--line2)}
.serp-list li.you{background:var(--panel);outline:2px solid var(--lime);outline-offset:-2px}
.serp-list .pos{flex:none;width:22px;text-align:right;font-family:'Silkscreen',monospace;color:var(--text4)}
.serp-list a{color:inherit}
.tag{font-size:11px;font-weight:700;padding:1px 6px;white-space:nowrap;vertical-align:1px}
.tag-you{background:var(--lime);color:var(--on-accent)}
.tag-rival{background:#FFD23F;color:var(--on-accent)}
.hl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:12px}
.hl{display:flex;flex-direction:column;gap:4px;padding:12px 14px;background:var(--panel3);border-left:4px solid var(--good);font-size:15px;overflow-wrap:anywhere}
.hl strong{color:var(--good)}
.hl-bad{border-left-color:var(--bad)}.hl-bad strong{color:var(--bad)}
.qr svg{display:block;width:100%;height:auto}
.a-grow1{transform-origin:bottom;animation:grow 2.4s steps(6) 1}

@media (max-width: 1140px){
.nav-toggle{display:flex !important}
.nav-links{display:none !important;order:3;flex-basis:100%;flex-direction:column !important;border-top:2px solid var(--line2);padding-top:8px}
.nav-links.open{display:flex !important}
.nav-links a{border-bottom:1px solid var(--line2);padding:14px 4px !important}
.hide-sm{display:none !important}
.show-sm{display:block !important}
}
@media (max-width: 640px){
.sec{padding-left:16px !important;padding-right:16px !important;padding-top:48px !important;padding-bottom:24px !important}
.hero-pad{padding:36px 16px 48px !important;gap:32px !important}
.box-pad{padding:24px 18px !important}
.head-pad{padding:12px 16px !important}
.cta-small{padding:10px 12px !important;font-size:14px !important}
.logo-txt{font-size:11px !important}
.hero-card{box-shadow:6px 6px 0 var(--shadow) !important}
.cta-bar{padding:0}
.cta-bar-in{gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));border-width:2px 0 0;box-shadow:0 -6px 16px rgba(0,0,0,.25)}
.cta-bar-txt{display:none}
.cta-bar-btn{flex:1 1 0;padding:10px 6px;font-size:14px}
.cta-bar-btn.primary{flex-grow:1.5;box-shadow:none;padding:10px 6px}
body:has(.cta-bar){padding-bottom:72px}
}
@media print{.cta-bar{display:none}}
.print-only{display:none}
/* dashboard -> "Save as PDF": light A4 report, no app chrome */
@media print{
@page{size:A4;margin:12mm}
:root,:root.light{--bg:#FFFFFF;--panel:#FFFFFF;--panel2:#F6F5FA;--panel3:#F1EFF8;--line:#D6D2E6;--line2:#E6E3F0;--text:#1A1730;--text2:#34304D;--text3:#46415F;--text4:#5B5675;--text5:#6E6A86;--good:#3D7A0B;--info:#0B6F8F;--warn:#8A5D00;--bad:#C42E62;--lime:#8BD12F;--cyan:#2BA9C9;color-scheme:light}
*{-webkit-print-color-adjust:exact;print-color-adjust:exact;animation:none !important;box-shadow:none !important}
body{background:#FFFFFF}
body>header,.no-print,.serp-detail,.kw-toggle .chev{display:none !important}
.print-only{display:block}
.wrap{padding:0 !important;max-width:none;gap:14px}
.card,.kpi,.hl,section{break-inside:avoid}
.tbl-wrap{overflow:visible !important}
.tbl{min-width:0;font-size:11px}
.tbl td,.tbl th{padding:5px 4px}
.tbl tr{break-inside:avoid}
a{color:inherit;text-decoration:none}
}
.g-stats{display:flex;flex-wrap:wrap;gap:12px}
.g-stats>div{flex:1 1 140px;display:flex;flex-direction:column;gap:4px;padding:12px 14px;background:var(--panel3);font-size:13px;color:var(--text3)}
.g-stats .v{font-family:'Press Start 2P',monospace;font-size:clamp(15px,1.8vw,19px);color:var(--text)}
/* blog */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:20px}
.post-card{padding:0;overflow:hidden}
.post-card img,.post-cover{display:block;width:100%;height:auto;aspect-ratio:1200/630;border-bottom:2px solid var(--line)}
.post-cover{border:2px solid var(--line)}
.post{max-width:760px;width:100%;display:flex;flex-direction:column;gap:28px}
.post-toc{background:var(--panel);border:2px solid var(--line);border-left:4px solid var(--cyan);padding:16px 20px;font-size:16px}
.post-toc ol{margin:8px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:6px;line-height:1.6}
.prose{font-size:18px;line-height:1.9;color:var(--text2);overflow-wrap:anywhere}
.prose h2{font-size:clamp(22px,3vw,27px);line-height:1.4;color:var(--text);margin:40px 0 12px;scroll-margin-top:16px}
.prose h3{font-size:20px;line-height:1.5;color:var(--text);margin:28px 0 8px;scroll-margin-top:16px}
.prose p,.prose ul,.prose ol{margin:0 0 18px}
.prose li{margin-bottom:6px}
.prose strong{color:var(--text)}
.prose img{display:block;max-width:100%;height:auto;border:2px solid var(--line);margin:8px 0}
.prose blockquote{margin:0 0 18px;padding:12px 18px;background:var(--panel3);border-left:4px solid var(--lime)}
.prose blockquote p:last-child{margin:0}
.prose code{font-size:.9em;background:var(--panel3);padding:2px 6px}
.prose .tbl-scroll{overflow-x:auto;margin:0 0 18px}
.prose table{border-collapse:collapse;width:100%;min-width:520px;font-size:16px;line-height:1.6}
.prose th,.prose td{text-align:left;padding:10px 12px;border:1px solid var(--line)}
.prose th{background:var(--panel3);color:var(--text)}
.prose .faq summary{font-size:17px}
.cat-nav{display:flex;flex-wrap:wrap;gap:8px}
.cat-nav a{font-size:14px;font-weight:600;padding:8px 14px;min-height:40px;box-sizing:border-box;display:inline-flex;align-items:center;border:2px solid var(--line);color:var(--text);text-decoration:none}
.cat-nav a[aria-current="page"]{background:var(--lime);color:var(--on-accent);border-color:var(--on-accent)}
/* admin: blog editor */
.ed-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
@media (max-width:980px){.ed-grid{grid-template-columns:minmax(0,1fr)}}
.ed-input{font-family:inherit;font-size:15px;padding:9px 12px;min-height:42px;box-sizing:border-box;background:var(--bg);color:var(--text);border:2px solid var(--line);width:100%}
.ed-input:focus{border-color:var(--cyan);outline:none}
.ed-body{font-family:ui-monospace,Consolas,monospace;font-size:14px;line-height:1.7;min-height:560px}
.ed-count{font-size:12px;color:var(--text4);align-self:flex-end}
.ed-count.over{color:var(--bad);font-weight:700}
.ed-preview{border:2px dashed var(--line);padding:16px 20px;max-height:640px;overflow:auto}
.st-draft{background:var(--panel3);color:var(--text2)}.st-published{background:var(--lime);color:var(--on-accent)}.st-archived{background:var(--line);color:var(--text3)}.st-scheduled{background:#FFD23F;color:var(--on-accent)}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:12px}
.media-grid figure{margin:0;display:flex;flex-direction:column;gap:6px;font-size:12px}
.media-grid img{width:100%;height:auto;border:2px solid var(--line)}
.media-grid code{overflow-wrap:anywhere;user-select:all}

/* admin shell: sidebar menu (app/templates/admin_base.html) */
.adm{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:start}
.adm-main{display:flex;flex-direction:column;gap:24px;min-width:0}
.adm-side{position:sticky;top:16px;background:var(--panel);border:2px solid var(--line);box-shadow:5px 5px 0 var(--shadow);padding:16px 10px}
.adm-side-head{display:flex;flex-direction:column;gap:2px;padding:0 10px 12px;border-bottom:2px solid var(--line2);margin-bottom:8px}
.adm-nav{display:flex;flex-direction:column;gap:2px}
.adm-group{font-family:'Silkscreen',monospace;font-size:12px;color:var(--text5);padding:14px 10px 4px}
.adm-nav a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 10px;min-height:40px;box-sizing:border-box;color:var(--text2);text-decoration:none;font-size:15px;font-weight:600;border-left:4px solid transparent}
.adm-nav a:hover{background:var(--panel3);color:var(--text)}
.adm-nav a[aria-current="page"]{background:var(--lime);color:var(--on-accent);border-left-color:var(--cyan)}
.adm-count{font-family:'Silkscreen',monospace;font-size:12px;background:var(--bad);color:var(--on-accent);padding:2px 7px;min-width:12px;text-align:center}
.adm-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.adm-head h1{margin:0;font-size:clamp(24px,3vw,34px)}
.adm-alert{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;text-decoration:none;color:var(--text)}
.adm-alert>span:first-child{flex:1;min-width:0}.adm-alert>span:last-child{white-space:nowrap}
.adm-feed{margin:0;padding:0;list-style:none}
.adm-feed li{display:flex;flex-wrap:wrap;gap:2px 14px;padding:10px 0;border-bottom:1px solid var(--line2)}
.adm-feed .when{width:130px;flex:none;font-size:14px;color:var(--text4)}
.adm-feed .what{flex:1 1 260px;min-width:0;overflow-wrap:anywhere}
.adm-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.adm-filters select,.adm-filters input{font-family:inherit;font-size:15px;min-height:40px;padding:0 10px;box-sizing:border-box;background:var(--bg);color:var(--text);border:2px solid var(--line)}
.pill{font-size:13px;font-weight:600;padding:3px 8px;white-space:nowrap;color:var(--on-accent)}
.pill.pending{background:var(--warn)}.pill.approved{background:var(--lime)}.pill.rejected{background:var(--bad)}.pill.revoked{background:var(--text5)}
.pill.auto{background:var(--cyan)}.pill.manual{background:transparent;color:var(--text3);border:1px solid var(--line)}
@media (max-width: 900px){
.adm{grid-template-columns:minmax(0,1fr);gap:16px}
.adm-side{position:static;padding:8px;box-shadow:none}
.adm-side-head,.adm-group{display:none}
.adm-nav{flex-direction:row;overflow-x:auto;gap:4px;scrollbar-width:thin}
.adm-nav a{flex:none;border-left:0;border-bottom:4px solid transparent;font-size:14px}
.adm-nav a[aria-current="page"]{border-bottom-color:var(--cyan)}
}

/* /compare — our prices and features against foreign SEO tools */
.cmp{max-width:960px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:48px}
.cmp h1{margin:0;font-size:clamp(28px,4.6vw,40px);line-height:1.3;text-wrap:balance}
.cmp h2{margin:0;font-size:clamp(22px,3.2vw,28px);text-wrap:balance}
.cmp h3{margin:0;font-size:18px}
.cmp p{margin:0;line-height:1.7}
.cmp-hero{padding:28px;gap:18px;box-shadow:6px 6px 0 var(--shadow);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px}
.cmp-eyebrow{font-family:'Silkscreen',monospace;font-size:13px;letter-spacing:.06em;color:var(--info)}
.cmp-lead{font-size:18px;color:var(--text2);max-width:66ch}
.cmp-cta{display:flex;flex-wrap:wrap;gap:12px}
.cmp-sec{display:flex;flex-direction:column;gap:18px;min-width:0}
.cmp-bars{display:flex;flex-direction:column;gap:12px}
.cmp-bar-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;align-items:center}
.cmp-bar-name{font-weight:600;font-size:15px}
.cmp-bar-track{position:relative;height:30px}
.cmp-bar{height:100%;min-width:4px;background:#3D8FAE}
.cmp-bar.us{background:var(--lime)}
.cmp-bar-val{position:absolute;top:50%;transform:translateY(-50%);font-size:14px;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.cmp-bar-val.inside{color:#FFFFFF}
.cmp-callout{font-size:19px;font-weight:600}
.cmp-callout b{color:var(--good)}
.cmp-tbl{overflow-x:auto;border:2px solid var(--line);background:var(--panel)}
.cmp-tbl table{border-collapse:collapse;width:100%;min-width:680px;font-size:15px}
.cmp-tbl th,.cmp-tbl td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line2)}
.cmp-tbl thead th{font-size:13px;color:var(--text4);background:var(--panel2);border-bottom:2px solid var(--line)}
.cmp-tbl thead th.us{color:var(--good)}
.cmp-tbl tbody th{font-weight:600;color:var(--text2);width:28%}
.cmp-tbl td.us{background:color-mix(in srgb,var(--lime) 12%,transparent);font-weight:600}
.cmp-tbl tr:last-child>*{border-bottom:0}
.cmp-tbl .n{font-variant-numeric:tabular-nums;white-space:nowrap}
.v-yes{color:var(--good);font-weight:700}
.v-no{color:var(--text5)}
.v-part{color:var(--warn)}
.cmp-reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.cmp-reasons .card:first-child{border-color:var(--lime);box-shadow:5px 5px 0 var(--shadow)}
.cmp-reasons p{color:var(--text3)}
.cmp-others ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;color:var(--text3)}
.cmp-faqs{display:flex;flex-direction:column;gap:12px}
.cmp-faqs .faq{border:2px solid var(--line);background:var(--panel)}
.cmp-faqs .sign{font-family:'Press Start 2P',monospace;font-size:16px;color:var(--good)}
.cmp-faqs .faq p{padding:0 20px 20px;color:var(--text3)}
.cmp-end{padding:28px;gap:14px;border-color:var(--lime)}
@media (max-width:520px){.cmp-bar-row{grid-template-columns:92px minmax(0,1fr)}.cmp-hero,.cmp-end{padding:20px}}
.filters .filter-link{font-size:14px;font-weight:600;padding:8px 14px;min-height:40px;box-sizing:border-box;display:inline-flex;align-items:center;color:var(--text);text-decoration:none}
.filters .filter-link[aria-current="page"]{background:var(--lime);color:var(--on-accent)}
.tag-q{background:var(--cyan);color:var(--on-accent)}