/* Confirmed family geometry. Radius follows role/scale; continuous corners,
   not one fixed rounded rectangle applied to every container. */
:root{--cf-gutter:32px;--cf-control:#ececec;--cf-popup:#f7f7f7;--cf-popup-line:#00000017;--cf-shadow:#0000001a;--cf-nav-selected:#e4e4e4;--cf-nav-active:#242424}
:root[data-theme="dark"]{--cf-control:#192128;--cf-popup:#293139ed;--cf-popup-line:#ffffff0a;--cf-shadow:#00000040;--cf-nav-selected:#2b343d;--cf-nav-active:#f2f4f6}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:1px solid var(--oc-accent);outline-offset:3px}
html{scrollbar-gutter:stable}.site-header{height:auto;border-bottom:1px solid var(--oc-line)}.site-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;min-height:64px;padding:0 var(--cf-gutter)}.site-brand{display:flex;align-items:center;justify-self:start;width:auto;height:auto;margin-left:-12px}.site-brand img{position:static;left:auto;top:auto;width:auto;height:34px}.site-brand .logo-night{display:none}:root[data-theme="dark"] .site-brand .logo-night{display:block}:root[data-theme="dark"] .site-brand .logo-day{display:none}.site-links{position:static;left:auto;right:auto;bottom:auto;transform:none;justify-self:center;display:flex;align-items:center;gap:4px;max-width:100%;overflow-x:auto;scrollbar-width:none}.site-links a,.site-links span{padding:7px 12px;line-height:20px;font-size:13px;font-weight:500;border-radius:10px;corner-shape:squircle}.site-links [aria-current]{background:var(--cf-nav-selected);color:var(--cf-nav-active)}.site-theme{justify-self:end;width:30px;height:30px;border-radius:10px;corner-shape:squircle;background:var(--cf-control)}.site-theme svg{width:17px;height:17px}
#app.oc-app{padding-left:var(--cf-gutter)!important;padding-right:var(--cf-gutter)!important}.demo-notice{padding-left:var(--cf-gutter);padding-right:var(--cf-gutter)}.oc-pagehead{padding-top:18px!important}.oc-search-wrap{flex-basis:320px!important;width:320px!important;overflow:visible!important}.oc-search{height:32px!important;border-radius:10px!important;corner-shape:squircle;padding:0 11px!important}.oc-radar-page .oc-search:focus{background:var(--selected)!important;outline:0!important;outline-offset:0!important;box-shadow:inset 0 0 0 1px var(--oc-accent)!important}
/* Suggestions use the same matching/keyboard contract as One-AMV. */
.oc-radar-page .oc-search-results,.oc-radar-page .oc-search-empty{position:fixed!important;bottom:auto;max-width:calc(100vw - 24px);overflow-y:auto;overscroll-behavior:contain;background:var(--cf-popup)!important;border:1px solid var(--cf-popup-line)!important;border-radius:12px!important;corner-shape:squircle;box-shadow:0 6px 16px -6px var(--cf-shadow)!important;backdrop-filter:blur(16px);z-index:60001!important;text-align:left;scrollbar-width:thin;padding:4px!important}.oc-search-result{padding:8px 6px!important;min-height:36px;text-align:left;border-radius:8px!important;corner-shape:squircle;outline:0!important;background:transparent!important}.oc-radar-page .oc-search-result{border:0!important;box-shadow:none!important}.oc-search-result.search-active{background:var(--selected)!important;color:var(--oc-ink)!important}.oc-search-name{font-weight:500!important}.oc-search-code,.oc-search-type{font-size:11px!important;color:var(--oc-muted)!important}.oc-radar-page .oc-search-empty{padding:10px!important;font-size:13px!important}
/* Condition groups and actions share the family states, not arbitrary pills. */
.oc-tab,.oc-export,.mirror-calendar-button,.modal-action,.modal-close,.detail-tab,.similar-item{corner-shape:squircle}.oc-tab{min-height:28px!important;height:28px!important;padding:4px 9px!important;border-radius:8px!important;font-size:12px!important}.oc-export{height:30px!important;padding:4px 10px!important;border-radius:10px!important;font-weight:400!important}.desktop-mirror,.oc-rank-controls,.mobile-radar-only>div{corner-shape:squircle}.mirror-bar{corner-shape:squircle}.native-date-binding{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;padding:0!important;clip-path:inset(50%)}
.oc-date{display:flex!important;align-items:center;gap:8px!important;position:relative}#cashflow-date-trigger{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 8px;border:0;border-radius:11px;corner-shape:squircle;background:var(--field);color:var(--oc-text);font-size:12px;font-variant-numeric:tabular-nums}#cashflow-date-trigger svg{width:14px;height:14px;color:var(--oc-muted)}#cashflow-date-trigger:hover,#cashflow-date-trigger[aria-expanded="true"]{background:var(--selected)}
#cashflow-calendar{position:fixed;width:292px;max-width:calc(100vw - 24px);padding:12px;background:var(--cf-popup);color:var(--oc-text);border:1px solid var(--cf-popup-line);border-radius:15px;corner-shape:squircle;box-shadow:0 0 18px var(--cf-shadow);backdrop-filter:blur(16px);z-index:60000}#cashflow-calendar[hidden]{display:none}.cf-calendar-head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:10px}.cf-calendar-head button{width:26px;height:26px;display:grid;place-items:center;border:0;border-radius:8px;corner-shape:squircle;background:var(--field);color:var(--oc-text)}.cf-calendar-head button svg{width:14px;height:14px}.cf-calendar-head input,.cf-calendar-head select{background:var(--field);color:var(--oc-text);height:28px;border:0;border-radius:7px;corner-shape:squircle;padding:2px 5px;font-size:12px}.cf-calendar-head input{width:70px}.cf-calendar-head select{width:62px}.cf-calendar-week,.cf-calendar-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}.cf-calendar-week span{text-align:center;line-height:26px;font-size:11px;color:var(--oc-muted)}.cf-calendar-days button{height:30px;min-width:0;padding:0;border:0;background:transparent;color:var(--oc-text);font-size:12px;border-radius:6px;corner-shape:squircle}.cf-calendar-days button:hover:not(:disabled):not([aria-selected="true"]){background:var(--field)}.cf-calendar-days button[aria-selected="true"]{background:var(--selected);color:var(--oc-ink);font-weight:600}.cf-calendar-days button:disabled{opacity:.28}.cf-calendar-foot{margin-top:10px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--oc-muted)}.cf-calendar-foot button{padding:4px 7px;border:0;background:transparent;color:var(--oc-text);border-radius:7px;corner-shape:squircle}.cf-calendar-foot button:hover{background:var(--field)}
/* A readable, height-budgeted detail workspace. Default desktop content fits;
   overflow remains available for small screens, expanded explanations or zoom. */
.modal-overlay{padding:20px!important;animation:none!important}.modal-content.detail-dialog{width:min(1180px,calc(100vw - 40px))!important;max-width:1180px!important;max-height:calc(100dvh - 40px)!important;border:1px solid var(--oc-line)!important;border-radius:16px!important;corner-shape:squircle;overflow:hidden;animation:cashflow-enter 160ms ease-out!important}.detail-dialog .modal-head{padding:18px 24px 14px;gap:16px;border:0;background:transparent}.detail-dialog .modal-title{font-size:21px;font-weight:600;letter-spacing:0;line-height:28px}.detail-dialog .modal-title-row{align-items:center;gap:8px 12px}.detail-dialog .modal-type,.detail-dialog .modal-code{font-size:11px;font-weight:400;letter-spacing:0}.detail-dialog .modal-actions{margin-left:auto;gap:6px}.detail-dialog .modal-action{font-size:12px;font-weight:400;padding:5px 8px;border:0;border-radius:8px;white-space:nowrap}.detail-dialog .modal-action:hover,.detail-dialog .modal-close:hover{background:var(--field);border:0}.detail-dialog .modal-close{height:28px;width:28px;border:0;border-radius:8px}.detail-dialog .modal-meta{margin-top:5px;gap:6px 12px}.detail-dialog .modal-leader-label{font-size:11px;font-weight:400;letter-spacing:0}.detail-dialog .modal-date,.detail-dialog .modal-leader{font-size:12px;font-weight:400}
.detail-dialog .detail-workspace{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(320px,1fr);gap:18px 24px;padding:0 24px 22px;background:transparent;min-height:0;overflow-y:auto;overscroll-behavior:contain;align-items:start}.detail-summary-region{grid-column:1/-1;min-width:0}.detail-dialog .detail-section-title{margin:0 0 8px;font-size:13px;font-weight:500;letter-spacing:0;color:var(--oc-text-secondary)}.detail-dialog .detail-metrics{border:0;margin:0;gap:18px}.detail-dialog .detail-metric{padding:4px 0 8px;border:0!important}.detail-dialog .detail-metric.is-active::before{display:none}.detail-dialog .detail-metric-label{font-size:12px;font-weight:400;color:var(--oc-muted)}.detail-dialog .detail-metric-value{font-size:23px;line-height:30px;font-weight:600;letter-spacing:0;margin-top:1px;font-family:inherit}.detail-dialog .detail-metric-unit{font-size:11px;font-weight:400}.detail-dialog .detail-metric-sub{font-size:12px!important;line-height:18px!important;margin-top:3px;color:var(--oc-muted)}.detail-dialog .detail-metric-sub strong{font-weight:400}.detail-observation-region,.detail-stock-region{min-width:0}.detail-stock-region{border-left:1px solid var(--oc-line);padding-left:24px}.detail-dialog .detail-trend-head{align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 10px}.detail-dialog .detail-trend-head .detail-section-title{margin:0}.detail-dialog .detail-tabs,.detail-dialog .constituent-direction{display:inline-flex;align-items:center;gap:0;min-height:30px;padding:3px;border:0;border-radius:11px;corner-shape:squircle;background:var(--cf-control);width:max-content;max-width:100%}.detail-dialog .detail-tab,.detail-dialog .constituent-direction button{min-height:24px;height:24px;padding:2px 8px!important;line-height:20px;margin:0;border:0!important;border-radius:8px!important;corner-shape:squircle;font-size:12px;font-weight:400;min-width:0;background:transparent!important;color:var(--oc-text-secondary)!important}.detail-dialog .detail-tab.is-active,.detail-dialog .constituent-direction button.is-active{background:var(--cf-accent-fill)!important;color:var(--cf-accent-ink)!important}.detail-dialog .detail-tab:hover:not(.is-active),.detail-dialog .constituent-direction button:hover:not(.is-active){background:var(--field)!important}.detail-dialog .detail-chart{height:clamp(168px,25dvh,230px);margin:0 0 24px;border:0;background:var(--panel);border-radius:12px;corner-shape:squircle}.detail-dialog .detail-chart-line{stroke:var(--cf-accent-ink)}.detail-dialog .detail-chart-date,.detail-dialog .detail-chart-rank{border:1px solid var(--cf-popup-line);background:var(--cf-popup);border-radius:6px;corner-shape:squircle;font-size:11px}.detail-dialog .detail-chart-date{bottom:-19px}.detail-dialog .constituent-strength{margin:0}.detail-dialog .constituent-strength>.detail-trend-head{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.detail-dialog .metric-note{font-size:11px;line-height:18px;color:var(--oc-muted);margin:0 0 8px}.detail-dialog .metric-note summary{cursor:pointer;width:fit-content}.detail-dialog .metric-note p{margin:6px 0 0}.detail-dialog .constituent-toolbar{border:0;margin:0 0 8px;padding:0;gap:8px;align-items:center;flex-direction:row}.detail-dialog .constituent-date{font-size:11px!important}.detail-dialog .constituent-list{border:0}.detail-dialog .constituent-list li{min-height:38px;border:0;grid-template-columns:18px minmax(0,1fr) auto}.detail-dialog .constituent-stock{display:flex;flex-direction:row;align-items:baseline;gap:8px;min-width:0;white-space:nowrap;line-height:17px;font-family:inherit}.detail-dialog .constituent-stock strong{min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:500}.detail-dialog .constituent-rank{font-size:12px;font-family:inherit}.detail-dialog .constituent-value{font-family:inherit;font-weight:500}.detail-similar-region{margin-top:0}.detail-dialog .similar-list{border:0;gap:0 14px}.detail-dialog .similar-item{border:0!important;background:transparent!important;padding:7px 0!important;gap:10px;min-height:34px;border-radius:6px!important}.detail-dialog .similar-item:hover{background:var(--field)!important}.detail-dialog .similar-name{font-size:12px;font-weight:400}.detail-dialog .similar-score{font-size:11px!important;font-weight:400;font-family:inherit}.detail-dialog .similar-empty{border:0;padding:12px 0;text-align:left;font-size:12px}
@media(max-width:1100px){:root{--cf-gutter:20px}.site-links a,.site-links span{padding-left:10px;padding-right:10px}.detail-dialog .detail-workspace{grid-template-columns:minmax(0,1.4fr) minmax(290px,1fr);gap:16px}.detail-stock-region{padding-left:16px}.detail-dialog .detail-trend-head{gap:6px}}
@media(max-width:900px){.site-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:8px;padding-top:12px;padding-bottom:8px}.site-brand{grid-column:1;grid-row:1}.site-theme{grid-column:2;grid-row:1}.site-links{grid-column:1/-1;grid-row:2;justify-self:center}.detail-dialog .detail-workspace{grid-template-columns:minmax(0,1fr)}.detail-summary-region{grid-column:auto}.detail-stock-region{padding-left:0;border-left:0;border-top:1px solid var(--oc-line);padding-top:16px}.detail-dialog .detail-chart{height:190px}.detail-dialog .constituent-strength>.detail-trend-head{flex-direction:row;align-items:center}}
@media(max-width:720px){:root{--cf-gutter:16px}.site-inner{min-height:92px;padding:14px 16px 9px;gap:10px}.site-brand{margin-left:-11px}.site-brand img{height:32px}.site-links a,.site-links span{font-size:12px;padding:7px 10px}.oc-search-wrap{flex-basis:100%!important;width:100%!important}.detail-dialog .modal-head{padding:16px 16px 12px}.detail-dialog .modal-title{font-size:19px}.detail-dialog .modal-actions{margin-left:0;gap:4px}.detail-dialog .detail-workspace{padding:0 16px 18px}.detail-dialog .detail-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}.modal-content.detail-dialog{width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important}.modal-overlay{padding:10px!important}.detail-dialog .constituent-toolbar{flex-wrap:wrap}.detail-dialog .constituent-direction{width:max-content}.detail-dialog .similar-list{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-dialog .detail-tabs{width:max-content;justify-content:flex-start;gap:0}}
/* Light surfaces stay neutral, including transient and browser-native surfaces.
   Financial colors remain independent of interface selection. */
:root[data-theme="light"] .modal-overlay{background:#0000002e!important}
:root[data-theme="light"] .modal-content{background:var(--cf-popup)!important;box-shadow:0 16px 48px #00000024!important}
:root[data-theme="light"] .detail-metric.is-active .detail-metric-label{color:var(--oc-ink)}
:root[data-theme="light"] :is(.oc-search-results,.oc-search-empty,#cashflow-calendar){backdrop-filter:none!important}
:root[data-theme="light"] .custom-tooltip .tooltip-text{color:var(--oc-text);border:1px solid var(--cf-popup-line);box-shadow:0 6px 18px var(--cf-shadow)}
:root[data-theme="light"] #loading-screen .text{color:var(--oc-muted)}
:root[data-theme="light"] #loading-screen .sub{color:var(--oc-quiet)}
/* Rank heatmaps are data encoding, not selected controls. Keep red/green,
   using the existing financial palette and a contrast-safe foreground. */
.heat-top-extreme{background:var(--oc-attack);color:var(--oc-on-solid);border-color:var(--oc-attack)}
.heat-bot-extreme{background:var(--oc-weak);color:var(--oc-on-solid);border-color:var(--oc-weak)}
.heat-top-high{background:var(--oc-attack-fill);color:var(--oc-attack);border-color:var(--oc-attack)}
.heat-bot-high{background:var(--oc-weak-fill);color:var(--oc-weak);border-color:var(--oc-weak)}
.cal-box .cal-date{color:inherit}
:root[data-theme="dark"]{--oc-heat-mid-text:var(--oc-muted)}
@supports (appearance:base-select) and selector(select::picker(select)){
 /* Month picker keeps its native select, keyboard behavior and date owner. */
 :root[data-theme="light"] .cf-calendar-head select,:root[data-theme="light"] .cf-calendar-head select::picker(select){appearance:base-select}
 :root[data-theme="light"] :is(.cf-calendar-head,.cf-rank-mode) select::picker(select){max-height:min(320px,calc(100dvh - 24px));overflow-y:auto;overscroll-behavior:contain;padding:4px;margin-top:6px;border:1px solid var(--cf-popup-line);border-radius:11px;corner-shape:squircle;background:var(--cf-popup);color:var(--oc-ink);box-shadow:0 6px 18px var(--cf-shadow)}
 :root[data-theme="light"] .cf-calendar-head option{display:flex;align-items:center;gap:8px;min-height:28px;padding:4px 8px;border:0;border-radius:7px;corner-shape:squircle;background:transparent;color:var(--oc-ink);font-size:12px;line-height:20px;cursor:pointer}
 :root[data-theme="light"] .cf-calendar-head option:not(:checked):hover,:root[data-theme="light"] .cf-calendar-head option:not(:checked):focus-visible{background:var(--field);outline:0}
 :root[data-theme="light"] .cf-calendar-head option:checked{background:var(--selected);font-weight:500}
 :root[data-theme="light"] .cf-calendar-head option::checkmark{order:1;margin-left:auto;color:var(--oc-ink)}
 :root[data-theme="light"] .cf-calendar-head select::picker-icon{color:var(--oc-muted)}
}
/* Feedback refinement: a narrower continuous comparison, not smaller type. */
:root{--cf-content-width:1480px;--cf-content-gutter:24px}
#app.oc-app{max-width:var(--cf-content-width)!important;padding-left:var(--cf-content-gutter)!important;padding-right:var(--cf-content-gutter)!important}
.demo-notice{max-width:var(--cf-content-width);padding-left:var(--cf-content-gutter);padding-right:var(--cf-content-gutter)}
.oc-pagehead{padding-top:14px!important;padding-bottom:14px!important;gap:12px!important}
.oc-head-actions{gap:12px!important}.oc-toolbar{padding-bottom:12px!important;gap:12px!important}
.oc-control-set{margin-left:12px!important;padding-left:12px!important}.oc-sort-control{margin-left:auto!important;padding-left:0!important}
/* Lookup stays with page identity; filters/date/export share the next row. */
.oc-pagehead{flex-wrap:wrap!important;gap:12px 20px!important}
.oc-head-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:0;margin-left:auto}
.oc-head-actions .oc-search-wrap{flex:0 1 280px!important;width:280px!important;min-width:160px;max-width:280px}
.oc-toolbar{align-items:center!important;column-gap:16px!important;row-gap:10px!important}
.oc-toolbar>.oc-control-set{flex:0 0 auto!important;width:auto!important;margin:0!important;padding:0!important;border:0!important}
.oc-toolbar>.oc-sort-control{position:relative;padding-left:17px!important}
.oc-toolbar>.oc-sort-control::before{content:"";position:absolute;left:0;top:50%;translate:0 -50%;width:1px;height:16px;background:var(--oc-line)}
.cf-toolbar-actions{display:flex;align-items:center;gap:12px;flex:0 0 auto;margin-left:auto;max-width:100%}
.cf-toolbar-actions>.oc-date{margin:0;flex:0 0 auto}
.cf-export-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto;min-height:32px}
.cf-export-count{min-width:52px;text-align:right;font-size:12px;color:var(--oc-muted);white-space:nowrap}
.cf-export-quiet{min-height:30px;padding:4px 8px;border:0;border-radius:9px;corner-shape:squircle;background:transparent;color:var(--oc-text-secondary);font-size:12px;white-space:nowrap}
.cf-export-quiet:hover:not(:disabled){background:var(--field);color:var(--oc-ink)}
.cf-export-actions .oc-export{white-space:nowrap}
/* Same footer hierarchy and spacing as the activity workbench. The app
   already owns its page gutter, so the footer needs no second horizontal inset. */
.oc-app footer.cf-page-footer{display:flex;align-items:baseline;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;margin:0!important;padding:24px 0 28px;border:0!important;background:transparent!important;color:var(--oc-muted)!important;font-size:11px!important;line-height:1.55;text-align:left}
.cf-page-footer .research-disclaimer{margin-left:auto;text-align:right;max-width:100%;overflow-wrap:anywhere}
@media(max-width:720px){.cf-page-footer .research-disclaimer{margin-left:0;text-align:left}}
/* Rank-change is one mode with subordinate settings on its right. Keep the
   original select/model and native keyboard semantics; style its actual picker. */
.cf-rank-mode{display:flex;align-items:center;flex:0 0 auto;gap:12px;margin-left:10px;padding-left:12px;border-left:1px solid var(--oc-line);white-space:nowrap}
.cf-rank-mode .oc-rank-control-group{display:flex;align-items:center;flex:0 0 auto;gap:4px}
.cf-rank-mode .oc-rank-control-group label{margin-right:2px;color:var(--oc-muted);font-size:11px;font-weight:400}
.cf-rank-mode .oc-tab{height:26px!important;min-height:26px!important;padding:3px 6px!important;border:0!important;font-size:11px!important;font-weight:400;background:transparent;color:var(--oc-text-secondary)}
.cf-rank-mode .oc-tab:hover{background:var(--field)}
.cf-rank-mode .oc-tab.is-active{background:var(--selected);color:var(--oc-ink)}
.cf-rank-mode .oc-rank-control-group select{min-width:78px;height:28px;padding:3px 8px;border:0;border-radius:8px;corner-shape:squircle;background:var(--field);color:var(--oc-ink);font:inherit;font-size:12px;font-weight:400;line-height:20px;cursor:pointer}
.cf-rank-mode select:focus-visible{outline:1px solid var(--oc-accent);outline-offset:3px}
.cf-rank-mode select option{background:var(--panel);color:var(--oc-ink)}
@supports (appearance:base-select) and selector(select::picker(select)){
 .cf-rank-mode select,.cf-rank-mode select::picker(select){appearance:base-select}
 .cf-rank-mode select{gap:10px;align-items:center}
 .cf-rank-mode select:open{background:var(--selected)}
 .cf-rank-mode select::picker-icon{content:"";width:6px;height:6px;margin:0 2px 3px 0;border-right:1.25px solid currentColor;border-bottom:1.25px solid currentColor;rotate:45deg;color:var(--oc-muted)}
 .cf-rank-mode select:open::picker-icon{rotate:225deg;margin-top:4px;margin-bottom:0}
 .cf-rank-mode select::picker(select){min-width:90px;margin-top:6px;padding:4px;background:var(--panel);color:var(--oc-ink);border:1px solid var(--oc-line);border-radius:11px;corner-shape:squircle;box-shadow:0 6px 18px var(--cf-shadow);backdrop-filter:none}
 .cf-rank-mode option{display:flex;align-items:center;gap:8px;min-height:28px;padding:4px 8px;border:0;border-radius:7px;corner-shape:squircle;background:transparent;color:var(--oc-ink);font-size:12px;line-height:20px;font-weight:400;cursor:pointer}
 .cf-rank-mode option:not(:checked):hover,.cf-rank-mode option:not(:checked):focus-visible{background:var(--field);outline:0}
 .cf-rank-mode option:checked{background:var(--selected);font-weight:500}
 .cf-rank-mode option::checkmark{order:1;margin-left:auto;color:var(--oc-ink)}
}
/* Idle controls are invisible. Desktop selection floats in the existing page
   gutter instead of reserving an empty column; data positions stay stable. */
.oc-content-shell:not(.cf-selecting) input[type="checkbox"]{visibility:hidden;pointer-events:none}
@media(max-width:720px){
 .oc-head-actions{gap:8px!important;width:100%;margin-left:0}
 .oc-head-actions .oc-search-wrap{flex:1 1 180px!important;width:auto!important;max-width:none}
 .cf-export-actions{max-width:100%;flex-wrap:wrap}
 .oc-toolbar>.oc-sort-control{order:1;flex:1 1 100%!important;width:100%!important;padding-left:0!important;flex-wrap:nowrap!important;overflow-x:auto}
 .oc-toolbar>.oc-sort-control::before{display:none}
 .cf-toolbar-actions{order:2;width:100%;flex-wrap:wrap;row-gap:8px}
 .cf-toolbar-actions>.cf-export-actions{margin-left:auto}
}
/* Captions explain the comparison; only columns + rows form the table. */
.desktop-mirror{background:transparent!important;border-radius:0!important;--cf-board-inset:13px;--cf-select-slot:14px;--cf-rank-slot:28px;--cf-board-gap:8px}
.desktop-mirror .mirror-board{position:relative;gap:var(--cf-board-gap)!important}
.desktop-mirror .mirror-board.left{padding-left:var(--cf-board-inset)}
.desktop-mirror .mirror-board.right{padding-right:var(--cf-board-inset)}
.desktop-mirror .mirror-board input[type="checkbox"]{position:absolute;top:50%;translate:0 -50%;width:var(--cf-select-slot)!important;margin:0}
.desktop-mirror .mirror-board.left input[type="checkbox"]{left:-4px}
.desktop-mirror .mirror-board.right input[type="checkbox"]{right:-4px}
.desktop-mirror .mirror-rank{display:grid;place-items:center;flex:0 0 var(--cf-rank-slot);width:var(--cf-rank-slot);text-align:center!important;line-height:20px}
.mirror-column-head>.mirror-board-heading.left{padding-left:calc(var(--cf-board-inset) + var(--cf-rank-slot) + var(--cf-board-gap))!important;justify-content:flex-start}
.mirror-column-head>.mirror-board-heading.right{padding-right:calc(var(--cf-board-inset) + var(--cf-rank-slot) + var(--cf-board-gap))!important;justify-content:flex-end}
.mirror-group-head{min-height:36px!important;padding-top:0!important;margin-bottom:8px;background:transparent!important}
.mirror-axis-head{border:0;color:var(--oc-muted)!important;font-weight:400}.mirror-axis-head i{display:none}
.mirror-table{background:var(--panel);border-radius:12px;corner-shape:squircle}
.mirror-table .mirror-column-head{min-height:34px!important;background:transparent!important;border-bottom:1px solid var(--oc-line)!important}
.mirror-row{min-height:38px!important}
/* Narrow layouts keep their existing horizontal-scroll tables, but captions
   likewise sit on the page rather than inside a separate colored header. */
.oc-radar-page .mobile-radar-only>div.bg-white{background:transparent!important;border-radius:0!important;overflow:visible!important}
.oc-radar-page .mobile-radar-only>div.bg-white>div:first-child{background:transparent!important;border:0!important;padding:0 12px 8px!important}
.oc-radar-page .mobile-radar-only .overflow-x-auto{background:var(--panel);border-radius:12px;corner-shape:squircle}
.oc-radar-page .mobile-radar-only .table-head{background:transparent!important;border-bottom:1px solid var(--oc-line)!important}
/* The fallback tables must not allocate 1/12 of their width to an invisible
   checkbox and another 1/12 to a rank. Keep a small edge gutter + 28px rank. */
.oc-radar-page .mobile-radar-only .table-head,.oc-radar-page .mobile-radar-only .data-row{position:relative;grid-template-columns:28px repeat(10,minmax(0,1fr));padding-left:22px!important;padding-right:4px!important}
.oc-radar-page .mobile-radar-only .table-head>div:first-child,.oc-radar-page .mobile-radar-only .data-row>div:first-child{position:absolute;left:4px;top:50%;translate:0 -50%;width:14px;height:14px;grid-column:auto!important}
.oc-radar-page .mobile-radar-only .table-head>div:first-child input,.oc-radar-page .mobile-radar-only .data-row>div:first-child input{margin:0}
.oc-radar-page .mobile-radar-only .data-row:not(.bg-blue-50){background:transparent!important}
.oc-radar-page .mobile-radar-only .data-row:not(.bg-blue-50):hover{background:var(--oc-row-hover)!important}
.mirror-group-action{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:4px 8px!important;border:0;border-radius:8px;corner-shape:squircle;background:transparent;color:var(--oc-text-secondary)!important;font-weight:400!important;text-decoration:none!important;white-space:nowrap}
.mirror-group-action:hover:not(:disabled){background:var(--field);color:var(--oc-ink)!important}.mirror-group-action:disabled{opacity:.45;cursor:default}
/* Both axis strokes use the same half-pixel reference; no gap in the 50/50 header. */
.mirror-primary-sort{position:relative;gap:0!important}.mirror-primary-sort button:last-child{border-left:0!important}
.mirror-primary-sort::after,.mirror-flow::after{position:absolute;content:"";top:0;bottom:0;left:calc(50% - .5px);width:1px;background:var(--oc-axis);pointer-events:none}
/* Two actual columns: data and chart stay together; related sectors follow stocks. */
.modal-content.detail-dialog{width:min(1080px,calc(100vw - 40px))!important;max-width:1080px!important;animation:none!important;translate:0 0;scale:1}
.detail-dialog .modal-head{padding:16px 20px 14px;gap:12px}
.detail-dialog .modal-title-row{gap:8px 14px;align-items:center}
.detail-dialog .modal-leader-group,.detail-dialog .modal-date-group{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.detail-dialog .modal-leader-label{margin-left:0}.detail-dialog .modal-actions{gap:4px}
.detail-dialog .detail-workspace{grid-template-columns:minmax(0,3fr) minmax(340px,2fr);gap:20px;padding:0 20px 20px;align-items:start}
.detail-summary-region{grid-column:auto;margin-bottom:16px}
.detail-dialog .detail-metrics{gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}
.detail-dialog .detail-metric{padding:3px 0 6px}
.detail-stock-region{padding-left:20px;border-left:1px solid var(--oc-line)}
.detail-dialog .detail-chart{height:clamp(184px,28dvh,248px);border-radius:0;corner-shape:square;background:transparent;margin-bottom:22px}
.detail-dialog .detail-trend-head{gap:8px;margin-bottom:10px;align-items:center}
.detail-dialog .constituent-strength>.detail-section-title{margin-bottom:8px}
.constituent-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.constituent-controls .detail-tabs,.constituent-controls .constituent-direction{flex:0 0 auto}
.detail-dialog .constituent-list li{min-height:28px;padding-block:4px}
.detail-similar-region{margin-top:18px}
.detail-dialog .similar-list{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}
.detail-dialog .similar-item{display:inline-flex;flex:0 1 auto;max-width:100%;width:auto;min-height:28px;padding:5px 8px!important;gap:6px;border:0!important;border-radius:8px!important;background:var(--field)!important}
.detail-dialog .similar-item:hover{background:var(--selected)!important}
.detail-dialog .similar-score{white-space:nowrap;color:var(--cf-accent-ink)!important}
/* Blue links selection to rank, never to the direction of a price move. */
.detail-dialog .detail-metric.is-active .detail-metric-label{color:var(--cf-accent-ink)}
.detail-dialog .detail-metric.is-active .detail-metric-value:not(.text-up):not(.text-down){color:var(--cf-accent-ink)!important}
.detail-dialog .detail-metric-value.text-up,.detail-dialog .modal-leader.text-up{color:var(--oc-attack)!important}
.detail-dialog .detail-metric-value.text-down,.detail-dialog .modal-leader.text-down{color:var(--oc-weak)!important}
/* One bounded focus transition, no stagger, data animation or spring. Vue owns
   DOM retention through leave; CSS owns only the overlay and surface motion. */
.modal-overlay{opacity:1;animation:none!important}
.cf-detail-enter-active{transition:opacity 200ms cubic-bezier(.16,1,.3,1)}
.cf-detail-enter-active .detail-dialog{transition:translate 200ms cubic-bezier(.16,1,.3,1),scale 200ms cubic-bezier(.16,1,.3,1)}
.cf-detail-leave-active{transition:opacity 140ms cubic-bezier(.4,0,1,1);pointer-events:none}
.cf-detail-leave-active .detail-dialog{transition:translate 140ms cubic-bezier(.4,0,1,1),scale 140ms cubic-bezier(.4,0,1,1)}
.cf-detail-enter-from,.cf-detail-leave-to{opacity:0}
.cf-detail-enter-from .detail-dialog{translate:0 6px;scale:.995}
.cf-detail-leave-to .detail-dialog{translate:0 3px;scale:.997}
@media(max-width:1100px){.detail-dialog .detail-workspace{grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);gap:16px}.detail-stock-region{padding-left:16px}.detail-dialog .detail-tabs .detail-tab,.detail-dialog .constituent-direction button{padding-left:6px!important;padding-right:6px!important}}
@media(min-width:821px) and (max-width:900px){.detail-stock-region{border-top:0;padding-top:0;border-left:1px solid var(--oc-line)}.detail-dialog .detail-metric-sub{line-height:18px!important}}
@media(max-width:820px){.detail-dialog .detail-workspace{grid-template-columns:minmax(0,1fr)}.detail-stock-region{padding:16px 0 0;border-left:0;border-top:1px solid var(--oc-line)}.detail-summary-region{margin-bottom:14px}.detail-dialog .detail-chart{height:210px}.detail-dialog .detail-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){:root{--cf-content-gutter:16px}.oc-control-set{margin-left:0!important;padding-left:0!important}.oc-sort-control{margin-left:0!important}.modal-content.detail-dialog{width:calc(100vw - 20px)!important}.detail-dialog .modal-head{padding:16px 16px 12px}.detail-dialog .detail-workspace{padding:0 16px 18px}.detail-dialog .modal-title-row{gap:8px 12px}.detail-dialog .detail-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}.detail-dialog .similar-list{display:flex}.detail-dialog .modal-actions{margin-left:0}}
@media(prefers-reduced-motion:reduce){.modal-overlay,.modal-content.detail-dialog{animation:none!important;transition:none!important}.cf-detail-enter-from,.cf-detail-leave-to{opacity:1}.cf-detail-enter-from .detail-dialog,.cf-detail-leave-to .detail-dialog{translate:0 0;scale:1}}

