*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#f0f4ff;color:#1e293b;min-height:100vh}

/* HEADER */
.header{background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 50%,#a855f7 100%);color:white;padding:56px 20px 90px;text-align:center;position:relative;overflow:hidden}
.header::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.badge{display:inline-block;background:rgba(255,255,255,0.18);border:1px solid rgba(255,255,255,0.3);border-radius:20px;padding:5px 14px;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:18px}
.header-logo{position:absolute;top:18px;left:24px;z-index:2;text-decoration:none;opacity:0.92;transition:opacity .15s}
.header-logo:hover{opacity:1}
.header-logo svg{height:40px;width:auto;display:block}
.header h1{font-size:2.6rem;font-weight:900;margin-bottom:10px;letter-spacing:-0.02em}
.header p{font-size:1.05rem;opacity:0.82;max-width:480px;margin:0 auto}

/* SEARCH */
.search-wrap{max-width:700px;margin:-38px auto 0;padding:0 20px;position:relative;z-index:10}
.search-box{background:white;border-radius:18px;box-shadow:0 24px 64px rgba(79,70,229,0.2),0 4px 16px rgba(0,0,0,0.08);padding:8px;display:flex;gap:8px}
.search-box input{flex:1;border:none;outline:none;padding:14px 18px;font-size:1rem;border-radius:12px;background:#f8fafc;color:#1e293b;min-width:0}
.search-box input::placeholder{color:#94a3b8}
.search-box button{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;border:none;border-radius:12px;padding:14px 28px;font-size:1rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .2s}
.search-box button:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(79,70,229,0.45)}
.search-box button:active{transform:translateY(0)}
.search-box button:disabled{opacity:0.55;cursor:not-allowed;transform:none;box-shadow:none}

/* CTA ROW */
.cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:14px;padding:0 4px}
.private-label{font-size:0.78rem;color:#64748b;display:flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap}
.private-label input{accent-color:#4f46e5;cursor:pointer}

/* HISTORY */
.history-wrap{max-width:700px;margin:12px auto 0;padding:0 20px}
.history-panel{background:white;border-radius:14px;box-shadow:0 4px 20px rgba(0,0,0,0.06);overflow:hidden;display:none}
.history-panel.visible{display:block}
.history-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #f1f5f9}
.history-title{font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:#94a3b8}
.history-clear{font-size:0.75rem;color:#94a3b8;background:none;border:none;cursor:pointer;padding:2px 6px;border-radius:6px}
.history-clear:hover{background:#fee2e2;color:#dc2626}
.history-list{list-style:none;padding:0;margin:0;max-height:220px;overflow-y:auto}
.history-item{display:flex;align-items:center;gap:10px;padding:10px 18px;cursor:pointer;transition:background .15s;border-bottom:1px solid #f8fafc}
.history-item:last-child{border-bottom:none}
.history-item:hover{background:#f8fafc}
.history-score{flex-shrink:0;font-size:0.75rem;font-weight:800;padding:3px 9px;border-radius:20px;min-width:44px;text-align:center}
.history-url{flex:1;font-size:0.85rem;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.history-time{flex-shrink:0;font-size:0.72rem;color:#94a3b8}
.history-del{flex-shrink:0;background:none;border:none;cursor:pointer;color:#cbd5e1;font-size:1rem;padding:2px 4px;border-radius:4px;line-height:1}
.history-del:hover{color:#ef4444;background:#fee2e2}

/* MAIN */
.main{max-width:980px;margin:48px auto 60px;padding:0 20px}

/* WELCOME */
.welcome{text-align:center;padding:64px 20px;color:#94a3b8}
.welcome-icon{font-size:4.5rem;margin-bottom:20px;display:block}
.welcome h2{color:#64748b;font-size:1.4rem;font-weight:700;margin-bottom:10px}
.welcome p{font-size:0.95rem;line-height:1.6}
.checks-preview{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:24px}
.check-pill{background:white;border:1px solid #e2e8f0;border-radius:20px;padding:6px 14px;font-size:0.8rem;color:#475569;font-weight:500}

/* LOADING */
.loading{text-align:center;padding:64px 20px;display:none}
.spinner{width:52px;height:52px;border:5px solid #e2e8f0;border-top-color:#4f46e5;border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 20px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{color:#475569;font-size:1rem;font-weight:500}
.loading-url{color:#4f46e5;font-size:0.88rem;margin-top:6px;font-weight:600}
.loading-steps{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.step{background:white;border:1px solid #e2e8f0;border-radius:20px;padding:5px 12px;font-size:0.78rem;color:#94a3b8}
.step.active{border-color:#4f46e5;color:#4f46e5;background:#eef2ff}

/* ERROR */
.error-box{background:#fef2f2;border:1.5px solid #fecaca;border-radius:14px;padding:20px 24px;color:#dc2626;text-align:center;display:none;font-weight:500}

/* SCORE CARD */
.score-card{background:white;border-radius:20px;padding:32px 36px;box-shadow:0 4px 24px rgba(0,0,0,0.07);margin-bottom:28px;display:none;flex-direction:row;align-items:center;gap:36px}
.score-ring{flex-shrink:0;position:relative;width:140px;height:140px}
.score-ring svg{transform:rotate(-90deg)}
.score-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.score-num{font-size:2.4rem;font-weight:900;line-height:1;color:#1e293b}
.score-sub{font-size:0.72rem;color:#94a3b8;font-weight:600}
.score-info{flex:1;min-width:0}
.score-grade{font-size:1.5rem;font-weight:800;margin-bottom:6px}
.score-url{font-size:0.82rem;color:#64748b;word-break:break-all;margin-bottom:16px}
.score-stats{display:flex;flex-wrap:wrap;gap:12px}
.stat{background:#f8fafc;border-radius:10px;padding:10px 16px;text-align:center;min-width:72px}
.stat-label{font-size:0.7rem;color:#94a3b8;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}
.stat-value{font-size:1.15rem;font-weight:800;color:#1e293b;margin-top:2px}

/* EMAIL REPORT BOX */
.email-report{background:white;border-radius:14px;padding:18px 22px;box-shadow:0 2px 12px rgba(0,0,0,0.06);margin-bottom:24px;display:none}
.email-report.visible{display:block}
.email-report-label{font-size:0.78rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:12px}
.email-report-row{display:flex;gap:8px;flex-wrap:wrap}
.email-report-input{flex:1;min-width:200px;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 14px;font-size:0.9rem;outline:none;transition:border-color .15s}
.email-report-input:focus{border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
.email-report-btn{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;border:none;border-radius:10px;padding:10px 20px;font-size:0.88rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:transform .15s}
.email-report-btn:hover{transform:translateY(-1px)}
.email-report-btn:disabled{opacity:0.6;cursor:not-allowed;transform:none}
.email-report-confirm{font-size:0.85rem;color:#16a34a;font-weight:600;margin-top:10px;display:none}
.email-report-error{font-size:0.85rem;color:#dc2626;margin-top:8px;display:none}

/* SECTION TITLES */
.section-title{font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:#94a3b8;margin-bottom:14px;padding-left:4px}

/* CHECKS GRID */
.checks-grid{display:none;grid-template-columns:1fr 1fr;gap:14px}
@media(min-width:620px){.header h1{font-size:2.5rem}}
@media(max-width:620px){
  .checks-grid{grid-template-columns:1fr}
  .score-card{flex-direction:column;text-align:center}
  .score-stats{justify-content:center}
  .header h1{font-size:1.9rem}
}

/* CHECK CARD */
.check-card{background:white;border-radius:16px;padding:18px 20px;box-shadow:0 2px 8px rgba(0,0,0,0.05);border-left:5px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .2s;animation:fadeUp .4s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.check-card:hover{transform:translateY(-3px);box-shadow:0 10px 32px rgba(0,0,0,0.1)}
.check-card.pass{border-left-color:#22c55e}
.check-card.warning{border-left-color:#f59e0b}
.check-card.fail{border-left-color:#ef4444}
.check-card.error{border-left-color:#94a3b8}
.card-cat{font-size:0.65rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:#94a3b8;margin-bottom:8px}
.card-head{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.card-icon{font-size:1.25rem}
.card-name{font-weight:700;font-size:0.9rem;flex:1}
.card-badge{font-size:0.7rem;font-weight:700;padding:3px 10px;border-radius:20px;white-space:nowrap}
.badge-pass{background:#dcfce7;color:#16a34a}
.badge-warning{background:#fef9c3;color:#a16207}
.badge-fail{background:#fee2e2;color:#dc2626}
.badge-error{background:#f1f5f9;color:#64748b}
.card-msg{font-size:0.82rem;color:#64748b;margin-bottom:11px;line-height:1.5}
.card-bar{height:6px;background:#f1f5f9;border-radius:3px;overflow:hidden;margin-bottom:4px}
.card-fill{height:100%;border-radius:3px;width:0%;transition:width .8s cubic-bezier(.34,1.56,.64,1)}
.fill-pass{background:linear-gradient(90deg,#4ade80,#22c55e)}
.fill-warning{background:linear-gradient(90deg,#fde047,#f59e0b)}
.fill-fail{background:linear-gradient(90deg,#fca5a5,#ef4444)}
.card-score{font-size:0.72rem;color:#94a3b8;text-align:right}
.card-details{display:none;margin-top:12px;padding-top:12px;border-top:1px dashed #e2e8f0}
.card-details.open{display:block}
.det-item{font-size:0.78rem;color:#64748b;margin-bottom:4px;word-break:break-word}
.det-key{font-weight:700;color:#475569}
.det-list{list-style:disc;margin:4px 0 0 18px;padding:0}
.det-list li{font-size:0.78rem;color:#64748b;margin-bottom:2px}
.toggle-hint{font-size:0.7rem;color:#c7d2fe;float:right;margin-top:2px}

/* KIVY UPSELL */
.kivy-upsell{border-radius:20px;padding:28px 32px;margin-top:28px;display:none}
.kivy-upsell.visible{display:block}
.kivy-upsell.mode-chatbot{background:linear-gradient(135deg,#eef2ff 0%,#f5f3ff 100%);border:1.5px solid #c7d2fe}
.kivy-upsell.mode-fix{background:linear-gradient(135deg,#fff7ed 0%,#fef3c7 100%);border:1.5px solid #fcd34d}
.upsell-top{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.upsell-tag{font-size:0.68rem;font-weight:800;text-transform:uppercase;letter-spacing:0.09em;padding:4px 10px;border-radius:20px;flex-shrink:0}
.upsell-tag.tag-chatbot{background:#4f46e5;color:white}
.upsell-tag.tag-fix{background:#f59e0b;color:white}
.upsell-headline{font-size:1.15rem;font-weight:900;color:#1e293b;line-height:1.3;flex:1}
.upsell-sub{font-size:0.88rem;color:#64748b;line-height:1.6;margin-bottom:20px}
.reg-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:600px){.reg-form{grid-template-columns:1fr}}
.reg-input{border:1.5px solid #e2e8f0;border-radius:10px;padding:11px 14px;font-size:0.9rem;outline:none;transition:border-color .15s;background:white;width:100%}
.reg-input:focus{border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
.reg-input[readonly]{background:#f8fafc;color:#64748b;cursor:default}
.reg-submit{grid-column:1/-1;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;border:none;border-radius:12px;padding:13px 28px;font-size:0.95rem;font-weight:700;cursor:pointer;transition:transform .15s,box-shadow .2s;width:100%}
.reg-submit:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(79,70,229,0.4)}
.reg-submit:disabled{opacity:0.6;cursor:not-allowed;transform:none;box-shadow:none}
.reg-confirm{display:none;background:#dcfce7;border:1.5px solid #86efac;border-radius:12px;padding:16px 20px;color:#15803d;font-weight:600;font-size:0.9rem;margin-top:12px}
.reg-error{display:none;background:#fef2f2;border:1.5px solid #fecaca;border-radius:12px;padding:12px 16px;color:#dc2626;font-size:0.85rem;margin-top:8px}
.upsell-privacy{font-size:0.72rem;color:#94a3b8;margin-top:12px}
.upsell-privacy a{color:#a5b4fc}
.fix-btn{display:inline-block;background:linear-gradient(135deg,#f59e0b,#d97706);color:white;padding:12px 24px;border-radius:12px;text-decoration:none;font-weight:700;font-size:0.88rem;white-space:nowrap;transition:transform .15s,box-shadow .2s}
.fix-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(245,158,11,0.4)}

/* FAQ */
.faq-section{max-width:780px;margin:0 auto 48px;padding:0 20px}
.faq-section h2{font-size:1.4rem;font-weight:800;color:#1e293b;margin-bottom:24px;text-align:center}
.faq-item{background:white;border-radius:14px;padding:20px 24px;margin-bottom:14px;box-shadow:0 2px 8px rgba(0,0,0,0.05)}
.faq-item h3{font-size:1rem;font-weight:700;color:#4f46e5;margin-bottom:8px}
.faq-item p{font-size:0.9rem;color:#475569;line-height:1.7}

/* FOOTER */
.footer{text-align:center;padding:32px 20px;color:#94a3b8;font-size:0.82rem}
.footer a{color:#a5b4fc;text-decoration:none}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin-bottom:12px}
.footer-links a{color:#94a3b8;text-decoration:none;font-size:0.82rem;transition:color .15s}
.footer-links a:hover{color:#4f46e5}

/* SIMPLE PAGES */
.simple-page{max-width:680px;margin:48px auto;padding:0 20px}
.simple-page a:first-child{display:inline-block;margin-bottom:24px;color:#4f46e5;text-decoration:none;font-weight:600;font-size:0.9rem}
.simple-page h1{font-size:1.8rem;font-weight:800;color:#1e293b;margin-bottom:20px}
.simple-page h2{font-size:1.2rem;font-weight:700;color:#1e293b;margin:24px 0 10px}
.simple-page p{font-size:0.95rem;color:#475569;line-height:1.7;margin-bottom:12px}
.simple-page a{color:#4f46e5}
