:root{
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  --bg:#060914;
  --sidebar:#070b15;
  --surface:#0c1322;
  --surface2:#10192b;
  --surface3:#131e32;
  --line:#202b43;
  --line2:#2a3855;
  --text:#f7f8fc;
  --muted:#8591a9;
  --purple:#8b5cf6;
  --purple2:#6d28d9;
  --purple3:#a855f7;
  --blue:#3b82f6;
  --green:#22c55e;
  --red:#ef476f;
  --yellow:#f59e0b;
}

*{box-sizing:border-box}
[hidden]{display:none!important}

html,body{
  margin:0;
  min-height:100%;
  background:
    radial-gradient(circle at 75% -10%,rgba(109,40,217,.12),transparent 28%),
    var(--bg);
  color:var(--text);
}

body{font-size:14px}
button,input,select{font:inherit}
button{cursor:pointer}
h1,h2,h3,p{margin-top:0}
h1{font-size:27px;margin:0}
h2{font-size:28px;margin-bottom:7px}
h3{font-size:20px}
small,.hint,p{color:var(--muted)}
.eyebrow{
  color:#9b68ff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  margin-bottom:7px;
}

/* LOGIN */
.loginShell{
  min-height:100vh;
  display:grid;
  grid-template-columns:1.15fr .85fr;
}
.loginVisual{
  padding:70px;
  display:flex;
  gap:28px;
  align-items:center;
  background:
    radial-gradient(circle at 20% 20%,#32215b,transparent 35%),
    #080d19;
}
.loginVisual h1{font-size:46px;line-height:1.05}
.loginMark{
  width:78px;height:78px;border-radius:24px;
  display:grid;place-items:center;
  font-size:38px;font-weight:900;
  background:linear-gradient(135deg,var(--purple3),var(--purple2));
}
.loginPane{display:grid;place-items:center;padding:40px}
.loginCard{
  width:min(430px,92vw);
  background:var(--surface);
  border:1px solid var(--line);
  padding:32px;border-radius:20px;
}
.brandLockup,.sideBrand{display:flex;align-items:center;gap:12px}
.brandIcon{
  width:43px;height:43px;border-radius:13px;
  display:grid;place-items:center;
  font-weight:900;color:#fff;
  background:linear-gradient(135deg,var(--purple3),var(--purple2));
}
.loginFeatures{display:flex;gap:8px}
.loginFeatures span{
  border:1px solid var(--line2);
  border-radius:999px;padding:7px 10px
}
.loginFooter{display:flex;justify-content:space-between;margin-top:16px;color:var(--muted)}

/* SHELL */
.appShell{
  min-height:100vh;
  display:grid;
  grid-template-columns:245px minmax(0,1fr);
}

.sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:245px;
  padding:18px 14px;
  z-index:20;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(circle at 10% 5%,rgba(139,92,246,.1),transparent 25%),
    var(--sidebar);
  border-right:1px solid #172238;
}

.sideBrand{
  padding:8px 9px 24px;
}
.sideBrand b{font-size:16px}
.sideBrand small{display:block;color:#75829b;margin-top:2px}

.sideNav{display:flex;flex-direction:column;gap:3px}
.navLabel{
  padding:18px 11px 7px;
  color:#596985;
  font-size:9px;
  font-weight:900;
  letter-spacing:.13em;
}

.navItem{
  width:100%;
  border:1px solid transparent;
  background:transparent;
  color:#b6c0d1;
  min-height:43px;
  border-radius:10px;
  display:flex;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  text-align:left;
  font-weight:700;
}
.navItem:hover{
  background:#0f1728;
  border-color:#1d2940;
}
.navItem.active{
  color:#fff;
  background:linear-gradient(90deg,rgba(126,58,242,.42),rgba(126,58,242,.14));
  border-color:rgba(139,92,246,.45);
  box-shadow:inset 3px 0 0 #a855f7,0 8px 28px rgba(109,40,217,.13);
}
.navIcon{width:18px;text-align:center}

.sideFooter{
  margin-top:auto;
  border:1px solid #262248;
  border-radius:12px;
  padding:14px;
  background:
    radial-gradient(circle at 70% 30%,rgba(139,92,246,.28),transparent 45%),
    #101025;
  color:#c9c5ea;
  display:flex;
  justify-content:space-between;
  font-size:10px;
}

.workspace{grid-column:2;min-width:0}

/* TOPBAR */
.topbar{
  position:sticky;
  top:0;
  z-index:15;
  min-height:76px;
  display:grid;
  grid-template-columns:minmax(190px,1fr) minmax(300px,460px) minmax(330px,1fr);
  gap:22px;
  align-items:center;
  padding:12px 28px;
  background:rgba(6,9,20,.9);
  backdrop-filter:blur(18px);
  border-bottom:1px solid #172238;
}
.topSearch{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 13px;
  border:1px solid #24304a;
  border-radius:12px;
  background:#0b1220;
}
.topSearch input{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  min-height:43px;
}
kbd{
  color:#7f8ba2;
  background:#111a2a;
  border:1px solid #28344e;
  border-radius:7px;
  padding:4px 7px;
  white-space:nowrap;
}
.topActions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
}

/* MAIN */
.content{
  max-width:1750px;
  padding:28px 30px 45px;
  margin:0 auto;
}
.page{animation:fade .16s ease}
@keyframes fade{from{opacity:.5;transform:translateY(3px)}to{opacity:1}}

.panel,
.formCard,
.item,
.notice{
  background:linear-gradient(180deg,var(--surface2),var(--surface));
  border:1px solid var(--line);
  border-radius:16px;
}
.panel{padding:22px}
.formCard{padding:18px;margin:14px 0}

.heroCard{
  background:
    radial-gradient(circle at 88% 20%,rgba(139,92,246,.25),transparent 30%),
    linear-gradient(135deg,#10192b,#0b1220);
  border:1px solid #293753;
  border-radius:18px;
  padding:26px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
}
.heroStatus{
  min-width:210px;
  padding:15px;
  border-radius:13px;
  background:#080e19aa;
  border:1px solid #303e5a;
  display:grid;
  gap:7px;
}

/* KPI */
.stats{
  display:grid;
  grid-template-columns:repeat(7,minmax(125px,1fr));
  gap:12px;
  margin:16px 0;
}
.stat{
  min-height:92px;
  padding:17px;
  border-radius:14px;
  background:linear-gradient(180deg,#111b2d,#0c1422);
  border:1px solid #273550;
}
.stat b{display:block;font-size:25px;margin-bottom:5px}
.stat span{font-size:11px;color:#8693ac;font-weight:700}

.dashboardGrid{
  display:grid;
  grid-template-columns:1.5fr .75fr;
  gap:15px;
}
.quickGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.quickGrid button{
  min-height:72px;
  border:1px solid #7846d3;
  border-radius:11px;
  padding:15px;
  color:#fff;
  text-align:left;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}
.quickGrid b,.quickGrid span{display:block}
.quickGrid span{font-size:11px;color:#ddd6fe;margin-top:4px}

.infoList>div{
  display:flex;
  justify-content:space-between;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}

/* FORM */
label{
  display:grid;
  gap:7px;
  color:#8996ad;
  font-size:11px;
  font-weight:800;
}
input,select,textarea{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  color:#f7f9ff;
  background:#09111e;
  border:1px solid #2a3751;
  border-radius:9px;
  outline:none;
}
input:focus,select:focus{
  border-color:#8b5cf6;
  box-shadow:0 0 0 3px rgba(139,92,246,.12);
}
.formGrid{display:grid;gap:12px;margin-bottom:14px}
.formGrid.four{grid-template-columns:repeat(4,1fr)}
.formGrid.three{grid-template-columns:repeat(3,1fr)}
.formGrid.one{grid-template-columns:1fr}
.row,.toolbar,.actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.row>*{flex:1}

button{
  min-height:39px;
  border-radius:9px;
  padding:9px 13px;
  border:1px solid transparent;
  font-weight:800;
  transition:.15s ease;
}
button:hover{transform:translateY(-1px)}
.primary{
  color:#fff;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
  border-color:#8b5cf6;
}
.soft,.ghost,.iconBtn,.actions button{
  color:#d7deeb;
  background:#10192a;
  border-color:#2a3751;
}
.danger{
  color:#ff9aae!important;
  background:rgba(239,71,111,.1)!important;
  border-color:rgba(239,71,111,.28)!important;
}
.iconBtn{width:40px;padding:0}
.full{width:100%}

/* Pills */
.badge,.pill{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:5px 9px;
  font-size:10px;
  font-weight:900;
}
.badge.unactivated,.pill.unknown{
  color:#fbbf24;
  background:#2a210d;
}
.pill.ok,.badge.active{
  color:#4ade80;
  background:#0c2c1d;
}
.pill.dead{
  color:#fb7185;
  background:#32131b;
}

/* General lists/tables */
.sectionHead,.pageIntro,.catalogTitle{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.toolbar{
  border:1px solid var(--line);
  background:#0a1220;
  padding:10px;
  border-radius:11px;
}
.stack{display:grid;gap:10px;margin-top:15px}
.item{padding:15px}
.table{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:12px;
}
table{
  width:100%;
  border-collapse:collapse;
  min-width:950px;
}
th,td{
  text-align:left;
  padding:12px 13px;
  border-bottom:1px solid #1a263b;
  font-size:12px;
}
th{
  color:#8794ac;
  background:#111a2a;
  font-size:10px;
  text-transform:uppercase;
}

/* SOURCES */
#sourceRows .item{
  position:relative;
  overflow:hidden;
}
#sourceRows .item:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(#a855f7,#3b82f6);
}
.miniStats{
  display:grid;
  grid-template-columns:repeat(7,minmax(100px,1fr));
  gap:9px;
  margin:10px 0;
}
.miniStats>div,
.miniStat{
  padding:12px;
  border:1px solid #263450;
  border-radius:11px;
  background:#0c1525;
}
.miniStats b,.miniStat b{display:block;font-size:19px}
.miniStats span,.miniStat span{font-size:10px;color:#8390aa}

/* PACKAGE PAGE */
.automationBanner{
  display:grid;
  grid-template-columns:56px 1fr auto;
  align-items:center;
  gap:16px;
  margin:20px 0 26px;
  padding:18px;
  border:1px solid #272d51;
  border-radius:15px;
  background:
    radial-gradient(circle at 12% 50%,rgba(139,92,246,.15),transparent 18%),
    linear-gradient(90deg,#10182a,#0c1422);
}
.automationIcon{
  width:52px;height:52px;border-radius:15px;
  display:grid;place-items:center;
  font-size:28px;
  background:linear-gradient(135deg,#7928ca,#4c1d95);
}
.automationBanner b{font-size:16px}
.automationBanner p{margin:5px 0 0}
.autoReady{color:#4ade80;font-weight:800}

.catalogTitle{margin-bottom:12px}
.serverCatalogs{display:grid;gap:13px}

.serverCard{
  overflow:hidden;
  border-radius:15px;
  border:1px solid #25324c;
  background:#0b1321;
  box-shadow:0 12px 35px rgba(0,0,0,.18);
}
.serverHead{
  min-height:76px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-left:3px solid #a855f7;
}
.serverIdentity,.serverRight,.packageIdentity{
  display:flex;
  align-items:center;
  gap:11px;
}
.serverIdentity b{font-size:16px}
.serverIdentity small{display:block;margin-top:4px}
.serverDot{
  width:10px;height:10px;border-radius:50%;
}
.serverDot.online{background:#22c55e;box-shadow:0 0 14px rgba(34,197,94,.7)}
.serverDot.offline{background:#64748b}
.sourceCount{
  color:#b8c3ff;
  background:#1a2751;
  border-radius:999px;
  padding:5px 9px;
  font-size:10px;
}
.serverEnabled{
  color:#4ade80;background:#0d2b1d;padding:6px 10px;border-radius:8px
}
.serverDisabled{
  color:#9aa5b7;background:#1c2534;padding:6px 10px;border-radius:8px
}
.moreDots{color:#8490a8;font-weight:900}

.packageHeader,.packageLine{
  display:grid;
  grid-template-columns:2fr 1fr .9fr .9fr .8fr .6fr;
  gap:12px;
  align-items:center;
  padding:12px 18px;
}
.packageHeader{
  background:#131d30;
  color:#96a2b8;
  font-size:11px;
  font-weight:800;
}
.packageLine{
  min-height:70px;
  border-top:1px solid #1c2940;
}
.packageLine:hover{background:#0e1828}
.packageIdentity b,.packageDuration b{display:block;color:#edf2fa}
.packageIdentity small,.packageDuration small{display:block;margin-top:4px}
.packageCube{
  width:32px;height:32px;
  display:grid;place-items:center;
  color:#a855f7;
  background:#221446;
  border-radius:9px;
}
.packageValue{
  display:inline-flex;
  min-width:54px;
  padding:8px 10px;
  border:1px solid #293753;
  border-radius:8px;
  background:#101a2b;
}
.statusDot{
  width:8px;height:8px;border-radius:50%;
  display:inline-block;margin-right:7px;
}
.statusDot.on{background:#22c55e}
.statusDot.off{background:#64748b}
.packageActions{display:flex;gap:7px}
.iconAction{
  min-height:34px!important;
  width:35px;padding:0!important;
  color:#c4b5fd!important;
  background:#201544!important;
  border:1px solid #392c67!important;
}
.dangerMini{color:#fb7185!important}
.emptyPackages,.emptyState{
  padding:25px;
  text-align:center;
  color:#7f8ba2;
}

.howItWorks{
  display:grid;
  grid-template-columns:55px repeat(5,1fr);
  gap:16px;
  align-items:center;
  margin-top:20px;
  padding:18px;
  border:1px solid #24314a;
  border-radius:15px;
  background:#0d1625;
}
.howIcon{
  width:46px;height:46px;
  border-radius:50%;
  display:grid;place-items:center;
  font-size:22px;font-weight:900;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}
.howItWorks b{display:block;font-size:12px}
.howItWorks span{display:block;color:#7f8ca4;font-size:10px;margin-top:5px}

/* Unified Library */
.sourceChooser{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
}
.sourceChoice{
  display:flex!important;
  align-items:center;
  gap:9px;
  padding:10px;
  border:1px solid #283650;
  border-radius:9px;
  background:#0b1423;
}
.sourceChoice input,.checkLabel input{width:auto!important}

/* RESPONSIVE */
@media(max-width:1350px){
  .stats{grid-template-columns:repeat(4,1fr)}
  .miniStats{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:1050px){
  .topbar{grid-template-columns:1fr auto}
  .topSearch{display:none}
  .dashboardGrid{grid-template-columns:1fr}
  .formGrid.four{grid-template-columns:1fr 1fr}
  .packageHeader{display:none}
  .packageLine{grid-template-columns:1.5fr 1fr 1fr}
  .howItWorks{grid-template-columns:1fr 1fr}
}
@media(max-width:800px){
  .appShell{grid-template-columns:75px 1fr}
  .sidebar{width:75px}
  .sideBrand>div:last-child,.navItem span:last-child,.navLabel,.sideFooter{display:none}
  .navItem{justify-content:center}
  .content{padding:18px}
  .formGrid.four,.formGrid.three{grid-template-columns:1fr}
  .stats,.miniStats{grid-template-columns:1fr 1fr}
  .sourceChooser{grid-template-columns:1fr}
}


/* =========================================================
   MEXAMO ACCOUNT MANAGER MODAL
   ========================================================= */

.accountManager{
  position:fixed !important;
  inset:0 !important;
  z-index:999999 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:28px !important;
}

.accountManager[hidden]{
  display:none !important;
}

.accountManagerShade{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background:rgba(2,6,16,.82) !important;
  backdrop-filter:blur(8px);
}

.accountManagerBox{
  position:relative !important;
  z-index:1 !important;

  width:min(1050px,96vw) !important;
  max-height:92vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;

  border:1px solid #33415f !important;
  border-radius:20px !important;

  background:#091321 !important;
  box-shadow:
    0 35px 120px rgba(0,0,0,.75),
    0 0 0 1px rgba(139,92,246,.08) !important;
}

.accountManagerHeader{
  position:sticky;
  top:0;
  z-index:5;

  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;

  padding:22px 24px;
  border-bottom:1px solid #27354f;

  background:rgba(9,19,33,.97);
  backdrop-filter:blur(15px);
}

.accountManagerHeader h2{
  margin:4px 0 9px;
  font-size:24px;
}

.amClose{
  width:44px !important;
  height:44px !important;
  padding:0 !important;

  display:grid !important;
  place-items:center !important;

  border-radius:12px !important;
  font-size:27px !important;
  line-height:1 !important;
}

.amOverview{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:11px;
  padding:20px 22px;
}

.amInfoBox{
  min-width:0;
  padding:15px;

  border:1px solid #283752;
  border-radius:13px;

  background:#0c1727;
}

.amInfoBox > span{
  display:block;
  margin-bottom:8px;

  color:#74839d;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}

.amInfoBox > b{
  display:block;
  margin-bottom:10px;

  overflow-wrap:anywhere;
  color:#e5edf8;
}

.amSection{
  margin:0 22px 17px;
  padding:18px;

  border:1px solid #293850;
  border-radius:14px;

  background:#0b1625;
}

.amDomainRow{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}

.amDomainRow select{
  width:100%;
}

.amLinkRow{
  display:grid;
  grid-template-columns:110px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;

  margin-bottom:8px;
  padding:11px;

  border:1px solid #24324a;
  border-radius:10px;

  background:#091321;
}

.amLinkRow > span{
  color:#7d8ca4;
  font-size:9px;
  font-weight:900;
  letter-spacing:.05em;
}

.amLinkRow code{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#becbe0;
}

.amLinkRow button{
  min-width:72px;
}

.amLinkTime{
  display:grid;
  grid-template-columns:minmax(200px,1fr) 110px 110px auto;
  gap:10px;
  align-items:end;

  margin-top:15px;
  padding:14px;

  border:1px dashed #3c4b67;
  border-radius:12px;
}

.amLinkTime small{
  display:block;
  margin-top:5px;
  color:#77859b;
}

.amLinkExpires{
  padding-top:11px;
  color:#a5b1c4;
  font-size:11px;
}

.amXtreamGrid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:10px;
}

.amXtreamGrid > div{
  min-width:0;
  padding:14px;

  border:1px solid #25344c;
  border-radius:11px;

  background:#091321;
}

.amXtreamGrid span{
  display:block;
  margin-bottom:7px;

  color:#75849b;
  font-size:9px;
  font-weight:900;
}

.amXtreamGrid b{
  display:block;
  overflow-wrap:anywhere;
}

.amRegenerate{
  display:flex;
  justify-content:center;
  padding:2px 22px 22px;
}

.amRegenerateButton{
  min-width:300px !important;
  min-height:50px !important;

  border:none !important;
  border-radius:12px !important;

  color:white !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;

  background:
    linear-gradient(135deg,#9333ea,#6d28d9) !important;

  box-shadow:
    0 14px 35px rgba(109,40,217,.30) !important;
}

.amFooter{
  position:sticky;
  bottom:0;
  z-index:5;

  display:flex;
  justify-content:space-between;
  gap:14px;

  padding:16px 22px;

  border-top:1px solid #293750;

  background:rgba(9,19,33,.98);
  backdrop-filter:blur(15px);
}

.amFooter > div{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}


@media(max-width:900px){

  .amOverview{
    grid-template-columns:1fr 1fr;
  }

  .amXtreamGrid{
    grid-template-columns:1fr;
  }

  .amLinkTime{
    grid-template-columns:1fr 1fr;
  }

}


@media(max-width:620px){

  .accountManager{
    padding:8px !important;
  }

  .accountManagerBox{
    width:100% !important;
    max-height:96vh !important;
    border-radius:15px !important;
  }

  .amOverview{
    grid-template-columns:1fr;
  }

  .amDomainRow,
  .amLinkRow,
  .amLinkTime{
    grid-template-columns:1fr;
  }

  .amFooter{
    flex-direction:column;
  }

}



/* =====================================================
   COMPACT CUSTOMER LINK MODAL
===================================================== */

.accountManager{
  position:fixed!important;
  inset:0!important;
  z-index:999999!important;
  display:grid!important;
  place-items:center!important;
  padding:18px!important;
}

.accountManager[hidden]{
  display:none!important;
}

.accountManagerShade{
  position:absolute;
  inset:0;
  background:rgba(2,7,16,.86);
  backdrop-filter:blur(8px);
}

.linkModal{
  position:relative;
  z-index:1;

  width:min(780px,96vw);
  max-height:94vh;
  overflow:auto;

  border:1px solid #33425c;
  border-radius:18px;

  background:#0a1524;

  box-shadow:
    0 35px 120px rgba(0,0,0,.72);
}

.linkModalHeader{
  position:sticky;
  top:0;
  z-index:10;

  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:15px;

  padding:20px 22px;

  border-bottom:1px solid #26354d;

  background:rgba(10,21,36,.98);
}

.linkModalHeader h2{
  margin:4px 0 8px;
  font-size:23px;
}

.linkHeaderMeta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;

  color:#92a0b6;
  font-size:11px;
}

.linkClose{
  width:42px!important;
  height:42px!important;
  padding:0!important;

  display:grid!important;
  place-items:center!important;

  font-size:25px!important;
  border-radius:11px!important;
}

.linkBody{
  padding:20px;
}

.linkSectionTitle{
  margin-bottom:10px;

  color:#aa72ff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.11em;
}

.linkField{
  display:grid;
  grid-template-columns:120px minmax(0,1fr) 78px;
  gap:10px;
  align-items:center;

  margin-bottom:9px;
}

.linkField label{
  color:#dbe4f2;
  font-size:11px;
  font-weight:800;
}

.linkField select,
.linkField code{
  min-width:0;
  min-height:44px;

  display:flex;
  align-items:center;

  padding:0 13px;

  border:1px solid #35445e;
  border-radius:9px;

  background:#091321;
  color:#dce6f4;
}

.linkField code{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.linkField button{
  min-height:44px!important;
}

.linkAction{
  color:white!important;
  border:none!important;
  background:
    linear-gradient(135deg,#9333ea,#7c3aed)!important;
}


.xtreamBox{
  margin-top:18px;
  padding:15px;

  border:1px solid #35445e;
  border-radius:12px;

  background:#0d1828;
}

.xtreamHeader{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:11px;
}

.xtreamRows{
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr;
  gap:9px;
}

.xtreamRows>div{
  min-width:0;
  padding:12px;

  border:1px solid #293951;
  border-radius:9px;

  background:#091321;
}

.xtreamRows span{
  display:block;
  margin-bottom:7px;

  color:#77879f;
  font-size:9px;
  font-weight:900;
}

.xtreamRows b{
  display:block;
  overflow-wrap:anywhere;
}

.xtreamRows button{
  margin-top:9px;
}

.xtreamPasswordActions{
  display:flex;
  gap:5px;
}


.regenerateOptions{
  display:grid;
  grid-template-columns:minmax(0,1fr) 100px 100px;
  gap:10px;
  align-items:end;

  margin-top:18px;
  padding:13px;

  border:1px dashed #3e4b63;
  border-radius:11px;
}

.regenerateOptions small{
  display:block;
  margin-top:5px;
  color:#74839a;
}

.regenerateOptions label{
  font-size:9px;
  font-weight:900;
  color:#8795aa;
}

.linkExpiration{
  margin:9px 0;

  color:#8997ad;
  font-size:10px;
}


.mainRegenerate{
  display:block!important;

  width:320px!important;
  max-width:100%!important;
  min-height:49px!important;

  margin:17px auto 5px!important;

  border:none!important;
  border-radius:11px!important;

  color:white!important;
  font-weight:900!important;
  letter-spacing:.10em!important;

  background:
    linear-gradient(135deg,#9b30f5,#7131de)!important;

  box-shadow:
    0 12px 30px rgba(126,49,222,.30)!important;
}


.accountControls{
  display:flex;
  justify-content:space-between;
  gap:12px;

  margin-top:18px;
  padding-top:15px;

  border-top:1px solid #26354d;
}

.accountControls>div{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}


@media(max-width:650px){

  .linkModal{
    width:100%;
    max-height:97vh;
  }

  .linkField{
    grid-template-columns:1fr;
  }

  .xtreamRows{
    grid-template-columns:1fr;
  }

  .regenerateOptions{
    grid-template-columns:1fr 1fr;
  }

  .accountControls{
    flex-direction:column;
  }

}



/* MEXAMO PREMIUM SOURCES 1.9.2 */

.premiumSources{
  padding:0!important;
  border:0!important;
  background:transparent!important;
}

.premiumSourcesHero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:24px;
  margin-bottom:14px;
  border-radius:20px;
  border:1px solid var(--line);
  background:
    linear-gradient(
      135deg,
      rgba(91,65,255,.10),
      rgba(0,170,255,.06)
    );
}

.premiumSourcesHero h2{
  margin:4px 0 6px;
  font-size:27px;
}

.premiumHeroButtons{
  display:flex;
  gap:8px;
}


.sourcePremiumStats{
  display:grid;
  grid-template-columns:
    repeat(
      7,
      minmax(105px,1fr)
    );
  gap:9px;
  margin-bottom:14px;
}

.sourcePremiumStats>div{
  padding:14px;
  border-radius:15px;
  border:1px solid var(--line);
  background:var(--panel);
}

.sourcePremiumStats span,
.sourcePremiumStats small{
  display:block;
  font-size:10px;
  color:var(--muted);
  font-weight:700;
}

.sourcePremiumStats b{
  display:block;
  font-size:20px;
  margin:4px 0;
}


.sourcePremiumToolbar{
  display:grid;
  grid-template-columns:
    minmax(260px,1fr)
    180px
    180px;
  gap:8px;
  padding:10px;
  margin-bottom:14px;
  border-radius:15px;
  border:1px solid var(--line);
  background:var(--panel);
  position:sticky;
  top:8px;
  z-index:5;
}


.premiumSourceGrid{
  display:grid;
  gap:13px;
}


.premiumSourceCard{
  padding:18px;
  border-radius:18px;
  border:1px solid var(--line);
  border-left:4px solid #64748b;
  background:var(--panel);
  box-shadow:
    0 8px 28px
    rgba(20,30,50,.06);
}

.premiumSourceCard.done{
  border-left-color:#10b981;
}

.premiumSourceCard.scanning{
  border-left-color:#7c3aed;
}

.premiumSourceCard.partial{
  border-left-color:#f59e0b;
}

.premiumSourceCard.error{
  border-left-color:#ef4444;
}

.premiumSourceCard.disabled{
  opacity:.70;
}


.premiumSourceIdentity{
  display:flex;
  align-items:center;
  gap:12px;
}


.premiumSourceAvatar{
  width:46px;
  height:46px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:white;
  font-weight:900;
  background:
    linear-gradient(
      135deg,
      #7c3aed,
      #2563eb
    );
}


.premiumSourceTitle{
  display:flex;
  gap:7px;
  align-items:center;
  flex-wrap:wrap;
}

.premiumSourceTitle h3{
  margin:0;
}


.premiumProvider{
  margin-top:3px;
  font-size:11px;
  color:var(--muted);
}


.premiumBadge{
  padding:5px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  background:#e5e7eb;
  color:#374151;
}

.premiumBadge.done{
  background:#d1fae5;
  color:#047857;
}

.premiumBadge.scanning{
  background:#ede9fe;
  color:#6d28d9;
}

.premiumBadge.partial{
  background:#fef3c7;
  color:#b45309;
}

.premiumBadge.error{
  background:#fee2e2;
  color:#b91c1c;
}

.premiumBadge.type{
  background:#dbeafe;
  color:#1d4ed8;
}


.premiumInventory{
  display:grid;
  grid-template-columns:
    repeat(5,1fr);
  gap:8px;
  margin:15px 0;
}

.premiumInventory>div{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
}

.premiumInventory span{
  display:block;
  font-size:9px;
  color:var(--muted);
  text-transform:uppercase;
  font-weight:800;
}

.premiumInventory b{
  display:block;
  font-size:17px;
  margin-top:3px;
}


.premiumProgressBox{
  padding:12px;
  border-radius:13px;
  border:1px solid var(--line);
}

.premiumProgressHeader{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:end;
}

.premiumProgressHeader span{
  display:block;
  font-size:10px;
  color:var(--muted);
}

.premiumProgressRight{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.premiumProgressRight .failed{
  color:#dc2626;
}

.premiumProgress{
  height:7px;
  margin-top:8px;
  overflow:hidden;
  border-radius:99px;
  background:
    rgba(100,116,139,.18);
}

.premiumProgress i{
  height:100%;
  display:block;
  border-radius:99px;
  background:
    linear-gradient(
      90deg,
      #7c3aed,
      #2563eb,
      #06b6d4
    );
}


.premiumSourceInfo{
  display:grid;
  grid-template-columns:
    2fr 1fr 1.4fr 1fr;
  gap:8px;
  margin-top:10px;
}

.premiumSourceInfo>div{
  padding:9px 10px;
  border-radius:11px;
  background:
    rgba(120,120,120,.04);
  min-width:0;
}

.premiumSourceInfo span{
  display:block;
  font-size:8px;
  color:var(--muted);
  text-transform:uppercase;
  font-weight:900;
  margin-bottom:4px;
}

.premiumSourceInfo b,
.premiumSourceInfo code{
  display:block;
  font-size:10px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}


.premiumSourceActions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:13px;
}


.premiumError{
  margin-top:10px;
  padding:10px;
  border-radius:10px;
  background:#fff1f2;
  color:#be123c;
}


.premiumEmpty{
  padding:40px;
  text-align:center;
  border-radius:16px;
  border:1px dashed var(--line);
}

.premiumEmpty b,
.premiumEmpty span{
  display:block;
}

.premiumEmpty span{
  margin-top:5px;
  color:var(--muted);
}


.premiumSourceModal[hidden]{
  display:none!important;
}

.premiumSourceModal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:20px;
}

.premiumModalBackdrop{
  position:absolute;
  inset:0;
  background:
    rgba(2,6,23,.70);
  backdrop-filter:blur(4px);
}

.premiumModalBody{
  position:relative;
  width:min(720px,96vw);
  max-height:90vh;
  overflow:auto;
  padding:21px;
  border-radius:20px;
  border:1px solid var(--line);
  background:var(--panel);
  box-shadow:
    0 30px 100px
    rgba(0,0,0,.35);
}

.premiumModalHeader{
  display:flex;
  justify-content:space-between;
  gap:15px;
  margin-bottom:15px;
}

.premiumModalHeader h3{
  font-size:23px;
  margin:3px 0;
}


.premiumTypeSelector{
  display:grid;
  grid-template-columns:
    repeat(4,1fr);
  gap:7px;
  margin-bottom:15px;
}

.premiumTypeSelector button{
  padding:12px!important;
  border-radius:12px!important;
}

.premiumTypeSelector b,
.premiumTypeSelector span{
  display:block;
}

.premiumTypeSelector span{
  font-size:9px;
  color:var(--muted);
}

.premiumTypeSelector button.active{
  border-color:#7c3aed!important;
  box-shadow:
    0 0 0 2px
    rgba(124,58,237,.12);
}


.premiumModalActions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:12px;
}


.premiumInspect{
  margin-top:10px;
  padding:10px;
  border-radius:10px;
}

.premiumInspect b,
.premiumInspect span{
  display:block;
}

.premiumInspect.success{
  background:#ecfdf5;
  color:#047857;
}

.premiumInspect.error{
  background:#fff1f2;
  color:#be123c;
}

.premiumInspect.checking{
  background:#eff6ff;
  color:#1d4ed8;
}


.premiumModalOpen{
  overflow:hidden;
}


@media(max-width:1100px){

  .sourcePremiumStats{
    grid-template-columns:
      repeat(4,1fr);
  }

  .premiumSourceInfo{
    grid-template-columns:
      1fr 1fr;
  }

  .premiumInventory{
    grid-template-columns:
      repeat(3,1fr);
  }
}


@media(max-width:700px){

  .premiumSourcesHero{
    flex-direction:column;
    align-items:flex-start;
  }

  .sourcePremiumStats{
    grid-template-columns:
      1fr 1fr;
  }

  .sourcePremiumToolbar{
    grid-template-columns:1fr;
  }

  .premiumInventory{
    grid-template-columns:
      1fr 1fr;
  }

  .premiumSourceInfo{
    grid-template-columns:1fr;
  }

  .premiumTypeSelector{
    grid-template-columns:
      1fr 1fr;
  }

}

