:root{
  --bg:#ffffff;
  --text:#0f172a;
  --muted:rgba(15,23,42,.68);
  --line:rgba(15,23,42,.12);
  --accent:#ED5A96;
  --surface:rgba(255,255,255,.94);
  --shadow-soft:0 12px 30px rgba(15,23,42,.09);
  --radius:16px;
  --radius-lg:22px;
  --gutter:26px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  font-size:14px;
  line-height:1.45;
  background:
    radial-gradient(900px 520px at 20% -10%,rgba(237,90,150,.16),rgba(255,255,255,0) 60%),
    radial-gradient(900px 520px at 85% 0%,rgba(59,130,246,.10),rgba(255,255,255,0) 55%),
    linear-gradient(180deg,#fff 0%,#f8fafc 100%);
}

a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
.page{min-height:100%;display:flex;flex-direction:column}
.container{margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(15,23,42,.10);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-logo{height:42px;width:auto}
.brand-product{font-size:13px;font-weight:800;color:rgba(15,23,42,.82);padding:7px 10px;border-left:1px solid var(--line)}
.top-menu{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.top-link{
  display:inline-flex;
  align-items:center;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(15,23,42,.10);
  background:rgba(15,23,42,.03);
  color:rgba(15,23,42,.86);
  font-size:13px;
  font-weight:600;
  line-height:1;
}
.top-link:hover{background:rgba(237,90,150,.08);border-color:rgba(237,90,150,.22)}
.top-link.is-active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 8px 18px rgba(237,90,150,.24)}

.main{flex:1;padding:22px 0 28px}
.hero-panel{
  display:grid;
  grid-template-columns:1fr 320px;
  gap:16px;
  align-items:stretch;
  margin-bottom:14px;
}
.hero-panel>div,.status-box,.panel{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
}
.hero-panel>div:first-child{padding:22px}
.eyebrow{margin:0 0 8px;color:var(--accent);font-size:12px;font-weight:800;text-transform:uppercase}
h1{margin:0;font-size:30px;line-height:1.08;letter-spacing:0;font-weight:900}
.lede{margin:10px 0 0;max-width:760px;color:var(--muted);font-weight:600}
.status-box{display:flex;align-items:center;gap:12px;padding:18px}
.status-box strong{display:block;margin-bottom:4px}
.status-box span:last-child{display:block;color:var(--muted);font-size:13px}
.status-dot{width:12px;height:12px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.14);flex:0 0 auto}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.panel-body{padding:16px}
h2{margin:0 0 12px;font-size:15px;line-height:1.2}
.check-list{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.check-list li{padding:10px 11px;border:1px solid rgba(15,23,42,.09);border-radius:12px;background:rgba(15,23,42,.025);font-weight:600;color:rgba(15,23,42,.80)}
.footer{border-top:1px solid var(--line);background:rgba(255,255,255,.80);backdrop-filter:blur(10px);padding:12px 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:12px}

@media (max-width:900px){
  .header-inner{align-items:flex-start;flex-direction:column}
  .top-menu{justify-content:flex-start}
  .hero-panel,.grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  .container{padding-left:14px;padding-right:14px}
  .brand{align-items:flex-start;flex-direction:column;gap:8px}
  .brand-product{border-left:0;padding-left:0}
  .top-menu{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .top-link{justify-content:center}
  h1{font-size:24px}
}


.logout-form{margin:0;display:inline-flex}
.logout-button{cursor:pointer;font-family:inherit}
.logout-button span{font-size:11px;opacity:.72;margin-left:5px}
.auth-main{display:flex;align-items:flex-start;justify-content:center;min-height:calc(100vh - 145px)}
.auth-container{width:100%;max-width:540px}
.login-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);overflow:hidden}
.login-head{padding:22px 22px 8px}
.login-body{padding:14px 22px 22px}
.login-form{display:grid;gap:13px}
.field{display:grid;gap:7px}
.field span{font-size:12px;font-weight:800;color:rgba(15,23,42,.72)}
.field input{width:100%;padding:11px 12px;border-radius:12px;border:1px solid rgba(15,23,42,.14);background:#fff;color:var(--text);font:inherit;font-weight:600;outline:none}
.field input:focus{border-color:rgba(237,90,150,.45);box-shadow:0 0 0 4px rgba(237,90,150,.10)}
.button-primary{display:inline-flex;align-items:center;justify-content:center;padding:11px 14px;border-radius:12px;border:1px solid var(--accent);background:var(--accent);color:#fff;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 8px 18px rgba(237,90,150,.22)}
.notice{border-radius:12px;padding:10px 11px;margin-bottom:12px;border:1px solid rgba(15,23,42,.12);background:rgba(255,255,255,.94);font-size:13px;font-weight:700}
.notice--danger{border-color:rgba(239,68,68,.25);background:rgba(239,68,68,.07)}
.notice--warn{border-color:rgba(245,158,11,.28);background:rgba(245,158,11,.08)}
.status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.status-card{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:var(--shadow-soft);display:grid;gap:6px;min-height:92px}
.status-card span{font-size:12px;font-weight:800;color:var(--muted)}
.status-card strong{font-size:16px;line-height:1.1}
.status-card.is-locked{border-left:4px solid rgba(100,116,139,.80)}
.status-card.is-warn{border-left:4px solid rgba(245,158,11,.85)}
.status-card.is-info{border-left:4px solid rgba(59,130,246,.85)}
.status-dot--locked{background:#64748b;box-shadow:0 0 0 5px rgba(100,116,139,.14)}
.readiness-list{display:grid;gap:9px}
.readiness-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid rgba(15,23,42,.09);border-radius:14px;background:rgba(15,23,42,.025)}
.readiness-row strong{display:block;margin-bottom:3px}
.readiness-row span{display:block;color:var(--muted);font-size:13px;font-weight:600}
.badge{display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:6px 8px;border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase;color:rgba(15,23,42,.82);background:rgba(15,23,42,.07)}
.badge--ok{background:rgba(34,197,94,.14);color:#166534}
.badge--warn{background:rgba(245,158,11,.16);color:#92400e}
.badge--fail{background:rgba(239,68,68,.14);color:#991b1b}
.badge--locked{background:rgba(100,116,139,.14);color:#334155}
@media (max-width:900px){.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.status-grid{grid-template-columns:1fr}.logout-form,.logout-button{width:100%}.readiness-row{align-items:flex-start;flex-direction:column}.badge{justify-content:flex-start}}


.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px}
.grid--wide{grid-template-columns:.72fr 1.28fr}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field--full{grid-column:1/-1}
.field textarea,.field select,.inline-form input,.inline-form select,.search-row input{width:100%;padding:11px 12px;border-radius:12px;border:1px solid rgba(15,23,42,.14);background:#fff;color:var(--text);font:inherit;font-weight:600;outline:none}
.field textarea:focus,.field select:focus,.inline-form input:focus,.inline-form select:focus,.search-row input:focus{border-color:rgba(237,90,150,.45);box-shadow:0 0 0 4px rgba(237,90,150,.10)}
.search-row{display:grid;grid-template-columns:1fr auto;gap:10px;margin-bottom:12px}
.inline-form{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;margin-top:14px}
.action-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.button-secondary,.button-danger,.button-small{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;font:inherit;font-weight:800;cursor:pointer;text-decoration:none;background:#fff;color:rgba(15,23,42,.86)}
.button-secondary{padding:10px 12px;border:1px solid rgba(15,23,42,.14)}
.button-danger{padding:10px 12px;border:1px solid rgba(239,68,68,.26);background:rgba(239,68,68,.07);color:#991b1b}
.button-small{padding:7px 9px;border:1px solid rgba(15,23,42,.14);font-size:12px}
.table-wrap{overflow:auto;border:1px solid rgba(15,23,42,.10);border-radius:14px;background:#fff}
.data-table{width:100%;border-collapse:collapse;min-width:680px}
.data-table th,.data-table td{padding:11px 12px;border-bottom:1px solid rgba(15,23,42,.08);text-align:left;vertical-align:middle}
.data-table th{font-size:12px;color:var(--muted);font-weight:900;background:rgba(15,23,42,.025)}
.data-table tr:last-child td{border-bottom:0}
.table-link{font-weight:900;color:#be185d}
.stack{display:grid;gap:9px}
.list-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px;border:1px solid rgba(15,23,42,.09);border-radius:14px;background:rgba(15,23,42,.025)}
.list-item strong{display:block}.list-item span,.muted{display:block;color:var(--muted);font-size:13px;font-weight:600}.section-gap{margin-top:14px}.check{display:inline-flex;gap:6px;align-items:center;font-weight:800;color:var(--muted)}
.notice--success{border-color:rgba(34,197,94,.22);background:rgba(34,197,94,.08)}
.badge--active,.badge--ok{background:rgba(34,197,94,.14);color:#166534}.badge--inactive,.badge--archived{background:rgba(100,116,139,.14);color:#334155}.badge--suppressed,.badge--bounced,.badge--complained,.badge--unsubscribed{background:rgba(239,68,68,.14);color:#991b1b}
@media (max-width:900px){.page-head{align-items:flex-start;flex-direction:column}.grid--wide{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.inline-form{grid-template-columns:1fr}.search-row{grid-template-columns:1fr}.data-table{min-width:560px}}

.badge--uploaded,.badge--validated,.badge--ready_to_apply{background:rgba(59,130,246,.14);color:#1d4ed8}.badge--validation_failed,.badge--failed{background:rgba(239,68,68,.14);color:#991b1b}.badge--applied{background:rgba(34,197,94,.14);color:#166534}.badge--duplicate{background:rgba(245,158,11,.16);color:#92400e}.badge--invalid{background:rgba(239,68,68,.14);color:#991b1b}.badge--skipped{background:rgba(100,116,139,.14);color:#334155}.data-table code{font-size:11px;white-space:pre-wrap}
