
:root{
  --bg:#081827;
  --bg-deep:#061321;
  --bg-glow:#0f3150;
  --card:#0f263b;
  --card2:#123049;
  --card-soft:#0c2134;
  --line:#24445f;
  --line-soft:#1c3a53;
  --text:#f5fbff;
  --muted:#a8c0d3;
  --cyan:#5ee2cf;
  --cyan2:#85f0df;
  --blue:#77b6ff;
  --blue2:#99cbff;
  --navy:#0b2236;
  --shadow:0 22px 55px rgba(1,10,20,.30);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--text);
  background:
    radial-gradient(circle at 84% -5%, rgba(53,122,180,.35) 0, rgba(53,122,180,0) 34%),
    radial-gradient(circle at 12% 8%, rgba(52,214,190,.09) 0, rgba(52,214,190,0) 30%),
    linear-gradient(180deg,#0b2135 0,var(--bg) 360px,var(--bg-deep) 100%);
  font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh;
}
a{color:inherit}
header,main,footer{max-width:1180px;margin:auto;padding:22px}
header{display:flex;justify-content:space-between;align-items:center;padding-top:25px}
.brand{font-size:29px;font-weight:900;color:#fff;text-decoration:none;letter-spacing:-.6px}
.brand span,em{color:var(--cyan);font-style:normal}
nav a{color:#bad1e3;text-decoration:none;margin-left:28px;font-weight:650}
nav a:hover{color:#fff}
.hero{text-align:center;padding:56px 14px 26px}
.pill,article>b{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:850;
  color:var(--cyan2);background:rgba(37,132,128,.16);border:1px solid rgba(94,226,207,.28);
  border-radius:999px;padding:8px 14px
}
h1{font-size:clamp(42px,6.5vw,74px);line-height:1.02;letter-spacing:-1.2px;margin:18px 0 14px;color:#fff}
h2,h3{color:#fff}.hero p,.subcopy{color:var(--muted);font-size:19px;max-width:820px;margin:0 auto}
.index-card{
  max-width:980px;margin:35px auto 0;background:linear-gradient(180deg,rgba(18,48,73,.97) 0%,rgba(13,36,56,.98) 100%);
  border:1px solid var(--line);border-radius:28px;padding:32px;text-align:left;box-shadow:var(--shadow)
}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:24px}
.steps span{background:rgba(6,25,41,.55);border:1px solid var(--line-soft);border-radius:14px;padding:12px;text-align:center;color:#c2d5e4;font-size:14px;font-weight:750}
.stack{display:grid;gap:12px}.main-index-form label{font-weight:850;color:#fff}.main-index-form label small{font-weight:500;color:var(--muted)}
.tool input,.stack input,textarea{
  width:100%;background:#091d2f;border:1px solid #2a4d68;color:#f8fcff;padding:17px 18px;border-radius:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)
}
.tool input:focus,.stack input:focus,textarea:focus{outline:none;border-color:#58cfc3;box-shadow:0 0 0 3px rgba(94,226,207,.10)}
.tool input::placeholder,.stack input::placeholder,textarea::placeholder{color:#7692a8}
textarea{min-height:150px;resize:vertical}
.key-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
button{
  border:0;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#08223a;padding:16px 25px;font-weight:900;border-radius:14px;cursor:pointer;
  box-shadow:0 12px 26px rgba(67,175,190,.18);transition:transform .08s ease,box-shadow .2s ease,filter .2s ease
}
button:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 16px 34px rgba(67,175,190,.24)}button:disabled{opacity:.48;cursor:not-allowed;transform:none;box-shadow:none}
.secondary-btn{background:linear-gradient(135deg,#183d50,#17476b);border:1px solid #315c77;color:#eaf8ff;white-space:nowrap}
.secondary-btn:hover{border-color:#62d9cf}
.key-help{color:#bdd0df;font-size:14px;background:#0a1e30;border:1px dashed #31526b;border-radius:14px;padding:14px}
.key-actions{display:flex;justify-content:flex-start}.submit-main{border-radius:16px;font-size:18px;padding:19px 28px}.fineprint{display:block;color:#9fb8ca;margin-top:14px;font-size:14px}
.results{margin:26px auto 14px;background:transparent;border:none;padding:0;max-width:980px}.hidden{display:none}
.score{font-size:50px;color:var(--cyan);font-weight:900;margin-bottom:14px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.metric{background:#0b2134;padding:15px 16px;border-radius:16px;border:1px solid #24445e}.metric small{color:#8facbf;font-weight:750;letter-spacing:.4px}
.submission-result,.error-result,article,.legal-card{background:linear-gradient(180deg,#112b42 0%,#0d2438 100%);border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow)}
.success-badge{display:inline-block;padding:8px 14px;border:1px solid rgba(94,226,207,.4);border-radius:999px;color:var(--cyan2);background:rgba(54,151,137,.14);font-weight:900;margin-bottom:10px}
.lead{font-size:18px;color:var(--muted);margin-top:6px}.where-box{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 8px}
.where-box>div{background:linear-gradient(180deg,#102d45 0%,#0d263b 100%);border:1px solid #28506b;border-radius:16px;padding:16px}.where-box small{display:block;color:#8fabbe;margin-bottom:6px;font-weight:750}.where-box strong{display:block;color:#fff;font-size:16px;word-break:break-word}
.engine-list{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 22px}.engine-list span{padding:9px 13px;border:1px solid #2b5069;border-radius:999px;background:#0c263b;color:#dceef7;font-weight:750}.submitted-urls{word-break:break-all;padding-left:20px}.submitted-urls li{margin:7px 0}
.extras-title{text-align:center;padding:48px 10px 18px}.extras-title h2{font-size:34px;margin:12px 0 8px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:12px}.grid article{min-height:250px}.tool{display:flex;max-width:100%;margin:22px 0 0}.tool input{border-radius:14px 0 0 14px}.tool button{border-radius:0 14px 14px 0}.muted{color:var(--muted)}
footer{text-align:center;color:#8faabd;padding-block:46px}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #18364c;padding-top:24px}.footer-links{display:flex;flex-wrap:wrap;gap:18px;justify-content:center}.footer-links a{color:#abc3d4;text-decoration:none}.footer-links a:hover{color:#fff}
.legal-main{max-width:960px;padding-top:40px;padding-bottom:20px}.legal-hero{text-align:center;padding:35px 15px 28px}.legal-hero h1{font-size:clamp(38px,6vw,60px);margin-bottom:10px}.legal-hero p{color:var(--muted);max-width:760px;margin:auto}.legal-card{padding:36px}.legal-card h2{margin-top:32px;font-size:24px}.legal-card h2:first-child{margin-top:0}.legal-card p,.legal-card li{color:#c4d5e2}.legal-card ul{padding-left:22px}.legal-card code{background:#091d2f;border:1px solid #24445f;padding:2px 6px;border-radius:6px;color:#eaf7ff}.legal-card a{color:var(--cyan2)}.effective{display:inline-block;margin-top:8px;color:#8daabd;font-size:14px}
@media(max-width:900px){.metrics,.where-box{grid-template-columns:1fr}.footer-inner{flex-direction:column}}
@media(max-width:760px){nav{display:none}.grid,.steps,.key-row{grid-template-columns:1fr}.tool{display:grid;gap:10px}.tool input,.tool button,.secondary-btn{border-radius:14px;width:100%}.index-card,.legal-card{padding:22px}h1{font-size:clamp(36px,10vw,56px)}.hero p,.subcopy{font-size:17px}.footer-links{gap:12px}}
