:root{--bg:#f4f6f8;--surface:#fff;--surface-strong:#f8fafc;--text:#18212f;--muted:#667386;--line:#d9e1ea;--line-strong:#c7d1dc;--teal:#0f766e;--teal-bg:#e6f5f2;--green:#287a4e;--green-bg:#e9f7ef;--indigo:#4057a8;--indigo-bg:#eef2ff;--amber:#9a6700;--amber-bg:#fff5d6;--red:#b42318;--red-bg:#fff0ed;--blue:#245f8f;--blue-bg:#edf5ff;--neutral:#586575;--neutral-bg:#eef2f5;--shadow:0 16px 42px #1e2b3a14;--modal-shadow:0 24px 70px #10182838}:root[data-theme=dark]{--bg:#111820;--surface:#18212b;--surface-strong:#202b36;--text:#eef3f8;--muted:#a4b0be;--line:#334151;--line-strong:#4a5a6c;--teal:#5ec8b7;--teal-bg:#123c39;--green:#71d09b;--green-bg:#143923;--indigo:#9ba8ff;--indigo-bg:#252d55;--amber:#f2c15f;--amber-bg:#3c2f11;--red:#ff9187;--red-bg:#431b18;--blue:#83b9f2;--blue-bg:#18334d;--neutral:#c0c9d4;--neutral-bg:#2b3541;--shadow:0 18px 46px #0000003d;--modal-shadow:0 30px 80px #00000070}*{box-sizing:border-box}html{background:var(--bg);min-width:320px}body{color:var(--text);background:var(--bg);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}:root[data-theme=light] body{background:linear-gradient(180deg, #fff 0, #fff9 180px, #f4f6f800 340px), var(--bg)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}h1,h2,p{margin:0}.shell{width:min(1460px,100% - 40px);margin:0 auto;padding:28px 0 42px}.loginShell{place-items:center;min-height:100vh;padding:24px;display:grid}.loginPanel{border:1px solid var(--line);width:min(100%,430px);box-shadow:var(--shadow);background:#fffffff5;border-radius:8px;gap:20px;padding:28px;display:grid;position:relative}:root[data-theme=dark] .loginPanel{background:color-mix(in srgb, var(--surface) 94%, transparent)}.loginUtilities{justify-content:flex-end;gap:8px;display:flex}.loginLogo{width:min(270px,82%);height:auto;margin:0 auto}.loginIntro{text-align:center;justify-items:center;gap:8px;display:grid}.loginIntro p,.loginPanel>p{color:var(--muted);font-weight:750}.loginIcon,.confirmIcon{width:44px;height:44px;color:var(--teal);background:var(--teal-bg);border-radius:8px;place-items:center;display:grid}.loginRoleTabs{background:var(--surface-strong);border:1px solid var(--line);border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;display:grid}.loginRoleTabs button{min-height:42px;color:var(--muted);background:0 0;border:0;border-radius:6px;padding:0 10px;font-size:.86rem;font-weight:950}.loginRoleTabs button.is-active{color:var(--text);background:var(--surface);box-shadow:0 6px 16px #1e2b3a14}.loginRoleHint{color:var(--muted);text-align:center;font-size:.87rem;font-weight:750;line-height:1.45}.loginForm{gap:14px;display:grid}.topbar{justify-content:space-between;align-items:center;gap:16px;min-height:64px;margin-bottom:20px;display:flex}.brand{align-items:center;gap:14px;min-width:0;display:flex}.brandLogo{flex:none;width:clamp(132px,16vw,190px);height:auto}.brandMark{color:#fff;background:linear-gradient(135deg, var(--teal), var(--indigo));border-radius:8px;flex:0 0 44px;place-items:center;width:44px;height:44px;display:grid;box-shadow:0 10px 24px #0f766e33}h1{font-size:1.34rem;line-height:1.2}h2{font-size:1rem;line-height:1.2}.brand p,.panelHeader p{color:var(--muted);margin-top:3px;font-size:.88rem}.iconButton,.toolbarButton,.secondaryButton,.eventActionButton,.collapseButton,.primaryButton{color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:7px;justify-content:center;align-items:center;display:inline-flex}.iconButton{width:42px;height:42px}.topbarActions{align-items:center;gap:8px;display:flex}.toolbarButton{gap:7px;min-width:82px;min-height:42px;padding:0 10px;font-weight:900}.toolbarButton span{font-size:.82rem}.roleBadge{white-space:nowrap;border-radius:999px;align-items:center;min-height:34px;padding:0 10px;font-size:.78rem;font-weight:950;display:inline-flex}.roleBadge.admin{color:var(--teal);background:var(--teal-bg)}.roleBadge.viewer{color:var(--neutral);background:var(--neutral-bg)}.iconButton:hover,.toolbarButton:hover,.secondaryButton:hover,.eventActionButton:hover{border-color:var(--line-strong);box-shadow:0 6px 16px #1e2b3a14}.secondaryButton{min-height:40px;padding:0 14px;font-weight:800}.primaryButton{color:#fff;background:var(--teal);border-color:var(--teal);gap:9px;min-height:42px;padding:0 16px;font-weight:900}.primaryButton:hover{filter:brightness(.96)}.dangerPrimary{background:var(--red);border-color:var(--red)}.collapseButton{width:34px;height:34px;color:var(--muted)}.notice{border-radius:8px;align-items:center;gap:9px;min-height:42px;margin-bottom:16px;padding:10px 12px;font-weight:800;display:flex}.notice.danger{color:var(--red);background:var(--red-bg);border:1px solid color-mix(in srgb, var(--red-bg) 70%, var(--red))}.compactNotice{margin:0}.summaryGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px;display:grid}.summaryTile{border:1px solid var(--line);min-height:112px;box-shadow:var(--shadow);background:#fffffff0;border-radius:8px;grid-template-columns:40px minmax(0,1fr);gap:10px 12px;padding:16px;display:grid}:root[data-theme=dark] .summaryTile,:root[data-theme=dark] .filterPanel,:root[data-theme=dark] .panel{background:color-mix(in srgb, var(--surface) 92%, transparent)}.summaryIcon{border-radius:8px;place-items:center;width:40px;height:40px;display:grid}.summaryIcon.teal{color:var(--teal);background:var(--teal-bg)}.summaryIcon.green{color:var(--green);background:var(--green-bg)}.summaryIcon.indigo{color:var(--indigo);background:var(--indigo-bg)}.summaryIcon.amber{color:var(--amber);background:var(--amber-bg)}.summaryTile span{color:var(--muted);text-transform:uppercase;align-self:center;font-size:.83rem;font-weight:900}.summaryTile strong{color:var(--text);grid-column:1/-1;font-size:2.15rem;line-height:1}.filterPanel{border:1px solid var(--line);box-shadow:var(--shadow);background:#fffffff0;border-radius:8px;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));align-items:end;gap:12px;margin-bottom:16px;padding:14px;display:grid}.filterPanel .field:first-child{grid-column:span 2}.field{color:var(--muted);text-transform:uppercase;gap:7px;font-size:.78rem;font-weight:900;display:grid}.compactField{min-width:0}.input{width:100%;min-width:0;height:40px;color:var(--text);background:var(--surface-strong);border:1px solid var(--line);border-radius:7px;outline:none;padding:0 11px;font-weight:650;transition:border-color .15s,box-shadow .15s,background .15s}.input:focus{background:var(--surface);border-color:#0f766eb3;box-shadow:0 0 0 3px #0f766e1f}.input::placeholder{color:#8a96a8}.dashboardGrid{grid-template-columns:1fr;align-items:start;gap:16px;display:grid}.panel{border:1px solid var(--line);box-shadow:var(--shadow);background:#fffffff0;border-radius:8px}.activity{min-height:360px;padding:16px}.panelHeader{justify-content:space-between;align-items:center;gap:14px;min-height:42px;display:flex}.stackedHeader{align-items:flex-start}.panelControls{justify-content:flex-end;align-items:center;gap:8px;min-width:0;display:flex}.panel.is-collapsed{min-height:auto}.tableWrap{border:1px solid var(--line);border-radius:8px;width:100%;margin-top:14px;overflow-x:auto}table{border-collapse:collapse;background:var(--surface);width:100%;min-width:1420px}th,td{text-align:left;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid var(--line);max-width:240px;height:48px;padding:0 12px;font-size:.88rem;overflow:hidden}th{color:var(--muted);background:var(--surface-strong);text-transform:uppercase;font-size:.74rem;font-weight:950}tr:last-child td{border-bottom:0}.selectColumn{text-align:center;width:44px;min-width:44px;max-width:44px;padding-inline:12px}.selectColumn input,.bulkSelectAll input,.eventSelectCell input{width:16px;height:16px;accent-color:var(--teal);cursor:pointer}.bulkToolbar{background:var(--surface-strong);border:1px solid var(--line);border-radius:8px;justify-content:space-between;align-items:center;gap:12px;min-height:48px;margin-top:14px;padding:10px 12px;display:flex}.bulkToolbar>span,.bulkSelectAll{color:var(--muted);font-size:.84rem;font-weight:900}.bulkToolbar>div{justify-content:flex-end;align-items:center;gap:8px;display:flex}.bulkSelectAll{align-items:center;gap:8px;display:inline-flex}.metadataInput,.metadataSelect{width:100%;min-width:130px;height:34px;color:var(--text);background:var(--surface-strong);border:1px solid var(--line);border-radius:7px;outline:none;padding:0 9px;font-size:.82rem;font-weight:750}.metadataInput:focus,.metadataSelect:focus{background:var(--surface);border-color:#0f766eb3;box-shadow:0 0 0 3px #0f766e1f}.readonlyCell{color:var(--muted);font-size:.84rem;font-weight:800}.metadataSaveBar{justify-content:flex-end;align-items:center;gap:12px;min-height:54px;margin-top:12px;display:flex}.metadataSaveBar span{min-width:0;color:var(--muted);font-size:.85rem;font-weight:850}.badge{border-radius:999px;justify-content:center;align-items:center;min-width:70px;min-height:26px;padding:0 9px;font-size:.76rem;font-weight:950;display:inline-flex}.badge.opened{color:var(--green);background:var(--green-bg)}.badge.clicked{color:var(--blue);background:var(--blue-bg)}.badge.failed{color:var(--red);background:var(--red-bg)}.badge.waiting{color:var(--amber);background:var(--amber-bg)}.segmented{background:var(--surface-strong);border:1px solid var(--line);border-radius:8px;gap:4px;padding:4px;display:inline-flex}.segmented button{min-height:32px;color:var(--muted);background:0 0;border:0;border-radius:6px;align-items:center;gap:7px;padding:0 10px;font-size:.82rem;font-weight:900;display:inline-flex}.segmented button.is-active{color:var(--text);background:var(--surface);box-shadow:0 5px 14px #1e2b3a14}.segmented button[data-state=active].is-active{color:var(--green)}.segmented button[data-state=archived].is-active{color:var(--neutral)}.segmented button[data-state=deleted].is-active{color:var(--red)}.segmented span{min-width:22px;height:22px;color:var(--muted);background:color-mix(in srgb, var(--line) 70%, var(--surface));border-radius:999px;place-items:center;font-size:.72rem;display:inline-grid}.segmented button.is-active span{background:var(--teal-bg);color:var(--teal)}.segmented button[data-state=active].is-active span{background:var(--green-bg);color:var(--green)}.segmented button[data-state=archived].is-active span{background:var(--neutral-bg);color:var(--neutral)}.segmented button[data-state=deleted].is-active span{background:var(--red-bg);color:var(--red)}.eventList{gap:10px;margin-top:14px;display:grid}.eventRow{background:var(--surface);border:1px solid var(--line);border-radius:8px;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;min-height:76px;padding:12px;display:grid}.eventRow.is-selectable{grid-template-columns:28px 40px minmax(0,1fr) auto}.eventSelectCell{place-items:center;width:28px;min-height:40px;display:grid}.eventIcon{border-radius:8px;place-items:center;width:40px;height:40px;display:grid}.eventIcon.sent{color:var(--teal);background:var(--teal-bg)}.eventIcon.open{color:var(--green);background:var(--green-bg)}.eventIcon.click{color:var(--indigo);background:var(--indigo-bg)}.eventIcon.sender{color:var(--amber);background:var(--amber-bg)}.eventMain{min-width:0}.eventTopline{justify-content:space-between;align-items:center;gap:12px;min-width:0;display:flex}.eventTopline strong,.eventTopline time,.eventMeta span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.eventTopline strong{min-width:0;color:var(--text);font-size:.93rem}.eventTopline time{color:var(--muted);flex:none;font-size:.78rem;font-weight:800}.eventMeta{color:var(--muted);grid-template-columns:minmax(120px,.85fr) minmax(120px,.85fr) minmax(120px,1fr) minmax(96px,.8fr);gap:10px;margin-top:7px;font-size:.82rem;font-weight:700;display:grid}.eventActions{align-items:center;gap:6px;display:flex}.eventActionButton{width:32px;height:32px}.eventActionButton.danger{color:var(--red)}.modalBackdrop{z-index:50;background:#0a0f1680;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.confirmDialog{background:var(--surface);border:1px solid var(--line);width:min(100%,430px);box-shadow:var(--modal-shadow);border-radius:8px;gap:14px;padding:24px;display:grid}.confirmDialog h2{font-size:1.12rem}.confirmDialog p,.confirmDialog span{color:var(--muted);font-weight:750}.confirmDialog strong{color:var(--text);text-overflow:ellipsis;white-space:nowrap;background:var(--surface-strong);border:1px solid var(--line);border-radius:7px;padding:10px 12px;overflow:hidden}.dialogActions{justify-content:flex-end;gap:8px;display:flex}.emptyState{min-height:260px;color:var(--muted);justify-content:center;align-items:center;gap:10px;padding:24px;font-weight:850;display:flex}.mutedIcon{color:var(--muted)}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1180px){.summaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.filterPanel{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:760px){.shell{width:min(100% - 24px,1460px);padding-top:18px}.topbar{align-items:flex-start;display:grid}.brand{align-items:flex-start}.brandLogo{width:118px;margin-top:2px}.brandMark{flex-basis:40px;width:40px;height:40px}h1{font-size:1.1rem}.summaryGrid,.filterPanel{grid-template-columns:1fr}.filterPanel .field:first-child{grid-column:auto}.topbarActions{justify-content:flex-end;width:100%}.activity{padding:14px}.panelHeader,.stackedHeader,.eventTopline{gap:8px;display:grid}.panelControls{justify-content:stretch}.segmented{width:100%;overflow-x:auto}.segmented button{flex:1 0 auto}.eventRow{grid-template-columns:40px minmax(0,1fr)}.eventRow.is-selectable{grid-template-columns:28px 40px minmax(0,1fr)}.eventActions{grid-column:1/-1;justify-content:flex-end}.eventMeta{grid-template-columns:1fr;gap:4px}.metadataSaveBar,.bulkToolbar,.bulkToolbar>div{justify-content:stretch;display:grid}.emptyState{min-height:220px}.dialogActions{display:grid}}
