/* Compact terminal frame: one market bar, one tool strip, aligned chart panes. */
:root{--line:#343b42;--muted:#939ca5;color:#c2c8cd;background:#181c20;font-size:11px}
.topbar{height:42px;padding:0 12px;gap:12px;background:#20252a;border-bottom-color:#383f46}
.brand{position:relative;display:block;width:114px;height:37px;flex:0 0 114px;margin-right:0}
.brand-lockup{display:block;width:100%;height:100%;mix-blend-mode:screen}
#brand-gem{position:absolute;left:0;top:0;width:24.92308%;height:100%;visibility:hidden;pointer-events:none}
#brand-gem canvas{display:block;width:100%;height:100%}
.brand[data-gem-state=ready] #brand-gem{visibility:visible}
.brand[data-gem-state=ready] .static-emblem{opacity:0}
.product-name{font-size:11px;font-weight:400;letter-spacing:1px;padding-right:12px;color:#9ba4ac;border-color:#414950}
.markets{gap:0;margin-left:0}.markets a{gap:5px;padding:0 13px;border-bottom-width:2px}
.markets a.active{background:#2b3239;border-bottom-color:#a5b5c1}.markets a:hover{background:#303840}
.markets b{font-size:12px;letter-spacing:.3px}.markets small{font-size:9px;color:#9ca8b1}.coin{width:17px;height:17px;font-size:13px}
.quote{min-width:210px;gap:5px;border-left:1px solid #414950;padding-left:14px;align-items:center}
.quote strong{font-size:17px;letter-spacing:0;font-variant-numeric:tabular-nums;color:#edf0f1}
.quote span{font-size:9px}.quote small{font-size:10px;margin-left:12px;color:#9ca7af;font-variant-numeric:tabular-nums}
.venue{font-size:10px;color:#abb2b9}.venue i{background:#76aa94;width:5px;height:5px;border-radius:50%}
.top-actions{gap:7px;align-items:center}.top-actions button{height:24px;padding:0 6px;display:flex;align-items:center;gap:5px}.top-actions button:last-child{border:0;border-radius:2px}
.toolbar{top:42px;height:32px;padding:0 10px;gap:10px;justify-content:flex-start;background:#252b30;border-color:#414950}
.group{gap:2px;height:23px}.group+.group{border-color:#434c55;padding-left:9px}
button{height:24px;border-radius:2px;padding:0 7px;transition:background .12s,color .12s}
button:hover{background:#3b444d;color:#f1f4f6}.range button{height:23px;padding:0 6px;font-size:10px;color:#b4bdc5}
.range button.selected{background:#343d44;color:#e8eeef;box-shadow:inset 0 -1px #90aaa8}
.tool-divider{height:13px;border-left:1px solid #4d565f;margin:0 4px}
#zoom-in,#zoom-out{font-size:15px;width:22px;padding:0}#fit-price{font-size:10px;color:#aebdc8;margin-left:3px}
.layers button{font-size:10px;padding:0 6px;gap:4px;color:#84919b}.layers button[aria-pressed=true]{color:#d1d6db}
.layers button:before{width:3px;height:3px;border-radius:1px}.layers button[aria-pressed=true]:before{background:#91aaad;border-color:#91aaad}
.appearance{margin-left:auto;gap:6px!important;color:#a8b1b8;font-size:10px}
.appearance label:not(:first-child){margin-left:7px}.appearance input{width:53px;height:16px;accent-color:#aab7be}
.heat-ramp{width:46px;height:5px;background:linear-gradient(90deg,#18242c,#15516b,#299bc0,#e9eddf,#fae02d,#ff2a14)}
#bubble-minimum{font-size:9px;color:#a4b0b8;font-variant-numeric:tabular-nums}
.view-actions{gap:3px}.view-actions button{font-size:10px;padding:0 7px;display:flex;align-items:center;gap:5px}.live-button{background:transparent!important;border-color:transparent!important;color:#b3c6bd!important;min-width:50px;justify-content:center}
.live-button.detached{background:transparent!important;border-color:transparent!important;color:#d6b47a!important}
.tool-icon{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.range button{display:inline-flex;align-items:center;justify-content:center;gap:3px}.coin{object-fit:contain;border-radius:50%;background:none}
.live-dot{width:5px;height:5px;background:#64b58b;border-radius:50%;flex:none}.detached .live-dot{background:#d6b47a}
input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;outline:none}input[type=range]::-webkit-slider-runnable-track{height:2px;background:#56666e;border:0}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;margin-top:-3px;width:8px;height:8px;background:#afc1c9;border:0;border-radius:50%}
footer{height:24px;padding:0 12px;background:#20252a;border-top:1px solid #3a434b;border-bottom:0;color:#9aa5ae;font-size:10px}
.legend{gap:12px}.legend i{width:4px;height:4px}.legend .separator{background:#454e56;height:10px}.hint{font-size:10px;color:#87949e}
.clock{font-size:10px;gap:7px}.clock button{height:20px;padding:0 4px;color:#aeb9c2}
.clock #feed-age{min-width:63px;font-variant-numeric:tabular-nums;color:#95b3a5}
#quality-label,.clock #feed-age.quality-warning{color:#d6b47a}
.popover{top:82px;right:12px;background:#262d33;border-color:#4c5761;box-shadow:0 12px 38px #0008;border-radius:5px;max-height:calc(100vh - 125px);overflow-y:auto}
.popover h2{font-size:14px;color:#e0e5e9}.popover p,.popover dd{font-size:11px;line-height:1.65;color:#abb7c0}
.popover dt{color:#dce2e7;font-size:11px}.popover select{background:#20262b;border-color:#4d5963;color:#c9d1d7}
#status{background:#181c20e8}#status strong{font-weight:500}.loading-mark{border-color:#3b454e;border-top-color:#a9bcc8}
@media(max-width:1320px){.topbar{gap:8px}.product-name{display:none}.quote{min-width:178px}.quote small{margin-left:6px}.toolbar{gap:5px;padding:0 7px}.group+.group{padding-left:6px}.layers button{padding:0 4px}.appearance{gap:4px!important}.appearance input{width:44px}.appearance .heat-ramp{width:32px}.hint{display:none}}
@media(max-width:1150px){.appearance .heat-ramp,.appearance label[for=heat],#heat{display:none}.quote small{display:none}.quote{min-width:140px}.brand{width:103px;flex-basis:103px;height:34px}.markets a{padding:0 10px}}
@media(max-width:1040px){.toolbar .appearance{display:flex}.appearance label[for=bubbles],#bubbles{display:none}.markets small{display:inline}.venue{display:none}.quote{margin-left:0}.legend{gap:8px}.clock button{display:none}}
@media(max-width:1150px){#quality-label:not([hidden])~span{display:none}footer:has(#quality-label:not([hidden])) #depth-label,footer:has(#quality-label:not([hidden])) .separator{display:none}}
@media(max-width:840px){.toolbar .appearance,.markets small,.top-actions span{display:none}.brand{width:96px;flex-basis:96px}.markets a{padding:0 7px}.quote{min-width:115px}.quote strong{font-size:15px}.legend{gap:6px}.clock{margin-left:auto}footer .legend>span:nth-child(-n+3){display:none}}
@media(prefers-reduced-motion:reduce){.brand[data-gem-state=ready] #brand-gem{visibility:hidden}.brand[data-gem-state=ready] .static-emblem{opacity:1}}

/* Shared chrome rhythm; chart palette and data geometry stay independent. */
:root{--line:#343e45;--muted:#91a0a9;--accent:#9abfb5}
.topbar{background:#1e2429;border-color:var(--line)}
.toolbar{background:#232a30;border-color:var(--line)}
.markets a{color:#aeb9c1;transition:background .12s,color .12s}
.markets a.active{background:#2a343b;border-bottom-color:var(--accent);color:#f0f3f4}
.markets a:hover{background:#2b353d}.markets small{color:#8d9da8;letter-spacing:.2px}
.quote{min-width:215px}.quote strong{min-width:103px;text-align:right;letter-spacing:-.2px}
.top-actions button,.view-actions button,.range button{color:#abb9c2}
.range button.selected{background:#303b43;box-shadow:inset 0 -1px var(--accent);color:#e8f2ee}
.layers button[aria-pressed=true]:before{background:var(--accent);border-color:var(--accent)}
.group+.group{border-color:var(--line)}.tool-divider{border-color:#45525b}
.live-button{color:#b1d6c2!important}.live-button.detached{color:#d6b47a!important}
input[type=range]:focus-visible{outline:1px solid #92b7b0;outline-offset:3px}
.popover{padding:17px 18px 18px;border:1px solid #44525c;border-radius:4px;background:#222a30;box-shadow:0 12px 36px #0006}
.popover-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;gap:16px}
.popover-head h2{margin:0;font-size:13px;letter-spacing:.3px;font-weight:600}
.popover-close{width:24px;padding:0;display:grid;place-items:center;color:#92a2ad}
.popover p{line-height:1.8;margin:8px 0 14px}.popover .setting-row{padding:12px 0;border-color:var(--line)}
.popover select{min-height:31px;border-radius:3px;background:#192127;border-color:#44545f;padding:5px 9px}
.popover .reset{height:30px;border-color:#4c626b;border-radius:3px;background:#2b373f;color:#d2e2e5}
.help{width:410px}.help dt{font-weight:600;padding-top:11px;margin-top:11px;border-top:1px solid var(--line)}
.help dd{margin:5px 0 10px;color:#a0b0ba;line-height:1.85}.help a{color:#9dcabd}
footer{background:#1e252b;border-color:var(--line)}.clock{color:#8b9aa5}
#status{inset:74px 0 24px;transform:none;border:0;border-radius:0;padding:24px;box-shadow:none;background:#181c20;justify-content:center;gap:11px}
#status strong{font-size:13px;letter-spacing:.3px;color:#d5e0e5}#status span{font-size:11px;color:#90a2af}
#status-retry{margin-top:8px;border:1px solid #465d69;padding:0 14px}
.loading-mark{width:18px;height:18px;border-width:1.5px;border-color:#34434c;border-top-color:#a4c8bc;margin-bottom:3px}
#history-state{position:fixed;z-index:6;top:85px;left:20px;display:flex;align-items:center;gap:7px;pointer-events:none;background:#202a31ee;border:1px solid #3d4e59;padding:6px 9px;border-radius:3px;font-size:10px;color:#b6c5cf}
.history-dot{width:4px;height:4px;border-radius:50%;background:#91b9af;animation:history-pulse 1s ease-in-out infinite}
@keyframes history-pulse{50%{opacity:.35}}
@media(max-width:1320px){.quote{min-width:190px}.quote strong{min-width:98px}}
@media(max-width:1150px){.quote{min-width:134px}.help{width:380px}}
@media(max-width:840px){.quote{min-width:118px}.quote strong{min-width:88px}.help{width:min(380px,calc(100vw - 24px))}}
@media(prefers-reduced-motion:reduce){.history-dot,.loading-mark{animation:none}button,.markets a{transition:none}}

/* Portrait is a guide over the same running terminal, never a second chart. */
#orientation-guide{display:none;position:fixed;inset:0;z-index:100;overflow:auto;overscroll-behavior:contain;background:#181c20;color:#e1e8ec;padding:32px 24px;align-items:center;justify-content:center;text-align:center}
.orientation-content{width:100%;max-width:340px;margin:auto}
.orientation-brand{display:flex;align-items:center;justify-content:center;gap:8px;color:#dbe4e8;font-size:17px;font-weight:650;letter-spacing:-.3px}
.orientation-brand img{object-fit:contain}.orientation-brand small{font-size:12px;font-weight:400;letter-spacing:1px;color:#91a0a9;margin-left:9px;padding-left:12px;border-left:1px solid #3b464e}
.orientation-illustration{width:144px;height:144px;display:block;margin:36px auto 22px}
.orientation-phone{stroke:#c3d5db}.orientation-arrow{stroke:#8bb8aa}
#orientation-title{font-size:21px;line-height:1.5;letter-spacing:1px;font-weight:550;margin:0 0 10px;outline:none}
#orientation-description{font-size:14px;line-height:1.8;margin:0;color:#a9b8c1}
#orientation-help{font-size:12px;line-height:1.9;margin:38px 0 0;color:#81919d}
@media (hover:none) and (pointer:coarse) and (max-width:600px) and (orientation:portrait){#orientation-guide{display:flex}}
@media (hover:none) and (pointer:coarse) and (orientation:landscape) and (max-height:600px){
  .toolbar{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}
  .toolbar .group{flex-shrink:0}.toolbar button{min-height:28px;touch-action:manipulation}
  .topbar{gap:8px}.top-actions{display:flex;margin-left:auto;flex-shrink:0}.markets .coin{display:block}
  .popover{max-height:calc(100dvh - 106px);overscroll-behavior:contain}
}

/* Explicit test link only: ?mobile=portrait. The production desktop shell stays unchanged. */
.mobile-portrait{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--line:#303940;touch-action:manipulation;overscroll-behavior:none}
.mobile-portrait #orientation-guide{display:none!important}
.mobile-portrait .topbar{height:calc(136px + var(--safe-top));padding:var(--safe-top) 12px 0;display:block;background:#20252a;overflow:hidden}
.mobile-portrait .brand{position:absolute;top:var(--safe-top);left:11px;width:103px;height:43px;min-width:0}
.mobile-portrait .product-name{position:absolute;display:block;top:calc(15px + var(--safe-top));left:127px;padding:0 0 0 10px;border-left:1px solid #414950;border-right:0;font-size:11px;letter-spacing:0}
.mobile-portrait .top-actions{display:flex;position:absolute;right:8px;top:var(--safe-top);height:44px;gap:4px;margin:0}
.mobile-portrait .top-actions button{height:40px;width:38px;padding:8px}
.mobile-portrait .mobile-preview-badge{display:block;font-size:9px;color:#b5a486}
.mobile-portrait .top-actions svg,#mobile-nav svg,#mobile-sheet-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.mobile-portrait .markets{position:absolute;top:calc(44px + var(--safe-top));left:0;right:0;height:44px;border-block:1px solid var(--line);display:flex;gap:0;margin:0}
.mobile-portrait .markets a{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;padding:0 6px;gap:5px;height:44px}
.mobile-portrait .markets a.active{background:#293638;border-bottom-color:#92b5a6}
.mobile-portrait .markets .coin,.mobile-portrait .markets small{display:block}.mobile-portrait .markets small{font-size:9px}.mobile-portrait .markets b{font-size:13px}
.mobile-portrait .quote{position:absolute;top:calc(88px + var(--safe-top));left:0;right:0;height:48px;padding:0 12px;display:flex;align-items:center;gap:5px;border:0;margin:0;min-width:0;background:#181c20}
.mobile-portrait .quote strong{font-size:23px;min-width:0;letter-spacing:-.5px}.mobile-portrait .quote>span{display:block;font-size:9px;color:#8597a2}
.mobile-portrait #spread,.mobile-portrait .venue{display:none}
#mobile-feed{margin-left:auto;text-align:right;display:flex;flex-direction:column;gap:4px}
#mobile-feed #mobile-feed-state{display:block;font-size:10px;color:#a5bcb2}
#mobile-feed #mobile-history-state{display:block;font-size:9px;color:#80929c;margin:0;max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mobile-feed .quality-warning{color:#d7ac72!important}
.mobile-portrait .toolbar{top:auto;bottom:calc(57px + var(--safe-bottom));height:43px;padding:0 5px;border-top:1px solid var(--line);border-bottom:0;background:#20262b;display:flex;overflow:hidden}
.mobile-portrait .toolbar .range{height:43px;width:100%;padding:0;display:flex;gap:0}
.mobile-portrait .range button{height:42px;flex:1;min-width:0;font-size:12px;padding:0}
.mobile-portrait .range #fit-price{flex:1.2;border-left:1px solid var(--line);margin:0;display:flex;align-items:center;justify-content:center;gap:3px}
.mobile-portrait #zoom-in,.mobile-portrait #zoom-out,.mobile-portrait .tool-divider,.mobile-portrait .toolbar .view-actions{display:none}
.mobile-portrait footer{display:none}
#mobile-nav{position:fixed;inset:auto 0 0;height:calc(57px + var(--safe-bottom));padding:2px 5px var(--safe-bottom);display:flex;gap:0;z-index:9;border-top:1px solid var(--line);background:#20282e}
#mobile-nav button{height:54px;flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;border:0;border-radius:0;background:none;padding:0 2px;font-size:10px;color:#9bacb8;min-width:0}
#mobile-nav #live{color:#a3cebc}#mobile-nav #live.detached{color:#dab277}#mobile-nav #pause[aria-pressed=true]{color:#dab277}
#mobile-nav button:focus-visible{outline:1px solid #98b9aa;outline-offset:-3px}
#mobile-nav button:hover{background:#2b363c}
#mobile-touch{position:fixed;left:0;right:0;z-index:3;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline:0}
#mobile-cvd-handle{position:fixed;left:8px;right:58px;height:24px;z-index:4;touch-action:none;cursor:ns-resize;background:none;border:0;padding:0}
#mobile-cvd-handle:after{content:'';position:absolute;width:30px;height:3px;top:8px;left:calc(50% - 15px);background:#5b6c71;border-radius:3px}
#mobile-inspection{position:fixed;left:12px;z-index:5;pointer-events:none;max-width:calc(100vw - 72px);padding:9px 12px;border:1px solid #46565f;border-radius:4px;background:#202a31f2;color:#d8e5e6;font-size:11px;line-height:1.8}
#mobile-inspection small{display:block;color:#91a4b0;font-size:10px}
#mobile-cross-x,#mobile-cross-y{position:fixed;z-index:4;pointer-events:none}#mobile-cross-x{border-left:1px dashed #bdc9cf66}#mobile-cross-y{border-top:1px dashed #bdc9cf66}
#mobile-scrim{position:fixed;inset:0;z-index:20;background:#050a103d}
#mobile-sheet{position:fixed;inset:auto 0 0;z-index:21;height:49dvh;min-height:280px;max-height:85dvh;background:#20282e;border:1px solid #47545d;border-radius:15px 15px 0 0;box-shadow:0 -12px 40px #0006;display:flex;flex-direction:column;padding-bottom:var(--safe-bottom);color:#cad5db}
#mobile-sheet-grip{height:24px;flex-shrink:0;position:relative;touch-action:none;cursor:grab}#mobile-sheet-grip:after{content:'';position:absolute;top:9px;left:calc(50% - 16px);height:3px;width:32px;border-radius:3px;background:#687a85}
#mobile-sheet header{display:flex;align-items:center;justify-content:space-between;padding:0 12px 10px;flex-shrink:0}#mobile-sheet h2{font-size:15px;font-weight:500;margin:0 0 4px}#mobile-sheet-state{font-size:10px;color:#93a5ae;margin:0}
#mobile-sheet-close{width:40px;height:40px;display:grid;place-items:center;background:transparent;border:0}
#mobile-sheet-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 13px 20px;font-size:12px;font-variant-numeric:tabular-nums;line-height:1.5}
.mobile-book-head,.mobile-book-row{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:6px}
.mobile-book-head,.mobile-trade-head{position:sticky;top:0;background:#20282e;padding:8px 0;z-index:1;border-bottom:1px solid #38444b;color:#8da3af;font-size:10px}
.mobile-book-row{height:26px}.mobile-book-row>span{height:23px;line-height:23px;isolation:isolate;position:relative}.mobile-book-row>span:nth-child(2),.mobile-book-head>span:nth-child(2){text-align:center}.mobile-book-row>span:last-child,.mobile-book-head>span:last-child{text-align:right}
.mobile-book-row .buy:before,.mobile-book-row .sell:before{content:'';position:absolute;inset:0 auto 0 0;width:var(--bar);background:#38b18824;z-index:-1}.mobile-book-row .sell:before{inset:0 0 0 auto;background:#e6716925}
.mobile-book-mid{padding:7px 0;border-block:1px solid #3a484f;margin:4px 0;text-align:center;font-size:17px;color:#d8e8e1}.mobile-book-mid small{font-size:10px;color:#92a4af;margin-left:8px}
.mobile-trade-head,.mobile-trade-row{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:5px;text-align:right}.mobile-trade-head>span:first-child,.mobile-trade-row>span:first-child{text-align:left;color:#8fa4b0}.mobile-trade-row{height:29px;align-items:center}
.mobile-portrait .buy{color:#39c68e}.mobile-portrait .sell{color:#e7776d}
.mobile-portrait .popover{inset:auto 0 0;width:100%;max-height:78dvh;margin:0;padding:18px 16px calc(18px + var(--safe-bottom));border-radius:14px 14px 0 0;background:#20282e;overflow-y:auto;overscroll-behavior:contain;font-size:12px}
.mobile-portrait .popover::backdrop{background:#050a1055}
.mobile-portrait .popover button,.mobile-portrait .popover select{min-height:42px}.mobile-portrait .popover-close{min-width:40px}
.mobile-portrait #settings .layers{display:flex;gap:6px;height:auto;border:0;padding:8px 0}.mobile-portrait #settings .layers button{flex:1;font-size:12px;justify-content:center;background:#273339}
.mobile-portrait #settings .appearance{display:grid;grid-template-columns:43px 1fr 100px;height:auto;margin:0;border:0;padding:12px 0;gap:10px!important;font-size:11px}
.mobile-portrait #settings .appearance input{display:block;min-height:42px;width:100%;margin:0}.mobile-portrait #settings .appearance label{display:block;margin:0}.mobile-portrait #settings .appearance .heat-ramp{display:block;width:100%}
.mobile-portrait #status{max-width:calc(100vw - 36px);min-width:230px;padding:22px 15px;z-index:12}.mobile-portrait #status span{text-align:center;line-height:1.8}
.mobile-portrait #history-state{top:calc(140px + var(--safe-top));left:auto;right:78px;transform:none;font-size:9px;pointer-events:none;z-index:5;max-width:150px;padding:3px 6px;border:0;background:#20282ebf}
.mobile-portrait #context-warning{top:calc(148px + var(--safe-top));z-index:15;width:calc(100vw - 28px)}
#context-entry-status{font-size:11px;color:var(--muted);line-height:1.5}
.mobile-portrait #context-entry-status{position:fixed;top:calc(140px + var(--safe-top));left:12px;right:72px;z-index:5;padding:3px 6px;background:#20282eef;color:#bdcbd3;font-size:10px;pointer-events:none}
@media(max-height:650px){.mobile-portrait .topbar{height:calc(124px + var(--safe-top))}.mobile-portrait .quote{height:36px}.mobile-portrait .quote strong{font-size:20px}}

#depth-label[hidden],#history-label[hidden],#feed-age[hidden]{display:none}
.orderflow-account-wall{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:rgb(0 0 0 / 45%)}
.orderflow-account-wall iframe{width:min(480px,100%);height:100%;max-height:900px;border:0;background:var(--fl-surface,#fff)}
