/* Per-stock 概览 (quote-{code}.html). Clarity follows Longbridge quote overview:
   chart card (toolbar 20px inset, 24px segmented buttons in a 32px track,
   stats grid 3 columns 14px), 60px between sections, cards 8px / 0.5px. */

.sq-main{max-width:1400px;margin:0 auto;padding:40px var(--cl-panel-inline,40px) 24px;box-sizing:border-box}
.sq-card{border:1px solid rgba(var(--c-text-rgb),.12);border-radius:8px;background:var(--c-bg);overflow:hidden}
/* Price chart after the Longbridge quote chart (lc-sc-* shell, TradingView Lightweight Charts):
   20px toolbar margin, 32px segmented ranges with a sliding 24px indicator, chart-type
   dropdown + settings popover, 328px chart (290px pane + 38px time axis). */
.sq-chart-shell{display:flex;flex-direction:column;position:relative;padding-bottom:20px}
.lc-sc-toolbar,body.clarity.light .sq-chart-shell .lc-sc-toolbar{position:relative;z-index:10;display:flex;align-items:center;gap:12px;height:32px;flex-shrink:0;margin:20px}
.lc-sc-seg{position:relative;display:inline-flex;align-items:center;height:32px;padding:0 4px;box-sizing:border-box;border:.5px solid var(--c-border);border-radius:6px;background:rgba(var(--c-text-rgb),.02);overflow-x:auto;min-width:0;scrollbar-width:none}
.lc-sc-seg::-webkit-scrollbar{display:none}
.lc-sc-indicator{position:absolute;top:0;left:0;height:24px;border-radius:4px;background:rgba(var(--c-text-rgb),.08);pointer-events:none;opacity:0;transition:transform .2s ease-out,width .2s ease-out}
.lc-sc-seg-btn{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;height:24px;padding:0 12px;margin:0;border:0;border-radius:4px;background:transparent;color:var(--c-sub);font:inherit;font-size:14px;white-space:nowrap;cursor:pointer;transition:color .2s}
.lc-sc-seg-btn:hover,.lc-sc-seg-btn.lc-sc-on,body.clarity.light .sq-chart-shell .lc-sc-seg-btn.lc-sc-on,body.clarity.light .sq-chart-shell .lc-sc-seg-btn:hover{background:transparent;color:var(--c-text)}
.lc-sc-seg-btn.lc-sc-on{font-weight:500}
.lc-sc-chart-actions{display:inline-flex;align-items:stretch;gap:12px;height:32px;flex-shrink:0}
.lc-sc-dd,.lc-sc-settings{position:relative;flex-shrink:0}
.lc-sc-dd-trigger{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 12px;margin:0;border:.5px solid var(--c-border);border-radius:6px;background:#fafafa;color:var(--c-text);font:inherit;font-size:14px;font-weight:400;white-space:nowrap;cursor:pointer;transition:color .2s,background-color .2s}
.lc-sc-dd-value{display:flex;align-items:center}
.lc-sc-dd-trigger svg:not(.lc-sc-dd-chevron),.lc-sc-menu-item>svg{width:20px;height:20px}
.lc-sc-dd-chevron{width:16px;height:16px;color:var(--c-sub);transition:transform .2s}
.lc-sc-dd-trigger.lc-sc-open .lc-sc-dd-chevron{transform:rotate(180deg)}
.lc-sc-menu{position:absolute;top:100%;left:0;z-index:30;display:flex;flex-direction:column;gap:2px;width:max-content;margin-top:4px;padding:4px;border-radius:8px;background:var(--c-bg);box-shadow:0 2px 6px -4px rgba(43,62,92,.12),0 4px 14px 0 rgba(43,62,92,.08),0 6px 24px 6px rgba(43,62,92,.05)}
.lc-sc-menu[hidden],.lc-sc-pop[hidden]{display:none}
.lc-sc-menu-item{display:flex;align-items:center;justify-content:center;min-height:32px;padding:0 8px;margin:0;border:0;border-radius:4px;background:transparent;color:var(--c-sub);font:inherit;font-size:14px;white-space:nowrap;cursor:pointer;transition:background-color .2s,color .2s}
.lc-sc-menu--labels .lc-sc-menu-item{justify-content:flex-start;text-align:left}
.lc-sc-menu-item:hover{background:rgba(var(--c-text-rgb),.03);color:var(--c-text)}
.lc-sc-menu-item.lc-sc-on{background:rgba(var(--c-text-rgb),.05);color:var(--c-text);font-weight:500}
.lc-sc-menu-item.lc-sc-off{opacity:.35;cursor:default}
.lc-sc-menu-item.lc-sc-off:hover{background:transparent;color:var(--c-sub)}
.lc-sc-settings{border:.5px solid var(--c-border);border-radius:6px;background:var(--c-bg)}
.lc-sc-settings-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;margin:0;border:0;border-radius:6px;background:transparent;color:var(--c-sub);cursor:pointer;transition:color .2s}
.lc-sc-settings-btn:hover,.lc-sc-settings-btn.lc-sc-open{color:var(--c-text)}
.lc-sc-pop{position:absolute;top:100%;right:0;z-index:30;min-width:190px;margin-top:4px;padding:8px 0;border-radius:12px;background:var(--c-bg);box-shadow:0 2px 6px -4px rgba(43,62,92,.12),0 4px 14px 0 rgba(43,62,92,.08),0 6px 24px 6px rgba(43,62,92,.05)}
.lc-sc-pop-row{display:flex;align-items:center;gap:12px;padding:6px 16px}
.lc-sc-pop-label{flex:1 1 0%;font-size:14px;color:var(--c-text);white-space:nowrap}
.lc-sc-switch{position:relative;display:inline-flex;align-items:center;flex-shrink:0;width:32px;height:16px;padding:0;margin:0;border:0;border-radius:9999px;background:rgba(var(--c-text-rgb),.08);cursor:pointer;transition:background-color .2s}
.lc-sc-switch.lc-sc-on{background:var(--c-accent)}
.lc-sc-knob{display:inline-block;width:14px;height:14px;border-radius:9999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.15);transform:translateX(1px);transition:transform .2s}
.lc-sc-switch.lc-sc-on .lc-sc-knob{transform:translateX(17px)}
.lc-sc-period-dropdown{display:none}
.lc-sc-chart{position:relative;height:328px;z-index:0}
.sq-lw{position:absolute;inset:0}
.sq-profile{position:absolute;top:0;pointer-events:none;z-index:2}
.sq-chart-empty{display:flex;align-items:center;justify-content:center;height:328px;margin:0;font-size:14px;color:var(--c-sub)}
.sq-markers{position:absolute;height:24px;pointer-events:none;z-index:3}
.sq-marker{position:absolute;top:0;display:flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:var(--c-bg);border:1.5px solid var(--c-teal);color:var(--c-teal);font-size:11px;font-weight:600;line-height:1;pointer-events:auto;cursor:default;box-sizing:border-box}
.ltw-chart-tooltip{position:absolute;z-index:40;min-width:180px;padding:10px 14px;box-sizing:border-box;border:1px solid var(--c-border);border-radius:8px;background:var(--c-bg);font-size:12px;pointer-events:none;box-shadow:0 2px 6px -4px rgba(43,62,92,.12),0 4px 14px 0 rgba(43,62,92,.08),0 6px 24px 6px rgba(43,62,92,.05)}
.ltw-chart-tooltip[hidden]{display:none}
.ltw-tip-title{margin-bottom:6px;color:var(--c-sub);font-weight:500;font-variant-numeric:tabular-nums}
.ltw-tip-rows{display:flex;flex-direction:column;gap:2px}
.ltw-tip-row{display:flex;align-items:center;justify-content:space-between;gap:24px;line-height:18px;font-variant-numeric:tabular-nums}
.ltw-tip-row span{color:var(--c-sub)}
.ltw-tip-row b{font-weight:500;color:var(--c-text)}
/* Stats grid: Longbridge clips to the first 4 rows under a 64px fade with a chevron;
   the rest opens in place (grid-rows 0fr -> 1fr) and closes with a full-width chevron. */
.sq-stats{position:relative;border-top:1px solid rgba(var(--c-text-rgb),.12);padding:20px}
.sq-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px clamp(16px,14%,192px);margin:0}
.sq-stat{display:flex;align-items:baseline;justify-content:space-between;gap:12px;min-width:0;font-size:14px;line-height:18px}
.sq-stat dt{color:var(--c-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sq-stat dd{margin:0;color:var(--c-text);font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}
.sq-stats-more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .2s ease-out,opacity .2s ease-out}
.sq-stats-more-inner{min-height:0;overflow:hidden}
.sq-stats-more .sq-stats-grid{margin-top:24px}
.sq-stats.is-open .sq-stats-more{grid-template-rows:1fr;opacity:1}
.sq-stats.is-open>.sq-fade-more{opacity:0;pointer-events:none}
.sq-collapse{display:flex;justify-content:center;width:100%;margin:24px 0 0;padding:0;border:0;border-radius:4px;background:transparent;color:var(--c-sub);cursor:pointer;transition:color .15s}
.sq-collapse:hover{color:var(--c-text)}
.sq-collapse svg{transition:transform .2s}
.sq-collapse:hover svg{transform:translateY(-2px)}
.sq-fade-more{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;height:64px;padding:0 0 6px;border:0;border-radius:0 0 8px 8px;background:linear-gradient(to top,var(--c-bg),rgba(var(--c-bg-rgb,255,255,255),.85),transparent);color:var(--c-text);cursor:pointer;transition:opacity .2s}
.sq-fade-more[hidden]{display:none}
.sq-fade-more svg{transition:transform .2s}
.sq-fade-more:hover svg{transform:translateY(2px)}
.sq-fade-tall{height:96px}
.sq-section{margin-top:60px}
.sq-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px;margin-bottom:20px}
.sq-section-head h2{flex:1 1 0%;min-width:0;margin:0;font-size:20px;font-weight:600;line-height:1.25;color:var(--c-text)}
.sq-more{flex-shrink:0;font-size:13px;font-weight:500;color:var(--c-accent);text-decoration:none}
/* Daily events: only the latest dot is brand-colored (12px + glow); older ones are 10px
   hollow grey rings. 4px/4px dashed rail, the first one fading from brand to border. */
.sq-events-wrap{position:relative;max-height:540px;overflow:hidden;margin:20px}
.sq-events-wrap.is-open{max-height:none}
.sq-events{list-style:none;margin:0;padding:0}
.sq-event{display:flex}
.sq-event-date{flex-shrink:0;width:72px;box-sizing:border-box;padding:1px 16px 0 0;text-align:right;font-size:16px;font-weight:600;line-height:22px;color:var(--c-text);white-space:nowrap}
.sq-event-rail{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:12px;padding-top:6px}
.sq-event-dot{flex-shrink:0;box-sizing:border-box;width:10px;height:10px;border:1px solid #a8aaad;border-radius:50%;background:var(--c-bg)}
.is-latest .sq-event-dot{width:12px;height:12px;border:0;background:var(--c-accent);box-shadow:0 0 3px 4px rgba(117,96,214,.2)}
.sq-event-line{flex:1 1 0%;width:1px;margin-top:6px;background:#dbdde1;-webkit-mask-image:repeating-linear-gradient(to bottom,#000 0 4px,transparent 4px 8px);mask-image:repeating-linear-gradient(to bottom,#000 0 4px,transparent 4px 8px)}
.is-latest .sq-event-line{background:linear-gradient(to bottom,var(--c-accent),#dbdde1 50%)}
.sq-event-body{display:flex;flex:1 1 0%;flex-wrap:wrap;align-items:center;gap:4px 6px;min-width:0;min-height:24px;padding:0 0 32px 16px}
.sq-event:last-child .sq-event-body{padding-bottom:0}
.sq-event-price{font-size:16px;font-weight:600;line-height:24px;color:var(--c-text);font-variant-numeric:tabular-nums}
.sq-event-change{display:inline-flex;align-items:center;gap:2px;font-size:14px;font-weight:600;color:var(--c-sub);font-variant-numeric:tabular-nums}
.sq-event-change svg{width:12px;height:12px;fill:currentColor}
.sq-event-change.is-up{color:var(--c-teal)}
.sq-event-change.is-down{color:var(--c-pink)}
.sq-event-note{font-size:14px;color:var(--c-sub)}
/* News: 16px round source icon + source · time (14px grey), 2-line title 14/500. */
.sq-news{list-style:none;margin:0;padding:20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
.sq-news li{min-width:0}
.sq-news a{display:block;margin:-8px -12px;padding:8px 12px;border-radius:8px;text-decoration:none;transition:background-color .15s ease-out}
.sq-news a:hover{background:rgba(var(--c-text-rgb),.024)}
.sq-news a:active{background:rgba(var(--c-text-rgb),.036)}
.sq-news-meta{display:flex;align-items:center;gap:6px;margin-bottom:12px;font-size:14px;line-height:20px;color:var(--c-sub)}
.sq-news-meta img{flex-shrink:0;width:16px;height:16px;border-radius:50%;object-fit:cover}
.sq-news-source{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sq-news-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;font-weight:500;line-height:1.375;color:var(--c-text);transition:color .15s}
.sq-news a:hover .sq-news-title{color:var(--c-accent)}
.sq-source{margin:24px 0 0;font-size:12px;color:var(--c-sub)}

body.clarity.light .sq-card{border:.5px solid #dbdde1;border-radius:10px;background:#fff}
body.clarity.light .sq-fade-more{border-radius:0 0 10px 10px;background:linear-gradient(to top,#fff,rgba(255,255,255,.85),rgba(255,255,255,0))}
body.clarity.light .sq-stats{border-top:.5px solid #dbdde1}
body.clarity.light .sq-stat dt{color:#696e77}
body.clarity.light .sq-more{color:#624dbb}
body.clarity.light .is-latest .sq-event-dot{background:#7560d6}
body.clarity.light .is-latest .sq-event-line{background:linear-gradient(to bottom,#7560d6,#dbdde1 50%)}
body.clarity.light .sq-event-change.is-up{color:#00ada2}
body.clarity.light .sq-event-change.is-down{color:#ff3874}

@media(max-width:767px){
  .lc-sc-toolbar{margin:20px;gap:12px}
  .lc-sc-seg,body.clarity.light .sq-chart-shell .lc-sc-seg{display:none}
  .lc-sc-period-dropdown{display:block}
  .sq-main{padding-inline:var(--cl-panel-inline,16px)}
  .sq-stats{padding:16px 12px}
  .sq-stat{flex-direction:column;align-items:flex-start;gap:2px}
  .sq-stat dd{text-align:left}
  .sq-section{margin-top:40px}
  .sq-news{grid-template-columns:minmax(0,1fr);gap:24px}
}