:root{
  --bg:#090909;
  --bg-soft:#101010;
  --card:#141414;
  --card-2:#181818;
  --line:rgba(255,255,255,.07);
  --line-strong:rgba(255,255,255,.12);
  --text:#f6f0ea;
  --muted:#a89f97;
  --accent:#f0ab6d;
  --accent-2:#d88b50;
  --success:#1d8b66;
  --danger:#983c4f;
  --warn:#8c6c2c;
  --shadow:0 18px 40px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(240,171,109,.12), transparent 28%),
    radial-gradient(circle at 100% 0%, rgba(240,171,109,.08), transparent 24%),
    linear-gradient(180deg, #0b0b0b 0%, #080808 100%);
}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
.page-shell{max-width:1380px;margin:0 auto;padding:22px}
.content-area{padding-top:22px}
.glass-card,.card,.modal-card{
  background:linear-gradient(180deg, rgba(24,24,24,.96), rgba(17,17,17,.96));
  border:1px solid var(--line);
  border-radius:28px;
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.glass-card::before,.card::before,.modal-card::before{
  content:"";
  position:absolute;
  inset:auto auto -80px -30px;
  width:220px;
  height:220px;
  background:radial-gradient(circle, rgba(240,171,109,.12), transparent 70%);
  pointer-events:none;
}
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:16px 18px;
}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:18px}
.brand-mark{display:flex;align-items:center;gap:12px;min-width:max-content}
.brand-avatar,.profile-avatar{
  width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, rgba(240,171,109,.28), rgba(240,171,109,.12));
  border:1px solid rgba(240,171,109,.24);
  color:#f7c28e;font-weight:700;
}
.brand-text{display:flex;flex-direction:column;gap:2px}
.brand-text strong{font-size:18px;font-weight:700}
.brand-text small,.profile-meta small,.muted{color:var(--muted)}
.nav{display:flex;gap:10px;flex-wrap:wrap}
.nav-pill{
  padding:11px 16px;border-radius:16px;border:1px solid transparent;background:transparent;color:#d7cec6;
  transition:.2s ease;
}
.nav-pill:hover,.nav-pill.active{
  background:linear-gradient(180deg, rgba(240,171,109,.22), rgba(240,171,109,.14));
  border-color:rgba(240,171,109,.18);
  color:#fff4ea;
}
.top-actions{display:flex;align-items:center;gap:10px}
.top-icon{
  width:36px;height:36px;border-radius:12px;border:1px solid var(--line);background:#121212;
  display:flex;align-items:center;justify-content:center;color:#dcc9b3;font-size:14px;
}
.profile-pill{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:20px;border:1px solid var(--line);background:#121212}
.profile-meta{display:flex;flex-direction:column;gap:2px}
.profile-meta strong{font-size:14px}
.logout-link{padding:8px 12px;border-radius:12px;background:#1a1a1a;border:1px solid var(--line);font-size:13px}
.dashboard-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.span-8{grid-column:span 8}.span-7{grid-column:span 7}.span-6{grid-column:span 6}.span-5{grid-column:span 5}.span-4{grid-column:span 4}.span-2{grid-column:span 2}
.hero-panel,.stat-card,.chart-card,.form-card,.auth-card,.claim-main,.table-card-premium{padding:28px}
.hero-panel h1,.auth-side h1,.claim-main h1{margin:12px 0 12px;font-size:42px;line-height:1.05}
.hero-copy{max-width:700px;font-size:15px;line-height:1.65}
.eyebrow,.section-kicker{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(240,171,109,.12);border:1px solid rgba(240,171,109,.18);color:#f0b37a;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.hero-actions,.action-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border-radius:16px;
  border:1px solid var(--line-strong);cursor:pointer;transition:.2s ease;color:var(--text)
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#24170f;border:none;box-shadow:0 10px 22px rgba(216,139,80,.28)}
.btn-secondary,.btn{background:#171717}
.btn-full{width:100%}
.btn-small{min-height:38px;padding:8px 12px;border-radius:12px}
.stat-card{min-height:190px;display:flex;flex-direction:column;justify-content:space-between}
.stat-label{font-size:14px;color:var(--muted)}
.stat-value{font-size:48px;font-weight:800;letter-spacing:-.03em}
.stat-foot{font-size:13px}
.card-head,.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.card-head h2,.section-head h2,.section-head h3{margin:8px 0 0;font-size:24px}
.fake-chart{height:280px;padding-top:12px}
.fake-chart svg{width:100%;height:230px;display:block}
.chart-line{fill:none;stroke:rgba(240,171,109,.95);stroke-width:4;filter:drop-shadow(0 0 8px rgba(240,171,109,.35))}
.chart-fill{fill:url(#lineFill)}
.chart-months{display:flex;justify-content:space-between;font-size:12px;padding-top:10px}
.feature-list{display:flex;flex-direction:column;gap:16px}
.feature-item{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.feature-item:last-child{border-bottom:none;padding-bottom:0}
.feature-item span{width:32px;height:32px;border-radius:12px;background:rgba(240,171,109,.12);border:1px solid rgba(240,171,109,.18);display:flex;align-items:center;justify-content:center;color:#f0b37a;font-weight:700;flex:0 0 32px}
.feature-item strong{display:block;margin-bottom:6px}
.feature-item p{margin:0;color:var(--muted);line-height:1.55}
.stack-xl>*+*{margin-top:24px}.stack-sm>*+*{margin-top:12px}
.buy-grid{display:grid;grid-template-columns:1fr 1fr 260px;gap:16px;align-items:end}
.form-grid,.buy-grid label,.renew-inline{display:flex;flex-direction:column;gap:8px}
input,select{
  width:100%;min-height:52px;padding:14px 16px;border-radius:16px;border:1px solid var(--line-strong);
  background:#101010;color:var(--text);outline:none
}
input::placeholder{color:#766f69}
input:focus,select:focus{border-color:rgba(240,171,109,.32);box-shadow:0 0 0 3px rgba(240,171,109,.08)}
.configs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.premium-card{
  padding:22px;border-radius:24px;border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(20,20,20,.98), rgba(12,12,12,.98));
}
.config-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.config-server{display:inline-flex;margin-bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(240,171,109,.10);color:#efb47f;font-size:12px}
.config-card h3{margin:0 0 8px;font-size:22px}
.config-meta{font-size:13px;margin-top:12px}
.mt-18{margin-top:18px}
.premium-renew{margin-top:16px}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:15px 12px;border-bottom:1px solid rgba(255,255,255,.06);white-space:nowrap}
th{color:var(--muted);font-size:13px;font-weight:600}
td{font-size:14px}
.badge,.alert{
  display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;border:1px solid transparent;font-size:13px
}
.badge.success,.alert.success{background:rgba(29,139,102,.14);color:#8ff1cb;border-color:rgba(29,139,102,.28)}
.badge.danger,.alert.error{background:rgba(152,60,79,.14);color:#ffb1c0;border-color:rgba(152,60,79,.28)}
.badge.warn{background:rgba(140,108,44,.14);color:#ffd992;border-color:rgba(140,108,44,.28)}
.badge.ghost{background:rgba(255,255,255,.04);border-color:var(--line);color:#d6cbc2}
.alert{display:flex;width:100%;padding:14px 16px;border-radius:18px;background:#131313}
.auth-page{display:flex;justify-content:center;padding:28px 0}
.auth-card{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;max-width:1060px;width:100%}
.auth-side{padding:12px 4px}
.auth-form-wrap{padding:24px;border-radius:24px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05)}
.auth-form{gap:16px}
.mini-stats{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.mini-stats div{min-width:120px;padding:14px 16px;border-radius:18px;background:#151515;border:1px solid var(--line)}
.mini-stats strong{display:block;font-size:18px;margin-bottom:4px}
.claim-layout{max-width:860px;margin:0 auto}
.qr-inline,.qr-modal{width:280px;max-width:100%;background:#fff;padding:16px;border-radius:20px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;align-items:center;justify-content:center;padding:18px;z-index:50}
.modal.hidden{display:none}
.modal-card{max-width:420px;width:100%;padding:24px}
.icon-btn{background:transparent;border:none;color:var(--text);font-size:28px;cursor:pointer}
.empty-state{padding:34px;border-radius:24px;border:1px dashed rgba(255,255,255,.09);background:rgba(255,255,255,.02)}
.small-card{max-width:520px;margin:0 auto}
.wrap{flex-wrap:wrap}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

@media (max-width:1180px){
  .span-8,.span-7,.span-6,.span-5,.span-4,.span-2{grid-column:span 12}
  .buy-grid{grid-template-columns:1fr}
  .auth-card{grid-template-columns:1fr}
}
@media (max-width:860px){
  .page-shell{padding:14px}
  .topbar{flex-direction:column;align-items:stretch}
  .topbar-left,.topbar-right{flex-direction:column;align-items:stretch}
  .profile-pill{justify-content:space-between}
  .hero-panel h1,.auth-side h1,.claim-main h1{font-size:32px}
  .stat-value{font-size:40px}
  .card-head h2,.section-head h2{font-size:21px}
  .config-top{flex-direction:column}
}


/* fixes */
.btn{font-weight:600;white-space:nowrap}
.btn-secondary{background:#171717}
.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-2)) !important;color:#24170f !important;border:none;box-shadow:0 10px 22px rgba(216,139,80,.28)}
.buy-grid > *{min-width:0}
.buy-grid .btn{width:100%}
.configs-grid,.configs-grid-premium{align-items:stretch}
.config-card,.premium-card{min-width:0;display:flex;flex-direction:column}
.config-top{min-width:0}
.config-top > div:first-child{min-width:0;flex:1 1 auto}
.config-card h3{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  word-break:break-word;
  overflow-wrap:anywhere;
  line-height:1.2;
  max-width:100%;
}
.config-card .mono{
  font-size:12px;
  line-height:1.45;
  color:#b6aaa0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:100%;
}
.config-meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.action-row .btn{flex:0 0 auto}
.premium-renew{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
.premium-renew select{min-width:0}
.premium-renew .btn{min-width:132px}
@media (max-width:980px){
  .premium-renew{grid-template-columns:1fr}
  .premium-renew .btn{width:100%}
}
@media (max-width:860px){
  .config-card h3{-webkit-line-clamp:2;font-size:20px}
}