/* Shared surfaces and dialogs, intentionally consistent across every tool. */
:root{--surface-radius:20px;--control-radius:10px}.content{background:#f7f7f7}.card,.insight-card,.inline-stats,.health-item,.route-card,.inbox-layout{border-radius:var(--surface-radius);border:1px solid #e7e7e7;box-shadow:0 2px 5px #00000003,0 0 0 1px #ffffff80 inset;background:#fff}.card-head{padding:19px 22px;border-color:#f0f0f0;background:#fff}.card-head h2,.insight-heading h2{color:#292929;font-weight:650}.card-head p,.tip,.card-body small{color:#818181}.card-body{padding:22px}.square-icon{background:#f2f2f2;color:#737373}.card .stat-number,.health-item strong{color:#2c2c2c}.stat-row,.stat-row b,.settings-layout label{color:#565656}.progress{background:#efefef}.progress>i{background:#474747}.overview-banner{background:#f1f1f1;border-color:#e5e5e5;border-radius:22px}.overview-banner h2{color:#292929}.overview-banner p,.eyebrow{color:#7c7c7c}.overview-shortcuts button{color:#444;border-color:#dedede;background:#fff}.kpis{border-radius:20px;border-color:#e5e5e5}.kpi .metric{color:#242424}.kpi.red .metric{color:#b52a25}.kpi-title,.stat-row,.thread-item h3,.message-subject,.conversation-head h2{color:#303030}.kpi small,.thread-item p,.conversation-head p,.message-meta,.message-meta .round{color:#8a8a8a}.inline-stats span{border-color:#eee}.inline-stats b{color:#333}.notice,.notice.info{border:1px solid #e4e7e9;background:#f4f6f7;color:#676e72;border-radius:14px;padding:14px 17px}.notice.warning{background:#fff9ec;color:#8c6e32;border-color:#efe4c8}button{border-radius:var(--control-radius);padding:7px 13px;border-color:#d7d7d7;box-shadow:0 1px 2px #00000004,0 -1px 0 #00000004 inset;background:#fff;color:#454545;font-weight:550}button:hover{background:#f9f9f9;border-color:#bdbdbd}button.primary{border-color:#242424;background:linear-gradient(#393939,#252525);color:#fff;box-shadow:0 1px 2px #0002,inset 0 1px #ffffff1a}button.primary:hover{background:#191919}button.small{border-radius:8px}.badge{border-radius:6px;font-size:10px;line-height:1.5}.badge:not(.green):not(.red):not(.orange):not(.blue):not(.purple){background:#eee;color:#777}.badge.purple{background:#edf1ed;color:#4c7555}input,select,textarea{border-radius:var(--control-radius);border-color:#d4d4d4;color:#333;background:#fff;padding:9px 11px;box-shadow:0 1px 2px #00000002 inset;font-size:13px}input:hover,select:hover,textarea:hover{border-color:#a5a5a5}input:focus,select:focus,textarea:focus{border-color:#8c8c8c;box-shadow:0 0 0 3px #d3e9ff;outline:0}input::placeholder,textarea::placeholder{color:#a4a4a4}input[type=checkbox]{accent-color:#303030}select{background-color:#fafafa}textarea{line-height:1.8}.search input,.thread-search input,.thread-search select,.analytics-filters input,.analytics-filters select{border-radius:12px;background:#fff}.thread-search{background:#fff;border-color:#eee}.thread-list{background:#fcfcfc;border-color:#eee}.thread-item{border-color:#f0f0f0}.thread-item:hover{background:#f7f7f7}.thread-item.selected{background:#f0f1f1;border-left-color:#303030}.thread-item .preview,.thread-item .top{color:#999}.message-list{background:#fafafa}.conversation-head{background:#fff;border-color:#eee}.message{border-radius:15px;border-color:#e6e6e6;box-shadow:0 2px 5px #00000002;padding:22px 24px}.message.incoming{border-left-color:#a0b8b0}.message.outgoing{border-left-color:#c4c9cc}.message-meta strong,.message-text{color:#505050}.attachment{border-color:#e3e5e4;background:#f7f8f8;color:#666;border-radius:10px}.translation,.ai-summary{background:#f6f7f7;border-color:#e5e7e7;color:#65716d;border-radius:12px}.ai-panel{background:#f3f5f4;border-color:#e1e7e3;border-radius:16px}.ai-panel h3{color:#4b6255}.ai-panel p{color:#8b9690}.form-section{color:#383838;border-color:#e9e9e9}.variant-box{border-color:#e4e4e4;background:#fafafa;border-radius:15px;padding:20px}.choice-list{border-color:#e0e0e0;background:#fafafa;border-radius:12px}.day-picks label{background:#fff;border-color:#ddd;border-radius:8px}.health-item h3,.route-card h3{color:#444}.health-item p,.route-card code,.endpoint code{color:#858585}.endpoint{border-color:#eee}.toggle-row{border-color:#eee}.toggle-row p{color:#8c8c8c}.toggle i{background:#d6d6d6}.toggle input:checked+i{background:#303030}.api-key{background:#f8f8f8;border-color:#d0d0d0;color:#555;border-radius:12px}.table-wrap table{background:#fff}th{background:#f7f7f7;color:#777;border-color:#e9e9e9;font-size:12px;font-weight:500}td{border-color:#f1f1f1;color:#555;padding:13px 17px}td strong{color:#333}td small{color:#999}tbody tr:hover{background:#fafafa}.bottom-pagination{border-color:#ededed}.meter{background:#eee}.meter i{background:#a8b7b0}.form-error{color:#b72727;font-size:12px}.command-results .command-item{border-radius:10px;padding:12px;background:#fff;color:#4a4a4a}.command-item:hover{background:#f4f4f4;border-color:#e6e6e6}
.shop-dialog{position:fixed;margin:auto;padding:0;width:min(720px,calc(100vw - 48px));max-width:calc(100vw - 48px);max-height:calc(100dvh - 64px);border:1px solid #dedede;border-radius:22px;background:#fff;color:#303030;box-shadow:0 24px 100px #0000001a,0 6px 24px #0000000a;overflow:hidden}.shop-dialog[open]{display:flex;flex-direction:column;animation:surface-in .16s ease-out}.shop-dialog::backdrop{background:#1b1b1b26;backdrop-filter:blur(1px)}.shop-dialog.wide{width:min(940px,calc(100vw - 56px))}.shop-dialog.small{width:min(560px,calc(100vw - 48px))}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:21px 25px;background:#fafafa;border-bottom:1px solid #ededed;flex-shrink:0}.dialog-head h2{font-size:17px;font-weight:650;letter-spacing:-.3px;color:#292929}.dialog-head p{font-size:12px;color:#949494;margin-top:5px;line-height:1.6}.dialog-close{width:30px;height:30px;min-width:30px;border:0;background:transparent;border-radius:50%;padding:5px;box-shadow:none;color:#777;display:grid;place-items:center}.dialog-close:hover{background:#ececec;border:0}.dialog-close svg{height:18px;width:18px;fill:none;stroke:currentColor;stroke-width:1.4}.dialog-body{padding:24px 25px;overflow:auto;overscroll-behavior:contain;min-height:0;flex:1}.dialog-body .form-grid{gap:18px 20px}.dialog-body label{font-size:13px;color:#5b5b5b}.dialog-body label>span{margin-bottom:7px}.dialog-body .form-section{margin-top:28px;padding-top:23px;font-size:14px;font-weight:650}.dialog-foot{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:15px 24px;background:#fafafa;border-top:1px solid #eaeaea;flex-shrink:0}.dialog-foot-note{margin-right:auto;font-size:11px;color:#979797;line-height:1.5}.dialog-body .login-box{margin:1vh auto}.dialog-body .login-box h2{font-size:23px}.dialog-body .brand-mark{color:#2f2f2f}.dialog-body .notice{font-size:12px}.trend-dialog{border-radius:25px}.trend-dialog .dialog-body{padding:20px 26px 22px}.trend-dialog .dialog-head{background:#fff}.trend-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:23px}.trend-selector button{border:1px solid transparent;box-shadow:none;background:transparent;border-radius:16px;padding:13px 16px;text-align:left;min-width:0}.trend-selector button.selected{border-color:#e5e5e5;background:#f9f9f9;box-shadow:0 1px 4px #00000003}.trend-selector span{display:block;font-size:12px;font-weight:450;color:#888;margin-bottom:9px}.trend-selector strong{font-size:19px;font-weight:650;letter-spacing:-.3px}.trend-selector small{font-size:10px;color:#14a65b;margin-left:8px;white-space:nowrap}.popup-trend-heading{margin:0 0 15px}.popup-trend-heading h3{font-size:16px;font-weight:650;color:#303030;letter-spacing:-.2px;margin-bottom:5px}.popup-trend-heading>strong{font-size:27px;font-weight:650;letter-spacing:-.8px}.popup-trend-heading>span{font-size:12px;color:#15aa5a;margin-left:10px}.trend-dialog .comparison-graph{max-height:340px;min-height:200px}.trend-dialog .comparison-graph text{font-size:11px}.trend-dialog .comparison-legend{font-size:12px;margin:24px 0 18px;gap:24px}.trend-values{border-top:1px solid #f0f0f0;margin-top:16px;padding-top:11px;color:#999;font-size:11px}.trend-values summary{cursor:pointer}.trend-values table{margin-top:13px}.metric-detail-icon{font-style:normal;color:#a7a7a7;margin-left:7px;font-size:11px;font-weight:400;opacity:.5}.analytics-kpi:hover .metric-detail-icon{opacity:1}.analytics-kpi{border-radius:22px}.insight-card{border-radius:22px}.analytics-kpi.selected{border-color:#dedede;box-shadow:0 1px 5px #00000004;background:#fff}.trend-actions{display:flex;align-items:center;gap:5px}.trend-actions button{white-space:nowrap}.globe-tools>button{background:#ecefef;color:#66706e;border:1px solid transparent;position:relative;transition:box-shadow .15s,background .15s}.globe-tools>button:hover{background:#e0e6e5}.globe-tools>button.is-selected{box-shadow:0 0 0 3px #acd8ff;background:#e4ebec;border-color:#b9d4e7}.globe-tools>button:focus-visible{outline:3px solid #acd8ff;outline-offset:1px}
.hotspot-title{font:600 14px -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;fill:#c2f7ff}.hotspot-sub{font:10px -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;fill:#9cbfca}.dispatch-hud{margin:14px 4px 4px;border-radius:15px;background:#17303be8;box-shadow:0 5px 24px #163f4e12;border:1px solid #35677755;color:#d7f4ff;padding:15px 17px;backdrop-filter:blur(8px);position:relative;z-index:3}.dispatch-state{display:flex;align-items:center;gap:7px;border-bottom:1px solid #ffffff12;padding-bottom:10px;flex-wrap:wrap}.dispatch-state strong{font-size:12px;font-weight:550;letter-spacing:.2px}.dispatch-state>span:last-child{font-size:8px;letter-spacing:1px;color:#8baebc;margin-left:auto}.radar-dot{width:6px;height:6px;border-radius:50%;background:#58a8bb;box-shadow:0 0 0 3px #29b0cf16}.radar-dot.active{background:#25d5a1;box-shadow:0 0 0 3px #25d5a116,0 0 10px #25d5a180}.dispatch-counters{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:11px 0}.dispatch-counters small{font-size:9px;color:#95b7c5;display:block;margin-bottom:5px}.dispatch-counters b{display:block;font-size:17px;font-weight:500;letter-spacing:.4px}.dispatch-counters b em{font-size:10px;font-style:normal;color:#91b5c5}.dispatch-ranking{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff12;padding-top:10px;font-size:10px}.dispatch-ranking>span{color:#9bb9c5;font-size:9px}.dispatch-ranking strong{font-size:12px;color:#d0faff;font-weight:550}.dispatch-ranking>b{margin-left:auto;font-size:14px;font-weight:500;color:#6de1f2}.dispatch-legend{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-top:11px;font-size:8px;color:#8eaebc}.dispatch-legend span{display:flex;align-items:center;gap:4px}.dispatch-legend i{width:4px;height:4px;border-radius:50%;background:#19bedc}.dispatch-legend .current{background:#28cf9b}.globe-art{background:radial-gradient(ellipse at 54% 50%,#bfe9ed70,transparent 72%)}.globe-caption{z-index:2}.globe-zoom{z-index:2}.globe-label{font-size:14px}
@media(min-width:1100px){.analytics-page{max-width:none}.overview-stage,.live-stage{display:block;position:relative;isolation:isolate;overflow:hidden;min-height:1100px}.overview-stage .analytics-panels,.live-stage .analytics-panels{position:relative;width:40%;min-width:355px;z-index:2;padding-top:1px}.overview-stage .analytics-kpis,.live-stage .analytics-kpis{grid-template-columns:1fr 1fr}.overview-stage .globe-column,.live-stage .globe-column{position:absolute;top:0;right:0;width:78%;min-width:0;z-index:1}.globe-column .globe-tools{margin-left:43%;width:57%;padding:0 4px}.globe-column .globe-art{height:1120px;min-height:0;width:120%;margin:12px 0 0 0;aspect-ratio:auto;overflow:hidden}.globe-column .globe-art>svg{position:absolute;width:1200px;height:1200px;max-height:none;max-width:none;left:57%;top:0;transform:translateX(-50%)}.globe-column #globe-hud{margin-left:49%;margin-top:18px;position:absolute;top:38px;right:5px;width:45%;max-width:350px;z-index:4}.globe-column .dispatch-hud{margin:0;padding:13px 15px}.globe-column .dispatch-state>span:last-child{display:none}.globe-column .globe-caption{left:46%;bottom:40px}.globe-column .globe-zoom{right:19%;bottom:40px}.globe-column .globe-summary{margin-left:45%;padding:6px 0}.globe-column .stream-card{display:none}.globe-column .provenance{margin-left:45%;padding:10px 0}.globe-column:fullscreen{position:fixed;inset:0;width:100%;height:100%;padding:20px;background:#f4f8f9}.globe-column:fullscreen .globe-tools{width:60%;margin:0 auto}.globe-column:fullscreen #globe-hud{top:65px;left:20px;margin:0;width:280px}.globe-column:fullscreen .globe-art{height:calc(100vh - 100px);width:100%;margin:0}.globe-column:fullscreen .globe-art>svg{height:100%;width:100%;position:static;transform:none}.globe-column:fullscreen .globe-caption{left:20px}.globe-column:fullscreen .globe-zoom{right:20px}.globe-column:fullscreen .globe-summary{margin-left:0}.analytics-kpi svg{right:12px;width:37%}.analytics-kpi>span{font-size:12px}.analytics-kpi>small{font-size:9px}}
@media(min-width:1700px){.globe-column .globe-art{height:1360px}.globe-column .globe-art>svg{width:1480px;height:1480px}.overview-stage,.live-stage{min-height:1380px}.overview-stage .analytics-panels,.live-stage .analytics-panels{width:39%;max-width:640px}.dispatch-hud{padding:17px 20px}}
@media(max-width:1099px){.dispatch-hud{padding:12px 15px}.dispatch-state>span:last-child{display:none}.globe-column .globe-art{margin-top:5px}.analytics-kpi{padding:16px}.trend-selector{gap:4px}.trend-selector button{padding:12px}.trend-selector small{display:block;margin:4px 0 0}.dialog-body{padding:20px}}
@media(max-width:850px){.shop-dialog.wide,.shop-dialog.small,.shop-dialog{width:calc(100vw - 32px);max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);border-radius:20px}.dialog-head{padding:18px 20px}.dialog-foot{padding:13px 18px}.dialog-foot-note{font-size:10px;max-width:60%}.trend-dialog .dialog-body{padding:18px 20px}.trend-selector{grid-template-columns:repeat(4,minmax(0,1fr))}.trend-selector button{padding:10px 8px}.trend-selector strong{font-size:18px}.trend-selector span{font-size:11px}.trend-dialog .comparison-graph text{font-size:13px}.dispatch-hud{margin-bottom:6px}.dispatch-counters{padding:8px 0}.dispatch-ranking{padding-top:8px}.dispatch-counters b{font-size:16px}.trend-actions{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:550px){.shop-dialog{max-height:calc(100dvh - 24px);width:calc(100vw - 20px);max-width:calc(100vw - 20px)}.dialog-head h2{font-size:16px}.dialog-head p{font-size:11px}.dialog-body,.trend-dialog .dialog-body{padding:16px}.dialog-foot{flex-wrap:wrap}.dialog-foot-note{flex-basis:100%;max-width:none}.trend-selector{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:18px}.trend-selector button{padding:10px 12px}.trend-selector small{display:inline;margin-left:7px}.trend-dialog .comparison-legend{font-size:10px;gap:12px}.dialog-body .form-grid{gap:14px}.dispatch-state strong{font-size:11px}.dispatch-legend{font-size:7px}.dispatch-counters small{font-size:9px}.dispatch-ranking>span{font-size:8px}.metric-detail-icon{display:none}.comparison-graph{min-height:190px}.popup-trend-heading h3{font-size:15px}}
@keyframes surface-in{from{opacity:0;transform:translateY(7px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.shop-dialog[open]{animation:none}}

/* Neutral shared controls and modal surfaces, aligned with the homepage. */
:root{--surface-radius:18px;--control-radius:8px}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible{outline:2px solid #005bd3;outline-offset:3px}
button:disabled{cursor:default;opacity:.55}
button.primary{background:linear-gradient(#3c3c3c,#303030);border-color:#242424;color:#fff;box-shadow:inset 0 1px #ffffff20,0 1px 0 #0000001a}
button.primary:hover{background:#242424;border-color:#1a1a1a}
button.primary:active{background:#1a1a1a;box-shadow:inset 0 2px 2px #0003}
input,select,textarea{font-size:13px;border-color:#b5b5b5;border-radius:8px}
input:focus,select:focus,textarea:focus{outline:2px solid #005bd3;outline-offset:2px;border-color:#8a8a8a;box-shadow:none}
.shop-dialog{border:1px solid #dedede;border-radius:20px;box-shadow:0 24px 80px #00000026,0 0 1px #00000014;color:#303030}
.shop-dialog::backdrop{background:#00000035;backdrop-filter:blur(1px)}
.dialog-head{padding:18px 22px;background:#fafafa;border-bottom-color:#ebebeb}
.dialog-head h2{font-size:15px;font-weight:650;letter-spacing:-.2px}
.dialog-head p{font-size:11px;line-height:1.6;color:#8a8a8a}
.dialog-close{width:28px;height:28px;min-width:28px;border-radius:8px;color:#6d7175}
.dialog-close:hover{background:#ededed}
.dialog-body{padding:22px}
.dialog-foot{padding:12px 20px;background:#fafafa;border-top-color:#ebebeb}
.dialog-foot button{min-height:30px;font-size:12px}
.home-trend-popup .dialog-head{background:#fff}
.home-trend-popup .dialog-body{padding:22px 26px}
@media(max-width:700px){
 .shop-dialog,.shop-dialog.wide,.shop-dialog.small{width:calc(100vw - 24px);max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);border-radius:18px}
 .dialog-head{padding:15px 16px;gap:12px}.dialog-head h2{font-size:14px}.dialog-head p{font-size:10px}
 .dialog-body,.home-trend-popup .dialog-body{padding:16px}
 .dialog-foot{padding:10px 14px}
}
@media(prefers-reduced-motion:reduce){.shop-dialog[open]{animation:none}}

.variant-preview-action{margin-top:10px;display:flex;justify-content:flex-end}
.variant-email-preview{margin-top:12px}
.email-preview-subject{padding:12px 16px;background:#fafafa;border:1px solid #e3e3e3;border-bottom:0;border-radius:10px 10px 0 0;font-size:13px;font-weight:600;overflow-wrap:anywhere}
.email-preview-frame{display:block;width:100%;height:440px;background:#fff;border:1px solid #e3e3e3;border-radius:0 0 10px 10px}
.email-preview-note{margin:10px 0 14px}
.variant-email-preview .email-preview-frame{height:340px}
@media(max-width:700px){.email-preview-frame{height:46dvh;min-height:240px}.variant-email-preview .email-preview-frame{height:300px}}