/* ========== Design Tokens ========== */
:root{
  --bg:#0a0d1f;
  --bg-grad: radial-gradient(1400px 900px at 20% -10%, #1f2453 0%, #0a0d1f 60%);
  --card:#141939;
  --stroke:#2e3675;
  --muted:#9fa6d4;
  --text:#f5f7ff;
  --text-weak:#c7caeb;
  --accent:#6c5ce7;
  --accent-2:#e0305d;
  --radius:18px;
  --shadow:0 12px 28px rgba(0,0,0,.35);
}

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font:16px/1.6 "Inter",system-ui,sans-serif;
  background:var(--bg-grad) fixed;
  color:var(--text);
}
.container{max-width:1080px;margin:0 auto;padding:32px 20px}

/* Hero */
.hero{padding-top:36px;padding-bottom:8px}
h1{font-size:42px;font-weight:900;line-height:1.1;margin:0 0 10px}
.sub{color:var(--muted);font-size:18px;margin:0 0 20px}

/* Card */
.card{
  background:linear-gradient(180deg,var(--card) 0%, #191e44 100%);
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  padding:28px;
  margin:28px 0;
  box-shadow:var(--shadow);
  transition:.25s transform,.25s box-shadow;
}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.4)}

h2{font-size:28px;font-weight:800;margin:0 0 16px}
h3{font-size:22px;font-weight:700;margin:0 0 12px}

/* Grid spacing larger */
.grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px}
@media(max-width:900px){.grid{grid-template-columns:1fr;gap:20px}}

/* Inputs */
label span{display:block;font-size:14px;font-weight:600;color:var(--text-weak);margin:0 0 8px}
input[type="url"],input[type="text"],input[type="email"],input[type="tel"]{
  width:100%;border-radius:14px;border:1px solid var(--stroke);
  background:#0d1133;color:var(--text);
  padding:14px 16px;font-size:15px;
  transition:.2s border,.2s box-shadow;
}
input::placeholder{color:#7a80b5}
input:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(108,92,231,.3);outline:none}

/* Checkbox */
.checkbox{display:flex;gap:12px;align-items:flex-start;color:var(--text-weak);margin:12px 0}

/* Buttons - larger, fresher */
.actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:10px;background:linear-gradient(135deg,var(--accent),#5a4de4);
  color:#fff;font-size:17px;font-weight:800;border:0;border-radius:14px;
  padding:16px 26px;cursor:pointer;transition:.2s transform,.25s box-shadow,.25s filter;
  box-shadow:0 6px 18px rgba(108,92,231,.35);
}
.btn-lg{font-size:18px;padding:18px 30px;border-radius:16px}
.btn:hover{filter:brightness(1.08);box-shadow:0 10px 24px rgba(108,92,231,.45)}
.btn:active{transform:scale(.97)}

/* Status */
.status{color:var(--muted)}

/* Scores */
.score-wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}
.score{font-size:66px;font-weight:1000;letter-spacing:-.5px;
  background:linear-gradient(135deg,var(--accent-2),#5e4ecf);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.breakdown{display:flex;gap:12px;flex-wrap:wrap}
.pill{background:#101544;border:1px solid var(--stroke);color:var(--text);border-radius:999px;padding:10px 14px;font-weight:600}

/* Lists */
ul{margin:0;padding-left:20px}
.meta li{margin:6px 0}
.issues li{margin:8px 0;color:#ffd9e0}
.hidden{display:none}

/* Ranking */
.rank-section,.rank-section *{color:#fff}
.rank-header{display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.rank-pos-big{
  min-width:140px;text-align:center;font-size:96px;font-weight:1000;letter-spacing:-2px;color:#fff;
  text-shadow:0 8px 30px rgba(0,0,0,.45);border-radius:22px;
  background:radial-gradient(600px 400px at 50% -20%, rgba(224,48,93,.4), transparent 60%);
  padding:12px 16px;
}
.rank-meta p{margin:6px 0;color:var(--text-weak)}
.rank-subcard{background:#101544;border-color:var(--stroke)}
.rank-list{margin:0;padding-left:26px;list-style:decimal;color:#fff}
.rank-list li{margin:6px 0;padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.1)}

/* Footer */
.foot{color:var(--text-weak);text-align:center;margin-top:16px}
.foot a{color:var(--accent);text-decoration:none;font-weight:700}
.foot a:hover{text-decoration:underline}