/* SpicyChat Inspector landing page — matches QoL's base components, with a distinct diagnostic accent. */
.inspector-page{--ins-accent:#b18bff;--ins-border:rgba(159,103,255,.28);background:radial-gradient(ellipse 58vw 42vw at 83% 4%,rgba(95,52,162,.1),transparent 78%),var(--bg)}
.inspector-page .eyebrow{color:#c4a2ff}
.inspector-page .eyebrow:before{background:linear-gradient(90deg,#845cff,#bd86ff)}
.inspector-page .button.primary{background:linear-gradient(120deg,#7b4de1,#6032c4);box-shadow:0 14px 35px rgba(95,52,162,.2)}
.inspector-page .button.primary:hover{background:linear-gradient(120deg,#8c61ee,#7044d3)}
.inspector-page .button:focus-visible,.inspector-page a:focus-visible{outline:2px solid #c4a2ff;outline-offset:3px}
.ins-hero{padding:110px 0 100px;border-bottom:1px solid var(--border);overflow:hidden;position:relative;background:radial-gradient(ellipse 51% 70% at 80% 40%,rgba(124,68,214,.105),transparent 75%)}
.ins-hero:before{content:"";pointer-events:none;position:absolute;inset:0;background-image:linear-gradient(rgba(172,113,255,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(172,113,255,.027) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(150deg,transparent 7%,black 63%,transparent 96%)}
.ins-hero-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(350px,.85fr);align-items:center;gap:58px}
.ins-product-identity{display:flex;align-items:center;gap:12px;color:#d1bddf;font-size:.84rem;font-weight:750;letter-spacing:.025em}
.ins-pulse-icon{display:inline-grid;place-items:center;width:52px;height:52px;border:1px solid var(--ins-border);border-radius:15px;background:#261a3b;color:var(--ins-accent)}
.ins-pulse-icon svg{width:38px;height:38px}
.ins-version{font-weight:550;color:#988ba4;margin-left:4px}
.ins-hero h1{font-size:clamp(3.5rem,6.5vw,6.2rem);line-height:.98;letter-spacing:-.062em;margin:27px 0 0}
.ins-hero h1 span{color:var(--ins-accent)}
.ins-subheadline{font-size:clamp(1.35rem,2.7vw,2.25rem)!important;line-height:1.17!important;letter-spacing:-.032em;color:#e3d8ef!important;margin:22px 0 0!important;max-width:680px}
.ins-intro{max-width:650px;color:var(--muted);font-size:1.04rem;margin:23px 0 0;line-height:1.8}
.ins-hero-buttons{margin-top:30px;gap:10px}.ins-hero-buttons .button{font-size:.83rem;padding:0 14px}.ins-release-note{color:var(--muted2);font-size:.78rem;margin:15px 0 0}
.ins-hero-display{padding:24px;border-radius:22px;background:linear-gradient(145deg,#1b1526,#101015 66%);border:1px solid var(--ins-border);box-shadow:0 28px 84px rgba(0,0,0,.37),0 0 36px rgba(134,70,243,.07)}
.ins-display-top{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:18px;font-size:.83rem}
.ins-display-top div{display:flex;align-items:center;gap:9px}.ins-display-top>span{color:#b0a2bc;font-size:.72rem}
.ins-live-dot{width:8px;height:8px;border-radius:50%;background:#b28bff;box-shadow:0 0 0 4px rgba(178,139,255,.1)}
.ins-display-wave{padding:18px 0 0;height:150px;color:#a375ff}.ins-display-wave svg{width:100%;height:100%;filter:drop-shadow(0 0 14px rgba(140,100,255,.35))}
.ins-display-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ins-display-grid>div{padding:16px;border:1px solid rgba(202,174,255,.11);border-radius:12px;background:rgba(255,255,255,.023)}
.ins-display-grid small{color:#a27bd2;display:block;font-size:.65rem;font-weight:800;margin-bottom:8px;letter-spacing:.11em}
.ins-display-grid strong,.ins-display-grid span{display:block}.ins-display-grid strong{font-size:.85rem}.ins-display-grid span{color:#a69ab2;font-size:.72rem;margin-top:4px;line-height:1.5}
.ins-hero-display>p{color:#9f90ac;font-size:.7rem;text-align:center;margin:20px 0 0}
.ins-section-head{max-width:790px;margin-bottom:38px}
.ins-section-head h2{margin:14px 0 0;line-height:1.06;letter-spacing:-.045em;font-size:clamp(2.1rem,4vw,3.4rem)}
.ins-section-head h2 em{font-style:normal;color:#c5a5ff}
.ins-section-head p{font-size:1.02rem;color:var(--muted);margin:17px 0 0}
.ins-example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ins-example-grid article,.ins-feature-card{border:1px solid var(--border);border-radius:17px;background:rgba(255,255,255,.018);padding:26px}
.ins-example-grid article{border-top:2px solid rgba(176,137,255,.55)}.ins-example-grid strong{font-size:1.12rem;line-height:1.35;display:block}.ins-example-grid p,.ins-feature-card p{font-size:.89rem;color:var(--muted);margin:12px 0 0}
.ins-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ins-feature-card{min-height:230px;transition:background .15s,border-color .15s}.ins-feature-card:hover{background:rgba(169,107,255,.045);border-color:var(--ins-border)}
.ins-feature-mark{font-size:.74rem;font-weight:850;letter-spacing:.11em;color:#bf99ff}
.ins-feature-card h3{font-size:1.24rem;line-height:1.26;letter-spacing:-.015em;margin:18px 0 0}
.ins-screens .ins-screenshot{max-width:1100px;margin:0 0 25px;padding:12px;border-radius:17px;background:#141019;border:1px solid var(--ins-border);overflow:hidden}
.ins-screenshot a{display:block;overflow:hidden;border-radius:10px;background:#0f0c15}.ins-screenshot img{width:100%;height:auto;transition:transform .2s}.ins-screenshot a:hover img{transform:scale(1.006)}
.ins-screenshot figcaption{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;padding:15px 10px 6px;font-size:.88rem}.ins-screenshot figcaption strong{color:white}.ins-screenshot figcaption span{color:var(--muted)}
.ins-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.ins-steps li{border:1px solid var(--border);border-radius:16px;padding:20px;background:rgba(255,255,255,.018)}
.ins-steps li>span{display:grid;place-items:center;width:38px;height:38px;background:#251c35;border:1px solid var(--ins-border);border-radius:11px;color:#c3a0ff;font-size:.9rem;font-weight:850}
.ins-steps h3{font-size:1rem;line-height:1.25;margin:18px 0 0}.ins-steps p{font-size:.85rem;color:var(--muted);margin:10px 0 0}
.ins-privacy-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:54px;align-items:center}
.ins-privacy-layout h2{font-size:clamp(2rem,4vw,3.2rem);margin:15px 0 0;line-height:1.09;letter-spacing:-.044em}
.ins-privacy-layout p{color:var(--muted)}
.ins-privacy-card{border:1px solid var(--ins-border);border-radius:19px;background:linear-gradient(140deg,rgba(94,57,160,.12),rgba(255,255,255,.015));padding:29px}
.ins-privacy-card strong{font-size:1.04rem}.ins-privacy-card ul{color:var(--muted);padding-left:20px;margin-bottom:0;font-size:.89rem}.ins-privacy-card li{margin:12px 0}
.ins-end-card{border:1px solid var(--ins-border);background:linear-gradient(100deg,rgba(110,62,179,.13),rgba(255,255,255,.018));padding:39px;border-radius:23px;display:grid;grid-template-columns:1fr;gap:23px}
.ins-end-card h2{margin:15px 0 10px;line-height:1.12}.ins-end-card p{margin:0;max-width:760px;color:var(--muted)}
@media(max-width:1100px){.ins-hero-layout{grid-template-columns:minmax(0,1fr) minmax(290px,.8fr);gap:30px}.ins-hero h1{font-size:clamp(3.1rem,6.5vw,5.2rem)}.ins-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.ins-hero{padding:82px 0}.ins-hero-layout,.ins-privacy-layout{grid-template-columns:1fr;gap:30px}.ins-hero-display{max-width:680px}.ins-example-grid,.ins-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ins-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.ins-hero{padding:55px 0 70px}.ins-hero h1{font-size:clamp(2.8rem,12vw,4.1rem)}.ins-hero-buttons{flex-direction:column;align-items:stretch}.ins-hero-buttons .button{justify-content:center}.ins-feature-grid,.ins-example-grid,.ins-steps{grid-template-columns:1fr}.ins-feature-card{min-height:0}.ins-hero-display{padding:17px}.ins-display-wave{height:105px}.ins-display-grid>div{padding:11px}.ins-section-head h2{font-size:2.2rem}.ins-screenshot figcaption{display:block}.ins-screenshot figcaption span{display:block;margin-top:3px}.ins-privacy-card{padding:22px}.ins-end-card{padding:24px}.ins-screens .ins-screenshot{padding:7px}}
@media(prefers-reduced-motion:reduce){.ins-screenshot img{transition:none}.ins-screenshot a:hover img{transform:none}}