/* Toolzo unified product UI polish — visual-only layer shared by all 13 tools. */
:root{
  --tz-bg:#080d18;
  --tz-panel:rgba(17,25,43,.82);
  --tz-panel-strong:#111a2d;
  --tz-border:rgba(148,163,255,.34);
  --tz-border-strong:rgba(129,140,248,.68);
  --tz-text:#f5f7ff;
  --tz-muted:#9aa8c1;
  --tz-accent:#7568f6;
  --tz-accent-2:#9b7bff;
  --tz-shadow:0 18px 50px rgba(0,0,0,.22);
}
html{scroll-behavior:smooth;background:var(--tz-bg)}
body{background:radial-gradient(ellipse at 12% -10%,rgba(91,78,220,.16),transparent 36%),radial-gradient(ellipse at 100% 0%,rgba(31,120,190,.10),transparent 30%),var(--tz-bg)!important;color:var(--tz-text)}
::selection{background:rgba(117,104,246,.55);color:#fff}
:where(.top,.topbar,.header){background:rgba(8,13,24,.86)!important;border-bottom:1px solid var(--tz-border-strong)!important;box-shadow:0 8px 28px rgba(0,0,0,.12)}
:where(.top,.topbar,.header) :where(a,button){transition:color .18s ease,background .18s ease,border-color .18s ease}
:where(.brand,.logo){letter-spacing:-.035em}
:where(.mark,.logo-tile){box-shadow:0 8px 24px rgba(117,104,246,.28)!important}
:where(main,.page,.sign-wrap){position:relative}
:where(.card,.modal-box,.preview-wrap,.dropzone,.pricebar,.price-card,.qr-card){background:linear-gradient(145deg,rgba(20,30,51,.92),rgba(13,21,37,.88))!important;border-color:var(--tz-border)!important;box-shadow:var(--tz-shadow)}
:where(.card,.modal-box,.price-card,.qr-card){border-radius:18px!important}
:where(.card) :where(h1,h2,h3){letter-spacing:-.025em;color:#f8f9ff}
:where(.hint,.muted,.app-sub,.tagline,.blurb,.detail,.fmeta){color:var(--tz-muted)!important}
:where(.btn,button.tab,.tab,.chip,.seg button,.run,.download,.buybtn){transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}
:where(.btn.primary,.run,.buybtn,.tab.active,.seg-active){background:linear-gradient(120deg,#5b55e8,#8065f5)!important;border-color:#8275ff!important;box-shadow:0 8px 20px rgba(99,89,235,.22)}
:where(.btn.primary,.run,.buybtn,.tab.active,.seg-active):hover{filter:brightness(1.1);box-shadow:0 10px 26px rgba(99,89,235,.32)}
:where(.btn,button.tab,.tab,.chip,.seg button){border-color:var(--tz-border)!important}
:where(.btn,button.tab,.tab,.chip,.seg button):focus-visible,:where(a,input,select,textarea):focus-visible{outline:2px solid #a69aff!important;outline-offset:2px}
:where(input,select,textarea){background-color:rgba(8,14,27,.9)!important;border-color:rgba(148,163,184,.36)!important;color:#f4f6ff!important;border-radius:10px!important}
:where(input,select,textarea)::placeholder{color:#71809b!important}
:where(input,select,textarea):focus{border-color:#8b7cff!important;box-shadow:0 0 0 3px rgba(117,104,246,.16)!important}
:where(.tabs){gap:7px}
:where(.tabs button,.tab){border-radius:10px!important}
:where(table th){color:#cbd5e1}
:where(table td,table th){border-color:rgba(148,163,184,.18)!important}
:where(.foot,footer,.footer){background:rgba(6,10,19,.7)!important;border-color:var(--tz-border)!important;color:#8795ae!important}
:where(.pill,.badge,.chip){border-color:var(--tz-border)}
:where(.dropzone):hover{border-color:#a69aff!important;background:rgba(117,104,246,.08)!important}
:where(button,a){-webkit-tap-highlight-color:transparent}
@media(max-width:680px){
  :where(.top,.topbar,.header){padding-left:14px!important;padding-right:14px!important;gap:10px}
  :where(main,.page){padding-left:14px!important;padding-right:14px!important}
  :where(.card){padding:14px!important}
  :where(.top-nav,.site-nav){gap:9px!important;flex-wrap:wrap}
  :where(.tabs){overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px;scrollbar-width:thin}
  :where(.tabs button,.tab){white-space:nowrap;flex:none}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* FONT SIZE NORMALIZATION + OVERFLOW GUARD 2026-11-08 (Qasim phone review) —
   readable text on phones; no horizontal page scroll. Visual only. */
:where(.pill){font-size:16px!important;font-weight:700}
:where(.hint,.app-sub,.brand-text>span,.topbar-tag,.cards .lbl,.item .s,.rowitem .meta,.cards span,.tpl .s,.foot-note,.bar-row,table.stat,table.audit,table.grid th,label,.site-nav a,.support-btn,.contact-btn,.foot,footer,.footer,.stat span,.card p,.filters label,.remove-btn,.btn-small,.qr-empty){font-size:14px!important}
:where(.badge,.plat,.model,code,.mono,.cal .dow,.cal .day){font-size:13px!important}
:where(.chip,.tag){font-size:14px!important}
:where(.tabs button,.tab){font-size:14px!important}
:where(.preview-footer){font-size:13px!important}
html,body{overflow-x:clip}
:where(img,svg,video){max-width:100%}
:where(.site-nav){flex-wrap:wrap;min-width:0}
:where(.preview-links a){overflow-wrap:anywhere;min-width:0}

/* COLORED TABS 2026-11-08 (Qasim) — inactive tabs must not look dull grey. Borders lightened 2026-11-08 (Qasim). */
:where(.tabs button,.tab){background:rgba(99,102,241,.16)!important;border-color:rgba(178,164,255,.95)!important;color:#dbe4ff!important}
:where(.tabs button:hover,.tab:hover){background:rgba(99,102,241,.3)!important;color:#fff!important}
:where(.foot-price){font-size:18px!important;font-weight:800}

/* PRIVACY LINE 2026-11-08 (Qasim) — prominent privacy line near top of every tool page. */
.privacy-line{margin:0 0 14px;padding:10px 14px;border:1px solid rgba(52,211,153,.55);background:rgba(16,185,129,.10);color:#34d399;font-size:17px;font-weight:800;border-radius:12px;text-align:center}
