/* Look-Through Clocks — styles. Loaded globally by Dash from /assets, so every rule
   is scoped under .ltc-app (the node's page) or .ltc-oc (its trades drawer, rendered
   in a portal). Shared node tokens: panels rgba(0,0,0,0.6), chips rgba(255,255,255,0.06),
   radius 10px, text #e8e8e8, muted #9fb3c8, headings #cfefff, accent #f0a030. */

.ltc-app { color: #e8e8e8; font-size: 13px; }
.ltc-app * { box-sizing: border-box; }

/* ---------- header + control bar ------------------------------------------------ */
.ltc-top { display: flex; align-items: flex-end; gap: 18px; padding: 0 200px 8px 0; }
.ltc-brand h3 { margin: 0; font-size: 1.3rem; color: #cfefff; font-weight: 600; letter-spacing: .2px; }
.ltc-brand div { color: #9fb3c8; font-size: .76rem; max-width: 900px; }
.ltc-bar { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: flex-end; background: rgba(255,255,255,0.06);
           border-radius: 10px; padding: 8px 14px; margin-bottom: 8px; }
.ltc-ctrl .ltc-k { color: #9fb3c8; font-size: .66rem; text-transform: uppercase; letter-spacing: .6px; margin-bottom: 3px; }
.ltc-ctrl.w-spec { width: 330px; }
.ltc-tradechip { background: rgba(240,160,48,0.10); border: 1px solid rgba(240,160,48,0.55); color: #f5d6a3;
                 border-radius: 14px; padding: 3px 12px; font-size: .78rem; cursor: pointer; }
.ltc-tradechip:hover { background: rgba(240,160,48,0.2); }
.ltc-tradechip i { color: #f0a030; margin-right: 2px; }

.ltc-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.ltc-pills label { margin: 0; cursor: pointer; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
                   border-radius: 14px; padding: 3px 11px; font-size: .76rem; color: #e8e8e8; }
.ltc-pills label:has(input:checked) { border-color: #f0a030; color: #f0a030; background: rgba(240,160,48,0.08); }
.ltc-pills input { display: none; }

/* dropdowns (dark), also inside the trades drawer */
.ltc-app .Select-control, .ltc-oc .Select-control { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(255,255,255,0.12) !important;
                               border-radius: 8px !important; min-height: 30px; height: 30px; }
.ltc-app .Select-value-label, .ltc-app .Select-input > input,
.ltc-oc .Select-value-label, .ltc-oc .Select-input > input { color: #e8e8e8 !important; font-size: .8rem; }
.ltc-app .Select-placeholder, .ltc-app .Select--single > .Select-control .Select-value,
.ltc-oc .Select-placeholder, .ltc-oc .Select--single > .Select-control .Select-value { line-height: 28px !important; color: #9fb3c8; }
.ltc-app .Select-menu-outer, .ltc-oc .Select-menu-outer { background: #141a21 !important; border: 1px solid rgba(255,255,255,0.15) !important;
                                  border-radius: 8px !important; z-index: 10060 !important; }
.ltc-app .VirtualizedSelectOption, .ltc-oc .VirtualizedSelectOption { color: #e8e8e8; font-size: .8rem; }
.ltc-app .VirtualizedSelectFocusedOption, .ltc-oc .VirtualizedSelectFocusedOption { background: rgba(240,160,48,0.18) !important; }
.ltc-app .Select-arrow, .ltc-oc .Select-arrow { border-top-color: #9fb3c8 !important; }

.ltc-warn { background: rgba(240,160,48,0.10); color: #f0c080; border-radius: 8px; padding: 4px 10px; font-size: .76rem; margin: 0 0 6px; }

/* ---------- summary chips --------------------------------------------------------- */
.ltc-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; min-height: 56px; }
@media (max-width: 1100px) { .ltc-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ltc-chip { display: flex; gap: 10px; align-items: center; background: rgba(0,0,0,0.45); border: 1px solid rgba(255,255,255,0.07);
            border-radius: 10px; padding: 7px 12px; min-width: 0; }
.ltc-chip > i { color: #f0a030; font-size: 1.05rem; width: 20px; text-align: center; }
.ltc-chip.est > i { color: #f0c080; }
.ltc-chip > div { min-width: 0; }
.ltc-chip-k { color: #9fb3c8; font-size: .64rem; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap;
              overflow: hidden; text-overflow: ellipsis; }
.ltc-chip-v { color: #f2f7fb; font-size: .98rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.ltc-chip-s { color: #9fb3c8; font-size: .66rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- the stage -------------------------------------------------------------- */
.ltc-wait { color: #9fb3c8; padding: 30px 10px; text-align: center; }
.ltc-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; font-size: .72rem; color: #9fb3c8; margin: 0 0 8px 2px; }
.ltc-live { display: inline-flex; align-items: center; gap: 6px; color: #28c878; font-weight: 600; text-transform: uppercase;
            letter-spacing: .6px; font-size: .66rem; }
.ltc-live .dot { width: 8px; height: 8px; border-radius: 50%; background: #28c878; box-shadow: 0 0 8px #28c878;
                 animation: ltc-pulse 1.4s ease-in-out infinite; }
.ltc-lg { display: inline-flex; align-items: center; gap: 6px; }
.ltc-lg.hint { font-style: italic; opacity: .75; }
.ltc-lg .sw { width: 22px; height: 6px; border-radius: 3px; display: inline-block; }
.ltc-lg .sw.a { background: #3fa9f5; }
.ltc-lg .sw.e, .ltc-meter .e {
  background: repeating-linear-gradient(-45deg, rgba(240,160,48,0.95) 0 4px, rgba(240,160,48,0.35) 4px 8px);
  background-size: 11.3px 11.3px; animation: ltc-stripes 0.9s linear infinite; }

.ltc-cols { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr) minmax(0, 0.95fr); gap: 10px; align-items: start; }
@media (max-width: 1300px) { .ltc-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (max-width: 860px) { .ltc-cols { grid-template-columns: minmax(0, 1fr); } }
.ltc-sec { background: rgba(0,0,0,0.45); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; padding: 10px 12px 8px; }
.ltc-sec-h { margin-bottom: 4px; }
.ltc-sec-t { color: #cfefff; font-weight: 600; font-size: .95rem; }
.ltc-sec-s { color: #9fb3c8; font-size: .68rem; }

.ltc-flow { position: relative; }
.ltc-svg { position: absolute; left: 0; top: 0; overflow: visible; }
.ltc-stream { opacity: .92; }
.ltc-band { fill: none; stroke-linecap: butt; opacity: .78; }
.ltc-dots { fill: none; stroke: rgba(255,255,255,0.55); stroke-linecap: round; stroke-dasharray: 1.5 10.5;
            animation: ltc-flow 1.1s linear infinite; }
.ltc-dots.thin { stroke: rgba(255,255,255,0.8); }

.ltc-badge { position: absolute; border-radius: 50%; display: flex; align-items: center; justify-content: center;
             background: var(--c); color: #0b1016; font-size: .95rem;
             box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 16px var(--c); z-index: 2; }
.ltc-badge.src { animation: ltc-glow 2.4s ease-in-out infinite; }
.ltc-badge.pool { font-size: 1.1rem; animation: ltc-ring 2.2s ease-out infinite; }
.ltc-ico { position: absolute; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center;
           justify-content: center; background: rgba(8,12,16,0.92); border: 2px solid var(--c); color: var(--c);
           font-size: .85rem; box-shadow: 0 0 12px -2px var(--c); z-index: 2; }
.ltc-ico.in { border-style: dashed; }

.ltc-txt { position: absolute; right: 2px; line-height: 1.15; }
.ltc-clock { cursor: default; }
.ltc-lab { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.ltc-name { color: #cfd9e3; font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ltc-clock.big .ltc-name { color: #cfefff; font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .4px; }
.ltc-speed { color: #7f93a6; font-size: .64rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ltc-num { font-family: Consolas, 'SFMono-Regular', Menlo, monospace; font-variant-numeric: tabular-nums;
           color: #f2f7fb; font-size: 1.02rem; white-space: nowrap; margin-top: 1px; }
.ltc-clock.big .ltc-num { font-size: 1.22rem; font-weight: 600; }
.ltc-num .cu { color: #9fb3c8; margin-right: 1px; }
.ltc-num .ce { color: #f2f7fb; }
.ltc-num .sx { color: #f0a030; font-size: .78em; margin-left: 1px; letter-spacing: .5px; opacity: .92; }
.ltc-meter { position: relative; display: flex; height: 3px; border-radius: 2px; overflow: hidden; margin-top: 3px;
             width: calc(100% - 62px); max-width: 260px; background: rgba(255,255,255,0.06); }
.ltc-clock.big .ltc-meter { width: calc(100% - 215px); min-width: 60px; }
.ltc-meter .a { height: 100%; }
.ltc-meter .e { height: 100%; }
.ltc-estp { position: absolute; right: 0; bottom: -2px; color: #f0c080; font-size: .62rem; font-variant-numeric: tabular-nums; }
.ltc-clock { position: relative; }

.ltc-stack { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ltc-sp-grid { display: grid; grid-template-columns: minmax(0, 1.9fr) repeat(4, minmax(0, 1fr)); gap: 3px 8px;
               margin-top: 6px; align-items: center; }
.ltc-sp-h { color: #9fb3c8; font-size: .6rem; text-transform: uppercase; letter-spacing: .5px; text-align: right;
            border-bottom: 1px solid rgba(255,255,255,0.08); padding-bottom: 3px; }
.ltc-sp-n { color: #dfe8f0; font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 3px 0; }
.ltc-sp-i { display: inline-block; width: 18px; text-align: center; margin-right: 5px; }
.ltc-sp-v { color: #f2f7fb; font-family: Consolas, monospace; font-size: .76rem; text-align: right; font-variant-numeric: tabular-nums; }
.ltc-sp-v.m { color: #b8c7d6; }
.ltc-sp-v.y { color: #f0c080; }

/* ---------- balance sheet -------------------------------------------------------------- */
.ltc-tower { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; margin-top: 8px; align-items: end; }
.ltc-tcol { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ltc-tcol-h { color: #9fb3c8; font-size: .66rem; text-transform: uppercase; letter-spacing: .6px; margin-bottom: 2px; }
.ltc-blk { position: relative; border-radius: 8px; border-left: 3px solid var(--c); overflow: hidden;
           background: linear-gradient(90deg, color-mix(in srgb, var(--c) 30%, transparent), color-mix(in srgb, var(--c) 10%, transparent));
           padding: 4px 8px; transition: filter .15s; }
.ltc-blk:hover { filter: brightness(1.25); }
.ltc-blk.eq { box-shadow: inset 0 0 18px color-mix(in srgb, var(--c) 35%, transparent); }
.ltc-blk.neg { border-left-color: #e05050; }
.ltc-blk-h { display: flex; align-items: center; gap: 6px; font-size: .7rem; min-width: 0; }
.ltc-blk-h i { color: var(--c); width: 14px; text-align: center; }
.ltc-blk-l { color: #dfe8f0; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ltc-blk-v { color: #f2f7fb; font-family: Consolas, monospace; font-variant-numeric: tabular-nums; }
.ltc-blk-p { color: #9fb3c8; font-size: .64rem; margin: 2px 0 0 20px; }
.ltc-bsstats { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 6px; margin-top: 10px; }
.ltc-bsstat { background: rgba(255,255,255,0.06); border-radius: 10px; padding: 5px 9px; }
.ltc-bsstat .k { color: #9fb3c8; font-size: .62rem; text-transform: uppercase; letter-spacing: .5px; }
.ltc-bsstat .v { color: #f2f7fb; font-family: Consolas, monospace; font-size: .86rem; }
.ltc-bsnote { color: #7f93a6; font-size: .66rem; margin-top: 8px; line-height: 1.35; }

/* ---------- lower panels ---------------------------------------------------------------- */
.ltc-lower { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; margin-top: 10px; }
@media (max-width: 1100px) { .ltc-lower { grid-template-columns: minmax(0, 1fr); } }
.ltc-card { background: rgba(0,0,0,0.45); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; padding: 10px 12px; min-width: 0; }
.ltc-h { color: #cfefff; font-weight: 600; font-size: .9rem; }
.ltc-hrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.ltc-tnote { color: #9fb3c8; font-size: .7rem; margin: 6px 2px; }
.ltc-notes { margin-top: 10px; background: rgba(255,255,255,0.06); border-radius: 10px; padding: 8px 14px; }
.ltc-notes summary { color: #cfefff; font-size: .82rem; cursor: pointer; }
.ltc-notes summary i { color: #f0a030; margin-right: 4px; }
.ltc-notes-b { margin-top: 8px; }
.ltc-np { color: #b8c7d6; font-size: .74rem; line-height: 1.45; margin-bottom: 4px; }
.ltc-np b { color: #cfefff; }
.ltc-nl { color: #9fb3c8; font-size: .7rem; margin: 4px 0 0; padding-left: 18px; columns: 2; column-gap: 28px; }

/* ---------- trades drawer (portal: scoped by .ltc-oc) ----------------------------------- */
.ltc-oc.offcanvas { background: linear-gradient(109.6deg, rgb(4,8,12) 11.2%, rgb(12,34,48) 91.1%) !important; color: #e8e8e8;
                    border-right: 1px solid rgba(255,255,255,0.08); padding: 16px 18px; border-top-right-radius: 10px;
                    border-bottom-right-radius: 10px; }
.ltc-oc-h { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; }
.ltc-oc-t { color: #cfefff; font-size: 1.1rem; font-weight: 600; }
.ltc-oc-s { color: #9fb3c8; font-size: .74rem; max-width: 440px; }
.ltc-oc .ltc-k { color: #9fb3c8; font-size: .66rem; text-transform: uppercase; letter-spacing: .6px; margin-bottom: 3px; }
.ltc-x { background: transparent; border: none; color: #fff; font-size: 1.1rem; cursor: pointer; }
.ltc-oc-f { display: flex; gap: 8px; justify-content: space-between; margin-top: 12px; width: 100%; }
.ltc-pfchip { align-self: flex-end; }
.ltc-btn.btn { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16); color: #e8e8e8; border-radius: 10px; }
.ltc-btn.btn:hover { border-color: #f0a030; color: #f5d6a3; background: rgba(240,160,48,0.1); }
.ltc-btn.acc.btn { border-color: rgba(240,160,48,0.7); color: #f5d6a3; background: rgba(240,160,48,0.14); }
.ltc-oc .dash-spreadsheet-container input { color: #e8e8e8 !important; background: transparent !important; }
.ltc-oc .dash-delete-cell { color: #9fb3c8 !important; }

/* ---------- animations -------------------------------------------------------------------- */
@keyframes ltc-flow { to { stroke-dashoffset: -24; } }
@keyframes ltc-stripes { to { background-position: 11.3px 0; } }
@keyframes ltc-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(.8); } }
@keyframes ltc-glow { 0%, 100% { box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 10px var(--c); }
                      50% { box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 24px var(--c); } }
@keyframes ltc-ring { 0% { box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 0 0 color-mix(in srgb, var(--c) 70%, transparent); }
                      70% { box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 0 14px transparent; }
                      100% { box-shadow: 0 0 0 3px rgba(0,0,0,0.55), 0 0 0 0 transparent; } }
@media (prefers-reduced-motion: reduce) {
  .ltc-dots, .ltc-live .dot, .ltc-badge, .ltc-lg .sw.e, .ltc-meter .e { animation: none !important; }
}