/* WatcherX shared Studio design. Trading states and chart interactions retain their semantics. */
:root{--toolbar-height:64px;--terminal-toolbar-height:52px;--workspace-top:calc(var(--toolbar-height) + var(--terminal-toolbar-height));--background:#101012;--panel:#17171a;--panel-soft:#1d1d22;--border:#2d2d34;--muted:#9696a1;--text:#c8c8d1;--text-strong:#ededf2;--studio-ui:Inter,"Segoe UI",Arial,sans-serif}
body{font-family:var(--studio-ui)}
.toolbar{height:var(--toolbar-height);gap:18px;padding:0 22px;background:#121214;border-bottom:1px solid #2a2a31;box-shadow:none;isolation:auto}
.toolbar::after{display:none}
.brand{width:162px;flex-basis:162px;border-right:0;padding-right:12px;gap:10px;font-size:13px;letter-spacing:1.3px}
.brand-mark{width:32px;height:32px;flex-basis:32px;filter:none}
.brand-wordmark{font-family:"JetBrains Mono Slashed",monospace}
.site-nav{height:100%;display:flex;align-items:center;gap:5px;flex-shrink:0}
.site-nav a{display:flex;align-items:center;height:36px;padding:0 14px;border:1px solid transparent;border-radius:7px;font-size:12px;font-weight:500;color:#9a9aa6;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.site-nav a:hover{background:#212127;color:#e4e4eb}
.site-nav a[aria-current=page]{background:#192e23;border-color:#294c39;color:#83dfae}
.toolbar-spacer{min-width:0;flex:1}
.account-button,.signal-sound-button{width:34px;min-width:34px;height:34px;border:1px solid #34343c;border-radius:8px;background:#1c1c21;box-shadow:none;color:#a2a2ae}
.account-button{order:5}.signal-sound-button{order:4}.active-position-shell{order:3}.search-shell{order:2}.connection-dot{order:3}
.account-avatar{border-radius:7px}.account-button.authenticated .account-avatar{border-radius:7px}
.account-button:hover,.signal-sound-button:hover{background:#25252b;border-color:#4a4a54}
body.account-view .toolbar .search-shell{visibility:hidden;pointer-events:none}
.toolbar .search-shell{position:relative;width:200px;flex:0 0 200px;margin:0;height:36px}
.toolbar .search-box{position:relative;inset:auto;width:100%;height:36px;min-width:0;border:1px solid #36363f;border-radius:8px;background:#1b1b20;padding:0 11px;box-shadow:none;color:#93939f;display:flex;align-items:center;gap:9px}
.toolbar .search-box input{width:100%;min-width:0;font-family:var(--studio-ui);font-size:12px;color:#ededf1;text-transform:none}
.toolbar .search-box input::placeholder{color:#9696a1}
.toolbar .search-shell.open{width:200px;flex-basis:200px}
.toolbar .search-shell.open .search-box{width:100%;border-color:#557764;background:#1d2520}
.toolbar .search-suggestions{top:44px;right:0;left:auto;width:320px;max-height:min(70dvh,500px);overflow-y:auto;border:1px solid #3a3a43;border-radius:10px;background:#1a1a1f;box-shadow:0 16px 40px #0008;padding:6px}
.search-suggestion{min-height:48px;border-radius:6px;padding:10px}.search-suggestion.active,.search-suggestion:hover{background:#27352d}.search-suggestion-symbol strong{font-size:12px}.search-suggestion-symbol small{font-size:9px;color:#9b9ba6}.search-suggestion-volume{font-size:11px}.search-suggestion-status{font-family:var(--studio-ui);padding:20px;font-size:11px;color:#aaaab5}
.terminal-toolbar{height:var(--terminal-toolbar-height);padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #26262d;background:#101012;position:relative;z-index:35}
.terminal-heading{display:flex;align-items:center;gap:16px;min-width:0}.terminal-heading h1{font-family:var(--studio-ui);font-size:15px;font-weight:550;color:#e1e1e8;letter-spacing:-.2px;margin:0}.terminal-heading>span{font-size:10px;color:#8f8f9c;border-left:1px solid #36363f;padding-left:16px}
.terminal-timeframes{display:flex;align-items:center;gap:13px}.terminal-timeframes>span{font-size:10px;color:#9595a0}
.terminal-toolbar .interval-group{height:32px;background:#1b1b20;border:1px solid #303039;border-radius:7px;padding:2px;gap:2px;box-shadow:none}
.terminal-toolbar .interval-group .tool{height:26px;min-width:34px;padding:0 8px;font-family:var(--studio-ui);font-size:10px;font-weight:550;border-radius:4px;color:#a2a2ad;background:transparent}
.terminal-toolbar .interval-group .tool.active{background:#2b4133;color:#a4efc3;box-shadow:none}.terminal-toolbar .interval-group .tool:hover{color:#ececf1;background:#2a2a31}
body.account-view .terminal-toolbar{display:none}
.workspace{height:calc(100dvh - var(--workspace-top));padding:12px;gap:12px;grid-template-columns:minmax(0,1fr) 340px 34px;background:#101012}
.chart-grid{background:transparent;gap:10px;grid-template-rows:repeat(3,minmax(0,1fr))}
.chart-card{grid-template-rows:38px minmax(0,1fr);background:#17171a;border:1px solid #303038;border-radius:9px;box-shadow:none}
.chart-card.active{border-color:#52765f;box-shadow:0 0 0 1px #345240}
.chart-card.active .chart-header{background:#1c2a22}
.chart-header{background:#1b1b20;border-bottom:1px solid #2c2c34;font-family:var(--studio-ui);padding:0 10px;gap:8px;color:#a3a3ae}
.chart-symbol{font-family:var(--studio-ui);font-size:12px;font-weight:600;letter-spacing:.1px;color:#e9e9ef}
.chart-token-icon{width:18px;height:18px;flex-basis:18px}.chart-token-icon img{width:18px;height:18px}
.chart-metric-chip{border-radius:4px;font-family:var(--studio-ui);border-color:transparent;background:transparent}
.chart-metric-chip b{font-weight:500}.chart-controls{gap:4px}.chart-controls button{border-radius:5px;background:transparent;color:#a2a2af}.chart-controls button:hover{background:#313139;color:#eeeeF2}.chart-pin-button.pinned{color:#87d6a8;background:#293d30}
.chart-card.expanded{inset:calc(var(--workspace-top) + 8px) 56px 12px 12px;border-radius:11px;border:1px solid #44444e;grid-template-rows:44px minmax(0,1fr);box-shadow:0 20px 65px #0009}
.chart-card.expanded .chart-header{padding:0 16px}.chart-card.expanded .chart-symbol{font-size:16px}.chart-card.expanded .chart-token-icon,.chart-card.expanded .chart-token-icon img{width:23px;height:23px}.chart-card.expanded .chart-token-icon{flex-basis:23px}
.window-backdrop{inset:var(--workspace-top) 0 0;background:#08090bb8;backdrop-filter:blur(3px)}
.side-panel{background:#17171a;border:1px solid #303038;border-radius:10px;overflow:hidden;min-height:0;display:flex;flex-direction:column}
.side-tabs{height:48px;flex:0 0 48px;align-items:center;gap:7px;padding:0 12px;background:#1b1b20;border-bottom:1px solid #303038}
.side-tab{height:30px;border:1px solid transparent;border-radius:6px;padding:0 12px;font-family:var(--studio-ui);font-size:11px;font-weight:500;letter-spacing:0;color:#9c9ca8}
.side-tab.active,.side-tab.tape-tab.active{background:#25382c;border-color:#304c3b;color:#94e2b5}.side-tab:hover{background:#28282f}
.coins-panel{flex:1;min-height:0;display:flex;flex-direction:column}.panel-title{height:42px;flex:0 0 42px;padding:0 14px;font-family:var(--studio-ui);font-size:12px;font-weight:550;letter-spacing:0;color:#d8d8e1}.panel-title .muted{font-size:10px;color:#898997}.coin-header{height:43px;flex:0 0 43px;background:#17171a;border-bottom:1px solid #2b2b33;color:#93939f;font-family:var(--studio-ui);font-size:8px;line-height:1.5}
.coin-sort-button{font-family:var(--studio-ui);font-size:8px;line-height:1.5;color:#93939f}.coin-sort-button.active{color:#a4dfbb}.coin-row{height:34px;font-family:var(--studio-ui);font-size:10px;border-bottom:1px solid #212127;color:#bdbdc8;font-variant-numeric:tabular-nums}.coin-row:hover{background:#23272a}.coin-row.active{background:#22372b;box-shadow:inset 2px 0 #5ab881}.coin-symbol{font-weight:550;color:#dfdfe7}.coin-list{height:auto;min-height:0;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#393943 transparent}
.tape-panel{min-height:0;flex:1;overflow:auto}.tape-header,.tape-context,.tape-legend{font-family:var(--studio-ui)}.tape-context{font-size:10px;line-height:1.6;color:#9696a3}.tape-legend{font-size:9px;color:#93939d}.tape-row{font-family:var(--studio-ui);border-bottom-color:#28282f}.tape-row:hover{background:#23282a}
.right-rail{border:0;background:transparent;padding:0;gap:8px;align-items:center}.rail-button{min-width:32px;width:32px;height:34px;border:1px solid #303038;border-radius:7px;background:#1b1b20;color:#a0a0ad}.rail-button.active{background:#25392d;border-color:#3a5844;color:#a4dcb7}.rail-button:hover{background:#2b2b32;color:#eeeef3}
.drawing-toolbar{background:#1e1e24;border-color:#3a3a43;border-radius:8px;box-shadow:0 8px 24px #0005}.drawing-toolbar button{border-radius:5px}.drawing-toolbar button:hover{background:#33333c}.toast{font-family:var(--studio-ui);border:1px solid #3b3b45;border-radius:8px;background:#23232a;color:#ededf2}.signal-toast{border-radius:10px;font-family:var(--studio-ui)}
.loading-overlay{background:#101012}.loading-overlay::before{opacity:.012}.loading-brand-mark>span{background:linear-gradient(90deg,transparent,#385441)}.loading-status{border-color:#314238;color:#98cba9;background:#18251e}.loading-progress{background:#253329}.loading-progress::after{background:#00c875}
button:focus-visible,a:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:2px solid #69c997;outline-offset:2px}
@media(min-width:1700px){.workspace{grid-template-columns:minmax(0,1fr) 370px 34px;padding:16px;gap:14px}.chart-grid{gap:12px}.chart-card{grid-template-rows:42px minmax(0,1fr)}}
@media(max-width:1250px){.toolbar{gap:10px;padding:0 15px}.brand{width:146px;flex-basis:146px}.site-nav a{padding:0 11px;font-size:11px}.toolbar .search-shell,.toolbar .search-shell.open{width:170px;flex-basis:170px}.workspace{grid-template-columns:minmax(0,1fr) 315px 32px;gap:9px;padding:10px}.chart-grid{gap:8px}.chart-header{gap:5px;padding:0 7px}.chart-card:not(.expanded) .chart-metric-chip{padding:0 2px}.chart-card.expanded{inset:calc(var(--workspace-top) + 7px) 51px 10px 10px}}
@media(min-width:721px) and (max-width:1100px){.chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,minmax(200px,1fr));overflow-y:auto}.chart-card:last-child{grid-column:1/-1}.toolbar .search-shell,.toolbar .search-shell.open{width:145px;flex-basis:145px}.site-nav a{padding:0 9px;font-size:10px}.brand{width:128px;flex-basis:128px;font-size:11px}.brand-mark{width:28px;height:28px;flex-basis:28px}.toolbar{gap:8px}}
@media(min-width:721px) and (max-width:900px){.brand{width:37px;flex-basis:37px;padding-right:0}.brand-wordmark{display:none}.signal-sound-button{display:none}.workspace{grid-template-columns:minmax(0,1fr) 295px 30px}}
@media(max-width:720px){:root{--toolbar-height:100px;--terminal-toolbar-height:52px}.toolbar{height:var(--toolbar-height);padding:0 16px;display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:56px 44px;gap:0 10px}.brand{grid-column:1;grid-row:1;width:auto;flex-basis:auto;height:56px;border:0;font-size:12px;gap:8px;padding:0}.brand-mark{width:28px;height:28px;flex-basis:28px}.brand-wordmark{display:inline}.toolbar-spacer{display:none!important}.site-nav{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;width:100%;height:44px;align-items:start}.site-nav a{justify-content:center;font-size:11px;padding:0 5px;height:33px}.signal-sound-button{grid-row:1;grid-column:3;display:grid;height:32px;width:32px;min-width:32px}.account-button{grid-row:1;grid-column:4;width:32px;height:32px;min-width:32px}.toolbar .search-shell{display:none}.toolbar .active-position-shell{grid-column:2;grid-row:1;justify-self:end;margin-right:0}.toolbar .connection-dot{display:none}body.has-live-position .brand{width:29px;padding:0}body.has-live-position .brand-wordmark{display:none}.terminal-toolbar{padding:0 16px;gap:10px}.terminal-heading h1{font-size:12px}.terminal-heading>span,.terminal-timeframes>span{display:none}.terminal-toolbar .interval-group{display:flex!important;visibility:visible;height:30px;flex:0 0 auto}.terminal-toolbar .interval-group .tool{min-width:29px;width:29px;flex:0 0 29px;height:24px;font-size:9px;padding:0}.workspace{height:calc(100dvh - var(--workspace-top));display:block;padding:0 10px 10px}.chart-grid,.right-rail{display:none}.side-panel{width:100%;height:100%;border:1px solid #303038;border-radius:9px}.side-tabs{height:46px;flex-basis:46px;padding:0 10px}.side-tab{font-size:11px;padding:0 12px}.panel-title{height:40px;flex-basis:40px;padding:0 12px;font-size:12px}.mobile-coin-search{margin:0 10px;height:40px;flex:0 0 40px;border:1px solid #3b3b44;border-radius:7px;background:#202026;padding:0 11px;color:#9595a1}.mobile-coin-search input{font-family:var(--studio-ui);font-size:12px;text-transform:none;color:#e5e5ec}.mobile-coin-search input::placeholder{color:#a0a0ac}.coin-header{height:43px;flex-basis:43px;margin-top:8px}.coin-header,.coin-row{grid-template-columns:minmax(58px,1fr) 43px 39px 37px 42px 40px;gap:3px;padding:0 9px}.coin-row{height:38px;font-size:10px}.coin-sort-button{font-size:7px}.coin-list{height:auto;flex:1;padding-bottom:env(safe-area-inset-bottom)}.chart-card.expanded,.chart-card.coin-preview{inset:var(--workspace-top) 0 env(safe-area-inset-bottom) 0;border:0;border-top:1px solid #383840;border-radius:0;display:grid;grid-template-rows:44px minmax(0,1fr)}.chart-card.expanded .chart-header{padding:0 10px}.chart-card.expanded .chart-symbol{font-size:14px}.window-backdrop{inset:var(--workspace-top) 0 0}.account-studio .account-page-nav{top:0}.account-studio .account-page-shell{min-height:100%}.active-position-menu{top:56px}.loading-wordmark{font-size:29px}}
@media(max-width:370px){.toolbar{padding:0 10px;gap:0 7px}.site-nav a{font-size:10px}.terminal-toolbar{padding:0 10px;gap:6px}.terminal-toolbar .interval-group .tool{min-width:26px;width:26px;flex-basis:26px}.coin-header,.coin-row{grid-template-columns:minmax(48px,1fr) 40px 34px 34px 38px 36px;padding:0 6px;gap:2px}}
@media(prefers-reduced-motion:reduce){.site-nav a{transition:none}}
.toolbar .search-shell,.toolbar .search-shell.open{top:auto;left:auto;opacity:1;visibility:visible;pointer-events:auto;transform:none;transition:none}body.account-view .toolbar .search-shell{visibility:hidden;pointer-events:none}

