/*
流程說明：
1. 定義共用色彩與會員表單版面，再套用走勢查詢、圖表與價格明細樣式。
2. 依螢幕寬度調整查詢欄位、指標與導覽；錯誤與空資料由對應狀態類別呈現。
*/
/* StockWeb：會員頁面與共用版型。 */
:root { --ink:#162d38; --muted:#687a86; --teal:#176b5d; --line:#e3e9ec; --paper:#f5f7f8; }
* { box-sizing:border-box; }
html { min-height:100%; }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; color:var(--ink); background:var(--paper); font-family:"Segoe UI","Microsoft JhengHei",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--teal); text-decoration:none; }
a:hover { color:#104e43; }
button,input { font:inherit; }
a:focus-visible,button:focus-visible,input:focus-visible { outline:3px solid #52b9a6; outline-offset:4px; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:100; padding:.8rem 1rem; background:white; border:2px solid var(--teal); }
.skip-link:focus { top:1rem; }
.site-header { background:#fff; border-bottom:1px solid var(--line); }
.site-nav { max-width:1280px; min-height:84px; padding:0 44px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:inline-flex; align-items:center; color:var(--ink); font-size:24px; font-weight:750; letter-spacing:-1px; }
.brand-accent { color:var(--teal); }
.brand-mark { width:36px; height:36px; margin-right:10px; color:#fff; background:var(--teal); border-radius:10px; display:grid; place-items:center; }
.brand-mark svg { width:24px; height:24px; }
.nav-actions { display:flex; align-items:center; gap:25px; font-size:14px; }
.nav-actions form { margin:0; }
.nav-login { color:var(--muted); }
.nav-register { border:1px solid var(--line); border-radius:7px; padding:10px 16px; font-weight:600; }
.nav-register span { margin-left:8px; }
.nav-user { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-link-button { border:0; background:none; color:var(--teal); font-weight:600; padding:8px 0; }
/* 流程：功能下拉沿用 Bootstrap 顯示／鍵盤行為；角色只控制可見入口，長名稱與窄螢幕仍限制寬度。 */
.nav-function-toggle { display:flex; align-items:center; gap:9px; max-width:100%; padding:10px 13px; border:1px solid #dbe5e8; border-radius:9px; background:#f6faf9; color:#245448; font-size:13px; }
.nav-function-toggle > svg { width:18px; height:18px; flex-shrink:0; }
.nav-menu-user { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-left:9px; border-left:1px solid #d1dfda; color:#657a71; font-size:12px; }
.nav-menu-chevron { font-size:16px; line-height:1; }
.nav-function-menu { min-width:220px; max-width:calc(100vw - 32px); padding:8px; margin-top:8px !important; border:1px solid #dbe5e8; border-radius:12px; box-shadow:0 16px 36px #102b3524; z-index:1050; }
.nav-menu-caption { display:block; padding:8px 11px 6px; color:#7a8c87; font-size:11px; letter-spacing:.5px; }
.nav-function-menu .dropdown-item { padding:10px 11px; border-radius:6px; color:#25483e; font-size:13px; }
.nav-function-menu .dropdown-item:hover,.nav-function-menu .dropdown-item:focus,.nav-function-menu .dropdown-item.active { background:#e4f3ee; color:#136851; }
.nav-function-menu .nav-menu-logout { color:#b1474f; }
.nav-function-menu .dropdown-divider { border-top-color:#dce6e2; margin:6px 3px; }
@media (max-width:520px) { .nav-function-toggle { padding:9px 10px; gap:6px; font-size:12px; } .nav-menu-user { display:none; } }
.site-main { flex:1; width:100%; max-width:1280px; margin:0 auto; padding:40px 44px 32px; }
.account-shell { display:grid; grid-template-columns:1.04fr 1fr; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:white; box-shadow:0 18px 60px #162d3806; }
.account-story { min-width:0; display:flex; flex-direction:column; padding:42px 44px 34px; color:white; background:radial-gradient(ellipse at 0 100%,#1b5350,transparent 75%),#102b35; }
.story-topline { display:flex; align-items:center; gap:9px; font-size:10px; letter-spacing:1.8px; color:#aec9cb; }
.story-dot { width:6px; height:6px; display:inline-block; border-radius:50%; background:#7ae0c7; }
.story-heading { margin-top:68px; }
.story-eyebrow { font-size:12px; letter-spacing:2px; color:#a9d8cf; margin-bottom:16px; }
.story-heading h1 { font-size:clamp(28px,2.9vw,38px); line-height:1.5; font-weight:650; letter-spacing:1px; margin:0 0 22px; }
.story-description { font-size:14px; line-height:1.9; color:#b4c9ce; margin:0; }
.market-illustration { margin:42px -14px 30px; }
.chart-caption { display:flex; justify-content:space-between; align-items:center; padding:0 10px; font-size:9px; letter-spacing:1.2px; color:#98b7bd; }
.chart-tag { background:#ffffff0a; border:1px solid #ffffff14; border-radius:5px; padding:5px 8px; color:#bdd4d6; font-size:9px; }
.market-illustration svg { display:block; width:100%; margin-top:12px; }
.chart-bottom { display:flex; justify-content:space-between; padding:0 12px; font-size:10px; color:#91b2b8; }
.story-footer { display:flex; gap:12px; align-items:center; margin-top:auto; padding-top:24px; border-top:1px solid #ffffff12; }
.story-icon { font-size:28px; color:#7ae0c7; }
.story-footer p { margin:0; color:#d4e3e5; font-size:12px; line-height:1.7; }
.story-footer p span { font-size:8px; letter-spacing:1.6px; color:#8fafb5; }
.account-form-panel { min-width:0; display:flex; align-items:center; justify-content:center; padding:42px 48px; }
.account-form-content { width:100%; max-width:370px; }
.form-eyebrow { color:var(--teal); font-size:10px; font-weight:700; letter-spacing:2px; margin:0 0 13px; }
.account-form-content h2 { margin:0 0 12px; font-size:29px; font-weight:700; letter-spacing:.3px; }
.form-description { color:var(--muted); font-size:13px; line-height:1.8; margin-bottom:26px; }
.account-tabs { display:flex; border-bottom:1px solid var(--line); margin-bottom:25px; gap:28px; }
.account-tabs a { display:block; padding:0 3px 12px; color:var(--muted); font-size:14px; }
.account-tabs .active { border-bottom:2px solid var(--teal); color:var(--teal); font-weight:700; margin-bottom:-1px; }
.form-field { margin-bottom:19px; }
.form-field label { display:block; font-size:12px; font-weight:650; margin-bottom:8px; }
.form-control { height:46px; font-size:13px; border:1px solid #dce4e8; border-radius:7px; background:#fff; padding:10px 13px; color:var(--ink); box-shadow:none; }
.form-control::placeholder { color:#9aa7af; }
.form-control:focus { border-color:#438f80; box-shadow:0 0 0 3px #176b5d12; }
.password-field { position:relative; }
.password-field .form-control { padding-right:64px; }
.password-toggle { position:absolute; right:11px; top:9px; background:none; color:var(--muted); border:0; padding:5px 4px; font-size:11px; }
.field-error { display:block; font-size:12px; color:#a83537; margin-top:6px; }
.field-error:empty { display:none; }
.field-hint { font-size:11px; color:var(--muted); line-height:1.7; margin:7px 0 0; }
.input-validation-error { border-color:#b54749; }
.account-errors.validation-summary-valid { display:none; }
.account-errors.validation-summary-errors { margin-bottom:20px; background:#fff3f2; border:1px solid #f1d3d1; border-radius:7px; padding:12px 14px; color:#9d3035; font-size:12px; line-height:1.7; }
.account-errors ul { list-style:none; padding:0; margin:0; }
.account-success { margin-bottom:20px; background:#edf7f2; color:#23654d; border:1px solid #cfe6d9; padding:12px 14px; border-radius:7px; font-size:12px; line-height:1.7; }
.remember-option { display:flex; gap:8px; align-items:center; color:var(--muted); font-size:12px; margin:2px 0 24px; cursor:pointer; }
.form-check-input { margin:0; border-color:#bdcbd2; width:15px; height:15px; }
.form-check-input:checked { background-color:var(--teal); border-color:var(--teal); }
.account-submit { display:flex; justify-content:space-between; align-items:center; width:100%; min-height:46px; padding:12px 17px; border:1px solid var(--teal); border-radius:7px; background:var(--teal); color:white; font-weight:600; font-size:13px; transition:background .15s,transform .15s; }
.account-submit:hover { background:#115548; color:white; transform:translateY(-1px); }
.account-submit:disabled { opacity:.65; cursor:wait; transform:none; }
.account-switch { font-size:12px; color:var(--muted); text-align:center; margin:23px 0; }
.account-switch a { font-weight:650; margin-left:4px; }
.account-assurance { display:flex; align-items:center; justify-content:center; gap:7px; color:#7f8e98; font-size:10px; border-top:1px solid #edf0f2; padding-top:19px; }
.account-assurance svg { width:14px; height:14px; }
.site-footer { max-width:1280px; width:100%; margin:0 auto; display:flex; justify-content:space-between; gap:15px; padding:0 44px 24px; color:#82919b; font-size:10px; }
.message-card { background:white; border:1px solid var(--line); border-radius:18px; padding:50px; max-width:650px; margin:40px auto; }
.message-card h1 { font-size:26px; margin-bottom:18px; }
.message-card p { color:var(--muted); font-size:14px; line-height:1.8; }
.message-card .account-submit { margin-top:28px; width:230px; }
.portal-hero { background:#102b35; color:white; border-radius:18px; padding:50px; position:relative; overflow:hidden; }
.portal-hero::after { content:""; position:absolute; width:280px; height:280px; right:-50px; bottom:-100px; border:45px solid #7ae0c70c; border-radius:50%; pointer-events:none; }
.portal-hero h1 { font-size:32px; margin-bottom:18px; overflow-wrap:anywhere; }
.portal-hero p { color:#b4c9ce; font-size:14px; }
.portal-status { display:inline-flex; align-items:center; gap:8px; color:#c2eade; background:#ffffff0b; border:1px solid #ffffff18; padding:7px 12px; border-radius:6px; font-size:12px; margin-top:15px; }
.portal-grid { display:grid; grid-template-columns:1fr 1fr; gap:25px; margin-top:25px; }
.portal-card { padding:32px; border:1px solid var(--line); border-radius:13px; background:white; min-width:0; }
.portal-card h2 { font-size:21px; margin-bottom:24px; }
.portal-card dt { font-size:11px; color:var(--muted); font-weight:400; margin-top:18px; }
.portal-card dd { font-size:14px; margin:4px 0; overflow-wrap:anywhere; }
.portal-card p:not(.form-eyebrow) { color:var(--muted); font-size:13px; line-height:1.8; }
.secondary-button { background:white; border:1px solid #c8d8d3; border-radius:7px; color:var(--teal); padding:10px 16px; font-size:13px; margin-top:20px; }
.admin-link { display:block; margin-top:25px; font-size:13px; }
@media (max-width:1000px) { .site-nav { padding:0 28px; } .site-main { padding:28px; } .account-story { padding:32px 30px; } .account-form-panel { padding:35px 30px; } .story-heading h1 { font-size:29px; } .site-footer { padding:0 28px 24px; } }
@media (max-width:720px) { .site-nav { min-height:70px; padding:0 20px; } .brand { font-size:21px; } .brand-mark { width:31px; height:31px; } .nav-actions { gap:15px; font-size:12px; } .nav-register { padding:8px 10px; } .nav-user { max-width:110px; } .site-main { padding:22px 16px; } .account-shell { grid-template-columns:1fr; border-radius:13px; } .account-story { padding:25px 28px; } .story-heading { margin-top:20px; } .story-heading h1 { font-size:24px; line-height:1.5; margin-bottom:12px; } .story-heading h1 br { display:none; } .story-description { font-size:12px; } .story-description br { display:none; } .story-eyebrow { margin-bottom:10px; font-size:10px; } .market-illustration,.story-footer { display:none; } .account-form-panel { padding:32px 26px; } .account-form-content { max-width:440px; } .account-form-content h2 { font-size:26px; } .site-footer { padding:0 20px 22px; font-size:9px; } .portal-hero { padding:32px 25px; } .portal-hero h1 { font-size:25px; } .portal-grid { grid-template-columns:1fr; gap:18px; } .portal-card { padding:25px; } .message-card { padding:30px 25px; margin:10px auto; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; } }

/* 會員股票走勢查詢。 */
/* 流程：股票搜尋改以自訂浮層分列代號、名稱與市場，鍵盤焦點跟隨輸入框；清單限制高度並在手機貼齊欄位。 */
.stock-picker { position:relative; }
.stock-picker-control { position:relative; }
.stocks-query .stock-picker-control input { padding-left:38px; padding-right:39px; }
.stock-picker-search { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:17px; height:17px; color:#74a6be; pointer-events:none; }
.stock-picker-toggle { position:absolute; right:4px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:32px; height:32px; padding:5px; color:#9cc9df; border:0; border-radius:7px; background:transparent; }
.stock-picker-toggle:hover,.stock-picker-toggle[aria-expanded=true] { color:#a5edff; background:#24475c; }
.stock-picker-toggle svg { width:18px; height:18px; transition:transform .15s; }
.stock-picker-toggle[aria-expanded=true] svg { transform:rotate(180deg); }
.stock-picker-menu { position:absolute; top:calc(100% + 9px); left:0; z-index:60; width:max(100%,360px); max-width:calc(100vw - 64px); padding:8px; border:1px solid #345c77; border-radius:13px; background:linear-gradient(145deg,#142b40,#0b1b2b); box-shadow:0 18px 44px #0007,inset 0 1px #b6ecff12; }
.stock-picker-menu[hidden] { display:none; }
.stock-picker-heading { display:flex; justify-content:space-between; gap:15px; padding:9px 10px 11px; color:#deeffb; font-size:12px; font-weight:600; }
.stock-picker-heading > span:last-child { color:#7fa6bc; font-size:11px; font-weight:400; }
.stock-picker-results { max-height:300px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#365c77 transparent; }
.stock-picker-option { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:12px; margin:3px 0; padding:11px 10px; border:1px solid transparent; border-radius:8px; color:#d5e7f4; cursor:pointer; font-size:13px; }
.stock-picker-option:hover,.stock-picker-option.is-active { border-color:#317995; background:#174259; }
.stock-picker-option[aria-selected=true] { background:#14364a; border-color:#2e5d78; }
.stock-picker-option[aria-selected=true].is-active,.stock-picker-option[aria-selected=true]:hover { background:#1a4c63; border-color:#63cae7; }
.stock-picker-code { font-weight:700; font-variant-numeric:tabular-nums; color:#7cddf9; letter-spacing:.4px; }
.stock-picker-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stock-picker-market { padding:3px 7px; border-radius:5px; background:#88badc14; color:#a5bdce; font-size:10px; white-space:nowrap; }
.stock-picker-note { padding:12px 10px; margin:0; color:#9eb7ca; font-size:11px; line-height:1.6; }
.stock-picker-help { display:flex; gap:15px; padding:9px 10px 3px; border-top:1px solid #2b4358; color:#7896ad; font-size:10px; }
@media (max-width:600px) { .stock-picker-menu { width:100%; max-width:100%; } .stock-picker-option { gap:8px; grid-template-columns:50px minmax(0,1fr) auto; } }
/* 流程：依最新要求，手機與桌機均沿用上方共用的top定位向下展開，結果區保留原生捲動及既有觸控防誤選。 */
/* 流程：股票查詢直接呈現操作列，收起終端介紹與原會員專屬區塊；會員身分統一放在共用會員中心。 */
.stocks-heading { display:none; }
.stocks-heading h1 { font-size:29px; font-weight:700; letter-spacing:.3px; margin-bottom:12px; }
.stocks-heading p:last-child { color:var(--muted); font-size:14px; margin:0; }
.stocks-access { display:flex; align-items:center; gap:8px; flex-shrink:0; color:var(--teal); background:#e8f2ed; padding:8px 13px; border-radius:20px; font-size:12px; }
.stocks-access .story-dot { background:var(--teal); }
.stocks-query { display:flex; align-items:flex-end; gap:16px; padding:24px; background:white; border:1px solid var(--line); border-radius:12px; }
.stocks-query > div { flex:1; min-width:0; }
.stocks-query .stock-picker { flex:1.6; }
.stocks-query label { display:block; font-size:12px; font-weight:600; margin-bottom:9px; }
.stocks-query input { width:100%; min-width:0; }
.date-separator { color:#a4b1b7; padding-bottom:13px; }
.stocks-submit { border:0; background:var(--teal); color:white; height:46px; border-radius:7px; padding:0 22px; font-size:14px; font-weight:600; white-space:nowrap; }
.stocks-submit:hover { background:#104e43; }
.stocks-submit:disabled { opacity:.5; cursor:wait; }
.stocks-submit span { margin-left:12px; }
.stocks-shortcuts { display:flex; gap:8px; align-items:center; margin:15px 2px 20px; font-size:12px; color:var(--muted); }
.stocks-shortcuts > span:first-child { margin-right:6px; }
.stocks-shortcuts button { border:1px solid transparent; background:transparent; padding:5px 11px; border-radius:5px; color:var(--muted); }
.stocks-shortcuts button[aria-pressed=true] { border-color:#c8ddd7; background:#eaf3ef; color:var(--teal); }
.stocks-unit { margin-left:auto; font-size:11px; }
.stocks-message { padding:12px 16px; border-radius:7px; background:#eaf3ef; color:var(--teal); font-size:13px; }
.stocks-message:empty { display:none; }
.stocks-message.is-error { background:#fff1ef; color:#a33638; }
.stock-chart-card { background:white; border:1px solid var(--line); border-radius:14px; padding:28px 30px 20px; }
.stock-chart-top { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.stock-chart-top .form-eyebrow { margin-bottom:10px; }
.stock-chart-top h2 { font-size:25px; font-weight:700; }
.stock-chart-subtitle { color:var(--muted); font-size:12px; margin:8px 0 0; }
.chart-switch { display:flex; background:var(--paper); padding:4px; border:1px solid var(--line); border-radius:7px; flex-shrink:0; }
.chart-switch button { border:0; background:transparent; color:var(--muted); padding:7px 14px; border-radius:4px; font-size:12px; }
.chart-switch button[aria-selected=true] { background:white; color:var(--teal); box-shadow:0 1px 4px #162d3810; font-weight:650; }
.stock-metrics { display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:18px; margin:26px 0 20px; padding-bottom:22px; border-bottom:1px solid var(--line); }
.stock-metrics > div { display:flex; flex-direction:column; gap:8px; }
.stock-metrics span { color:var(--muted); font-size:11px; }
.stock-metrics strong { font-size:23px; font-weight:600; font-variant-numeric:tabular-nums; }
.stock-metrics > div:first-child strong { font-size:30px; line-height:1.1; }
.stock-metrics .price-up { color:#ba4549; }
.stock-metrics .price-down { color:#18826b; }
.chart-inspection { display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; min-height:30px; color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; }
.chart-key { display:flex; align-items:center; gap:5px; font-size:10px; }
.chart-key i { display:inline-block; width:7px; height:7px; border-radius:1px; margin-left:9px; }
.key-up { background:#c35055; } .key-down { background:#23836e; }
/* 流程：開收相同的白色K棒圖例，與日K／股票分鐘／期貨實際繪圖同色。 */
.key-flat { background:#ffffff; }
.stock-plot { position:relative; margin:14px 0 18px; min-height:220px; }
.stock-plot svg { display:block; width:100%; height:315px; touch-action:pan-y; overflow:visible; }
.chart-placeholder { position:absolute; inset:0; display:grid; place-content:center; padding:24px; text-align:center; color:var(--muted); font-size:13px; background:repeating-linear-gradient(to bottom,white 0,white 63px,#f1f4f4 64px); }
.chart-placeholder[hidden] { display:none; }
.chart-note { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:10px; color:var(--muted); padding-top:16px; border-top:1px solid var(--line); }
.stock-history { margin-top:20px; background:white; border:1px solid var(--line); border-radius:10px; padding:18px 24px; }
.stock-history summary { color:var(--ink); font-size:13px; cursor:pointer; }
.stock-history summary span { float:right; color:var(--muted); font-size:11px; }
.stock-table-scroll { overflow-x:auto; margin-top:20px; }
.stock-history table { width:100%; border-collapse:collapse; font-size:12px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.stock-history th,.stock-history td { padding:13px 14px; text-align:right; border-bottom:1px solid var(--line); }
.stock-history th { color:var(--muted); font-weight:500; background:#f8faf9; }
.stock-history th:first-child,.stock-history td:first-child { text-align:left; }
.stocks-footnote { color:var(--muted); font-size:11px; line-height:1.8; margin:18px 2px 0; }
/* 流程：均線設定產生可見曲線與數值，工具列控制下載後的可見視窗，手機改用按鈕與滑桿。 */
.ma-settings { border:1px solid var(--line); border-radius:8px; padding:12px 15px; margin-bottom:15px; font-size:12px; }
.ma-settings summary { cursor:pointer; font-weight:600; }
.ma-settings summary span { margin-left:12px; font-size:11px; color:var(--muted); font-weight:400; }
.ma-settings-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; margin:20px 0 16px; }
.ma-setting label { display:flex; align-items:center; gap:6px; margin-bottom:9px; font-size:11px; }
.ma-setting input[type=checkbox] { accent-color:var(--ma-color); }
.ma-setting i { background:var(--ma-color); width:13px; height:3px; display:inline-block; }
.ma-setting > div { display:flex; align-items:center; gap:7px; }
.ma-setting input[type=number] { border:1px solid #d6e1df; padding:7px; width:65px; max-width:65%; border-radius:5px; color:var(--ink); }
.ma-setting span { color:var(--muted); font-size:10px; white-space:nowrap; }
.ma-settings-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.ma-settings-actions button { padding:7px 12px; background:#eaf3ef; border:1px solid #cadfd8; border-radius:5px; color:var(--teal); }
.ma-settings-actions button[type=button] { background:white; }
.ma-settings-actions span { color:var(--muted); font-size:11px; }
.ma-values { display:flex; flex-wrap:wrap; gap:10px 18px; font-size:11px; font-variant-numeric:tabular-nums; min-height:20px; margin-bottom:14px; }
.ma-values span { border-bottom:2px solid currentColor; padding-bottom:4px; }
.chart-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin:14px 0; }
.chart-toolbar > span { font-size:10px; color:var(--muted); }
.chart-zoom-buttons { display:flex; gap:6px; }
.chart-zoom-buttons button { color:var(--teal); background:white; border:1px solid #d6e1df; border-radius:5px; min-width:32px; min-height:30px; padding:4px 10px; font-size:11px; }
.chart-zoom-buttons button:disabled { opacity:.35; cursor:default; }
.stock-plot svg { cursor:crosshair; user-select:none; }
.stock-plot svg.is-dragging { cursor:grabbing; }
.chart-pan-label { display:flex; align-items:center; gap:15px; color:var(--muted); font-size:10px; margin:0 0 8px; }
.chart-pan-label input { flex:1; min-width:0; accent-color:var(--teal); }
.chart-interaction-hint { font-size:10px; color:var(--muted); margin:0 0 15px; line-height:1.8; }
.stock-chart-card:fullscreen { overflow:auto; border-radius:0; padding:30px 5vw; }
/* 流程：主圖以原高度的 90% 重新排版，寬度及副圖不變，沿用尺寸觀察器重新投影行情與標註。 */
.stock-chart-card:fullscreen .stock-plot svg { height:clamp(307.8px,61.56vh,855px); }
@media (max-width:1000px) { .ma-settings-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:600px) { .ma-settings { padding:12px; } .ma-settings summary span { display:block; margin:8px 0 0 16px; } .ma-settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ma-values { gap:10px 14px; } }
@media (max-width:900px) { .stocks-query { flex-wrap:wrap; } .stocks-query .stock-picker { flex-basis:100%; } .stocks-unit { display:none; } .stock-metrics { gap:12px; } .stock-metrics strong { font-size:19px; } }
@media (max-width:600px) { .stocks-heading h1 { font-size:23px; line-height:1.5; } .stocks-access { display:none; } .stocks-query { padding:18px; gap:12px; } .stocks-query > div:not(.stock-picker) { flex-basis:calc(50% - 6px); } .date-separator { display:none; } .stocks-submit { width:100%; } .stocks-shortcuts { gap:2px; } .stocks-shortcuts button { padding:5px 8px; } .stock-chart-card { padding:22px 16px 16px; } .stock-chart-top { flex-direction:column; } .stock-chart-top h2 { font-size:22px; } .stock-metrics { grid-template-columns:repeat(3,1fr); row-gap:18px; } .stock-metrics strong { font-size:18px; } .stock-metrics > div:first-child strong { font-size:24px; } .stock-plot { min-height:0; } .stock-plot svg { min-height:0; } .chart-inspection { min-height:54px; } .stock-history { padding:17px 16px; } .nav-user { max-width:70px; } }
/* 流程：以文字揭示即時連線與保存狀態，不用顏色單獨表示資料是否過期。 */
.stocks-live-status { color: #35685f; font-size: .85rem; margin: -.25rem 0 1rem; }
/* 流程：副圖沿用主圖寬度與右側座標留白；小螢幕設定換行，hidden 面板不佔空間。 */
.indicator-panel { border-top:1px solid #e5ecef; margin-top:12px; padding-top:14px; }
.indicator-panel[hidden] { display:none; }
.indicator-panel h3 { font-size:13px; font-weight:600; color:#355364; display:flex; gap:18px; flex-wrap:wrap; }
.indicator-panel h3 span { font-size:12px; font-weight:400; color:#647e90; }
.indicator-panel svg { width:100%; height:170px; display:block; touch-action:pan-y; }
.indicator-settings { display:flex; flex-wrap:wrap; gap:12px; padding:14px 0; align-items:center; }
.indicator-settings label { display:flex; gap:6px; align-items:center; font-size:12px; }
.indicator-settings input[type=number] { width:64px; }
.indicator-settings select,.indicator-settings input[type=number],.indicator-settings button { border:1px solid #dbe5e9; background:#fff; border-radius:5px; padding:6px; color:#284d60; }
[data-indicator-status] { color:#647e90; font-size:12px; line-height:1.6; }
/* 繪圖與平移工具分開切換；手機採兩次點選，保存狀態維持可見以便重試。 */
.drawing-tools { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:12px 0; }
.drawing-tools button,.drawing-tools select { padding:5px 9px; border:1px solid #dbe5e9; background:white; border-radius:5px; font-size:12px; color:#355364; }
.drawing-tools button[aria-pressed=true] { background:#e8f4f1; border-color:#23836e; }
.drawing-tools label { display:flex; align-items:center; gap:5px; font-size:12px; }
.drawing-tools input[type=color] { width:28px; height:25px; padding:1px; border:0; }
.drawing-tools input[type=range] { width:65px; }
.drawing-status { color:#647e90; font-size:12px; }
.indicator-unit-note { color:#647e90; font-size:11px; margin:0 0 8px; }
[data-chart-svg].is-drawing { cursor:crosshair; touch-action:none; }

/* 流程：只有股票頁套用深色科技終端；青色互動、紅漲綠跌與高對比格線共用主副圖。 */
body.market-terminal { --ink:#e3edf7; --muted:#9bb0c6; --teal:#38bdf8; --line:#263d54; --paper:#09121f; color-scheme:dark; background:radial-gradient(ellipse at 80% 0%,#12324566,transparent 45%),#09121f; }
.market-terminal .site-header { background:#0c1827ed; border-bottom-color:#244055; }
.market-terminal .brand { color:#e9f4ff; }
.market-terminal .brand-mark { color:#07111f; background:#38bdf8; box-shadow:0 0 20px #38bdf826; }
.market-terminal .brand-accent,.market-terminal .nav-login,.market-terminal .nav-user { color:#b6cee4; }
.market-terminal .nav-function-toggle { background:#10283b; border-color:#2c4b63; color:#b9edff; }
.market-terminal .nav-menu-user { color:#98b6cb; border-left-color:#315269; }
.market-terminal .nav-function-menu { background:#102335; border-color:#31516b; box-shadow:0 16px 36px #0006; }
.market-terminal .nav-menu-caption { color:#89a9bf; }
.market-terminal .nav-function-menu .dropdown-item { color:#d6e8f5; }
.market-terminal .nav-function-menu .dropdown-item:hover,.market-terminal .nav-function-menu .dropdown-item:focus,.market-terminal .nav-function-menu .dropdown-item.active { color:#a5e8ff; background:#1d4058; }
.market-terminal .nav-function-menu .nav-menu-logout { color:#fda4af; }
.market-terminal .nav-function-menu .dropdown-divider { border-top-color:#2e495e; }
/* 流程：會員入口改為圖示／名稱卡片，下拉列出角色與功能；沿用原有下拉鍵盤及登出授權流程。 */
.nav-function-toggle { gap:10px; border-radius:14px; padding:7px 12px 7px 7px; }
.nav-member-avatar { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border:1px solid #72b8d34d; border-radius:10px; background:#67c9ed18; color:#2784a4; }
.nav-member-avatar svg { width:23px; height:23px; }
.nav-member-summary { display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:0; }
.nav-member-summary small { color:#718b9c; font-size:9px; letter-spacing:1px; }
.nav-member-summary .nav-menu-user { padding:0; border:0; max-width:150px; font-size:13px; font-weight:600; }
.nav-function-toggle[aria-expanded=true] .nav-menu-chevron { transform:rotate(180deg); }
.nav-function-menu { min-width:258px; padding:9px; border-radius:16px; }
.nav-member-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px 12px; margin:1px 2px 9px; padding:14px 12px; border-bottom:1px solid #31516b44; }
.nav-member-card > span:first-child { grid-column:1/-1; color:#7d99ad; font-size:10px; }
.nav-member-card strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.nav-member-role { align-self:center; padding:3px 7px; background:#64c7e31c; border:1px solid #65bbd530; border-radius:20px; color:#4092ae; font-size:10px; }
.nav-function-menu .dropdown-item { display:flex; align-items:center; gap:11px; min-height:43px; border-radius:9px; }
.nav-menu-symbol { display:grid; place-items:center; width:27px; height:27px; border-radius:7px; background:#71aac716; font-size:18px; }
.market-terminal .nav-member-avatar { color:#8ae0ff; background:linear-gradient(135deg,#226280,#173a54); border-color:#3a7791; }
.market-terminal .nav-function-toggle { background:linear-gradient(135deg,#17364c,#102536); box-shadow:inset 0 1px #9ddfff12; }
.market-terminal .nav-function-menu { background:linear-gradient(145deg,#173249,#0d1e30); border-color:#3b6380; box-shadow:0 18px 48px #0008; }
.market-terminal .nav-member-card strong { color:#e8f5ff; }
.market-terminal .nav-member-role { color:#99e6fa; }
/* 流程：依伺服器既有會員標籤顯示四種圖示，顏色與形狀並用；名稱可截斷，身分文字仍在下拉及無障礙名稱保留。 */
.nav-function-dropdown [data-member-tier] { --member-tier-color:#217e9b; --member-tier-bg:#4ebbd218; }
.nav-function-dropdown [data-member-tier=advanced] { --member-tier-color:#7850bb; --member-tier-bg:#ad80ef20; }
.nav-function-dropdown [data-member-tier=vip] { --member-tier-color:#946000; --member-tier-bg:#ecc45424; }
.nav-function-dropdown [data-member-tier=admin] { --member-tier-color:#157a65; --member-tier-bg:#38bd9c20; }
.market-terminal .nav-function-dropdown [data-member-tier] { --member-tier-color:#8ae0ff; }
.market-terminal .nav-function-dropdown [data-member-tier=advanced] { --member-tier-color:#c5a3fc; }
.market-terminal .nav-function-dropdown [data-member-tier=vip] { --member-tier-color:#f8d477; }
.market-terminal .nav-function-dropdown [data-member-tier=admin] { --member-tier-color:#85e8c7; }
.nav-function-toggle[data-member-tier] .nav-member-avatar { color:var(--member-tier-color); background:var(--member-tier-bg); border-color:currentColor; }
.nav-member-card-name { display:flex; align-items:center; gap:7px; }
.nav-tier-icon { width:18px; height:18px; flex-shrink:0; color:var(--member-tier-color); }
.nav-member-avatar .nav-tier-icon { width:23px; height:23px; }
.nav-member-name-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-member-card[data-member-tier] .nav-member-role { color:var(--member-tier-color); background:var(--member-tier-bg); }
/* 流程：審核頁以安全投影列出待審會員；窄螢幕以表格橫向捲動保留名稱、時間與核准按鈕。 */
.review-count { padding:8px 13px; border:1px solid #315d76; border-radius:20px; color:#8bdcf4; font-size:12px; white-space:nowrap; }
.review-card { border:1px solid #2e4d66; border-radius:16px; background:linear-gradient(135deg,#132a3e,#0e1c2d); overflow:hidden; }
.review-card-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding:23px; border-bottom:1px solid #294459; }
.review-card-heading h2 { margin:0; font-size:17px; color:#e1f0fa; }
.review-card-heading span,.review-empty { color:#9eb6c9; font-size:12px; }
.review-empty { margin:0; padding:50px 24px; text-align:center; }
.review-table-scroll { overflow-x:auto; }
.review-table { width:100%; border-collapse:collapse; font-size:13px; }
.review-table th,.review-table td { padding:17px 22px; border-bottom:1px solid #294154; vertical-align:middle; }
.review-table th { color:#87a8be; font-size:11px; font-weight:500; }
.review-table td { color:#d0e4f1; overflow-wrap:anywhere; min-width:130px; }
.review-table td:first-child { font-weight:600; }
.review-table td:nth-child(3) { min-width:180px; white-space:nowrap; font-size:12px; font-variant-numeric:tabular-nums; }
.review-state { display:inline-block; padding:5px 9px; color:#f9d48a; background:#d4a84316; border:1px solid #b19a4633; border-radius:6px; font-size:11px; white-space:nowrap; }
.review-approve { padding:8px 13px; border:1px solid #3f829e; border-radius:7px; background:#1c546c; color:#b2ecff; font-size:12px; white-space:nowrap; }
.review-approve:hover { background:#286d87; }
.review-feedback { padding:13px 16px; border:1px solid #2d7169; border-radius:9px; color:#9be5cb; background:#143b35; font-size:13px; }
.review-feedback.is-error { color:#ffc2cc; border-color:#754756; background:#3c2634; }
.review-pagination { display:flex; justify-content:space-between; align-items:center; padding:18px 23px; color:#8faac0; font-size:12px; }
.review-pagination > div { display:flex; gap:12px; }
.review-pagination a { color:#8fe0fc; }
/* 流程：審核與所有會員頁簽共用深色卡片；角色表單保留可觸控尺寸及鍵盤焦點。 */
.review-tabs { display:flex; gap:8px; margin:0 0 20px; border-bottom:1px solid #2c485f; }
.review-tabs a { padding:13px 18px; color:#9db6cb; border-bottom:2px solid transparent; font-size:14px; }
.review-tabs a.active { color:#7dd3fc; border-color:#38bdf8; }
.review-role-form { display:flex; gap:8px; align-items:center; }
.review-role-form select { padding:10px; min-height:44px; border:1px solid #3d5d75; border-radius:7px; background:#0a1a2b; color:#d6ecfb; font-size:13px; }
.review-role-form button { min-height:44px; }
.review-self { display:block; margin-top:5px; color:#91adc3; font-size:11px; font-weight:400; white-space:nowrap; }
.review-state.is-approved { color:#99e7ce; background:#33bb8816; border-color:#398b6e55; }
.review-role-label { white-space:nowrap; }
.review-tabs a:focus-visible,.review-role-form select:focus-visible,.review-approve:focus-visible { outline:2px solid #7dd3fc; outline-offset:3px; }
.review-approve:disabled { opacity:.45; cursor:not-allowed; }
/* 流程：我的帳號套用登入／註冊與走勢相同色系，手機卡片改為單欄，長名稱與 Email 可換行。 */
.portal-terminal .portal-hero { border:1px solid #2d5068; background:radial-gradient(ellipse at 100% 0,#14536c66,transparent 65%),linear-gradient(135deg,#122c42,#0c1c2e); }
.portal-terminal .portal-hero h1 { color:#edf7ff; }
.portal-terminal .portal-hero p { color:#a9c1d5; }
.portal-terminal .portal-hero .story-eyebrow { color:#69d9ef; }
.portal-terminal .portal-status { color:#9fe8d1; border-color:#336d68; background:#143b354d; }
.portal-terminal .portal-card { border-color:#2a4861; background:linear-gradient(135deg,#132a3e,#0e1c2d); }
.portal-terminal .portal-card h2,.portal-terminal .portal-card dd { color:#e1f0fa; }
.portal-terminal .portal-card dt,.portal-terminal .portal-card p:not(.form-eyebrow) { color:#9eb6c9; }
.portal-links { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
.portal-terminal .secondary-button { display:inline-flex; align-items:center; gap:18px; padding:12px 16px; color:#a5e6fc; background:#153d53; border:1px solid #37667d; border-radius:8px; }
.portal-terminal .secondary-button:hover { background:#20566e; }
.portal-terminal .admin-link { color:#8edcf6; margin:0; }
@media (max-width:720px) { .review-card-heading { padding:18px; } .review-table th,.review-table td { padding:15px; } .review-tabs a { padding:13px 14px; } }
@media (max-width:520px) {
    .site-nav { gap:10px; }
    .site-nav .brand { flex-shrink:0; }
    .nav-actions,.nav-function-dropdown { min-width:0; }
    .nav-member-summary { display:flex; flex:1; }
    .nav-member-summary .nav-menu-user { display:block; max-width:min(80px,100%); }
    .nav-function-toggle { padding:6px 9px 6px 6px; gap:6px; }
}
/* 流程：登入頁沿用股票終端背景、青色互動與高對比欄位；保留既有響應式分欄及驗證訊息。 */
.account-terminal .account-shell { border-color:#2a4861; background:#102033; box-shadow:0 20px 70px #0004,inset 0 1px #9de5ff0c; }
.account-terminal .account-story { background:radial-gradient(ellipse at 0 100%,#144b6066,transparent 70%),linear-gradient(135deg,#0d293d,#0a192b); border-right:1px solid #284459; }
.account-terminal .story-topline,.account-terminal .story-eyebrow { color:#69d9ef; }
.account-terminal .story-heading h1 { color:#f0f8ff; }
.account-terminal .story-description { color:#a9c1d5; }
.account-terminal .chart-tag { color:#9be7ff; border-color:#2b536b; background:#0f3143; }
.account-terminal .story-icon { color:#38bdf8; }
.account-terminal .account-form-panel { background:linear-gradient(145deg,#12263a,#0d1c2d); }
.account-terminal .account-form-content h2 { color:#edf7ff; }
.account-terminal .account-tabs { border-color:#2a455d; }
.account-terminal .account-tabs a { color:#9db5cb; }
.account-terminal .account-tabs .active { color:#7dd3fc; border-color:#38bdf8; }
.account-terminal .form-field label { color:#caddf0; }
.account-terminal .form-control { color:#e7f3ff; background:#091827; border-color:#34516a; }
.account-terminal .form-control::placeholder { color:#819bb0; }
.account-terminal .form-control:focus { background:#0b2033; color:#edf7ff; border-color:#38bdf8; box-shadow:0 0 0 3px #38bdf820; }
.account-terminal .password-toggle { color:#8ed7f4; }
.account-terminal .form-check-input { background-color:#0a1929; border-color:#49657d; }
.account-terminal .form-check-input:checked { background-color:#38bdf8; border-color:#38bdf8; }
.account-terminal .remember-option { margin-bottom:7px; color:#b4c8da; }
.account-terminal .remember-hint { color:#829fb7; font-size:11px; line-height:1.7; margin:0 0 20px; }
.account-terminal .account-submit { background:#38bdf8; border-color:#38bdf8; color:#071724; box-shadow:0 0 22px #38bdf818; }
.account-terminal .account-submit:hover { background:#7dd3fc; border-color:#7dd3fc; color:#071724; }
.account-terminal .account-assurance { color:#91b4cc; border-color:#29445b; }
.account-terminal .field-error { color:#fda4af; }
.account-terminal .input-validation-error { border-color:#fb7185; }
.account-terminal .account-errors.validation-summary-errors { background:#371e2d; border-color:#764354; color:#fecdd3; }
.account-terminal .account-success { background:#123837; border-color:#2b6b62; color:#99f6e4; }
@media (max-width:720px) { .account-terminal .account-story { border-right:0; border-bottom:1px solid #284459; } }
.market-terminal .site-main { width:100%; max-width:1400px; }
.market-terminal .site-footer { color:#8da5bb; }
.market-terminal .stocks-heading { margin-bottom:22px; }
.market-terminal .stocks-heading h1 { color:#eef6ff; letter-spacing:1px; }
.market-terminal .form-eyebrow { color:#5ad6ee; letter-spacing:2px; }
.market-terminal .stocks-access { background:#0f2938; color:#6ce5e1; border:1px solid #245262; border-radius:6px; }
.market-terminal .stocks-query { background:#101e2e; border-color:#2a425a; box-shadow:0 8px 32px #0002; }
.market-terminal .stocks-query .form-control { color:#e8f2fd; background:#0a1625; border-color:#304b65; }
.market-terminal .form-control::placeholder { color:#8da5bb; }
.market-terminal .stocks-submit { color:#051321; background:#38bdf8; box-shadow:0 0 20px #38bdf81a; }
.market-terminal .stocks-submit:hover { background:#7dd3fc; }
.market-terminal .stocks-shortcuts button { color:#adbed0; }
.market-terminal .stocks-shortcuts button[aria-pressed=true] { background:#15354b; border-color:#357497; color:#9fe7ff; }
.market-terminal .stocks-message { background:#112f40; color:#a5e9ff; border:1px solid #275370; }
.market-terminal .stocks-message.is-error { background:#391d2a; color:#fda4af; border-color:#754250; }
.market-terminal .stocks-live-status { color:#87d9dd; border-left:2px solid #2dd4bf; padding-left:10px; }
/* 流程：股票桌面頁解除共用 1280px 上限，導覽／內容／頁尾一起展開，兩側保留彈性留白；窄版沿用原排列。 */
@media (min-width:1100px) {
    .stocks-terminal .site-nav,.stocks-terminal .site-main,.stocks-terminal .site-footer { max-width:none; padding-left:clamp(20px,2vw,48px); padding-right:clamp(20px,2vw,48px); }
}
.market-terminal .stock-chart-card { background:linear-gradient(135deg,#112236,#0d1a2a 58%); border-color:#2b4862; box-shadow:0 12px 48px #0003,inset 0 1px #91dbff0c; }
.market-terminal .stock-chart-top h2 { color:#f0f7ff; letter-spacing:.5px; }
.chart-top-actions { display:flex; align-items:center; gap:10px; }
.market-terminal .chart-switch { background:#091727; border-color:#304a63; }
.market-terminal .chart-switch button { color:#9ab3cb; }
.market-terminal .chart-switch button[aria-selected=true] { color:#a7ebff; background:#1a3a53; box-shadow:inset 0 0 0 1px #376783; }
.chart-settings-trigger { width:42px; height:42px; display:grid; place-items:center; border-radius:7px; border:1px solid #37536e; background:#10253a; color:#a8ddf5; }
.chart-settings-trigger:hover { color:#e6f8ff; border-color:#38bdf8; background:#17354e; }
.chart-settings-trigger svg { width:22px; height:22px; }
.market-terminal .stock-metrics { border-bottom-color:#2b425a; }
.market-terminal .stock-metrics strong { color:#ecf6ff; font-family:"Cascadia Code",Consolas,monospace; }
.market-terminal .stock-metrics .price-up { color:#fb7185; }
.market-terminal .stock-metrics .price-down { color:#2dd4bf; }
.market-terminal .chart-zoom-buttons button,.market-terminal .drawing-tools button,.market-terminal .drawing-tools select { background:#10253a; border-color:#36516a; color:#bdd4e8; }
.market-terminal .chart-zoom-buttons button:hover,.market-terminal .drawing-tools button:hover { background:#1c3c55; border-color:#4e8bb0; }
.market-terminal .drawing-tools button[aria-pressed=true] { color:#99e9ff; background:#163d53; border-color:#38bdf8; box-shadow:inset 0 -2px #38bdf8; }
.market-terminal .drawing-tools label { color:#afc5da; }
.market-terminal .drawing-tools input[type=range],.market-terminal .chart-pan-label input { accent-color:#38bdf8; }
.market-terminal .drawing-status,.market-terminal [data-indicator-status] { color:#9fb9d1; }
/* 流程：股票主圖移除容器外框，保留深色對比、原有留白及圖內格線，不影響縮放與繪圖座標。 */
.market-terminal .stock-plot { background:linear-gradient(#0b1828,#0c1b2b); border:0; border-radius:8px; padding:8px 5px 0; }
/* 流程：依使用者選定，從目前高度再縮小 10%；桌機、手機及全螢幕同乘 0.9，不縮放字體、寬度或 MACD。 */
.market-terminal .stock-plot svg { height:clamp(444.6px,58.14vh,701.1px); }
.market-terminal .key-up { background:#fb7185; }
.market-terminal .key-down { background:#2dd4bf; }
.market-terminal .chart-placeholder { background:repeating-linear-gradient(to bottom,#0c1b2b 0,#0c1b2b 63px,#20394f 64px); border-radius:8px; }
.market-terminal .indicator-panel { border-top-color:#2b425a; }
.market-terminal .indicator-panel h3 { color:#dbefff; letter-spacing:.3px; }
.market-terminal .indicator-panel h3 span,.market-terminal .indicator-unit-note { color:#a1b8cd; }
.market-terminal .indicator-panel svg { background:#0b1828; border:1px solid #253e56; border-radius:7px; height:165px; }
.market-terminal .chart-note { border-top-color:#2b425a; }
.market-terminal .stock-history { display:none; }
/* 流程：齒輪對話框可捲動，遮罩保留圖表脈絡；關閉／Esc 由原生 dialog 還原焦點。 */
.chart-settings-dialog { width:min(780px,calc(100vw - 32px)); max-height:calc(100dvh - 48px); border:1px solid #385b78; border-radius:14px; padding:24px; background:#102033; color:#e3edf7; box-shadow:0 24px 100px #0009; overflow:auto; }
.chart-settings-dialog::backdrop { background:#020810b8; backdrop-filter:blur(5px); }
.chart-settings-header { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:24px; }
.chart-settings-header h2 { font-size:23px; margin:5px 0 0; }
.chart-settings-header .form-eyebrow { margin:0; }
.chart-settings-header > button { background:#193248; color:#d7edff; border:1px solid #3a5873; border-radius:6px; width:36px; height:36px; font-size:24px; }
.chart-settings-dialog .ma-settings { background:#0c1b2c; border-color:#2a4660; padding:16px; }
.chart-settings-dialog .ma-settings-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.chart-settings-dialog .ma-setting input[type=number],.chart-settings-dialog .indicator-settings input[type=number],.chart-settings-dialog .indicator-settings select { color:#e3edf7; background:#142a40; border-color:#3a5873; }
.chart-settings-dialog .ma-settings-actions button,.chart-settings-dialog .indicator-settings button { color:#a5e9ff; background:#163d53; border-color:#367493; }
.chart-settings-dialog .ma-settings summary,.chart-settings-dialog .indicator-settings label { color:#d5e8f9; }
.chart-settings-dialog .ma-settings-actions span,.chart-settings-note { color:#9fb7cd; font-size:12px; line-height:1.8; }
.chart-settings-note { margin:16px 0 0; }
/* 流程：自動型態四個原生checkbox獨立控制圖層；桌機兩欄、窄螢幕一欄，label保留44px觸控高度。 */
.chart-pattern-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 16px; margin-top:10px; }
.chart-pattern-options label { display:flex; align-items:center; gap:10px; min-height:44px; color:#d5e8f9; cursor:pointer; }
.chart-pattern-options input[type=checkbox] { width:18px; height:18px; flex:none; accent-color:#38bdf8; }
@media (max-width:480px) { .chart-pattern-options { grid-template-columns:1fr; } }
.market-terminal button:disabled { opacity:.4; cursor:default; }
.market-terminal :focus-visible { outline:2px solid #7dd3fc; outline-offset:4px; }
@media (max-width:600px) {
    .market-terminal .stock-chart-top { flex-direction:row; flex-wrap:wrap; }
    .chart-top-actions { margin-left:auto; }
    .chart-settings-dialog { padding:18px; max-height:calc(100dvh - 24px); }
    .chart-settings-dialog .ma-settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .market-terminal .stock-plot svg { height:clamp(307.8px,49.59vh,444.6px); }
    .market-terminal .stocks-heading h1 { font-size:24px; }
}

/* 流程：主價格旁集中今日百分比與每股價差；其餘四項縮小，窄螢幕將主價格獨占一列以保持相鄰。 */
.market-terminal .stock-chart-top { display:grid; grid-template-columns:minmax(155px,.9fr) minmax(0,3.2fr) auto; gap:20px; align-items:start; border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:20px; }
.market-terminal .stock-chart-identity { min-width:0; }
.market-terminal .stock-chart-identity h2 { overflow-wrap:anywhere; }
.market-terminal .stock-chart-identity .stock-chart-subtitle { font-size:11px; line-height:1.7; }
.market-terminal .stock-metrics { grid-template-columns:minmax(245px,2.8fr) repeat(4,minmax(52px,1fr)); gap:12px; margin:0; padding:0; border:0; min-width:0; }
.market-terminal .stock-metrics span { font-size:10px; white-space:nowrap; }
.market-terminal .stock-metrics strong { font-size:21px; line-height:1.25; white-space:nowrap; }
/* 流程：除權息是系統事件；列表與查價文字獨立占位，長明細換行，手機不擠壓主圖或會員工具。 */
.stock-ex-dividends { margin:8px 0 14px; padding:10px 12px; border-left:2px solid #d7aa46; background:#15232f; font-size:12px; color:#c9d8e4; overflow-wrap:anywhere; }
.stock-ex-dividends p { margin:0 0 6px; }
.stock-ex-dividends summary { cursor:pointer; color:#fde68a; }
.stock-ex-dividends ul { max-height:180px; overflow-y:auto; padding-left:20px; margin:8px 0 0; }
.stock-ex-dividends li { margin:6px 0; }
.market-terminal .stock-price-headline { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.market-terminal .stock-metrics .stock-price-headline > strong { font-size:27px; line-height:1.1; }
.market-terminal .stock-today-return { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.market-terminal .stock-metrics .stock-today-return strong { font-size:16px; }
.market-terminal .stock-metric-secondary { gap:6px; padding-top:1px; }
.market-terminal .stock-metric-secondary > span { font-size:9px; }
.market-terminal .stock-metric-secondary > strong { font-size:16px; font-weight:500; }
@media (max-width:1260px) {
    .market-terminal .stock-chart-top { grid-template-columns:minmax(155px,.8fr) minmax(0,2fr); gap:16px 22px; }
    .market-terminal .stock-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
    .market-terminal .stock-price-primary { grid-column:1 / -1; }
    .market-terminal .chart-top-actions { grid-column:1 / -1; justify-self:end; }
}
@media (max-width:520px) {
    .market-terminal .stock-chart-top { grid-template-columns:minmax(0,1fr); }
    .market-terminal .stock-metrics { gap:16px 10px; }
    .market-terminal .stock-metrics strong { font-size:18px; }
    .market-terminal .stock-metrics .stock-price-headline > strong { font-size:24px; }
    .market-terminal .stock-metrics .stock-today-return strong { font-size:15px; }
    .market-terminal .stock-metric-secondary > strong { font-size:14px; }
}
/* 流程說明：當日分時獨立面板沿用深色終端對比，固定時間軸且保留鍵盤焦點；小螢幕標頭換行。 */
.stock-intraday-card { margin: 18px 0; padding: 22px 26px; border: 1px solid #29465e; border-radius: 18px; background: linear-gradient(140deg, #102335, #0b1929); color: #d9e9f5; }
.stock-intraday-card header { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.stock-intraday-card h2 { font-size: 19px; margin: 0; color: #e0f2fe; }
.stock-intraday-card header > span { color: #7dd3fc; font: 13px ui-monospace, monospace; }
.stock-intraday-card small { color: #9bb2c8; margin-left: 7px; }
.stock-intraday-card > p { color: #9bb2c8; font-size: 12px; margin: 12px 0 6px; }
.stock-intraday-card .intraday-inspect { min-height: 18px; color: #b8e7ff; }
.stock-intraday-card svg { display: block; width: 100%; height: 235px; border-radius: 8px; background: #0a1828; }
.stock-intraday-card svg:focus-visible { outline: 2px solid #38bdf8; outline-offset: 3px; }
.stock-intraday-card .intraday-note { line-height: 1.7; }
/* 流程：同一張卡片切換分時／日線，hidden 面板不佔高度；窄螢幕頁籤換行仍可操作。 */
.stock-intraday-card[hidden], [data-history-panel][hidden] { display:none; }
.stock-chart-card > .stock-intraday-card { margin:0; }
.chart-top-actions { max-width:100%; flex-wrap:wrap; }
.chart-settings-trigger:disabled { opacity:.4; cursor:not-allowed; }
@media (max-width:520px) { .market-terminal .chart-switch button { padding:7px 9px; white-space:nowrap; } }
@media (max-width: 520px) { .stock-intraday-card { padding: 18px 12px; } }
/* 流程：股票與期貨 MA 在主圖容器頂部獨占一列並參與排版；換行會自動增加列高，K 棒由下方開始，不再被文字覆蓋。 */
.stock-plot,.future-main-plot { position:relative; }
.ma-values.chart-ma-overlay { position:static; display:flex; flex-wrap:wrap; align-items:center; gap:5px 16px; width:fit-content; max-width:calc(100% - 24px); min-height:0; margin:0 12px 8px; padding:6px 9px; border:1px solid #35526c80; border-radius:6px; background:#0b1c2ae6; pointer-events:none; font-size:12px; line-height:1.5; }
.ma-values.chart-ma-overlay span { border:0; padding:0; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ma-values.chart-ma-overlay:empty,.ma-values.chart-ma-overlay[hidden] { display:none; }
@media(max-width:720px) { .ma-values.chart-ma-overlay { margin-left:8px; margin-right:8px; max-width:calc(100% - 16px); gap:3px 12px; font-size:11px; } }

/* 流程：法人浮窗以日K的真實交易日定位，股轉張保留三位；HTML浮層不攔截查價或會員繪圖。 */
.stock-plot .stock-institutional-tooltip { position:absolute; z-index:6; max-width:calc(100% - 16px); width:max-content; padding:9px 12px; border:1px solid #6bafc3; border-radius:8px; background:#153044; color:#e2eef7; box-shadow:0 5px 18px #0005; pointer-events:none; font-size:16px; line-height:1.6; font-variant-numeric:tabular-nums; }
.stock-plot .stock-institutional-tooltip[hidden] { display:none; }
.stock-institutional-tooltip .institutional-date { color:#b0c7da; font-size:12px; }
.stock-institutional-tooltip .institutional-values { display:flex; flex-wrap:wrap; gap:2px 14px; }
.stock-institutional-tooltip .institutional-values > span { white-space:nowrap; }
.stock-institutional-tooltip .institutional-state { color:#b0c7da; font-size:11px; margin-top:3px; overflow-wrap:anywhere; }
.stock-institutional-tooltip .price-up { color:#fb7185; }
.stock-institutional-tooltip .price-down { color:#2dd4bf; }

/* 流程：會員禁登、驗證器及被踢訊息使用正常文件排版；手機欄位可換行，金鑰不溢出、不隱藏管理日期。 */
.member-security-page{max-width:820px;margin:24px auto;padding:20px;color:#dceaf7}
.member-security-form,.member-ban-form{display:grid;gap:12px;margin:16px 0;min-width:0}
.member-security-form label,.member-ban-form label{display:grid;gap:6px}
.member-security-form input,.member-ban-form input,.member-review-page input[name=code]{max-width:100%;min-width:0;min-height:44px;border:1px solid #36536a;border-radius:6px;background:#10273b;color:#edf6ff;padding:8px;font-size:16px}
.member-security-form button,.member-ban-form button{min-height:44px;background:#164c68;color:#eef7ff;border:1px solid #3f738d;border-radius:6px;padding:8px 12px}
.member-ban-form input[type=checkbox]{min-height:20px;justify-self:start}
.member-setup-key{overflow-wrap:anywhere;user-select:all}
.member-session-dialog{background:#10273b;color:#edf6ff;border:1px solid #486980;border-radius:12px;width:min(440px,calc(100vw - 32px));padding:24px}
.member-session-dialog::backdrop{background:rgb(0 0 0 / .65)}
.member-session-dialog h2{font-size:20px}.member-session-dialog a{display:inline-flex;min-height:44px;align-items:center}

/* 流程：禁登日期保留可讀最小寬度，窄螢幕在既有表格容器內橫向捲動。 */
.member-ban-form { min-width: 250px; }

/* 流程：管理中心標題與返回股票趨勢並列，窄螢幕換行；原驗證器表單、CSRF與44px操作區沿用。 */
.admin-center-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.admin-center-heading h1{margin:0}
.admin-center-return{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid #355873;border-radius:7px;color:#d9eefc;text-decoration:none;background:#143047}
.admin-center-patterns{border-top:1px solid #29465e;border-bottom:1px solid #29465e;padding:18px 0;margin-bottom:24px}
.admin-center-status{display:grid;grid-template-columns:minmax(80px,110px) minmax(0,1fr);gap:8px 12px}
.admin-center-status dt{color:#b0c7da}.admin-center-status dd{margin:0;overflow-wrap:anywhere}
.admin-center-patterns button{min-height:44px;padding:8px 12px;border:1px solid #355873;border-radius:7px;background:#143047;color:#d9eefc}
.admin-center-patterns button:disabled{opacity:.55}

/* 流程：管理中心共用下拉及全站振幅輸入，窄畫面換行；不影響股票／期貨圖高與原會員表單。 */
.admin-center-navigation { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0 0 22px; }
.admin-center-navigation select,.admin-pattern-settings input { color:#dcebf6; background:#102333; border:1px solid #36576e; border-radius:7px; padding:10px 12px; min-height:44px; font-size:16px; }
.admin-center-navigation select { min-width:190px; max-width:100%; }
.admin-pattern-settings input { display:block; width:145px; margin:8px 0; }
.admin-pattern-settings button { min-height:44px; }
@media(max-width:480px){.admin-center-navigation select{flex:1;min-width:0;width:100%;}.admin-center-navigation{align-items:stretch;}}
/* 流程：BIAS 三圖共用獨立百分比副圖，主圖數值沿用 MA 自然換行；隱藏時不占空間，手機保留縱向捲動。 */
.chart-bias-panel { margin-top:16px; min-width:0; color:#d6e8f7; }
.chart-bias-panel[hidden] { display:none; }
.chart-bias-panel h3 { font-size:14px; margin:0 0 6px; }
.chart-bias-panel svg { display:block; width:100%; height:160px; background:#0c1e2b; touch-action:pan-y; user-select:none; }
.chart-bias-panel svg:focus-visible { outline:2px solid #38bdf8; outline-offset:2px; }
.chart-bias-legend { display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12px; line-height:1.7; min-height:24px; font-variant-numeric:tabular-nums; }
.chart-bias-legend span { white-space:nowrap; }
.chart-bias-settings { margin-top:16px; }
.chart-bias-fields>label { display:flex; align-items:center; gap:8px; margin:10px 0; }
.chart-bias-fields input[type=checkbox] { width:18px; height:18px; flex-shrink:0; }
.chart-bias-periods { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0; }
.chart-bias-periods>div { display:flex; align-items:center; flex-wrap:wrap; gap:6px; min-width:0; }
.chart-bias-periods label { display:flex; align-items:center; gap:6px; margin:0; }
.chart-bias-periods input[type=number] { width:72px; min-width:0; max-width:100%; color:#e1f0fa; background:#102333; border:1px solid #45637a; border-radius:5px; padding:7px; font-size:16px; }
.chart-bias-fields p { color:#9fb8ce; font-size:12px; line-height:1.7; margin:10px 0; }
.chart-bias-fields button { margin-right:8px; min-height:40px; }
@media(max-width:480px) { .chart-bias-periods { grid-template-columns:1fr; } .chart-bias-periods>div { flex-wrap:nowrap; } .chart-bias-legend { gap:4px 10px; font-size:11px; } }

/* 流程：分鐘／期貨用透明SVG將同一套BIAS虛線疊在Canvas價格區，指標穿透操作，浮窗仍位於上層；日K沿原SVG裁切。 */
.future-main-plot .chart-bias-canvas-overlay { position:absolute; z-index:1; display:block; margin:0; padding:0; overflow:hidden; pointer-events:none; }
.chart-bias-canvas-overlay * { pointer-events:none; }
.chart-ma-overlay [data-bias-value]::before { content:""; display:inline-block; width:13px; border-top:2px dashed currentColor; margin-right:4px; vertical-align:middle; }

/* 流程：BIAS 平滑線沿用原參數版型，同色點畫線與原虛線／MA實線分辨；手機逐列顯示，不攔截圖表手勢。 */
.chart-bias-smoothing { border-top:1px solid #294054; padding-top:12px; margin-top:14px; }
.chart-bias-smoothing>label { display:flex; align-items:center; gap:8px; margin:10px 0; }
.chart-bias-smoothing .chart-bias-periods>div { display:grid; grid-template-columns:minmax(0,1fr) 72px auto; }
.chart-bias-smoothing .chart-bias-periods { grid-template-columns:1fr; }
.chart-bias-smoothing .chart-bias-periods input[type=number] { width:72px; }
[data-bias-smooth-value]::before { content:""; display:inline-block; width:22px; height:2px; margin-right:4px; vertical-align:middle; background:repeating-linear-gradient(to right,currentColor 0 11px,transparent 11px 15px,currentColor 15px 17px,transparent 17px 22px); }

/* 流程：窄版設定視窗保留MACD來源完整名稱，原生選單與標籤換行，避免WebKit最小內容寬度擠出視窗。 */
@media(max-width:480px) {
    .chart-settings-dialog .indicator-settings label { min-width:0; max-width:100%; flex-wrap:wrap; }
    .chart-settings-dialog .indicator-settings select { min-width:0; max-width:100%; }
}

/* 流程：MA／BIAS／平滑各列分組，圖例與曲線同色同線型；只按鈕接收事件，保留K線空白區手勢。 */
.ma-values.chart-series-legend,.chart-bias-legend .chart-series-legend { display:flex; flex-direction:column; align-items:stretch; gap:4px; min-width:0; }
.stock-plot>.ma-values.chart-ma-overlay.chart-series-legend,.future-main-plot>.ma-values.chart-ma-overlay.chart-series-legend { display:flex; flex-direction:column; align-items:stretch; gap:3px; pointer-events:none; }
.chart-series-row { display:flex; align-items:flex-start; gap:12px; min-width:0; }
.chart-series-group-title { flex:0 0 82px; color:#a9bfd2; font-size:11px; padding-top:5px; }
.chart-series-items { display:flex; flex-wrap:wrap; gap:2px 10px; min-width:0; flex:1; }
.ma-values.chart-series-legend .chart-series-item,.chart-bias-legend .chart-series-item { display:inline-flex; gap:6px; align-items:center; min-width:0; min-height:27px; max-width:100%; margin:0; padding:3px 2px; font-family:inherit; font-size:12px; line-height:1.4; text-align:left; border:0; border-radius:2px; background:transparent; box-shadow:none; pointer-events:auto; touch-action:manipulation; cursor:pointer; }
.chart-series-item-label { display:inline-flex; gap:4px; align-items:center; min-width:0; }
.ma-values.chart-series-legend .chart-series-item span,.chart-bias-legend .chart-series-item span { border:0; padding:0; white-space:normal; overflow-wrap:anywhere; }
.chart-series-item-value { font-variant-numeric:tabular-nums; }
.chart-series-swatch { display:inline-block; width:22px; height:2px; flex:none; background:currentColor; }
[data-series-kind=bias] .chart-series-swatch { height:1.3px; background:repeating-linear-gradient(to right,currentColor 0 3px,transparent 3px 7px); }
[data-series-kind=smooth] .chart-series-swatch { height:3px; background:repeating-linear-gradient(to right,currentColor 0 12px,transparent 12px 17px); }
.chart-series-item[data-series-emphasized=true] .chart-series-item-name { text-decoration:underline; text-underline-offset:3px; }
.chart-series-item.is-series-muted { opacity:.5; }
.chart-ma-overlay [data-bias-value]::before,[data-bias-smooth-value]::before { display:none; }
.chart-bias-date { display:block; flex:0 0 100%; }
.chart-bias-legend>.chart-series-legend { width:100%; }
.chart-series-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:720px),(hover:none) and (pointer:coarse) {
    .chart-series-row { display:block; }
    .chart-series-group-title { display:block; padding:0; margin-bottom:1px; }
    .chart-series-items { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px 6px; }
    .ma-values.chart-series-legend .chart-series-item,.chart-bias-legend .chart-series-item { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:1px; min-height:44px; width:100%; padding:3px 0; font-size:11px; }
    .chart-series-item-label { flex-wrap:wrap; column-gap:3px; row-gap:0; }
    .chart-series-swatch { width:17px; }
}

/* 流程：完整BIAS與平滑週期名稱在窄版可換行，覆蓋舊圖內數值強制不換行的規則。 */
.chart-series-legend .chart-series-item span.chart-series-item-name { min-width:0; white-space:normal; overflow-wrap:anywhere; }