:root { color-scheme: light; }
* { box-sizing: border-box; }
body.stock-search-page { margin: 0; min-height: 100vh; background: #f5f7fa; color: #243548; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif; }
.stock-search-top { position: sticky; z-index: 100; top: 0; display: grid; min-height: 58px; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 6px; padding: max(8px, env(safe-area-inset-top)) 10px 8px; border-bottom: 1px solid #dde4eb; background: rgba(248, 250, 252, .96); backdrop-filter: blur(18px); }
.stock-search-back { display: grid; width: 36px; height: 36px; place-items: center; color: #526579; font-size: 34px; line-height: 1; text-decoration: none; }
.stock-search-form { display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-items: center; gap: 7px; }
.stock-search-form .ab-stock { position: relative; min-width: 0; }
#stockSearchInput { width: 100%; height: 38px; padding: 7px 11px 7px 36px; border: 1px solid #d9e0e8; border-radius: 9px; outline: 0; background: #fff; color: #26384b; font-size: 16px; box-shadow: 0 2px 7px rgba(29, 52, 76, .05); }
#stockSearchInput:focus { border-color: #91a7bd; box-shadow: 0 0 0 3px rgba(81, 111, 142, .1); }
#stockSearchInput::placeholder { color: #9aa5b1; }
.stock-search-icon { position: absolute; z-index: 2; top: 50%; left: 10px; width: 18px; height: 18px; color: #8190a0; pointer-events: none; transform: translateY(-50%); }
.stock-search-icon svg { display: block; width: 100%; height: 100%; }
.stock-search-form > button { min-height: 38px; padding: 0; border: 0; background: transparent; color: #3f658b; font-size: 14px; font-weight: 800; }
.stock-search-form .ac-panel { top: calc(100% + 7px); right: -55px; left: 0; max-height: 58vh; border-radius: 9px; box-shadow: 0 14px 30px rgba(19, 34, 51, .18); }
.stock-search-form .ac-opt { min-height: 48px; padding: 9px 12px; }
.stock-search-main { width: min(100% - 20px, 680px); margin: 12px auto 40px; }
.stock-search-history { margin-bottom: 12px; padding: 0 13px 12px; border: 1px solid #e0e6ed; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(24, 52, 82, .04); }
.stock-search-history > header { display: flex; min-height: 48px; align-items: center; justify-content: space-between; }
.stock-search-history h2 { margin: 0; color: #26384b; font-size: 15px; }
.stock-search-history > header > div { display: flex; align-items: center; gap: 7px; }
.stock-search-history button { border: 0; background: transparent; }
.stock-history-toggle { display: inline-flex; min-height: 32px; align-items: center; gap: 4px; padding: 0 4px; color: #73869a; font-size: 12px; }
.stock-history-toggle i { min-width: 13px; font-size: 16px; font-style: normal; line-height: 1; }
.stock-history-clear { display: grid; width: 32px; min-width: 32px; min-height: 32px; place-items: center; padding: 0; border-left: 1px solid #e4e9ef !important; color: #8190a0; }
.stock-history-clear svg { width: 20px; height: 20px; }
.stock-history-clear:disabled { opacity: .3; }
.stock-history-list { display: flex; flex-wrap: wrap; gap: 7px; }
.stock-history-chip { display: inline-flex; min-height: 32px; overflow: hidden; border: 1px solid #e2e7ed; border-radius: 8px; background: #f6f8fa; }
.stock-history-chip > button:first-child { display: inline-flex; min-height: 32px; align-items: center; gap: 5px; padding: 5px 7px 5px 9px; color: #40566d; }
.stock-history-chip b { font-size: 12px; font-weight: 700; }
.stock-history-chip small { color: #91a0af; font-size: 9px; }
.stock-history-chip > button:last-child { width: 27px; min-width: 27px; min-height: 32px; padding: 0; border-left: 1px solid #e2e7ed; color: #94a0ac; font-size: 15px; }
.stock-history-empty { padding: 2px 0 4px; color: #9aa5b0; font-size: 12px; }
.stock-search-hot { overflow: hidden; border: 1px solid #e0e6ed; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(24, 52, 82, .05); }
.stock-search-hot > header { display: flex; min-height: 48px; align-items: center; padding: 0 13px; border-bottom: 1px solid #edf1f5; }
.stock-search-hot h1 { margin: 0; color: #26384b; font-size: 16px; }
.stock-search-hot-list { padding: 0 12px 4px; }
.stock-search-row { display: grid; min-height: 92px; grid-template-columns: 23px minmax(0, 1fr) 66px 36px; align-items: center; gap: 4px 7px; padding: 8px 0; border-bottom: 1px solid #f0f2f5; }
.stock-search-row:last-child { border-bottom: 0; }
.stock-search-rank { color: #8b97a3; font-size: 14px; font-weight: 800; text-align: center; }
.stock-search-rank.top { color: #d65b28; }
.stock-search-stock, .stock-search-quote { min-width: 0; padding: 7px 0; border: 0; background: transparent; text-align: left; }
.stock-search-stock > span { display: flex; align-items: baseline; gap: 6px; }
.stock-search-stock b { overflow: hidden; color: #273748; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.stock-search-stock small { color: #99a3ad; font-size: 10px; }
.stock-search-quote { text-align: right; }
.stock-search-quote b { display: block; font-size: 14px; font-weight: 850; }
.stock-search-quote small { display: block; margin-top: 3px; color: #9aa4ae; font-size: 10px; }
.stock-search-actions { display: grid; grid-row: span 2; align-self: stretch; align-content: center; gap: 5px; }
.stock-search-watch, .stock-search-ai { width: 32px; min-width: 32px; min-height: 32px; padding: 0; border: 1.5px solid #6f879e; border-radius: 6px; background: #fff; color: #536f8b; line-height: 28px; }
.stock-search-watch { font-size: 22px; }
.stock-search-watch.active { border-color: #a7b8c8; background: #eef3f7; font-size: 16px; font-weight: 850; }
.stock-search-watch:disabled, .stock-search-ai:disabled { opacity: .45; }
.stock-search-ai { border-color: #92a8bd; background: #eef3f7; color: #365b80; font-size: 15px; font-weight: 900; }
.stock-search-ai:active { background: #dfe9f2; }
.stock-search-platform-ranks { display: flex; min-width: 0; grid-column: 2 / 4; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.stock-search-platform-ranks::-webkit-scrollbar { display: none; }
.stock-search-platform-ranks > span { display: inline-flex; min-height: 24px; flex: 0 0 auto; align-items: center; gap: 3px; padding: 3px 6px; border: 1px solid #dbe3eb; border-radius: 7px; background: #f7f9fb; color: #60758a; font-size: 10px; line-height: 1; }
.stock-search-platform-ranks b { font-weight: 750; }
.stock-search-platform-ranks em { min-width: 10px; color: #344b61; font-style: normal; font-weight: 850; text-align: center; }
.stock-search-platform-ranks .eastmoney { border-color: #edc875; background: #fffaf0; color: #a96a00; }
.stock-search-platform-ranks .ths { border-color: #f0b48b; background: #fff7f1; color: #bd5c24; }
.stock-search-platform-ranks .tgb { border-color: #cbb5f2; background: #faf6ff; color: #7449b4; }
.stock-search-platform-ranks .kaipanla { border-color: #f0a8ad; background: #fff5f6; color: #c8444f; }
.stock-search-state { padding: 32px 12px; color: #8190a0; font-size: 13px; text-align: center; }
.stock-search-hot-sentinel { min-height: 42px; padding: 12px; color: #8795a3; font-size: 11px; text-align: center; }
.stock-search-hot-sentinel.complete { color: #a1aab4; }
.stock-search-page .wb-up { color: #e33e49; }
.stock-search-page .wb-down { color: #12a164; }
.stock-search-page .wb-flat { color: #76889a; }
@media (min-width: 881px) { .stock-search-top { grid-template-columns: 44px minmax(0, 620px); justify-content: center; } }