:root{--bg:#f4f6fb;--card:#fff;--ink:#16202e;--mut:#6b7686;--line:#e3e8f0;--pri:#2457ff;--pri2:#1a43d1;--ok:#13a45b;--warn:#d98a00;--bad:#d63b3b;--r:12px}
@media (prefers-color-scheme:dark){:root{--bg:#0f141c;--card:#171e29;--ink:#e8edf5;--mut:#93a0b4;--line:#263041;--pri:#5b87ff;--pri2:#7a9dff}}
*{box-sizing:border-box}
html,body{margin:0}
body{font:15px/1.5 -apple-system,"Segoe UI",Roboto,"Noto Sans Bengali","Hind Siliguri",sans-serif;background:var(--bg);color:var(--ink)}
[hidden]{display:none!important}
code{background:var(--line);padding:1px 5px;border-radius:4px;font-size:.9em}
.muted{color:var(--mut)}
.sp{flex:1}

/* header */
.top{display:flex;align-items:center;gap:18px;padding:10px 20px;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;flex-wrap:wrap}
.brand{font-size:19px;letter-spacing:.2px}.brand b{color:var(--pri)}
#tabs{display:flex;gap:4px;flex-wrap:wrap;flex:1}
#tabs button{border:0;background:none;padding:8px 14px;border-radius:8px;color:var(--mut);font:inherit;cursor:pointer}
#tabs button.on{background:var(--pri);color:#fff}
#tabs button:not(.on):hover{background:var(--line)}
.logout{color:var(--mut);text-decoration:none;font-size:13px}
main{max-width:1280px;margin:0 auto;padding:20px}
.tab{display:none}.tab.on{display:block}

/* controls */
label{display:block;font-size:13px;color:var(--mut);margin:0 0 10px}
input,select,textarea{width:100%;margin-top:4px;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--pri) 45%,transparent);border-color:var(--pri)}
textarea{resize:vertical}
textarea.code{font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace;white-space:pre}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;font:inherit;cursor:pointer;text-decoration:none}
.btn:hover{border-color:var(--pri)}
.btn.primary{background:var(--pri);border-color:var(--pri);color:#fff}.btn.primary:hover{background:var(--pri2)}
.btn.danger{color:var(--bad)}.btn.danger:hover{border-color:var(--bad)}
.btn.sm{padding:4px 10px;font-size:13px}.btn.block{width:100%}
.btn[disabled]{opacity:.55;cursor:wait}
.chk{display:flex;align-items:center;gap:8px;color:var(--ink)}
.chk input{width:auto;margin:0}.chk.pad{margin-top:22px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.gap{margin-top:10px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.card h2{margin:0 0 12px;font-size:17px}.card h3{margin:16px 0 6px;font-size:14px}
.alert{padding:10px 12px;border-radius:8px;background:var(--line);margin:10px 0;font-size:14px}
.alert.bad{background:color-mix(in srgb,var(--bad) 15%,transparent);color:var(--bad)}
.alert.ok{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok)}
.cnt{float:right;font-size:12px;font-weight:600}.cnt.good{color:var(--ok)}.cnt.warn{color:var(--warn)}.cnt.bad{color:var(--bad)}

/* upload + grid */
.drop{border:2px dashed var(--line);border-radius:var(--r);padding:26px;text-align:center;background:var(--card);margin-bottom:16px}
.drop.over{border-color:var(--pri);background:color-mix(in srgb,var(--pri) 8%,var(--card))}
.drop small{display:block;color:var(--mut);margin-top:6px}
.upbar{height:22px;background:var(--line);border-radius:11px;margin:12px auto 0;max-width:520px;position:relative;overflow:hidden}
.upbar i{position:absolute;inset:0 auto 0 0;width:0;background:var(--pri);transition:width .2s}
.upbar span{position:relative;font-size:12px;line-height:22px;color:#fff;mix-blend-mode:difference}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin-bottom:12px;position:sticky;top:58px;z-index:10}
.log{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;margin-bottom:12px;font-size:13px;max-height:160px;overflow:auto}
.log div.err{color:var(--bad)}.log div.okk{color:var(--ok)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.empty{text-align:center;color:var(--mut);padding:40px 10px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;position:relative;display:flex;flex-direction:column}
.tile.sel{outline:2px solid var(--pri)}
.tile .th{height:150px;background:#0002 center/cover no-repeat;cursor:pointer}
.tile .sc{position:absolute;top:8px;left:8px;background:var(--card);border-radius:6px;padding:3px 5px;display:flex}
.tile .sc input{margin:0;width:auto}
.tile .bd{position:absolute;top:8px;right:8px;font-size:12px;font-weight:700;padding:2px 8px;border-radius:99px;color:#fff;background:var(--mut)}
.bd.good{background:var(--ok)!important}.bd.warn{background:var(--warn)!important}.bd.bad{background:var(--bad)!important}
.tile .in{padding:10px 12px;font-size:13px;display:flex;flex-direction:column;gap:3px}
.tile .fn{font-weight:600;word-break:break-all}
.tile .sub{color:var(--mut)}
.tile .sub .save{color:var(--ok);font-weight:600}
.tile .st{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.pill{font-size:11px;padding:1px 8px;border-radius:99px;background:var(--line);color:var(--mut)}
.pill.on{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}
.tile .busy{position:absolute;inset:0;background:#000a;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;z-index:3}

/* serp + chips */
.serp{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0;background:#fff;color:#202124;font-family:Arial,sans-serif;max-width:620px}
.serp.mobile{max-width:380px}
.serp .u{font-size:12px;color:#202124;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.serp .t{font-size:20px;line-height:1.3;color:#1a0dab;margin:2px 0 3px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}
.serp.desk .t{white-space:nowrap;display:block;text-overflow:ellipsis}
.serp .d{font-size:14px;line-height:1.58;color:#4d5156;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;word-break:break-word}
.serp.desk .d{-webkit-line-clamp:2}.serp.mobile .d{-webkit-line-clamp:3}
.serp-tabs{display:flex;gap:6px}.serp-tabs button{border:1px solid var(--line);background:none;color:var(--ink);padding:3px 12px;border-radius:99px;cursor:pointer;font:inherit;font-size:13px}
.serp-tabs button.on{background:var(--pri);color:#fff;border-color:var(--pri)}
.chips{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.chip{border:1px solid var(--line);border-radius:8px;padding:7px 10px;cursor:pointer;font-size:13px;background:var(--bg)}
.chip:hover{border-color:var(--pri)}.chip small{display:block;color:var(--mut)}
.score{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.score .ring{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px;color:#fff;background:var(--mut)}
.score .ring.good{background:var(--ok)}.score .ring.warn{background:var(--warn)}.score .ring.bad{background:var(--bad)}
.checks,.seo-check{list-style:none;padding:0;margin:0;font-size:13px}
.checks li,.seo-check li{padding:3px 0}
.checks .ok,.seo-check .ok{color:var(--ok)}.checks .bad,.seo-check .bad{color:var(--bad)}.checks .warn,.seo-check .warn{color:var(--warn)}
.variant{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px;background:var(--bg)}
.variant p{margin:0 0 6px;white-space:pre-wrap;word-break:break-word}.variant .why{font-size:12px;color:var(--mut)}
.variant .acts{display:flex;gap:6px;margin-top:6px;align-items:center}

/* providers */
.prov{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.prov h4{margin:0 0 6px;display:flex;gap:8px;align-items:center;font-size:14px}
.prov .row2{margin-bottom:6px}
.prov .acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dot{width:9px;height:9px;border-radius:50%;background:var(--line);display:inline-block}.dot.on{background:var(--ok)}

/* modal */
.modal{position:fixed;inset:0;background:#0009;z-index:50;display:flex;align-items:center;justify-content:center;padding:14px}
.mbox{background:var(--card);border-radius:14px;width:min(1180px,100%);max-height:100%;display:flex;flex-direction:column;overflow:hidden}
.mhead,.mfoot{display:flex;gap:8px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.mfoot{border-bottom:0;border-top:1px solid var(--line)}
.mbody{display:grid;grid-template-columns:340px 1fr;gap:18px;padding:16px;overflow:auto}
.preview{background:#0002;border-radius:10px;display:flex;align-items:center;justify-content:center;min-height:200px;overflow:hidden}
.preview img{max-width:100%;max-height:300px;display:block}
.stats{font-size:13px;margin:10px 0;display:grid;grid-template-columns:auto 1fr;gap:2px 10px}
.stats b{color:var(--mut);font-weight:500}
.mtabs{display:flex;gap:4px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.mtabs button{border:0;background:none;color:var(--mut);padding:8px 12px;cursor:pointer;font:inherit;border-bottom:2px solid transparent}
.mtabs button.on{color:var(--pri);border-color:var(--pri)}
.mt{display:none}.mt.on{display:block}
.metaview{font-size:13px;margin-top:10px}
.metaview table{width:100%;border-collapse:collapse}
.metaview td{padding:4px 8px;border-bottom:1px solid var(--line);vertical-align:top;word-break:break-word}
.metaview td:first-child{color:var(--mut);width:130px}

/* toast */
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:10px;z-index:99;font-size:14px;max-width:90vw}

/* auth */
body.auth{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.auth-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:28px;width:100%;max-width:380px}
.auth-card.wide{max-width:680px}
.auth-card h1{margin:0 0 4px;font-size:24px}
.auth-card h3{margin:18px 0 8px}
.checks li{padding:2px 0}

@media (max-width:900px){
  .cols,.mbody{grid-template-columns:1fr}
  .row3{grid-template-columns:1fr 1fr}
  .toolbar{position:static}
}
@media (max-width:560px){.row2,.row3{grid-template-columns:1fr}.top{gap:8px}}

/* previews */
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cmp figure{margin:0;background:#0001;border-radius:10px;padding:8px;text-align:center}
.cmp img{max-width:100%;max-height:260px;border-radius:6px;display:block;margin:0 auto;cursor:zoom-in;background:repeating-conic-gradient(#8881 0 25%,transparent 0 50%) 0 0/16px 16px}
.cmp figcaption{font-size:12px;color:var(--mut);margin-top:6px}
.cmp figcaption b{color:var(--ink)}
.zoomable{cursor:zoom-in}
.lightbox{position:fixed;inset:0;background:#000d;z-index:80;display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:100%;border-radius:6px;background:repeating-conic-gradient(#8884 0 25%,transparent 0 50%) 0 0/20px 20px}
.diff{width:100%;border-collapse:collapse;font-size:13px}
.diff th{text-align:left;color:var(--mut);font-weight:500;padding:4px 8px;border-bottom:1px solid var(--line)}
.diff td{padding:5px 8px;border-bottom:1px solid var(--line);vertical-align:top;word-break:break-word}
.diff td:first-child{color:var(--mut);width:110px;white-space:nowrap}
.diff tr.new td:last-child{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.diff tr.chg td:last-child{background:color-mix(in srgb,var(--warn) 16%,transparent)}
.diff tr.del td:last-child{background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad)}
.diff tr.same td:last-child{color:var(--mut)}
.diff .tag{font-size:11px;font-weight:700;margin-right:6px}
.gimg{display:flex;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px;background:#fff;color:#202124;font-family:Arial,sans-serif;max-width:560px}
.gimg img{width:128px;height:96px;object-fit:cover;border-radius:8px;flex:none;background:#eee}
.gimg .gsrc{font-size:12px;color:#4d5156;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gimg .gt{font-size:16px;color:#1a0dab;line-height:1.3;margin:2px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gimg .gs{font-size:12.5px;color:#4d5156;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.og{border:1px solid #dadde1;border-radius:8px;overflow:hidden;background:#f0f2f5;max-width:500px;font-family:Helvetica,Arial,sans-serif;color:#1c1e21}
.og .ogimg{aspect-ratio:1.91/1;background:#d8dce2 center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#7a828e;font-size:13px;overflow:hidden}
.og .ogimg img{width:100%;height:100%;object-fit:cover;display:block}
.og .ogb{padding:10px 12px;border-top:1px solid #dadde1}
.og .ogd{font-size:12px;color:#65676b;text-transform:uppercase;letter-spacing:.3px}
.og .ogt{font-size:16px;font-weight:600;line-height:1.25;margin:3px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.og .ogs{font-size:14px;color:#65676b;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard{display:flex;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--bg);max-width:460px;margin:10px 0}
.pcard .pimg{width:84px;height:84px;border-radius:8px;background:var(--line);flex:none}
.pcard .pt{font-size:14px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard .pbody{font-size:13.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.kv{display:grid;grid-template-columns:90px 1fr;gap:3px 10px;font-size:13px}
.kv b{color:var(--mut);font-weight:500}.kv span{word-break:break-all}
@media (max-width:560px){.cmp{grid-template-columns:1fr}.gimg{flex-direction:column}.gimg img{width:100%;height:auto;aspect-ratio:4/3}}
