/* DigitalBaloch: shared styles for individual SEO tool pages (prefix .tp-) */
:root{--hh:77px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
.tp-ico{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Hero ---------- */
.tp-hero{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding:48px 0 112px!important}
.tp-hero-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 90% at 85% 0%,rgba(109,40,217,.5),transparent 60%),radial-gradient(45% 70% at 0% 100%,rgba(167,139,250,.2),transparent 60%),linear-gradient(180deg,#0B0B2B,#10103A)}
.tp-hero-bg::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(70% 90% at 50% 20%,#000,transparent);mask-image:radial-gradient(70% 90% at 50% 20%,#000,transparent)}
.tp-hero .crumbs{display:flex;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.tp-hero h1{font:800 clamp(32px,4.4vw,52px)/1.1 var(--display);letter-spacing:-.02em;margin-top:16px}
.tp-hero p.tp-sub{margin:16px auto 0;max-width:660px;color:#D9D5F3;font-size:18px;line-height:28px}

/* ---------- Tool shell ---------- */
.tp-tool{margin-top:-72px;position:relative;z-index:2;padding-bottom:8px}
.tp-shell{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:24px;align-items:start}
.tp-card{background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:0 18px 50px rgba(11,11,43,.12);padding:28px}
.tp-card h2,.tp-card h3.tp-ct{font:800 20px/28px var(--display);color:var(--navy)}
.tp-side{display:grid;gap:20px}
.tp-aside{background:var(--lav);border:1px solid var(--border);border-radius:20px;padding:22px}
.tp-aside h3{display:flex;align-items:center;gap:8px;font:800 16px/24px var(--display);color:var(--purple-deep)}
.tp-aside p,.tp-aside li{font-size:14px;line-height:22px;color:var(--muted)}
.tp-aside ul{padding-left:18px;display:grid;gap:6px;margin-top:10px}
.tp-aside.tip{background:#fff}

.tp-tabs{display:flex;gap:6px;background:var(--lav);border-radius:12px;padding:4px;margin:18px 0 20px}
.tp-tab{flex:1;font:600 14px/20px var(--body);color:var(--muted);background:transparent;border:0;border-radius:9px;padding:10px 12px;cursor:pointer;transition:.15s}
.tp-tab[aria-selected=true]{background:#fff;color:var(--purple-deep);box-shadow:0 2px 8px rgba(11,11,43,.1)}
.tp-field{display:grid;gap:6px;margin-bottom:16px}
.tp-field label,.tp-lbl{display:flex;justify-content:space-between;gap:12px;font:600 13px/18px var(--body);color:var(--ink)}
.tp-field label small{font-weight:500;color:var(--muted)}
.tp-field input[type=text],.tp-field input[type=url],.tp-field input[type=search],.tp-field textarea,.tp-field select{width:100%;font:500 15px/22px var(--body);color:var(--ink);background:#fff;border:1px solid #CFC9E8;border-radius:12px;padding:11px 14px;transition:border-color .15s,box-shadow .15s}
.tp-field textarea{min-height:200px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:20px}
.tp-field input:focus,.tp-field textarea:focus,.tp-field select:focus{outline:0;border-color:var(--purple);box-shadow:0 0 0 3px rgba(109,40,217,.18)}
.tp-field [aria-invalid=true]{border-color:var(--error);box-shadow:0 0 0 3px rgba(185,28,28,.12)}
.tp-help{font-size:13px;line-height:20px;color:var(--muted)}
.tp-err{font:500 13px/20px var(--body);color:var(--error)}
.tp-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tp-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}
.tp-actions .btn{min-height:46px}
.tp-link{background:none;border:0;color:var(--purple);font:600 14px/20px var(--body);cursor:pointer;padding:8px 4px;text-decoration:underline;text-underline-offset:3px}
.tp-banner{display:flex;gap:10px;align-items:flex-start;border-radius:12px;padding:12px 14px;font-size:14px;line-height:22px;margin:0 0 16px}
.tp-banner.info{background:var(--lav);color:var(--purple-deep);border:1px solid var(--border)}
.tp-banner.warn{background:#FFFBEB;color:#92400E;border:1px solid #FDE68A}
.tp-banner.err{background:#FEF2F2;color:#991B1B;border:1px solid #FECACA}
.tp-banner svg{margin-top:2px}
.tp-spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:tpspin .7s linear infinite}
@keyframes tpspin{to{transform:rotate(360deg)}}

/* ---------- Results (audit) ---------- */
.tp-results{margin-top:28px;scroll-margin-top:96px}
.tp-sum{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center}
.tp-ring{--p:0;position:relative;width:124px;height:124px;border-radius:50%;background:conic-gradient(var(--purple) calc(var(--p)*1%),#E9E5F8 0);display:grid;place-items:center}
.tp-ring::before{content:"";position:absolute;inset:11px;border-radius:50%;background:#fff}
.tp-ring b{position:relative;font:800 30px/1 var(--display);color:var(--navy);text-align:center}
.tp-ring b small{display:block;font:600 11px/14px var(--body);color:var(--muted);margin-top:4px}
.tp-sum h2{font:800 22px/30px var(--display);color:var(--navy)}
.tp-meta{font-size:14px;line-height:22px;color:var(--muted);margin-top:4px;word-break:break-word}
.tp-counts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tp-pill{display:inline-flex;align-items:center;gap:6px;font:600 13px/18px var(--body);border-radius:999px;padding:5px 12px}
.tp-pill.pass{background:#ECFDF5;color:#047857}.tp-pill.warn{background:#FFFBEB;color:#B45309}.tp-pill.fail{background:#FEF2F2;color:#B91C1C}.tp-pill.info{background:var(--lav);color:var(--purple-deep)}
.tp-exp{display:grid;gap:8px}
.tp-exp .btn{min-height:42px;font-size:14px;padding:0 16px}
.tp-fix{margin-top:22px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px}
.tp-fix h3{font:800 17px/24px var(--display);color:var(--navy);margin-bottom:10px}
.tp-fix ol{padding-left:20px;display:grid;gap:8px;font-size:15px;line-height:24px}
.tp-fix li b{color:var(--ink)}
.tp-cats{display:grid;gap:14px;margin-top:22px}
.tp-cat{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.tp-cat>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:16px 20px;cursor:pointer;font:800 16px/24px var(--display);color:var(--navy)}
.tp-cat>summary::-webkit-details-marker{display:none}
.tp-cat>summary .tp-ci{width:36px;height:36px;border-radius:10px;background:var(--lav);color:var(--purple);display:grid;place-items:center}
.tp-cat>summary .tp-cs{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.tp-cat>summary::after,.tp-cat[open]>summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin:-4px 4px 0 8px;transition:transform .2s;flex:none}
.tp-cat[open]>summary::after{transform:rotate(-135deg);margin-top:4px}
.tp-fix p,.tp-limits{padding:0}
.tp-chk{display:grid;grid-template-columns:28px 1fr auto;gap:12px;padding:14px 20px;border-top:1px solid var(--border)}
.tp-st{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.tp-st svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.tp-st.pass{background:#D1FAE5;color:#047857}.tp-st.warn{background:#FEF3C7;color:#B45309}.tp-st.fail{background:#FEE2E2;color:#B91C1C}.tp-st.info{background:var(--lav);color:var(--purple)}
.tp-chk h3{font:700 15px/22px var(--body);color:var(--ink)}
.tp-chk p{font-size:14px;line-height:22px;color:var(--muted);margin-top:2px;padding:0;max-width:none}
.tp-chk p.fx{color:var(--ink);margin-top:6px}
.tp-chk p.fx b{color:var(--purple-deep)}
.tp-val{font:600 13px/20px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);background:var(--lav);border-radius:8px;padding:2px 8px;align-self:start;max-width:260px;word-break:break-word;text-align:right}
.tp-limits{margin-top:18px;font-size:14px;line-height:22px;color:var(--muted)}

/* ---------- Content sections ---------- */
.tp-sec{padding:64px 0 0!important}
.tp-sec:last-of-type{padding-bottom:8px!important}
.tp-narrow{max-width:960px;margin:0 auto}
.tp-eye{font:700 13px/18px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--purple)}
.tp-sec h2{font:800 clamp(24px,2.8vw,32px)/1.2 var(--display);letter-spacing:-.01em;color:var(--navy);margin-top:8px}
.tp-sec p.tp-lead{color:var(--muted);margin-top:12px;max-width:720px;font-size:17px;line-height:27px}
.tp-table{width:100%;border-collapse:collapse;margin-top:22px;font-size:15px;line-height:24px}
.tp-table th{text-align:left;font:700 12px/16px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:2px solid var(--border)}
.tp-table td{padding:14px 12px;border-bottom:1px solid var(--border);vertical-align:top}
.tp-table td:first-child{font-weight:600;color:var(--ink);width:34%}
.tp-table code,.tp-sec code{font:500 13px/20px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--lav);border-radius:6px;padding:1px 6px;color:var(--purple-deep)}
.tp-checklist{list-style:none;padding:0;margin-top:20px;display:grid;gap:0}
.tp-checklist li{display:flex;gap:12px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--border);font-size:16px;line-height:25px}
.tp-checklist li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:6px;border:2px solid var(--purple-soft);background:var(--lav) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236D28D9' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.tp-two{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.tp-box{border:1px solid var(--border);border-radius:16px;padding:22px;background:var(--lav)}
.tp-box.w{background:#fff}
.tp-box small{display:block;font:700 12px/16px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--purple);margin-bottom:8px}
.tp-box p,.tp-box li{font-size:15px;line-height:24px;color:var(--ink)}
.tp-box ul{padding-left:18px;display:grid;gap:4px}
.tp-callout{border-left:4px solid var(--purple);background:var(--lav);border-radius:0 14px 14px 0;padding:20px 24px;margin-top:22px}
.tp-callout small{display:block;font:700 12px/16px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--purple);margin-bottom:6px}
.tp-callout h3{font:800 19px/26px var(--display);color:var(--navy)}
.tp-callout p{margin-top:6px;font-size:15px;line-height:24px;color:var(--muted)}
.tp-steps{list-style:none;counter-reset:s;padding:0;margin-top:22px;display:grid;gap:14px}
.tp-steps li{counter-increment:s;display:grid;grid-template-columns:36px 1fr;gap:14px;font-size:16px;line-height:25px}
.tp-steps li::before{content:counter(s);width:34px;height:34px;border-radius:50%;background:var(--purple);color:#fff;display:grid;place-items:center;font:700 14px/1 var(--body)}
.tp-steps li b{color:var(--navy)}
.tp-legend{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}
.tp-legend div{border:1px solid var(--border);border-radius:14px;padding:16px}
.tp-legend b{display:flex;align-items:center;gap:8px;font:700 15px/22px var(--body);color:var(--navy)}
.tp-legend p{font-size:14px;line-height:22px;color:var(--muted);margin-top:6px}
.tp-prose p{font-size:16px;line-height:26px;color:var(--ink);margin-top:14px;max-width:760px}

/* related + faq + cta */
.tp-rel{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.tp-rc{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px;transition:.2s;color:inherit}
.tp-rc .tp-ci{width:42px;height:42px;border-radius:12px;background:var(--lav);color:var(--purple);display:grid;place-items:center}
.tp-rc h3{font:700 16px/22px var(--display);color:var(--navy)}
.tp-rc p{font-size:14px;line-height:21px;color:var(--muted)}
.tp-rc b{margin-top:auto;font:600 14px/20px var(--body);color:var(--purple)}
a.tp-rc:hover{transform:translateY(-4px);border-color:var(--purple-soft);box-shadow:var(--shadow-hi)}
.tp-rc.soon{background:#FBFAFF}.tp-rc.soon b{color:var(--muted)}
.tp-faq{margin-top:22px;border-top:1px solid var(--border)}
.tp-faq details{border-bottom:1px solid var(--border)}
.tp-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 4px;font:700 17px/26px var(--display);color:var(--navy)}
.tp-faq summary::-webkit-details-marker{display:none}
.tp-faq summary::after{content:"+";font:500 26px/1 var(--body);color:var(--purple);flex:none;transition:transform .2s}
.tp-faq details[open] summary::after{transform:rotate(45deg)}
.tp-faq details p{padding:0 4px 20px;font-size:16px;line-height:26px;color:var(--muted);max-width:780px}
.tp-cta{padding:64px 0 80px!important}
.tp-cta-card{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;border-radius:24px;padding:44px}
.tp-cta-card::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 120% at 100% 0%,rgba(109,40,217,.7),transparent 60%),radial-gradient(40% 100% at 0% 100%,rgba(167,139,250,.25),transparent 60%)}
.tp-cta-card>div:first-child{flex:1 1 420px}
.tp-cta-card h2{font:800 clamp(24px,2.8vw,32px)/1.2 var(--display);max-width:560px;margin-top:8px;color:#fff}
.tp-cta-card p{margin-top:12px;color:#C9C5E8;max-width:540px;font-size:16px;line-height:26px}
.tp-cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.tp-cta-btns .btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tp-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--navy);color:#fff;font:600 14px/20px var(--body);padding:12px 18px;border-radius:12px;opacity:0;pointer-events:none;transition:.25s;z-index:50;box-shadow:0 12px 30px rgba(0,0,0,.3)}
.tp-toast.on{opacity:1;transform:translateX(-50%)}

@media (max-width:1000px){
 .tp-shell{grid-template-columns:1fr}
 .tp-rel{grid-template-columns:1fr 1fr}
 .tp-legend{grid-template-columns:1fr 1fr}
 .tp-sum{grid-template-columns:auto 1fr}.tp-exp{grid-column:1/-1;grid-template-columns:repeat(3,auto);justify-content:start}
}
@media (max-width:639px){
 .tp-hero{padding:36px 0 96px!important}
 .tp-card{padding:20px 16px;border-radius:16px}
 .tp-row2,.tp-two,.tp-rel,.tp-legend{grid-template-columns:1fr}
 .tp-sum{grid-template-columns:1fr;justify-items:start}.tp-exp{grid-template-columns:1fr;width:100%}
 .tp-chk{grid-template-columns:28px 1fr}.tp-val{grid-column:2;text-align:left;max-width:none;justify-self:start}
 .tp-cat>summary{flex-wrap:wrap;padding:14px 16px}.tp-cat>summary .tp-cs{margin-left:48px;order:3;width:100%}
 .tp-table,.tp-table tbody,.tp-table tr,.tp-table td{display:block;width:100%}.tp-table thead{display:none}.tp-table td:first-child{width:100%;border-bottom:0;padding-bottom:0}
 .tp-sec{padding-top:48px!important}
 .tp-cta-card{padding:30px 22px}.tp-cta-btns,.tp-cta-btns .btn{width:100%}
 .tp-actions .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Local Keyword Research tool ---------- */
.kw-radios{display:grid;gap:10px;margin-bottom:16px}
.kw-radio{display:flex;gap:12px;align-items:flex-start;border:1px solid #CFC9E8;border-radius:12px;padding:12px 14px;cursor:pointer;transition:.15s}
.kw-radio:hover{border-color:var(--purple-soft);background:var(--lav)}
.kw-radio input{margin-top:4px;accent-color:var(--purple);flex:none;width:18px;height:18px}
.kw-radio b{display:block;font:600 14px/20px var(--body);color:var(--ink)}
.kw-radio span{display:block;font-size:13px;line-height:20px;color:var(--muted)}
.kw-radio:has(input:checked){border-color:var(--purple);background:var(--lav);box-shadow:0 0 0 3px rgba(109,40,217,.12)}
.kw-opts{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:end}
.kw-check{display:inline-flex;align-items:center;gap:8px;font:500 14px/20px var(--body);color:var(--ink);cursor:pointer}
.kw-check input{width:18px;height:18px;accent-color:var(--purple)}
.tp-field textarea.kw-ta{min-height:92px;font-family:var(--body);font-size:15px;line-height:22px}
.tp-field select{appearance:auto}
.kw-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap}
.kw-head h2{font:800 22px/30px var(--display);color:var(--navy)}
.kw-exp{display:flex;gap:8px;flex-wrap:wrap}
.kw-exp .btn{min-height:42px;font-size:14px;padding:0 16px}
.kw-note{margin:16px 0 0}
.kw-tools{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:16px}
.kw-chips{margin-top:14px}
.kw-chip{cursor:pointer;border:1px solid var(--border);transition:.15s;font-family:var(--body)}
.kw-chip:hover{border-color:var(--purple-soft)}
.kw-chip.on{background:var(--purple);color:#fff;border-color:var(--purple)}
.kw-chip b{font-weight:700}
.kw-gbody{padding:4px 20px 20px;border-top:1px solid var(--border)}
.kw-gbody>p.tp-help{margin-top:14px;padding:0;max-width:none}
.kw-gact{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:6px 0 12px}
.kw-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.kw-row{display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;font:500 14px/20px var(--body);color:var(--ink);background:#fff;border:1px solid var(--border);border-radius:10px;padding:9px 12px;cursor:copy;transition:.15s;word-break:break-word}
.kw-row:hover{border-color:var(--purple);background:var(--lav)}
.kw-row i{flex:none;font:600 11px/16px var(--body);font-style:normal;color:var(--purple-deep);background:var(--lav);border-radius:99px;padding:1px 8px}
.kw-row:hover i{background:#fff}
.kw-row[hidden]{display:none}
@media (max-width:760px){.kw-list{grid-template-columns:1fr}.kw-opts{grid-template-columns:1fr}.kw-exp{width:100%}.kw-exp .btn{flex:1 1 100%}}
.kw-recover{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px}
.kw-recover .tp-link{padding:4px 0}

/* ---------- SERP Preview tool ---------- */
.sp-shell{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:24px;align-items:start}
.sp-prev{background:var(--lav);border:1px solid var(--border);border-radius:20px;padding:20px;box-shadow:0 18px 50px rgba(11,11,43,.1)}
.sp-prev h2{font:800 18px/26px var(--display);color:var(--navy)}
.sp-prev .tp-help{margin-top:2px}
.sp-scroll{overflow-x:auto;margin-top:14px;padding-bottom:4px}
.sp-label{display:flex;justify-content:space-between;align-items:center;font:700 12px/16px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--purple-deep);margin:18px 0 8px}
.sp-label span{font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.sp-card{background:#fff;border:1px solid #E4E0F5;border-radius:12px;padding:16px 18px;font-family:Arial,"Liberation Sans",Helvetica,sans-serif;color:#202124;text-align:left}
.sp-desktop{width:600px;max-width:none}
.sp-mobile{width:372px;max-width:none;border-radius:20px;padding:14px 16px}
.sp-site{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.sp-fav{flex:none;width:26px;height:26px;border-radius:50%;background:#F1F3F4;border:1px solid #E0E0E0;display:grid;place-items:center;font:700 12px/1 Arial,sans-serif;color:#5F6368;text-transform:uppercase}
.sp-sn{font:400 14px/18px Arial,"Liberation Sans",sans-serif;color:#202124}
.sp-url{font:400 12px/16px Arial,"Liberation Sans",sans-serif;color:#4D5156;word-break:break-all}
.sp-title{font:400 20px/26px Arial,"Liberation Sans",Helvetica,sans-serif;color:#1A0DAB;margin:2px 0 3px;word-break:break-word}
.sp-desktop .sp-title{white-space:nowrap}
.sp-desc{font:400 14px/22px Arial,"Liberation Sans",Helvetica,sans-serif;color:#4D5156;word-break:break-word}
.sp-desc b,.sp-title b{font-weight:700}
.sp-ph{color:#5F6368!important;font-style:italic}
.sp-meter{margin-top:14px;display:grid;gap:10px}
.sp-m{display:grid;gap:5px}
.sp-m>div:first-child{display:flex;justify-content:space-between;gap:10px;font:600 13px/18px var(--body);color:var(--ink)}
.sp-m>div:first-child span{font-weight:500;color:var(--muted)}
.sp-bar{height:9px;border-radius:99px;background:#E4E0F5;overflow:hidden}
.sp-bar i{display:block;height:100%;width:0;border-radius:99px;background:#10B981;transition:width .15s}
.sp-bar i.near{background:#F59E0B}.sp-bar i.cut{background:#EF4444}
.sp-code{position:relative;margin-top:14px}
.sp-code pre{margin:0;background:var(--navy);color:#E6E3FA;border-radius:14px;padding:16px;font:500 13px/22px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-word;overflow:auto}
.sp-note{font-size:13px;line-height:20px;color:var(--muted);margin-top:12px}
.tp-import{margin-top:6px;border:1px dashed #CFC9E8;border-radius:12px;padding:10px 14px}
.tp-import summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--purple);list-style:none;padding:2px 0;display:block;min-height:0}
.tp-import summary::-webkit-details-marker{display:none}
.tp-import summary::after{content:none!important}
.tp-import textarea{margin-top:10px;min-height:120px!important}
@media (max-width:1000px){.sp-shell{grid-template-columns:minmax(0,1fr)}.sp-prev{min-width:0}}

/* long URLs / code inside content boxes must wrap instead of widening the page */
.tp-sec code,.tp-box code,.tp-table code,.tp-callout code{overflow-wrap:anywhere;word-break:break-word}
.tp-two>*,.tp-shell>*,.tp-legend>*,.tp-rel>*{min-width:0}
.tp-table td{overflow-wrap:anywhere}

/* ---------- Meta Tag Analyzer ---------- */
.mt-prev{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}
.mt-card{border:1px solid var(--border);border-radius:16px;background:#fff;padding:18px;min-width:0}
.mt-card h3{font:800 16px/22px var(--display);color:var(--navy);margin-bottom:12px}
.mt-fb{border:1px solid #DADDE1;border-radius:8px;overflow:hidden;background:#F2F3F5;font-family:Helvetica,Arial,sans-serif;max-width:500px}
.mt-img{aspect-ratio:1.91/1;background:#E4E6EB center/cover no-repeat;display:grid;place-items:center;color:#65676B;font:500 13px/18px Helvetica,Arial,sans-serif;text-align:center;padding:12px;overflow:hidden}
.mt-img img{width:100%;height:100%;object-fit:cover;display:block}
.mt-fb .mt-t{padding:10px 12px}
.mt-dom{font-size:12px;line-height:16px;color:#65676B;text-transform:uppercase}
.mt-ti{font-size:16px;line-height:20px;font-weight:600;color:#050505;margin-top:2px;overflow-wrap:anywhere}
.mt-de{font-size:14px;line-height:20px;color:#65676B;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.mt-x{border:1px solid #CFD9DE;border-radius:16px;overflow:hidden;background:#fff;font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;max-width:500px;position:relative}
.mt-x .mt-t{padding:10px 12px}
.mt-x .mt-dom{text-transform:none;color:#536471;font-size:13px}
.mt-x .mt-ti{font-weight:400;font-size:15px;color:#0F1419}
.mt-x .mt-de{color:#536471;font-size:15px}
.mt-x.sm{display:grid;grid-template-columns:96px 1fr}.mt-x.sm .mt-img{aspect-ratio:1/1;height:100%}
.mt-note{font-size:13px;line-height:20px;color:var(--muted);margin-top:10px}
.mt-tbl{width:100%;border-collapse:collapse;font-size:14px;line-height:20px;table-layout:fixed}
.mt-tbl th{text-align:left;font:700 12px/16px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--border)}
.mt-tbl td{padding:9px 10px;border-bottom:1px solid var(--border);vertical-align:top;overflow-wrap:anywhere}
.mt-tbl td:first-child{width:34%;font:600 13px/20px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--purple-deep)}
.mt-tbl tr.body td:first-child::after{content:" (in body)";color:#B45309;font-weight:500}
@media (max-width:760px){.mt-prev{grid-template-columns:minmax(0,1fr)}.mt-tbl td:first-child{width:38%}}

/* ---------- Schema validator + generator ---------- */
.sg-shell{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:start}
.sg-out{position:sticky;top:calc(var(--hh,77px) + 16px)}
.sg-h{font:800 15px/22px var(--display);color:var(--purple-deep);margin:22px 0 10px;padding-top:16px;border-top:1px solid var(--border)}
.sg-h:first-of-type{border-top:0;padding-top:0;margin-top:14px}
.sg-hours{width:100%;border-collapse:collapse;font-size:14px}
.sg-hours th{text-align:left;font:700 12px/16px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:6px 6px}
.sg-hours td{padding:5px 6px;vertical-align:middle}
.sg-hours input[type=time]{font:500 14px/20px var(--body);border:1px solid #CFC9E8;border-radius:8px;padding:6px 8px;width:100%;min-width:0;background:#fff;color:var(--ink)}
.sg-hours input[type=time]:disabled{background:#F5F3FF;color:#9A97B3}
.sg-hours input[type=checkbox]{width:18px;height:18px;accent-color:var(--purple)}
.sg-hours label{font-weight:600}
.sg-hours .tp-link{padding:0}
.sg-status{border-radius:12px;padding:12px 14px;font-size:14px;line-height:22px;margin-bottom:12px}
.sg-status.ok{background:#ECFDF5;color:#065F46;border:1px solid #A7F3D0}.sg-status.warn{background:#FFFBEB;color:#92400E;border:1px solid #FDE68A}.sg-status.bad{background:#FEF2F2;color:#991B1B;border:1px solid #FECACA}.sg-status.idle{background:var(--lav);color:var(--purple-deep);border:1px solid var(--border)}
.sg-status ul{margin:6px 0 0;padding-left:18px}
.sg-codebox pre{max-height:520px}
.sg-opts{display:flex;gap:18px;flex-wrap:wrap;margin:12px 0;align-items:center}
.sg-fmt{display:inline-flex;border:1px solid #CFC9E8;border-radius:10px;overflow:hidden}
.sg-fmt label{padding:7px 12px;font:600 13px/18px var(--body);cursor:pointer;background:#fff;color:var(--muted)}
.sg-fmt label{position:relative}.sg-fmt input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;left:0;top:0;margin:0}
.sg-fmt input:checked+span{color:#fff}
.sg-fmt label:has(input:focus-visible){outline:3px solid #A78BFA;outline-offset:-3px}
.sg-fmt label:has(input:checked){background:var(--purple);color:#fff}
.sv-err{border:1px solid #FECACA;background:#FEF2F2;border-radius:12px;padding:14px 16px;margin:12px 20px}
.sv-err b{color:#991B1B}
.sv-ex{margin-top:8px;background:var(--navy);color:#E6E3FA;border-radius:10px;padding:10px 12px;font:500 13px/20px ui-monospace,Menlo,monospace;overflow:auto;white-space:pre}
.sv-ent{display:flex;flex-wrap:wrap;gap:6px;padding:12px 20px 16px;border-top:1px solid var(--border)}
.sv-ent code{background:var(--lav);border-radius:99px;padding:3px 10px;font-size:12px}
.sv-pretty{padding:0 20px 18px}
.sv-pretty summary{cursor:pointer;font:600 14px/20px var(--body);color:var(--purple);list-style:none;padding:6px 0;min-height:0;display:block}
.sv-pretty summary::after{content:none!important}
.sv-pretty summary::-webkit-details-marker{display:none}
.sv-path{font:500 12px/16px ui-monospace,Menlo,monospace;color:var(--muted);margin-top:2px;overflow-wrap:anywhere}
@media (max-width:1000px){.sg-shell{grid-template-columns:minmax(0,1fr)}.sg-out{position:static}}
@media (max-width:639px){.sg-hours{table-layout:fixed}.sg-hours th,.sg-hours td{padding:5px 3px}.sg-hours th:nth-child(1){width:30%}.sg-hours td:first-child{white-space:nowrap}.sg-hours input[type=time]{padding:6px 4px;font-size:13px}}

/* XML Sitemap Generator */
.sm-imp{margin-top:14px;padding:14px;border:1px dashed #CFC9E8;border-radius:12px;background:#FAF9FF}
.sm-imp>label{display:block;font:600 14px/20px var(--body);color:var(--ink);margin-bottom:8px}
.sm-imp-row{display:flex;gap:10px;align-items:stretch}
.sm-imp-row input{flex:1;min-width:0;font:500 16px/24px var(--body);border:1px solid #CFC9E8;border-radius:12px;padding:10px 14px;background:#fff;color:var(--ink)}
.sm-imp-row input:focus{outline:3px solid #A78BFA;outline-offset:1px;border-color:var(--purple)}
.sm-imp-row .btn{min-height:46px;padding:0 18px;white-space:nowrap}
.sm-imp [aria-invalid=true]{border-color:#B42318}
.sm-file{display:inline-block;color:var(--purple);font-weight:600;cursor:pointer;text-decoration:underline;margin-left:4px;position:relative}
.sm-file input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.sm-file:focus-within{outline:3px solid #A78BFA;outline-offset:2px;border-radius:4px}
.sm-issues{margin-top:16px}
.sm-files{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.sm-fbtn{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 14px;border:1px solid #CFC9E8;border-radius:10px;background:#fff;color:var(--ink);font:600 13px/18px var(--body);cursor:pointer;text-align:left}
.sm-fbtn small{font:500 12px/16px var(--body);color:var(--muted)}
.sm-fbtn[aria-pressed=true]{background:var(--purple);border-color:var(--purple);color:#fff}
.sm-fbtn[aria-pressed=true] small{color:#E6E3FA}
.sm-fbtn:focus-visible{outline:3px solid #A78BFA;outline-offset:2px}
.sm-filehead{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin-top:18px;font:600 15px/22px var(--body);color:var(--navy)}
.sm-next{margin-top:24px}
.sm-next code{word-break:break-all}
#sm-code{max-height:420px}
@media (max-width:639px){.sm-imp-row{flex-direction:column}.sm-imp-row .btn{width:100%}}

/* Website Speed Test */
.sx-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0}
.sx-tile{border:1px solid #E4E0F5;border-radius:12px;padding:12px 14px;background:#FAF9FF;min-width:0}
.sx-tile small{display:block;font:600 12px/16px var(--body);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.sx-tile b{display:block;font:800 24px/32px var(--display);color:var(--navy);margin-top:2px;word-break:break-word}
.sx-tile span{display:block;font:500 12px/16px var(--body);color:var(--muted);margin-top:2px}
.sx-bar{display:flex;height:16px;border-radius:8px;overflow:hidden;background:#EEEAFB;margin:8px 0}
.sx-bar span{display:block;min-width:3px}
.sx-bar .c1,.sx-legend .c1{background:#A78BFA}.sx-bar .c2,.sx-legend .c2{background:#6D28D9}.sx-bar .c3,.sx-legend .c3{background:#0B0B2B}.sx-bar .c4,.sx-legend .c4{background:#C4B5FD}
.sx-legend{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:6px 0 4px;padding:0;font:500 13px/20px var(--body);color:var(--ink)}
.sx-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:baseline}
.sx-list{margin:6px 0 0;padding-left:18px;font:500 13px/20px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);word-break:break-all}
.sx-tw{overflow-x:auto;padding:0 16px}
.sx-table{min-width:560px;font-size:13px}
.sx-table td.sx-u{max-width:260px;word-break:break-all}
.sx-more{margin-top:22px}
.sx-psi{margin-top:14px;padding:14px;border:1px solid #E4E0F5;border-radius:12px}
.sx-psi h3{margin:0 0 4px;font:700 16px/24px var(--display);color:var(--navy)}
@media (max-width:639px){.sx-tile b{font-size:20px}.sx-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}