:root{color-scheme:light;--ink:#12203d;--muted:#66728a;--border:#e2e8f2;--paper:#fff;--bg:#f6f8fc;--blue:#2458e8;--blue-dark:#1845c0;--soft-blue:#eef3ff;--green:#197a5c;--soft-green:#e6f6ee;--amber:#926b20;--soft-amber:#fff6e6;--shadow:0 14px 36px rgba(35,54,90,.055)}
*{box-sizing:border-box}
html{font-family:"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink)}
body{margin:0;min-height:100vh}
button,input,select{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:"Segoe UI",Arial,sans-serif;letter-spacing:-.045em}
h1{font-size:clamp(2rem,4vw,3rem);line-height:1.13;margin-bottom:.65rem}
h2{font-size:1.25rem;line-height:1.25;margin-bottom:0}
p{line-height:1.6}
.topbar{background:#fff;border-bottom:1px solid var(--border)}
.topbar-inner{max-width:1240px;margin:auto;min-height:76px;padding:0 30px;display:flex;align-items:center;gap:42px}
.brand{display:inline-flex;align-items:center;gap:12px;white-space:nowrap}
.brand-mark{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:var(--blue);color:#fff;font-family:"Segoe UI",Arial,sans-serif;font-weight:800;font-size:15px;letter-spacing:-.1em;box-shadow:0 7px 15px rgba(36,88,232,.2)}
.brand-mark span{color:#a9c6ff}
.brand-text{font-family:"Segoe UI",Arial,sans-serif;font-size:17px;font-weight:800;letter-spacing:-.055em}
.brand-text span{font-weight:600;color:#8995aa}
.topnav{height:76px;display:flex;align-items:stretch;gap:29px}
.topnav a{display:flex;align-items:center;position:relative;color:#68758f;font-size:14px;font-weight:700}
.topnav a:hover,.topnav a[aria-current=page]{color:var(--blue)}
.topnav a[aria-current=page]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--blue);border-radius:4px 4px 0 0}
.account{display:flex;align-items:center;gap:16px;margin-left:auto}
.account-email{color:#7c8799;font-size:12px;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.text-button{background:none;border:0;color:var(--blue);font-weight:700;font-size:13px;padding:5px 0}
.text-button:hover{text-decoration:underline}
.text-button.danger{color:#a33a43}
.main-shell{max-width:1240px;margin:0 auto;padding:55px 30px 80px;min-height:calc(100vh - 135px)}
.footer{border-top:1px solid var(--border);padding:18px 30px;text-align:center;color:#9aa5b8;font-size:12px;background:#fff}
.footer span{padding:0 5px;color:#c2cbd9}
.eyebrow,.card-kicker{display:block;color:var(--blue);font-size:10px;letter-spacing:.17em;font-weight:800}
.eyebrow{margin-bottom:13px}
.card-kicker{margin-bottom:8px}
.lede{font-size:15px;color:var(--muted);margin:0;max-width:680px}
.muted{color:var(--muted);font-size:13px;line-height:1.6}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:33px}
.page-head.compact{margin-bottom:28px}
.private-badge{display:inline-flex;align-items:center;gap:8px;color:#55705f;background:var(--soft-green);padding:9px 13px;border-radius:100px;font-size:12px;font-weight:700;white-space:nowrap}
.private-dot{display:block;width:7px;height:7px;border-radius:50%;background:#27a873}
.summary-number{padding:16px 21px;background:#eaf0ff;border-radius:15px;display:flex;align-items:baseline;gap:8px;color:var(--blue)}
.summary-number strong{font-family:"Segoe UI",Arial,sans-serif;font-size:26px;line-height:1}
.summary-number span{font-size:12px;font-weight:700}
.period-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 24px;background:var(--paper);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);margin-bottom:26px}
.period-copy{display:flex;flex-direction:column;gap:4px}
.period-copy strong{font-family:"Segoe UI",Arial,sans-serif;font-size:13px}
.period-copy span{color:var(--muted);font-size:12px}
.period-controls{display:flex;align-items:center;gap:10px}
.period-controls label{font-size:12px;font-weight:700;color:#66738a}
input,select{border:1px solid #d8e0eb;background:#fff;border-radius:9px;min-height:42px;padding:9px 11px;color:var(--ink);outline:none}
input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(36,88,232,.13)}
input[type=date]{width:148px;font-size:12px}
.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:42px;padding:0 16px;border-radius:9px;border:1px solid transparent;font-size:12px;font-weight:800;white-space:nowrap}
.button.primary{background:var(--blue);color:#fff;box-shadow:0 7px 15px rgba(36,88,232,.17)}
.button.primary:hover{background:var(--blue-dark)}
.button.secondary{background:#f2f5fb;border-color:#e0e7f2;color:#2a426f}
.button.secondary:hover{background:#e8eef9}
.button.full{width:100%}
.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.metric-panel,.panel{background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}
.metric-panel{padding:26px 26px 21px}
.metric-heading{display:flex;align-items:center;gap:13px;padding-bottom:23px;border-bottom:1px solid #edf1f6}
.metric-heading .status{margin-left:auto}
.channel-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:#eaf0ff;color:var(--blue);font-weight:800;font-family:"Segoe UI",Arial,sans-serif;font-size:16px}
.channel-icon.linkedin{background:#e8f3fd;color:#0c75ac;font-size:14px}
.status{display:inline-flex;align-items:center;gap:6px;border-radius:100px;padding:7px 10px;font-size:11px;font-weight:800;white-space:nowrap}
.status:before{content:"";display:block;width:6px;height:6px;border-radius:50%}
.status.ready{background:var(--soft-green);color:var(--green)}
.status.ready:before{background:#28a976}
.status.pending{background:var(--soft-amber);color:var(--amber)}
.status.pending:before{background:#d5a144}
.stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:26px 0 22px}
.stat{display:flex;flex-direction:column;gap:7px;padding-left:22px;border-left:1px solid #e9eef5}
.stat:first-child{border-left:0;padding-left:0}
.stat span{font-size:12px;color:#78859a;font-weight:600}
.stat strong{font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(20px,2.3vw,29px);letter-spacing:-.06em;line-height:1.1}
.metric-foot{border-top:1px solid #edf1f6;padding-top:17px;display:flex;justify-content:space-between;gap:8px;color:#97a3b6;font-size:10px}
.info-note{display:flex;align-items:flex-start;gap:12px;margin-top:20px;padding:16px 19px;background:#edf3ff;border:1px solid #dce7ff;border-radius:12px;color:#536788}
.info-note p{margin:0;font-size:12px}
.info-mark{font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;border-radius:50%;background:#d5e3ff;color:var(--blue);font-size:12px}
.panel{padding:25px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:21px}
.list-panel{margin-bottom:20px}
.client-list{margin:-5px -25px -25px}
.client-row{display:flex;align-items:center;gap:15px;padding:17px 25px;border-top:1px solid #eef1f6}
.client-row:hover{background:#f9fbff}
.avatar{flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#eaf0ff;color:var(--blue);font-family:"Segoe UI",Arial,sans-serif;font-weight:800}
.client-meta{display:flex;flex-direction:column;gap:3px}
.client-meta strong{font-size:13px}
.client-meta small{color:#99a4b4;font-size:11px}
.channel-count{margin-left:auto;color:#738198;font-size:12px}
.row-arrow{margin-left:18px;color:#8d9bb3;font-size:20px}
.empty-state{padding:28px 8px;color:var(--muted);font-size:13px}
.form-panel{padding:26px}
.slim-panel{max-width:760px}
.inline-form{display:flex;align-items:end;gap:12px}
.inline-form>div{flex:1;min-width:0}
label{display:block;font-size:12px;font-weight:700;color:#495a75;margin-bottom:7px}
.inline-form input{width:100%}
.stacked-form{display:flex;flex-direction:column}
.stacked-form input,.stacked-form select{width:100%;margin-bottom:17px}
.stacked-form .button{margin-top:4px}
.field-help{color:#8996aa;font-size:11px;margin:-8px 0 19px}
.admin-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:23px}
.viewer-list{border-top:1px solid #edf1f6;margin:15px -26px 22px}
.viewer-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 26px;border-bottom:1px solid #edf1f6}
.viewer-row span{display:flex;flex-direction:column;gap:4px;overflow:hidden}
.viewer-row strong{font-size:12px;overflow:hidden;text-overflow:ellipsis}
.viewer-row small{font-size:11px;color:#9aa6b7}
.spaced-form{margin-top:22px}
.connection-status{margin:12px 0 17px}
.connection-panel p{font-size:13px;color:#5e6d83}
.connection-panel p.muted{color:#9aa5b6}
.back-link{display:inline-block;margin-bottom:20px;color:var(--blue);font-weight:700;font-size:12px}
.back-link:hover{text-decoration:underline}
.alert{border-radius:9px;padding:12px 14px;font-size:12px;line-height:1.6;margin-bottom:20px;overflow-wrap:anywhere}
.alert.error{background:#fff0f1;color:#9b313d;border:1px solid #f4d3d7}
.alert.success{background:#eaf8f2;color:#24654f;border:1px solid #cae9dc}
.alert strong,.alert span,.alert code{display:block}
.alert code{font-size:12px;background:rgba(255,255,255,.66);border:1px solid #c5e2d4;border-radius:5px;padding:9px;margin-top:9px;overflow-wrap:anywhere}
.tokens-layout{margin-top:0}
.tokens-layout .field-help{margin:20px 0 0}
.tokens-layout .field-help code{background:#eff3f8;padding:2px 5px;border-radius:3px;color:#43556f}
.auth-wrap{min-height:calc(100vh - 260px);display:grid;grid-template-columns:1fr 420px;gap:10%;align-items:center;max-width:1100px;margin:auto}
.auth-intro h1{max-width:600px;font-size:clamp(2.8rem,5vw,4.1rem);line-height:1.1;margin-bottom:21px}
.auth-intro p{font-size:16px;color:#697995;max-width:450px}
.auth-lines{display:flex;align-items:center;gap:7px;margin-top:39px}
.auth-lines span{height:5px;width:30px;border-radius:5px;background:#2b5ce9}
.auth-lines span:nth-child(2){background:#a8c1fb;width:18px}
.auth-lines span:nth-child(3){background:#d6e1fb;width:9px}
.auth-card{background:#fff;border:1px solid var(--border);box-shadow:0 25px 65px rgba(29,51,89,.09);padding:36px;border-radius:20px}
.auth-card h2{font-size:26px;margin-bottom:7px}
.auth-card .muted{margin-bottom:28px}
.auth-card .stacked-form label{margin-bottom:8px}
.auth-card .stacked-form input{height:47px;margin-bottom:20px}
.auth-card .button{height:48px;margin-top:6px;font-size:13px}
.form-footnote{text-align:center;color:#9aa5b6;font-size:11px;margin:19px 0 0}
.narrow-page{max-width:520px;margin:45px auto}
.narrow-page .form-panel{margin-top:27px}
@media(max-width:900px){.topbar-inner{gap:25px}.account-email{display:none}.period-bar{align-items:flex-start;flex-direction:column}.auth-wrap{gap:5%;grid-template-columns:1fr 390px}.metric-foot{flex-direction:column}}
@media(max-width:700px){.topbar-inner{padding:0 18px;min-height:66px;gap:18px}.topnav{height:66px;gap:16px}.topnav a{font-size:12px}.brand-text{display:none}.account{gap:0}.main-shell{padding:34px 17px 65px}.page-head{align-items:flex-start;flex-direction:column;margin-bottom:24px}.metric-grid,.admin-columns{grid-template-columns:1fr}.period-controls{flex-wrap:wrap}.period-controls label{width:34px}.period-controls input{flex:1;min-width:120px}.period-controls .button{width:100%;margin-top:3px}.period-bar{padding:18px}.metric-panel{padding:21px}.metric-heading{flex-wrap:wrap}.metric-heading .status{margin-left:0}.stat strong{font-size:23px}.client-row{padding:15px 18px}.client-list{margin:-5px -25px -25px}.channel-count{font-size:11px;text-align:right}.row-arrow{display:none}.inline-form{flex-direction:column;align-items:stretch}.inline-form>div,.inline-form .button{width:100%}.auth-wrap{display:flex;flex-direction:column;gap:35px;align-items:stretch;min-height:auto}.auth-intro h1{font-size:36px}.auth-intro p{font-size:14px}.auth-card{padding:27px}.auth-lines{display:none}}
