:root{
  --bg:#0b0b0b;--panel:#121212;--panel2:#171717;--line:#2a2a2a;--text:#f4f4f4;--muted:#8c8c8c;--soft:#d8d8d8;--danger:#ff6b6b;
}
*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}.app-shell{display:grid;grid-template-columns:230px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;border-right:1px solid var(--line);padding:28px 20px;display:flex;flex-direction:column;justify-content:space-between;background:#080808}.brand-mark{font-size:25px;font-weight:800;letter-spacing:-1px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--muted);text-transform:uppercase;margin-top:5px}.nav-list{display:flex;flex-direction:column;gap:5px}.nav-item,.logout-button{width:100%;border:0;background:transparent;color:var(--muted);text-align:left;padding:12px 13px;cursor:pointer;font-size:12px}.nav-item:hover,.nav-item.is-active{background:var(--panel2);color:var(--text)}.logout-button{border-top:1px solid var(--line);padding-top:18px}.main-content{padding:28px;min-width:0}.topbar{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}.topbar h1{margin:3px 0 0;font-size:32px;letter-spacing:-1px}.topbar select,.panel select{background:var(--panel);border:1px solid var(--line);color:var(--text);padding:10px 12px}.view{display:none}.view.is-active{display:block}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}.metric-card,.panel{background:var(--panel);border:1px solid var(--line)}.metric-card{padding:18px;min-height:120px;display:flex;flex-direction:column;justify-content:space-between}.metric-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.metric-value{font-size:28px;font-weight:700;letter-spacing:-1px}.metric-note{font-size:10px;color:var(--muted)}.panel{padding:18px;margin-bottom:12px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.panel h2{font-size:15px;margin:4px 0 0}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.trend-chart{height:230px;display:flex;align-items:flex-end;gap:5px;padding-top:15px;overflow:hidden}.trend-col{min-width:8px;flex:1;height:100%;display:flex;align-items:flex-end;gap:2px;position:relative}.trend-bar{width:70%;min-height:2px;background:#efefef}.trend-orders{width:30%;min-height:0;background:#656565}.trend-col:hover::after{content:attr(data-tip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#fff;color:#111;padding:5px 7px;font-size:9px;z-index:2}.rank-list{display:flex;flex-direction:column;gap:10px}.rank-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.rank-main{min-width:0}.rank-title{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank-sub{font-size:9px;color:var(--muted);margin-top:3px}.rank-value{font-size:12px;font-weight:700}.rank-bar-wrap{height:3px;background:#242424;margin-top:7px}.rank-bar{height:100%;background:#efefef}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:850px}th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;font-size:10px}th{font-size:9px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.7px}td strong{font-size:11px}.pill{display:inline-block;border:1px solid var(--line);padding:4px 7px;color:var(--soft);font-size:9px}.funnel-list{display:flex;flex-direction:column;gap:8px}.funnel-row{display:grid;grid-template-columns:190px 1fr 90px;gap:14px;align-items:center}.funnel-label{font-size:11px}.funnel-track{height:34px;background:#1c1c1c;position:relative}.funnel-fill{height:100%;background:#f1f1f1;min-width:2px}.funnel-number{text-align:right}.funnel-number strong{display:block;font-size:14px}.funnel-number span{font-size:9px;color:var(--muted)}.links-layout{grid-template-columns:minmax(350px,.8fr) minmax(450px,1.2fr)}.utm-form{display:grid;grid-template-columns:1fr 1fr;gap:11px}.utm-form label,.login-form label{display:flex;flex-direction:column;gap:6px;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}.utm-form .full{grid-column:1/-1}input{width:100%;background:#0d0d0d;border:1px solid var(--line);color:var(--text);padding:12px;outline:0}input:focus{border-color:#777}.primary-button{border:1px solid #f4f4f4;background:#f4f4f4;color:#0b0b0b;padding:13px;font-size:10px;font-weight:700;cursor:pointer}.primary-button:hover{background:#d9d9d9}.form-error{min-height:14px;color:var(--danger);font-size:10px;text-transform:none;letter-spacing:0}.created-link{margin-top:14px;border:1px solid var(--line);padding:13px}.hidden{display:none}.copy-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:8px}.copy-row code{background:#0d0d0d;border:1px solid var(--line);padding:10px;font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.copy-button,.toggle-button{border:1px solid var(--line);background:transparent;color:var(--text);padding:8px 10px;cursor:pointer;font-size:9px}.links-list{display:flex;flex-direction:column;gap:8px}.link-card{border:1px solid var(--line);padding:12px}.link-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.link-slug{font-size:12px;font-weight:700}.link-meta{font-size:9px;color:var(--muted);margin-top:6px;word-break:break-all}.link-actions{display:flex;gap:7px;align-items:center}.status-dot{width:7px;height:7px;border-radius:50%;background:#6e6e6e}.status-dot.active{background:#f1f1f1}.empty-state{padding:28px 0;color:var(--muted);font-size:11px;text-align:center}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(390px,100%);border:1px solid var(--line);background:var(--panel);padding:28px}.login-card h1{margin:28px 0 7px;font-size:25px}.muted{color:var(--muted);font-size:11px}.login-form{display:flex;flex-direction:column;gap:13px;margin-top:24px}.login-form button{margin-top:6px;border:1px solid #fff;background:#fff;color:#111;padding:13px;font-weight:700;font-size:10px;cursor:pointer}
@media(max-width:1000px){.metric-grid{grid-template-columns:repeat(2,1fr)}.split-grid,.links-layout{grid-template-columns:1fr}.app-shell{grid-template-columns:180px 1fr}.funnel-row{grid-template-columns:150px 1fr 70px}}
@media(max-width:700px){.app-shell{display:block}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:17px}.nav-list{flex-direction:row;overflow:auto;margin-top:16px}.nav-item{white-space:nowrap;width:auto}.logout-button{display:none}.main-content{padding:17px}.topbar{align-items:center}.topbar h1{font-size:25px}.metric-grid{grid-template-columns:1fr 1fr}.metric-card{min-height:105px}.metric-value{font-size:22px}.responsive-head{align-items:flex-start;gap:12px}.funnel-row{grid-template-columns:1fr}.funnel-number{text-align:left}.utm-form{grid-template-columns:1fr}.utm-form .full{grid-column:auto}}
.head-actions{display:flex;align-items:center;gap:8px}.secondary-button{border:1px solid var(--line);background:transparent;color:var(--text);padding:10px 12px;cursor:pointer;font-size:9px}.secondary-button:hover{border-color:#777}.wide-table{min-width:1180px}.order-status{display:inline-block;padding:5px 7px;border:1px solid var(--line);font-size:9px;white-space:nowrap}.status-paid{background:#efefef;color:#111;border-color:#efefef}.status-created{color:#d8d8d8}.status-cancelled,.status-refunded{color:#8c8c8c}.setup-card h2{font-size:17px;margin:6px 0 10px}.setup-text{font-size:12px;line-height:1.6;color:var(--soft);max-width:850px}.setup-card code{white-space:normal;word-break:break-all}.panel .muted{line-height:1.5}.metric-value{word-break:break-word}
@media(max-width:700px){.head-actions{width:100%;align-items:stretch}.head-actions select{flex:1}.responsive-head{flex-direction:column}.metric-grid{grid-template-columns:1fr}.copy-row{grid-template-columns:1fr}.copy-row button{width:100%}.nav-list{padding-bottom:4px}}


.utm-presets{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 14px;
}

.preset-button{
  border:1px solid var(--line);
  background:#0d0d0d;
  color:var(--text);
  padding:9px 11px;
  cursor:pointer;
  font-size:9px;
}

.preset-button:hover{
  border-color:#777;
}

.utm-hint{
  font-size:9px;
  color:var(--muted);
  line-height:1.4;
}

.delete-button{
  border:1px solid #6a2f2f;
  background:transparent;
  color:#ff8f8f;
  padding:8px 10px;
  cursor:pointer;
  font-size:9px;
}

.delete-button:hover{
  background:#321717;
}

.utm-tags{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:9px;
}

.utm-tags span{
  border:1px solid var(--line);
  padding:4px 6px;
  color:var(--soft);
  font-size:8px;
}

.link-actions{
  flex-wrap:wrap;
  justify-content:flex-end;
}