:root{
  --bg:#fcfffe; --surface:#fff; --surface-2:#f4faf8; --ink:#0a1f1a; --ink-2:#2d5c52;
  --muted:#5b7a72; --brand:#0d9b82; --brand-2:#3d7fd9; --line:rgba(13,155,130,.16);
  --warn-bg:#fff8e6; --warn-line:#e8c96a; --radius:14px;
}
:root[data-theme="dark"]{
  --bg:#030508; --surface:#0b111c; --surface-2:#101827; --ink:#eef2f8; --ink-2:#8b9cb8;
  --muted:#7f90ac; --brand:#14b8a6; --brand-2:#6fa8ff; --line:rgba(20,184,166,.2);
  --warn-bg:#241e08; --warn-line:#6b5a1e;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#030508; --surface:#0b111c; --surface-2:#101827; --ink:#eef2f8; --ink-2:#8b9cb8;
    --muted:#7f90ac; --brand:#14b8a6; --brand-2:#6fa8ff; --line:rgba(20,184,166,.2);
    --warn-bg:#241e08; --warn-line:#6b5a1e;
  }
}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/tajawal-400.woff2') format('woff2')}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/tajawal-800.woff2') format('woff2')}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/tajawal-800.woff2') format('woff2')}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Tajawal',system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink);line-height:1.85;-webkit-text-size-adjust:100%}
.skip{position:absolute;right:-9999px;top:0;background:var(--brand);color:#fff;padding:10px 16px;z-index:200}
.skip:focus{right:8px;top:8px}
header.site{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar{max-width:820px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px;padding:0 16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;font-weight:800;font-size:19px}
.brand img{width:36px;height:36px}
.bar nav a{color:var(--ink-2);text-decoration:none;font-size:14px;font-weight:600;margin-inline-start:16px}
.bar nav a:hover{color:var(--brand)}
@media(max-width:640px){.bar nav a:not(.cta){display:none}}
.cta{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff!important;padding:9px 16px;border-radius:11px}
main{max-width:820px;margin:0 auto;padding:40px 16px 24px}
h1{font-size:clamp(27px,5vw,40px);font-weight:800;line-height:1.25;margin-bottom:12px}
h2{font-size:clamp(20px,3.4vw,26px);font-weight:800;margin:40px 0 12px;padding-top:8px}
h3{font-size:clamp(17px,2.6vw,19px);font-weight:700;margin:24px 0 8px}
p,li{font-size:17px;color:var(--ink-2)}
p{margin-bottom:14px}
ul,ol{margin:0 0 16px;padding-inline-start:22px}
li{margin-bottom:8px}
a{color:var(--brand)}
strong{color:var(--ink);font-weight:700}
.lede{font-size:19px;color:var(--ink-2);margin-bottom:8px}
.meta{font-size:14px;color:var(--muted);margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.toc{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;margin-bottom:32px}
.toc p{font-weight:700;color:var(--ink);margin-bottom:8px;font-size:15px}
.toc ul{margin:0;padding-inline-start:20px}
.toc li{margin-bottom:5px;font-size:15px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin:20px 0}
.note{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--radius);padding:16px 20px;margin:20px 0}
.note p:last-child{margin-bottom:0}
table{width:100%;border-collapse:collapse;margin:18px 0;font-size:16px;display:block;overflow-x:auto}
th,td{border:1px solid var(--line);padding:10px 13px;text-align:right;vertical-align:top}
th{background:var(--surface-2);color:var(--ink);font-weight:700;white-space:nowrap}
td{color:var(--ink-2)}
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:24px 0}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.plan.best{border-color:var(--brand);border-width:2px}
.plan h3{margin-top:0}
.amount{font-size:34px;font-weight:800;color:var(--ink);line-height:1.2}
.amount span{font-size:15px;font-weight:600;color:var(--muted)}
.was{color:var(--muted);text-decoration:line-through;font-size:16px;margin-inline-start:8px}
.plan ul{list-style:none;padding:0;margin:16px 0 0}
.plan li{padding-inline-start:24px;position:relative;font-size:16px}
.plan li::before{content:"✓";position:absolute;right:0;color:var(--brand);font-weight:800}
.btn{display:inline-block;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;text-decoration:none;padding:13px 26px;border-radius:12px;font-weight:700;margin-top:18px}
footer.site{border-top:1px solid var(--line);margin-top:56px;background:var(--surface-2)}
.foot{max-width:820px;margin:0 auto;padding:28px 16px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:14px}
.foot nav a{color:var(--ink-2);text-decoration:none;font-size:15px;font-weight:600}
.foot nav a:hover{color:var(--brand)}
.foot p{font-size:14px;color:var(--muted);margin:0}

/* ---- /check/ scan widget ---- */
.scan{background:var(--surface);border:2px solid var(--line);border-radius:18px;padding:26px 24px;margin:8px 0 34px;box-shadow:0 10px 34px rgba(6,48,40,.07)}
:root[data-theme="dark"] .scan{box-shadow:0 10px 34px rgba(0,0,0,.4)}
.scan form{display:flex;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--surface-2);min-height:62px}
.scan input{flex:1;border:0;background:transparent;padding:16px 18px;font:inherit;font-size:17px;color:var(--ink);direction:ltr;text-align:left;outline:none;min-width:0}
.scan input::placeholder{color:var(--muted)}
.scan button{flex-shrink:0;min-width:116px;border:0;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer;padding:0 28px}
.scan button:disabled{opacity:.6;cursor:wait}
@media(max-width:560px){.scan form{flex-direction:column}.scan button{width:100%;padding:15px}}
.scan .hint{font-size:14px;color:var(--muted);margin:12px 0 0}
#chk-captcha{margin-top:14px;min-height:0}
#chk-captcha:not(:empty){min-height:68px}
.scan .msg{display:none;margin-top:12px;font-size:15px}
.scan .msg.on{display:block}
#chk-loading{color:var(--brand);font-weight:600}
#chk-error{color:#d02b45;font-weight:600}
:root[data-theme="dark"] #chk-error{color:#ff6b7a}
#chk-result{display:none;margin-top:18px;padding:22px;border-radius:14px;text-align:center}
#chk-result.on{display:block}
#chk-result.safe{background:rgba(10,158,110,.09);border:1px solid rgba(10,158,110,.3)}
#chk-result.leaked{background:rgba(224,62,82,.08);border:1px solid rgba(224,62,82,.3)}
#chk-result h3{margin:0 0 6px;font-size:20px;color:var(--ink)}
#chk-result p{font-size:15px;margin-bottom:6px}
.leak-n{font-size:44px;font-weight:800;color:#d02b45;font-variant-numeric:tabular-nums;line-height:1.2;margin:8px 0}
.leak-n.zero{color:#0a9e6e}
:root[data-theme="dark"] .leak-n{color:#ff6b7a}
:root[data-theme="dark"] .leak-n.zero{color:#3ee8a0}
#chk-reveal{margin-top:14px;border:0;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font:inherit;font-weight:700;font-size:15px;padding:13px 26px;border-radius:12px;cursor:pointer}
#chk-reveal.hide{display:none}

.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}
