:root{
  --paper:#fafafd;
  --white:#fff;
  --ink:#211b59;
  --body:#2a2548;
  --muted:#4f4c6a;
  --line:#e9e7f2;
  --blue:#22b5f5;
  --violet:#7544e8;
  --red:#d83b64;
  --green:#25875b;
  --shadow:0 18px 55px rgba(39,31,91,.09);
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--body);font:15px/1.55 ui-rounded,"SF Pro Rounded","Nunito Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.shell{width:min(1120px,calc(100% - 36px));margin:auto}
.topbar{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0}
.brand img,.brand-wordmark{height:42px;width:auto;max-width:176px;object-fit:contain;display:block}
.navlinks{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:10px 18px}
.navlinks a,.linkbutton{color:var(--ink);text-decoration:none;border:0;background:none;padding:0;font:800 16px/1.2 ui-rounded,"SF Pro Rounded","Nunito Sans",system-ui,sans-serif;letter-spacing:-.01em;cursor:pointer;-webkit-appearance:none;appearance:none}
.navlinks a:hover,.linkbutton:hover{color:var(--violet)}
.navlinks .button{color:#fff;padding:11px 16px}
.navlinks form{margin:0}
main{padding:42px 0 80px}
h1{font-size:clamp(40px,5.4vw,58px);font-weight:800;letter-spacing:-.045em;line-height:1.05;margin:0 0 10px;color:var(--ink)}
h2{font-size:22px;font-weight:800;letter-spacing:-.02em;margin:0 0 16px;color:var(--ink)}
h3{font-size:17px;font-weight:800;letter-spacing:-.01em;margin:0 0 8px;color:var(--ink)}
.muted{color:var(--muted);font-weight:500}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow)}
.metric strong{display:block;font-size:34px;font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1.1;margin-top:6px}
.span2{grid-column:span 2}
.form{display:grid;gap:16px}
label{display:grid;gap:7px;font-weight:700;color:var(--ink)}
label .muted{font-weight:600}
input,select{width:100%;border:1px solid #dcd9e9;border-radius:11px;padding:12px 14px;background:#fff;color:var(--ink);font:inherit}
input:focus,select:focus{outline:3px solid rgba(117,68,232,.14);border-color:var(--violet)}
.button{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:11px;padding:11px 16px;background:linear-gradient(100deg,var(--blue),var(--violet));color:#fff;font-weight:800;text-decoration:none;cursor:pointer}
.button.secondary{background:#f0ebff;color:var(--violet)}
.button.danger{background:#fff0f3;color:var(--red)}
.flash{padding:13px 16px;border-radius:12px;margin:0 0 20px;background:#eaf8f2;color:var(--green)}
.flash.error{background:#fff0f3;color:var(--red)}
.table-wrap{overflow:auto}
.links{width:100%;border-collapse:collapse}
.links th{text-align:left;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.links th,.links td{padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:middle;color:var(--body)}
.links a{color:var(--violet);font-weight:800;text-decoration:none}
.destination{max-width:290px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.actions form{display:inline}
.actions .button{padding:7px 10px;font-size:13px}
.badge{display:inline-block;border-radius:99px;padding:4px 9px;background:#eaf8f2;color:var(--green);font-size:12px;font-weight:800}
.badge.off{background:#f0eef5;color:var(--muted)}
.auth{width:min(460px,100%);margin:6vh auto}
.auth .brand{justify-content:center;margin-bottom:24px}
.empty{text-align:center;padding:44px 20px}
.token{word-break:break-all;background:#f3efff;border:1px solid #dcd2ff;border-radius:12px;padding:16px;font-family:monospace}
.danger-zone{border-color:#f1ccd5}
.footer{border-top:1px solid var(--line);padding:22px 0;color:var(--muted);font-size:13px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:16px}
.footer-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--muted)}
.footer-links a{color:var(--muted);text-decoration:none;font-weight:700}
.footer-links a:hover{color:var(--violet)}
.inline{display:flex;gap:12px;align-items:end}
.inline>*{flex:1}
.copy{cursor:pointer}
.price{font-size:28px;font-weight:800;letter-spacing:-.03em;color:var(--ink);margin:4px 0 10px}
.pricing-grid ul{margin:0 0 18px;padding-left:1.15em;color:var(--body)}
.pricing-grid li{margin:6px 0}
.card.featured{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(100deg,var(--blue),var(--violet)) border-box;box-shadow:0 20px 50px rgba(117,68,232,.18)}
.deal-badge{display:inline-block;margin:0 0 12px;padding:5px 11px;border-radius:99px;background:linear-gradient(100deg,var(--blue),var(--violet));color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.deal-remaining{font-weight:800;color:var(--ink)}
.pay-methods{display:grid;gap:8px;margin-top:8px}
.pay-choice{width:100%;max-width:320px}
.pay-methods .muted{margin:0 0 10px}
.featured .button:disabled{opacity:1;color:#fff}
.credits-list{margin:0;color:var(--body);font-size:17px;line-height:1.7}
.prose{max-width:720px}
.prose a{color:var(--violet);font-weight:800;text-decoration:none}
.prose p,.prose li{font-size:17px;line-height:1.7;color:var(--body)}
.prose p{margin:0 0 14px}
.prose h2{margin:32px 0 10px}
.prose ul{margin:0 0 16px;padding-left:1.2em}
.prose .updated{margin-top:28px;color:var(--muted);font-size:14px}
.admin-nav{display:flex;flex-wrap:wrap;gap:10px 20px;margin:0 0 28px;padding:0 0 16px;border-bottom:1px solid var(--line)}
.admin-nav a{color:var(--muted);text-decoration:none;font-weight:800}
.admin-nav a.active,.admin-nav a:hover{color:var(--violet)}
.metrics-4{grid-template-columns:repeat(4,1fr)}
.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin:0 0 20px}
.filters label{min-width:160px;flex:1}
.pager{display:flex;gap:12px;margin-top:16px}
label.confirm{display:flex;align-items:center;gap:8px}
label.confirm input{width:auto}
.card > a{color:var(--violet);font-weight:800;text-decoration:none}
.back{margin:0 0 14px}
.back a{color:var(--muted);font-weight:700;text-decoration:none}
.back a:hover{color:var(--violet)}
@media(max-width:760px){
  .grid{grid-template-columns:1fr}
  .span2{grid-column:auto}
  .metrics-4{grid-template-columns:1fr 1fr}
  .topbar{min-height:0;padding:12px 0;align-items:flex-start;flex-wrap:wrap}
  .navlinks{gap:8px 14px}
  .inline{display:grid}
  .card{padding:18px}
  h1{font-size:clamp(34px,11vw,46px)}
  .metric strong{font-size:30px}
  .footer-inner{display:grid;gap:10px}
  .links th.optional,.links td.optional{display:none}
  .destination{max-width:160px}
}
@media(max-width:520px){
  .shell{width:min(100% - 24px,1120px)}
  main{padding:28px 0 56px}
}
