@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap";
*{box-sizing:border-box}body{color:#e8edf5;background:#10141e;margin:0;font-family:Manrope,Arial}main{color:#18233a;background:#f8fafc;height:100vh;display:flex;overflow:hidden}main.dark{color:#e8edf5;background:#10141e}aside{background:#fff;border-right:1px solid #e5e9ef;flex-direction:column;flex:none;width:248px;padding:30px 16px 18px;display:flex}main.dark aside,.detail{background:#151b28;border-color:#273143}.brand{letter-spacing:2px;font-size:17px;font-weight:800}.brand span{color:#161923;background:#c4a65c;border-radius:8px;place-items:center;width:28px;height:28px;margin-right:8px;display:inline-grid}.eyebrow{color:#8792a8;letter-spacing:1.1px;margin:10px 0 4px;font:500 10px DM Mono}nav{gap:5px;margin-top:28px;display:grid}button{font:inherit;cursor:pointer;border:0}nav button{color:#71809a;text-align:left;background:0 0;border-radius:9px;align-items:center;gap:12px;padding:11px 12px;font-size:13px;display:flex}nav button svg{width:17px}nav .active{color:#1e293d;background:#e9edf3;font-weight:700}main.dark nav .active{color:#f4f7fb;background:#242e41}.sidebar-bottom{margin-top:auto}.quota{background:#f3f5f8;border-radius:10px;padding:14px 12px}.dark .quota{background:#1d2535}.quota span,.quota small{color:#8792a8;font:10px DM Mono;display:block}.quota b{margin:5px 0;font-size:18px;display:block}.quota i{background:#dce3ec;border-radius:4px;height:4px;display:block}.quota em{background:#83c9b6;border-radius:4px;width:98%;height:100%;display:block}.profile{text-align:left;width:100%;color:inherit;background:0 0;align-items:center;gap:9px;margin-top:17px;display:flex}.profile>span{color:#232633;background:#dac17d;border-radius:50%;padding:8px;font:600 11px DM Mono}.profile div{flex:1}.profile b,.profile small{font-size:11px;display:block}.profile small{color:#8792a8;margin-top:2px}.canvas-wrap{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}header{border-bottom:1px solid #e5e9ef;justify-content:space-between;align-items:center;height:101px;padding:23px 31px;display:flex}.dark header{border-color:#273143}h1{letter-spacing:-.7px;margin:0;font-size:23px;font-weight:800}h1 span{color:#8792a8;vertical-align:middle;background:#e8edf4;border-radius:12px;padding:3px 6px;font:11px DM Mono}.dark h1 span{background:#263146}.head-actions{align-items:center;gap:9px;display:flex}.search{color:#8792a8;border:1px solid #dce2ea;border-radius:8px;align-items:center;width:240px;height:37px;padding:0 9px;display:flex}.dark .search{border-color:#2c374c}.search input{color:inherit;background:0 0;border:0;outline:0;width:100%;padding:0 8px;font:12px Manrope}.search kbd{white-space:nowrap;background:#e9edf2;border-radius:3px;padding:3px;font:10px DM Mono}.dark .search kbd{background:#29354a}.icon-btn{color:#59677e;background:#eef1f5;border-radius:8px;width:37px;height:37px;position:relative}.dark .icon-btn{color:#b9c3d3;background:#232e42}.icon-btn i{background:#e4736b;border-radius:50%;width:6px;height:6px;position:absolute;top:8px;right:8px}.add{color:#1b1e26;background:#c5a964;border-radius:8px;align-items:center;gap:7px;height:37px;padding:0 13px;font-size:12px;font-weight:800;display:flex}.graph-toolbar{color:#8792a8;border-bottom:1px solid #e5e9ef;justify-content:space-between;align-items:center;height:45px;padding:0 31px;font:10px DM Mono;display:flex}.dark .graph-toolbar{border-color:#273143}.graph-toolbar b{color:#566077;margin:0 7px}.live{color:#6fc4aa}.graph-toolbar button{color:#68768e;background:0 0;font-size:11px}.react-flow{flex:1}.react-flow__controls{border:1px solid #dce2ea!important;box-shadow:0 3px 14px #10182818!important}.dark .react-flow__controls{border-color:#2f3b50!important}.react-flow__controls-button{fill:#617089!important;background:#fff!important;border-color:#e4e7ed!important}.dark .react-flow__controls-button{fill:#b5c0ce!important;background:#1b2433!important;border-color:#303d52!important}.node-card{color:#1e2a40;background:#fff;border:1px solid #dce3ec;border-radius:10px;min-width:153px;padding:11px 13px;transition:all .18s;box-shadow:0 5px 15px #17223a0d}.dark .node-card{color:#e9eef7;background:#192231;border-color:#314057;box-shadow:0 5px 15px #0002}.node-card.selected,.node-card:hover{border-color:#c4a65c;box-shadow:0 8px 24px #c4a65c29}.node-top{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.node-icon{background:#edf1f6;border-radius:6px;place-items:center;width:25px;height:25px;font-size:14px;display:grid}.node-icon.root{color:#292817;background:#d8bd72}.node-icon.country{background:#eef3f7}.node-icon.language{color:#5575ae;background:#e5eeff}.node-icon.channel{color:#8956a8;background:#f2eafb}.node-card strong{font-size:12px;display:block}.node-subtitle{color:#8190a6;margin-top:3px;font:10px DM Mono;display:block}.status-dot{border-radius:50%;width:7px;height:7px}.online{background:#67c29f}.offline{background:#b5bfcd}.hint{color:#c2cada;background:#1c2536;border-radius:7px;align-items:center;gap:7px;padding:9px 14px;font-size:11px;display:flex;position:absolute;bottom:17px;left:50%;transform:translate(-50%);box-shadow:0 5px 20px #0003}.detail{border-left:1px solid #273143;width:305px;padding:33px 25px;position:relative}.close{color:#8490a2;background:0 0;position:absolute;top:18px;right:16px}.detail-icon{background:#e9edf4;border-radius:12px;place-items:center;width:46px;height:46px;margin-bottom:19px;font-size:24px;display:grid}.dark .detail-icon{background:#273248}.detail h2{margin:5px 0 8px;font-size:24px}.connection{color:#6ec29e;background:#6ec29e1a;border-radius:10px;padding:4px 8px;font-size:11px}.metrics{border-top:1px solid #2b3547;border-bottom:1px solid #2b3547;grid-template-columns:repeat(3,1fr);margin:27px 0;padding:16px 0;display:grid}.metrics div+div{border-left:1px solid #2b3547;padding-left:10px}.metrics b,.metrics small{display:block}.metrics b{font-size:17px}.metrics small{color:#8792a8;margin-top:4px;font-size:9px}.not-connected,.node-info{background:#f0f3f6;border-radius:9px;padding:15px;font-size:12px;line-height:1.6}.dark .not-connected,.dark .node-info{background:#202a3b}.not-connected b{font-size:12px}.not-connected p{color:#8792a8}.not-connected button,.node-info button{color:#25261e;background:#c4a65c;border-radius:6px;padding:8px 10px;font-size:11px;font-weight:700}.detail-footer{color:#8792a8;border-top:1px solid #2b3547;justify-content:space-between;padding-top:14px;font-size:10px;display:flex;position:absolute;bottom:20px;left:25px;right:25px}.detail-footer b{color:#afbacb;font-weight:500}@media (max-width:900px){aside:first-child{width:62px;padding:22px 8px}.brand{font-size:0}.brand span{margin:0}.eyebrow,nav button:not(.active),.quota,.profile div,.profile svg{display:none}nav button{justify-content:center;padding:12px}.detail{z-index:5;height:100%;position:absolute;right:0}.search{width:160px}}@media (max-width:650px){header{padding:15px}.head-actions .icon-btn{display:none}.search{width:135px}.add{padding:0 10px;font-size:0}.graph-toolbar{padding:0 15px}.detail{width:270px}h1{font-size:18px}}
.node-info button{align-items:center;gap:5px;margin-top:10px;display:flex}.node-info .secondary{color:#94a0b4;background:0 0;border:1px solid #39455a}.modal-backdrop{z-index:20;background:#0c101acc;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{color:#edf2f8;background:#192231;border:1px solid #37445a;border-radius:14px;width:min(440px,100%);padding:27px;position:relative;box-shadow:0 25px 70px #0008}.modal h2{margin:4px 0 21px;font-size:21px}.modal label{color:#b9c3d1;margin:13px 0;font-size:11px;font-weight:700;display:block}.modal label em{float:right;color:#778399;font-style:normal;font-weight:400}.modal input,.modal textarea,.modal select{color:#e9eef5;background:#111826;border:1px solid #36435a;border-radius:7px;outline:none;width:100%;margin-top:7px;padding:10px;font:13px Manrope;display:block}.modal textarea{resize:vertical;min-height:70px}.form-note{color:#8c99ad;background:#222d40;border-radius:7px;padding:11px;font-size:11px;line-height:1.5}.modal-actions{justify-content:flex-end;gap:9px;margin-top:23px;display:flex}.modal-actions button:first-child{color:#9ca8b8;background:0 0;padding:8px 12px;font-size:12px}.modal-actions .add{font-size:12px}
.toolbar-actions{gap:14px;display:flex}.connection-notice{color:#e3bb74;margin:12px 0 0;font-size:11px;line-height:1.5}.react-flow__node{cursor:grab}.react-flow__node.dragging{cursor:grabbing}.node-info .danger{color:#f2bdc4;background:#4a2832;border:1px solid #71404d}
.account-picker{z-index:5;background:#1c2637;border:1px solid #3b4b64;border-radius:9px;max-width:310px;padding:13px;font-size:12px;position:absolute;top:150px;left:30px;box-shadow:0 12px 34px #0005}.account-picker b{margin-bottom:8px;display:block}.account-picker button{text-align:left;color:#e7edf6;background:#27344a;border-radius:5px;width:100%;margin-top:5px;padding:8px;display:block}
.oauth-banner{z-index:6;color:#ffe0a0;background:#503a20;border:1px solid #82613a;border-radius:8px;max-width:680px;padding:11px 14px;font-size:12px;line-height:1.45;position:absolute;top:155px;left:30px;right:30px}.account-picker{top:205px}