@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap");
:root{--navy:#071625;--pink:#cd32ba;--soft:#fae9f7;--line:#e1e6e9;--muted:#73808a;--yellow:#fff0a6}
*{box-sizing:border-box}body{margin:0;background:#f5f6f7;color:var(--navy);font-family:Montserrat,Arial,sans-serif}button,input,select{font:inherit}
header{height:74px;padding:0 max(22px,calc((100vw - 1120px)/2));display:flex;align-items:center;gap:20px;background:#fff;border-bottom:1px solid var(--line)}
header img{width:145px;height:48px;object-fit:contain}header>div{display:flex;align-items:center;gap:10px;padding-left:18px;border-left:1px solid var(--line);font-size:12px}header span{padding:5px 8px;border-radius:7px;color:#fff;background:var(--pink);font-size:8px;text-transform:uppercase;font-weight:900}
header>a{margin-left:auto;padding:9px 12px;border:1px solid var(--line);border-radius:9px;color:var(--navy);background:#fff;font-size:9px;font-weight:900;text-decoration:none}
main{max-width:1120px;margin:0 auto;padding:55px 22px 80px}.eyebrow{color:var(--pink);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}
h1{font-size:clamp(32px,5vw,50px);line-height:1.05;letter-spacing:-.04em;margin:13px 0}p{color:var(--muted);line-height:1.6}.login-card{max-width:520px;margin:60px auto;padding:35px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 18px 50px #07162512}
label>span{display:block;margin-bottom:7px;color:#66747d;font-size:9px;font-weight:800}input,select{width:100%;height:45px;padding:0 13px;border:1px solid #d9dfe3;border-radius:10px;background:#fff;outline:0}input:focus,select:focus{border-color:var(--pink);box-shadow:0 0 0 3px #cd32ba18}
button{min-height:43px;padding:0 18px;border:0;border-radius:10px;color:#fff;background:var(--pink);font-weight:900;font-size:11px;cursor:pointer}button:hover{filter:brightness(.95)}button:disabled{cursor:not-allowed;opacity:.45;filter:none}button.secondary{color:var(--navy);background:#fff;border:1px solid var(--line)}
.login-card form{display:grid;gap:14px;margin-top:24px}.message{min-height:18px;color:#a52b42;font-size:10px}
.admin-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;margin-bottom:35px}.admin-hero>div{max-width:780px}.admin-hero p{margin:0}
.create-card,.links-section{padding:27px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 12px 35px #0716250a;margin-bottom:25px}.create-card>div:first-child,.section-head>div{display:flex;align-items:center;gap:10px}.step{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;color:#fff;background:var(--pink);font-size:9px;font-weight:900}h2{margin:0;font-size:20px}
.create-card form{display:grid;grid-template-columns:1fr 1fr minmax(180px,.9fr) auto;gap:12px;align-items:end;margin-top:22px}.admin-validity{display:grid;grid-template-columns:1fr;gap:8px}.admin-validity:has(>label:not([hidden])+label:not([hidden])){grid-template-columns:1fr 1fr}.admin-validity label[hidden]{display:none}.created-link{margin-top:20px;padding:20px;border-radius:14px;background:var(--navy);color:#fff}.created-link span,.created-link strong{display:block}.created-link span{color:#a7b3bc;font-size:8px;text-transform:uppercase}.created-link strong{margin-top:4px}.copy-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin:13px 0}.copy-row input{color:var(--navy);background:#fff}.created-link small{color:#9eabb5;font-size:9px}
.section-head{display:flex;align-items:center;justify-content:space-between}.summary{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:22px 0}.summary div{position:relative;overflow:hidden;padding:18px;border-radius:13px;background:#f4f6f7}.summary div.live{color:#fff;background:linear-gradient(135deg,#18a672,#087852)}.summary div.active{background:#fff7d1}.summary div.live:after{content:"";position:absolute;right:14px;top:14px;width:8px;height:8px;border-radius:50%;background:#8affd2;box-shadow:0 0 0 5px #8affd226}.summary span,.summary strong{display:block}.summary span{color:#7c8891;font-size:8px;font-weight:800;text-transform:uppercase}.summary .live span{color:#cffff0}.summary strong{margin-top:7px;font-size:24px}.dashboard-filters{display:grid;grid-template-columns:190px minmax(220px,1fr) auto;align-items:end;gap:10px;margin-bottom:16px;padding:14px;border:1px solid var(--line);border-radius:13px;background:#f7f8f9}.dashboard-filters small{align-self:center;color:#88949c;font-size:8px}.link-list{display:grid;gap:10px}.link-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}.link-main{display:grid;grid-template-columns:minmax(150px,1.15fr) minmax(110px,.75fr) minmax(105px,.58fr) minmax(115px,.7fr) minmax(120px,.85fr) auto;align-items:center;gap:14px;padding:17px}.link-main b,.link-main small,.metric-cell span{display:block}.customer-cell>b{font-size:13px}.link-main small{color:#7d8991;margin-top:4px;font-size:8px;line-height:1.4}.metric-cell{padding-left:13px;border-left:1px solid #e7eaed}.metric-cell>span{margin-bottom:5px;color:#8b969d;font-size:7px;font-weight:900;text-transform:uppercase}.metric-cell>b{font-size:11px}.status{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border-radius:7px;font-size:8px;font-weight:900;text-transform:uppercase}.status.live{color:#fff;background:#15976a}.status.live:before{content:"";width:6px;height:6px;border-radius:50%;background:#9effd9;box-shadow:0 0 0 3px #9effd92b}.status.active{color:#806a08;background:#fff1a9}.status.expired,.status.revoked{color:#9a3547;background:#fae7eb}.actions{display:flex;gap:6px}.actions button{min-height:35px;padding:0 10px}.actions .danger{color:#a23247;background:#fff;border:1px solid #edcbd1}.empty-state{padding:30px;border:1px dashed #d7dde1;border-radius:13px;text-align:center}
.link-details{padding:20px;border-top:1px solid var(--line);background:#f8f9fa}.detail-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}.detail-metrics>div{padding:14px;border:1px solid var(--line);border-radius:11px;background:#fff}.detail-metrics span,.detail-metrics strong{display:block}.detail-metrics span{color:#829099;font-size:7px;font-weight:900;text-transform:uppercase}.detail-metrics strong{margin-top:6px;font-size:13px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.detail-grid>div>b{display:block;margin-bottom:12px;font-size:11px}.section-usage{display:grid;gap:8px}.section-usage>div{display:grid;grid-template-columns:125px 1fr 25px;align-items:center;gap:9px}.section-usage span{overflow:hidden;color:#5e6c75;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.section-usage i{height:6px;overflow:hidden;border-radius:10px;background:#e3e7ea}.section-usage em{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,var(--pink),#e879dc)}.section-usage strong{font-size:8px}.event-list{display:grid;gap:9px}.event-list>div{display:grid;grid-template-columns:9px 1fr;gap:9px}.event-list>div>i{width:8px;height:8px;margin-top:3px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 4px #cd32ba15}.event-list b,.event-list small{display:block}.event-list b{font-size:9px}.event-list small{margin-top:3px;color:#7c8991;font-size:7px;line-height:1.4}
@media(max-width:1050px){.summary{grid-template-columns:repeat(3,1fr)}.link-main{grid-template-columns:1fr 1fr 1fr}.actions{grid-column:1/-1}.metric-cell{padding-left:0;border-left:0}}
@media(max-width:800px){.create-card form{grid-template-columns:1fr}.summary{grid-template-columns:1fr 1fr}.dashboard-filters{grid-template-columns:1fr 1fr}.dashboard-filters small{grid-column:1/-1}.link-main{grid-template-columns:1fr 1fr}.actions{grid-column:1/-1}.detail-grid{grid-template-columns:1fr}.admin-hero{flex-direction:column}}
@media(max-width:500px){header>div{display:none}main{padding:35px 12px}.create-card,.links-section{padding:19px 13px}.summary{grid-template-columns:1fr}.dashboard-filters,.link-main,.detail-metrics{grid-template-columns:1fr}.section-usage>div{grid-template-columns:105px 1fr 24px}}
.embedded body{background:#f5f6f7}.embedded body>header{display:none}.embedded main{max-width:none;padding:28px}.embedded .login-card{margin:35px auto}.embedded .admin-hero{margin-bottom:22px}.embedded .admin-hero .secondary{display:none}
