:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#141a27;background:#fff;font-synthesis:none;--blue: #1557d5;--blue-soft: #eef4ff;--border: #dce2eb;--muted: #687386;--surface: #f7f9fc;--green: #1caa67;--amber: #d79116}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#fff}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.loading-screen{min-height:100vh;display:grid;place-items:center;font-size:28px;font-weight:750;letter-spacing:-.04em}.primary,.secondary,.ghost{min-height:42px;border-radius:10px;border:1px solid transparent;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:650}.primary{background:var(--blue);color:#fff;box-shadow:0 4px 12px #1557d529}.primary:hover{background:#104bc0}.primary.outline{background:#fff;color:var(--blue);border-color:#9ab8f3;box-shadow:none}.secondary{background:#fff;color:var(--blue);border-color:#9ab8f3}.ghost{background:#fff;border-color:var(--border);color:#394356}.icon-button{width:38px;height:38px;display:inline-grid;place-items:center;border:0;background:transparent;color:#4c576a;border-radius:9px;padding:0}.icon-button:hover{background:#f1f4f8;color:#162035}.icon-button.compact{width:30px;height:30px}.app-shell{min-height:100vh;display:grid;grid-template-columns:236px minmax(520px,1fr) 226px;grid-template-rows:76px 1fr}.topbar{grid-column:1 / -1;height:76px;display:grid;grid-template-columns:236px minmax(300px,520px) 1fr auto auto;align-items:center;gap:12px;border-bottom:1px solid var(--border);padding:0 24px 0 28px;background:#fffffff5;position:sticky;top:0;z-index:30}.topbar h1{margin:0;font-size:27px;letter-spacing:-.045em}.search{height:44px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--border);border-radius:10px;color:#6e7889;background:#fff}.search:focus-within{border-color:#7da2ec;box-shadow:0 0 0 3px #edf3ff}.search input{width:100%;border:0;outline:0;color:#182033;font-size:15px}.add-button{justify-self:end;height:44px;padding-inline:18px}.settings{border:1px solid var(--border)}.sidebar{border-right:1px solid var(--border);padding:26px 12px 22px;display:flex;flex-direction:column;min-height:calc(100vh - 76px);position:sticky;top:76px;height:calc(100vh - 76px)}.sidebar nav{display:flex;flex-direction:column;gap:5px}.sidebar nav button,.new-group{border:0;background:transparent;min-height:46px;border-radius:9px;display:flex;align-items:center;gap:13px;padding:0 13px;color:#344054;text-align:left;font-size:15px;position:relative}.sidebar nav button:hover,.new-group:hover{background:#f6f8fb}.sidebar nav button.active{color:var(--blue);background:var(--blue-soft);font-weight:650}.sidebar nav button.active:before{content:"";position:absolute;left:-12px;width:3px;height:34px;border-radius:0 3px 3px 0;background:var(--blue)}.new-group{margin-top:18px;padding-top:12px;border-top:1px solid var(--border);border-radius:0;color:var(--blue)}.sidebar-bottom{margin-top:auto}.storage-note{padding:12px 10px 18px;display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.storage-note strong{color:#344054;font-size:12px}.storage-note div{height:4px;border-radius:9px;background:#e7ebf1;margin-top:7px;overflow:hidden}.storage-note i{display:block;width:30%;height:100%;background:var(--blue)}.sidebar-settings{width:100%;min-height:46px;border:0;border-top:1px solid var(--border);background:transparent;color:#344054;display:flex;align-items:center;gap:13px;padding:13px;font-size:15px;text-align:left}.sidebar-settings:hover,.sidebar-settings.active{background:#f6f8fb;color:var(--blue)}.workspace{background-color:#fbfcfe;background-image:radial-gradient(#dfe4ec .7px,transparent .7px);background-size:14px 14px;padding:24px 26px 40px;min-width:0}.workspace-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:18px}.workspace-heading h2{font-size:28px;margin:0;letter-spacing:-.035em}.workspace-heading span{font-size:13px;color:var(--muted)}.card-canvas{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px 24px;align-items:start}.service-card{min-height:250px;background:#fff;border:1px solid #d5dce7;border-radius:13px;position:relative;padding:18px 16px 14px 19px;box-shadow:0 3px 10px #202d4209;transition:border-color .16s,box-shadow .16s,transform .16s;overflow:visible}.service-card:hover{border-color:#b8c4d5;box-shadow:0 8px 22px #1f304d14;transform:translateY(-2px)}.service-card.selected{border:2px solid var(--blue);padding:17px 15px 13px 18px;box-shadow:0 0 0 3px #e6efff}.service-card.dragging{opacity:.65;z-index:20;box-shadow:0 16px 36px #1f304d2e}.service-stripe{position:absolute;inset:0 auto 0 0;width:5px;border-radius:13px 0 0 13px;background:var(--service-color)}.card-header{display:grid;grid-template-columns:20px 44px 1fr 30px;align-items:center;gap:10px;position:relative}.drag-handle{width:20px;height:34px;border:0;padding:0;background:transparent;color:#5f6878;cursor:grab;display:grid;place-items:center}.drag-handle:active{cursor:grabbing}.service-mark,.activity-mark{color:#fff;display:grid;place-items:center;font-weight:750;letter-spacing:-.03em}.service-mark{width:44px;height:44px;border-radius:12px;font-size:15px}.service-title{min-width:0}.service-title h3{margin:0 0 6px;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;line-height:1.2;max-width:100%}.status i{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:#a6afbd}.status.connected i{background:var(--green)}.status.attention i{background:var(--amber)}.card-menu{position:absolute;top:35px;right:0;z-index:5;width:150px;background:#fff;border:1px solid var(--border);border-radius:10px;padding:5px;box-shadow:0 12px 30px #1e2b4121}.card-menu button{width:100%;border:0;background:transparent;text-align:left;padding:9px 10px;border-radius:7px;font-size:13px}.card-menu button:hover{background:var(--surface)}.card-menu .danger{color:#c83e46}.metrics{min-height:108px;margin:20px 0 14px 30px;display:flex;flex-direction:column;gap:10px}.metric{padding:9px 10px;background:#f8fafc;border:1px solid #edf0f4;border-radius:9px;display:flex;flex-direction:column;gap:3px}.metric span{color:var(--muted);font-size:12px}.metric strong{font-size:14px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-footer{min-height:38px;border-top:1px solid #e5e9ef;padding-top:11px;display:flex;align-items:center;justify-content:space-between;gap:8px}.credential{display:flex;align-items:center;gap:7px;color:#566173;font-size:12px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.footer-actions{display:flex}.revealed-secret{position:absolute;left:16px;right:16px;bottom:-36px;z-index:7;background:#172033;color:#fff;padding:9px 12px;border-radius:8px;font:12px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 8px 20px #141d2d38}.activity-rail{border-left:1px solid var(--border);padding:28px 18px;background:#fff;min-height:calc(100vh - 76px)}.activity-rail h2{margin:0 0 22px;font-size:15px}.activity-rail article{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:15px 0;border-bottom:1px solid #e7ebf0}.activity-mark{width:36px;height:36px;border-radius:10px}.activity-rail strong{font-size:13px}.activity-rail p{font-size:12px;color:#4e596b;margin:4px 0;line-height:1.4}.activity-rail time{font-size:11px;color:#8b94a3}.empty-activity{color:var(--muted);font-size:13px;line-height:1.6;padding:18px 0}.detail-panel{margin-top:26px;background:#fff;border:1px solid var(--border);border-radius:13px;overflow:hidden}.detail-head{display:grid;grid-template-columns:48px minmax(140px,1fr) minmax(180px,1fr) auto auto;align-items:center;gap:14px;padding:17px;border-bottom:1px solid var(--border)}.detail-head h2{margin:0 0 6px;font-size:17px}.detail-meta{display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:11px}.detail-meta strong{color:#344054;font-size:12px}.detail-body{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:18px}.detail-body h3{margin:0 0 10px;font-size:13px}.detail-row{min-height:44px;border:1px solid #e4e8ee;border-radius:8px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;margin-top:8px}.detail-row span{color:var(--muted)}.empty-state{min-height:420px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;border:1px dashed #cbd4e1;border-radius:14px;background:#fffc}.empty-state>div{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft)}.empty-state h3{margin:16px 0 6px;font-size:19px}.empty-state p{margin:0 0 18px;color:var(--muted);font-size:14px}.drawer-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#1c26375c;display:flex;justify-content:flex-end}.drawer{width:min(560px,100vw);height:100vh;background:#fff;display:grid;grid-template-rows:auto 1fr auto;box-shadow:-16px 0 50px #19253929;animation:slide .2s ease-out}@keyframes slide{0%{transform:translate(30px);opacity:.7}}.drawer-heading{min-height:76px;padding:0 22px 0 28px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.drawer-heading h2{margin:0;font-size:23px;letter-spacing:-.025em}.form-scroll{overflow:auto;padding:22px 28px 30px;display:flex;flex-direction:column;gap:18px}.form-scroll label,.form-scroll fieldset{display:flex;flex-direction:column;gap:8px;color:#2e3748;font-size:13px;font-weight:650}.form-scroll input,.form-scroll select{width:100%;height:43px;border:1px solid #ccd5e2;border-radius:9px;padding:0 12px;outline:0;color:#1b2434;background:#fff;font-size:14px;font-weight:450}.form-scroll input:focus,.form-scroll select:focus{border-color:#6e97e8;box-shadow:0 0 0 3px #edf3ff}.form-scroll small{font-size:11px;color:#8a94a5;font-weight:450}.form-scroll .label-title{display:flex;align-items:baseline;gap:7px}.form-scroll .label-title em{color:#8791a1;font-size:11px;font-style:normal;font-weight:450}.form-row{display:grid;grid-template-columns:1fr 84px;gap:14px}.color-input{padding:5px!important}.form-scroll fieldset{border:0;padding:0;margin:0}.form-scroll legend{padding:0;margin-bottom:8px}.connection-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px}.connection-types button{height:42px;border:1px solid var(--border);border-radius:9px;background:#fff;color:#4b5668;font-size:12px}.connection-types button.active{border-color:var(--blue);color:var(--blue);background:var(--blue-soft);font-weight:650}.secret-input{position:relative}.secret-input input{padding-right:46px}.secret-input button{position:absolute;right:4px;top:3px;width:38px;height:36px;border:0;background:transparent;color:#637087;display:grid;place-items:center}.field-adder{display:flex;gap:8px}.field-adder button{border:1px solid #a8bee9;background:#fff;color:var(--blue);border-radius:9px;padding:0 12px;display:flex;align-items:center;gap:5px;font-size:12px;font-weight:650;white-space:nowrap}.field-list{display:flex;flex-wrap:wrap;gap:6px}.field-list span{background:#f0f3f7;border:1px solid #e0e5ec;border-radius:7px;padding:5px 6px 5px 9px;display:flex;align-items:center;gap:5px;font-size:12px;font-weight:500}.field-list button{border:0;background:transparent;padding:0;display:grid;place-items:center;color:#6a7485}.toggle-row{min-height:64px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:16px}.toggle-row div{display:flex;flex-direction:column;gap:3px}.toggle-row strong{font-size:13px}.toggle-row span{font-size:11px;color:#8791a1}.switch{width:42px;height:24px;padding:3px;border:0;background:#cbd2dc;border-radius:20px;transition:.15s}.switch i{display:block;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #18243733;transition:.15s}.switch.on{background:var(--blue)}.switch.on i{transform:translate(18px)}.test-success{min-height:48px;display:flex;align-items:center;gap:9px;color:#168855;background:#effaf5;border:1px solid #a9e2c7;border-radius:9px;padding:0 13px;font-size:13px}.website-type-note{min-height:68px;display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid #bdd0f5;border-radius:11px;color:var(--blue);background:var(--blue-soft)}.website-type-note svg{flex:0 0 auto;margin-top:1px}.website-type-note div{display:flex;flex-direction:column;gap:4px}.website-type-note strong{font-size:13px}.website-type-note span{color:#566984;font-size:11px;line-height:1.45}.optional-auth{padding:16px!important;border:1px solid var(--border)!important;border-radius:11px;gap:16px!important}.optional-auth legend{padding:0 6px!important;margin:0!important}.optional-auth legend span,.optional-auth label>span{color:#8791a1;font-size:11px;font-weight:450}.drawer-actions{min-height:76px;padding:14px 22px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px}.drawer-actions>span{flex:1}.settings-drawer{width:min(590px,100vw)}.settings-title{display:flex;align-items:center;gap:11px}.settings-title>span{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft)}.settings-content{overflow:auto;padding:28px}.monitor-settings{border:1px solid #cfd9ea;border-radius:14px;overflow:hidden;margin-bottom:28px;box-shadow:0 4px 16px #253e630d}.settings-section-heading{padding:18px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;background:#f8faff;border-bottom:1px solid #dce4f0}.settings-section-heading h3{margin:0 0 5px;font-size:17px}.settings-section-heading p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.settings-section-heading .switch{flex:0 0 auto;margin-top:2px}.monitor-settings-body{padding:18px;transition:opacity .15s}.monitor-settings-body.disabled{opacity:.48}.monitor-frequency{display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:13px;font-weight:650}.monitor-frequency>span{display:flex;align-items:center;gap:8px}.monitor-frequency select{min-width:174px;height:40px;border:1px solid #ccd5e2;border-radius:9px;padding:0 10px;background:#fff;color:#263246;outline:none}.monitor-flow{display:grid;grid-template-columns:1fr 30px 1fr;align-items:center;margin:18px 0}.monitor-flow>div{min-height:116px;position:relative;border:1px solid #dfe5ef;border-radius:11px;padding:17px 14px 13px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:#fff}.monitor-flow>div>span{position:absolute;top:10px;right:10px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft);font-size:11px;font-weight:750}.monitor-flow svg{color:var(--blue)}.monitor-flow strong{font-size:13px}.monitor-flow small{color:var(--muted);font-size:11px;line-height:1.4}.monitor-flow>i{height:1px;background:#aebbd0;position:relative}.monitor-flow>i:after{content:"";position:absolute;right:-1px;top:-3px;width:6px;height:6px;border-top:1px solid #8394ae;border-right:1px solid #8394ae;transform:rotate(45deg)}.monitor-options{border:1px solid var(--border);border-radius:11px;overflow:hidden}.monitor-option{display:grid;grid-template-columns:38px 1fr 44px;align-items:center;gap:11px;padding:14px}.monitor-option+.monitor-option{border-top:1px solid var(--border)}.monitor-option-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;color:var(--blue);background:var(--blue-soft)}.monitor-option strong{display:block;margin-bottom:3px;font-size:13px}.monitor-option p{margin:0;color:var(--muted);font-size:11px;line-height:1.4}.monitor-description{display:flex;flex-direction:column;gap:7px;margin-top:18px;color:#2e3748;font-size:13px;font-weight:650}.monitor-description textarea{min-height:104px;width:100%;resize:vertical;border:1px solid #ccd5e2;border-radius:9px;padding:11px 12px;outline:none;color:#1b2434;background:#fff;font:13px/1.5 inherit}.monitor-description textarea:focus,.monitor-frequency select:focus{border-color:#6e97e8;box-shadow:0 0 0 3px #edf3ff}.monitor-description small{color:#8791a1;font-size:11px;font-weight:450}.monitor-retention{margin-top:18px;padding-top:17px;border-top:1px solid var(--border)}.monitor-note{margin-top:15px;display:flex;align-items:flex-start;gap:8px;padding:11px 12px;border-radius:9px;color:#356046;background:#f0f8f3;font-size:11px;line-height:1.45}.monitor-note svg{flex:0 0 auto;margin-top:1px;color:var(--green)}.settings-intro h3{margin:0 0 7px;font-size:17px}.settings-intro p,.settings-row p,.settings-session p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.settings-list{margin-top:22px;border:1px solid var(--border);border-radius:12px;overflow:hidden}.settings-row{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:17px;align-items:start}.settings-row+.settings-row{border-top:1px solid var(--border)}.settings-row-icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft)}.settings-row strong,.settings-session strong{display:block;margin-bottom:5px;font-size:14px}.settings-row code{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:#49566b;overflow-wrap:anywhere}.settings-session{margin-top:18px;border:1px solid var(--border);border-radius:12px;padding:17px;display:flex;align-items:center;justify-content:space-between;gap:18px}.logout-button{flex:0 0 auto;color:#bb3440}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);z-index:150;background:#172033;color:#fff;border-radius:10px;padding:12px 16px;font-size:13px;box-shadow:0 12px 30px #111b2b38}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:#f7f9fc;background-image:radial-gradient(#dce3ee .7px,transparent .7px);background-size:15px 15px}.login-card{width:min(420px,100%);background:#fff;border:1px solid var(--border);border-radius:16px;padding:34px;box-shadow:0 18px 50px #24324b1a}.login-mark{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:var(--blue);color:#fff}.login-card h1{font-size:30px;margin:20px 0 8px;letter-spacing:-.04em}.login-card p{color:var(--muted);margin:0 0 26px;line-height:1.55}.login-card form{display:flex;flex-direction:column;gap:14px}.login-card label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:650}.login-card input{height:46px;border:1px solid #cbd4e1;border-radius:9px;padding:0 12px;outline:0}.login-card input:focus{border-color:#6e97e8;box-shadow:0 0 0 3px #edf3ff}.login-error{color:#ba313a;font-size:13px}@media(max-width:1180px){.app-shell{grid-template-columns:210px minmax(500px,1fr)}.topbar{grid-template-columns:210px minmax(240px,1fr) auto auto;padding-left:20px}.activity-rail{display:none}.add-button{font-size:0;width:44px;padding:0}}@media(max-width:760px){.app-shell{display:block;padding-top:68px}.topbar{position:fixed;height:68px;grid-template-columns:auto 1fr auto auto;padding:0 12px}.topbar h1{font-size:22px}.search{grid-row:2;grid-column:1 / -1;display:none}.sidebar{position:fixed;z-index:40;bottom:0;top:auto;left:0;right:0;height:62px;min-height:0;border:0;border-top:1px solid var(--border);padding:5px 8px;background:#fff}.sidebar nav{flex-direction:row;justify-content:space-around}.sidebar nav button{width:58px;min-height:50px;justify-content:center;padding:0;font-size:0}.sidebar nav button.active:before{inset:auto 8px -5px;width:auto;height:3px;border-radius:3px 3px 0 0}.sidebar nav button:nth-child(n+5),.new-group,.sidebar-bottom{display:none}.workspace{min-height:calc(100vh - 68px);padding:20px 14px 90px}.workspace-heading h2{font-size:24px}.card-canvas{grid-template-columns:1fr;gap:14px}.service-card{min-height:235px}.detail-head{grid-template-columns:46px 1fr auto}.detail-meta,.detail-head .secondary{display:none}.detail-body{grid-template-columns:1fr}.drawer{width:100vw}.drawer-heading{min-height:68px;padding:0 16px}.form-scroll{padding:18px 16px 24px}.connection-types{grid-template-columns:1fr 1fr}.drawer-actions{padding:10px;flex-wrap:wrap}.drawer-actions>span{display:none}.drawer-actions .secondary{width:100%}.drawer-actions .ghost,.drawer-actions .primary{flex:1}.settings-session{align-items:stretch;flex-direction:column}.settings-session .logout-button{width:100%}.monitor-frequency{align-items:stretch;flex-direction:column}.monitor-frequency select{width:100%}.monitor-flow{grid-template-columns:1fr;gap:10px}.monitor-flow>i{width:1px;height:15px;justify-self:center}.monitor-flow>i:after{right:-3px;top:8px;transform:rotate(135deg)}}