/* --- 莫蘭迪配色變數定義 (v6.0) --- */
        :root { 
            --primary: #6B7F94; 
            --bg: #F2F4F6; 
            --card: #FFFFFF; 
            --text: #454F5B; 
            --red: #D96459; 
            --green: #5E8C6A; 
            --gray: #9BAEC8; 
            --input-bg: #F7F8FA; 
            --tag-bg-1: #9D85A8; /* 霧紫 */
            --tag-bg-2: #D4A76A; /* 芥末黃 */
            --tag-bg-3: #D68C6D; /* 髒橘 */
            --tag-bg-4: #5E8C6A; /* 鼠尾草綠 */
            --tag-bg-5: #6B7F94; /* 霧霾藍 */
        }

        html { height: 100%; overscroll-behavior: none; }
        body { height: 100%; margin: 0; padding: 0; overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif; background-color: var(--bg); color: var(--text); user-select: none; -webkit-user-select: none; }
        * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
        
        .page { display: none; height: 100%; overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; padding-bottom: 100px; background: var(--bg); position: absolute; top: 0; left: 0; width: 100%; transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1); }
        .page.active { display: block; transform: translateX(0); z-index: 10; }

        /* Tag Styles */
        .tag-badge { padding: 2px 6px; border-radius: 4px; font-size: 11px; color: white; margin-right: 6px; white-space: nowrap; font-weight: 500; letter-spacing: 0.5px; opacity: 0.9; display: inline-block; vertical-align: middle; margin-bottom: 2px;}
        .bg-purple { background-color: var(--tag-bg-1); } 
        .bg-gold { background-color: var(--tag-bg-2); }   
        .bg-dark { background-color: #636366; }
        .bg-green { background-color: var(--tag-bg-4); }  
        .bg-red { background-color: var(--red); }    
        .bg-orange { background-color: var(--tag-bg-3); } 
        .bg-blue { background-color: var(--tag-bg-5); }   

        /* --- 廣告區塊樣式 (防飄移終極鎖定版) --- */
        .ad-container {
            position: fixed; 
            bottom: calc(70px + env(safe-area-inset-bottom, 0px));    
            left: 0;
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 10px 0;
            background: rgba(242, 244, 246, 0.85); 
            backdrop-filter: blur(8px); 
            -webkit-backdrop-filter: blur(8px);
            z-index: 850;    
            transform: translateZ(0); 
            will-change: transform, bottom;
        }
        .ad-placeholder {
            width: 320px;
            height: 50px;
            background: #E8ECEF;
            color: #7A869A;
            font-size: 13px;
            font-weight: 700;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 8px;
            border: 2px dashed #9BAEC8;
        }

        /* Header */
        .header-card { 
            --red: #FFB5A7;    
            --green: #A8E6CF;  
            background: linear-gradient(135deg, #6B7F94, #4A5D70); 
            color: white; 
            padding: 12px 20px; 
            padding-top: max(12px, env(safe-area-inset-top)); 
            border-radius: 0 0 24px 24px; 
            box-shadow: 0 8px 20px rgba(74, 93, 112, 0.15); 
            margin-bottom: 12px; 
            position: sticky; 
            top: 0; 
            z-index: 100; 
        }
        
        .header-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; height: 28px; }
        .header-title { font-size: 12px; font-weight: 600; opacity: 0.9; letter-spacing: 1px; text-transform: uppercase; }
        
        .header-left { display: flex; align-items: center; gap: 8px; }
        .eye-btn { background: rgba(255, 255, 255, 0.2); border: none; border-radius: 50%; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: white; padding: 0; transition: background 0.2s; }
        .eye-btn:active { background: rgba(255, 255, 255, 0.4); }
        .eye-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
        .refresh-btn { width: 28px; height: 28px; padding: 0; background: rgba(255, 255, 255, 0.15); border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(10px); color: white; transition: transform 0.2s, background 0.2s; }        
        .refresh-btn:active { background: rgba(255, 255, 255, 0.4); }
        .refresh-btn.spin { animation: spin 1s linear infinite; }
        @keyframes spin { 100% { transform: rotate(360deg); } }

        .total-value { font-size: 30px; font-weight: 700; margin: 0 0 10px; letter-spacing: -0.5px; line-height: 1; text-shadow: 0 2px 10px rgba(0,0,0,0.1); }

        .pnl-row { display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; width: 100%; gap: 12px; }
        .pnl-group { display: flex; flex-direction: column; flex: 1; min-width: 0; }
        .pnl-label { font-size: 11px; opacity: 0.8; margin-bottom: 2px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
        
        .pnl-val-large { font-size: 24px; font-weight: 700; letter-spacing: -0.5px; }
        .pnl-val-small { font-size: 14px; font-weight: 600; margin-left: 4px; opacity: 0.95; }

        .pnl-today .pnl-val-large { font-size: 20px; }
        .pnl-today { text-align: right; position: relative; padding-left: 15px; }
        .pnl-today::before { content: ''; position: absolute; left: 0; top: 10%; height: 80%; width: 1px; background: rgba(255,255,255,0.2); }

        .group-section { margin-bottom: 20px; }
        .group-header-row { background: #E8ECEF; padding: 12px 18px; border-radius: 14px; margin-bottom: 10px; cursor: pointer; display: flex; justify-content: space-between; align-items: flex-start; transition: background 0.2s; }
        .group-header-row:active { background: #DDE2E6; }
        .group-title { font-size: 15px; font-weight: 700; color: #55606E; display: flex; align-items: center; gap: 6px; margin-top: 2px;}
        .group-arrow { font-size: 10px; color: #9BAEC8; transition: transform 0.2s; }
        .group-header-row.collapsed .group-arrow { transform: rotate(-90deg); }
        .group-info { text-align: right; font-size: 11px; color: #7A869A; line-height: 1.5; }
        .group-val-main { font-weight: 600; color: #454F5B; font-size: 12px; }
        .group-sub-val { opacity: 0.9; font-size: 11px; font-weight: 600; }
        .group-body { display: block; animation: fadeIn 0.3s ease; }
        .group-body.collapsed { display: none; }

        .list-container { padding: 0 20px; animation: fadeIn 0.4s ease; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
        
        .asset-item { background: var(--card); padding: 4px 16px; border-radius: 16px; margin-bottom: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.03); transition: transform 0.1s; cursor: pointer; border: 1px solid rgba(0,0,0,0.02); display: flex; flex-direction: column; }        
        .asset-item:active { transform: scale(0.98); background-color: #F8F9FA; }
        .item-row { display: flex; justify-content: space-between; align-items: center; }
        .col-left { flex: 1; overflow: hidden; margin-right: 12px; }
        .col-mid { text-align: right; margin-right: 16px; min-width: 75px; }
        .col-right { text-align: right; min-width: 90px; }
        .name-row { display: flex; align-items: center; margin-bottom: 5px; }
        .asset-name { font-size: 17px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.3px; }
        .asset-desc { font-size: 13px; color: #8F9BAD; font-weight: 500; }
        .price-curr { font-size: 17px; font-weight: 700; color: var(--text); }
        .price-avg { font-size: 13px; color: #A0AAB8; margin-top: 3px; font-weight: 500;}
        .pnl-val { font-size: 17px; font-weight: 700; letter-spacing: -0.3px; }
        .pnl-pct { font-size: 13px; margin-top: 3px; font-weight: 600; opacity: 0.9;}
        .text-red { color: var(--red) !important; } .text-green { color: var(--green) !important; }
        
        .nav-bar { background: var(--card); position: sticky; top: 0; z-index: 100; padding: 10px 20px; padding-top: max(10px, env(safe-area-inset-top)); display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(0,0,0,0.03); height: 70px; }
        .nav-center-box { flex: 1; text-align: center; overflow: hidden; }
        .nav-main-text { font-size: 20px; font-weight: 700; color: var(--text); }
        .nav-sub-text { font-size: 12px; color: #8F9BAD; font-weight: 500; margin-top: 2px; }
        .icon-btn { font-size: 22px; color: var(--primary); background: none; border: none; cursor: pointer; padding: 8px; font-weight: bold; position: relative; z-index: 2005; transition: color 0.2s;}
        .icon-btn:active { color: #4A5D70; }

        .menu-dropdown { display: none; position: absolute; right: 16px; top: 60px; background: white; border-radius: 16px; box-shadow: 0 10px 40px rgba(0,0,0,0.1); width: 160px; z-index: 99999; overflow: hidden; border: 1px solid rgba(0,0,0,0.03); }
        .menu-dropdown.show { display: block; animation: fadeIn 0.1s; }
        .menu-item { padding: 16px 20px; font-size: 15px; border-bottom: 1px solid #F5F5F5; cursor: pointer; color: var(--text); font-weight: 500; text-align: left; }
        .menu-item:active { background-color: #F2F4F6; }
        .menu-item.delete { color: var(--red); }

        .quote-strip { background: var(--card); padding: 12px 24px; border-bottom: 1px solid #F0F2F5; display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
        .qs-left { display: flex; align-items: center; gap: 20px; }
        .qs-price { font-size: 20px; font-weight: 600; color: var(--text); } .qs-change { font-size: 16px; font-weight: 600; } .qs-time { font-size: 12px; color: #A0AAB8; font-weight: 500; }
        .detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding: 10px 24px 20px; text-align: center; background: var(--card); border-bottom: 1px solid #eee; margin-bottom: 15px; }
        .grid-item { display: flex; flex-direction: column; justify-content: center; }
        .grid-label { font-size: 13px; color: #8F9BAD; margin-bottom: 6px; font-weight: 500; }
        .grid-val { font-size: 18px; font-weight: 700; color: var(--text); }
        .grid-val-lg { font-size: 26px; font-weight: 700; letter-spacing: -0.5px; }
        .grid-row-2 { grid-column: span 2; display: flex; justify-content: space-between; border-top: 1px solid #F0F2F5; padding-top: 15px; margin-top: 10px; }
        .grid-sub-item { flex: 1; text-align: center; }

        #page-detail.active {
            display: flex;
            flex-direction: column;
            overflow: hidden; 
        }
        .tx-wrapper {
            flex: 1; 
            overflow-y: auto; 
            padding-bottom: 120px; 
        }
        .tx-table thead th {
            position: sticky;
            top: 0;
            z-index: 5;
            box-shadow: 0 1px 2px rgba(0,0,0,0.05); 
        }
        
        .tx-table { width: 100%; background: var(--card); border-collapse: collapse; font-size: 14px; table-layout: fixed; }
        .tx-table th { text-align: right; padding: 14px 10px; color: #8F9BAD; font-size: 12px; font-weight: 500; border-bottom: 1px solid #F0F2F5; background: #FAFAFB; padding: 14px 4px; }
        .tx-table th:first-child { text-align: left; padding-left: 24px; width: 35%; } .tx-table th:nth-child(2) { text-align: right; padding-right: 10px; width: 20%; } .tx-table th:nth-child(3) { text-align: right; padding-right: 10px; width: 20%; } .tx-table th:last-child { text-align: right; padding-right: 24px; width: 25%; } 
        .tx-table td { border-bottom: 1px solid #F7F8FA; color: var(--text); font-weight: 500; padding: 16px 4px; vertical-align: middle; position: relative; }
        .tx-table td:first-child { text-align: left; padding-left: 24px; color: #8F9BAD; font-weight: 400; font-size: 12px; line-height: 1.4; } .tx-table td:nth-child(2) { text-align: right; padding-right: 10px; } .tx-table td:nth-child(3) { text-align: right; padding-right: 10px; } .tx-table td:last-child { text-align: right; padding-right: 24px; } 

        .tab-bar { display: flex; padding: 5px; background: #E8ECEF; border-radius: 14px; margin: 16px 20px; margin-bottom: 12px; }
        .tab-btn { flex: 1; padding: 10px; text-align: center; font-size: 14px; font-weight: 600; color: #8F9BAD; border-radius: 11px; cursor: pointer; transition: all 0.2s; }
        .tab-btn.active { background: #fff; color: #454F5B; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
        .input-body { padding: 0 24px 30px 24px; }
        
        .nav-header { background: var(--card); padding: 15px 20px; border-bottom: 1px solid #F0F2F5; display: flex; justify-content: space-between; align-items: center; }
        .nav-title { flex: 1; text-align: center; font-weight: 700; font-size: 17px; }
        .modal-body { padding: 25px 24px; overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; }       
        .form-group { margin-bottom: 20px; }
        .form-group label { display: block; font-size: 13px; color: #8F9BAD; margin-bottom: 8px; font-weight: 600;}
        .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 16px; border: 1px solid #E8ECEF; border-radius: 14px; font-size: 16px; background: var(--input-bg); outline: none; color: var(--text); transition: border-color 0.2s; }
        .form-group input:focus, .form-group textarea:focus { border-color: var(--primary); background: #fff; }
        .form-group textarea { resize: none; height: 100px; }

        .checkbox-row { display: flex; align-items: center; margin-bottom: 24px; }
        .checkbox-row input { width: 20px; height: 20px; margin-right: 12px; accent-color: var(--primary); }
        .checkbox-row label { margin-bottom: 0; font-size: 15px; color: var(--text); }
        .btn-full { width: 100%; padding: 16px; background: var(--primary); color: white; border: none; border-radius: 16px; font-size: 16px; font-weight: 600; margin-top: 10px; cursor: pointer; box-shadow: 0 4px 12px rgba(107, 127, 148, 0.25); transition: opacity 0.2s; }
        .btn-full:active { opacity: 0.9; transform: scale(0.99); }
        .btn-delete { background: rgba(217, 100, 89, 0.1); color: var(--red); margin-top: 15px; box-shadow: none; }
        .btn-delete:active { background: rgba(217, 100, 89, 0.2); }

        .modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(69, 79, 91, 0.4); z-index: 2500; align-items: center; justify-content: center; backdrop-filter: blur(5px); }
        .modal-content { background: var(--card); width: 88%; max-width: 360px; border-radius: 28px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); animation: popUp 0.25s cubic-bezier(0.16, 1, 0.3, 1); overflow: hidden; display: flex; flex-direction: column; max-height: 85vh; }        
        @keyframes popUp { from { transform: scale(0.95); opacity: 0; } to { transform: scale(1); opacity: 1; } }

        #toast { visibility: hidden; min-width: 200px; background-color: rgba(69, 79, 91, 0.9); color: #fff; text-align: center; border-radius: 50px; padding: 14px 24px; position: fixed; z-index: 3000; left: 50%; bottom: 120px; transform: translateX(-50%); font-size: 14px; font-weight: 500; opacity: 0; backdrop-filter: blur(8px); box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
        #toast.show { visibility: visible; opacity: 1; transition: opacity 0.3s; }
        .center-modal-box { text-align: center; padding: 30px 25px; }
        .center-title { font-size: 19px; font-weight: 700; margin-bottom: 12px; color: var(--text); }
        .center-msg { font-size: 15px; color: #7A869A; margin-bottom: 28px; line-height: 1.5; }
        .center-btns { display: flex; gap: 14px; }
        .center-btn { flex: 1; padding: 14px; border-radius: 14px; border: none; font-size: 16px; font-weight: 600; cursor: pointer; }
        .btn-cancel { background: #F2F4F6; color: #7A869A; }
        .btn-ok { background: var(--primary); color: white; }
        .btn-ok-red { background: var(--red); color: white; }
        
        .bottom-nav { position: fixed; bottom: 0; width: 100%; background: rgba(255,255,255,0.92); backdrop-filter: blur(20px); border-top: none; box-shadow: 0 -5px 30px rgba(0,0,0,0.03); display: flex; justify-content: space-around; padding: 10px 0; padding-bottom: max(10px, env(safe-area-inset-bottom)); z-index: 900; }
        .nav-item { text-align: center; color: #A0AAB8; font-size: 10px; flex: 1; cursor: pointer; transition: color 0.2s; display: flex; flex-direction: column; align-items: center; justify-content: center; }
        .nav-item.active { color: var(--primary); }
        .nav-item svg { width: 26px; height: 26px; margin-bottom: 4px; stroke-width: 2.2; transition: transform 0.2s; }
        .nav-item.active svg { transform: translateY(-2px); stroke-width: 2.5; }
        
        .fab { position: fixed; bottom: 150px; right: 20px; background: var(--primary); color: white; width: 58px; height: 58px; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 30px; box-shadow: 0 8px 25px rgba(107, 127, 148, 0.4); cursor: pointer; z-index: 2000; transition: transform 0.2s; }
        .fab:active { transform: scale(0.92); }
        
        .input-suffix { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #8F9BAD; font-weight: 600; pointer-events: none; }
        .input-container { position: relative; width: 100%; }
        .input-container input { padding-right: 50px; } 

        .group-header { position: sticky; top: 0; background: var(--bg); z-index: 90; padding: 12px 0; padding-top: max(12px, env(safe-area-inset-top)); box-shadow: 0 4px 12px rgba(0,0,0,0.03); }
        
        .group-scroll { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 20px 8px 20px; align-items: center; }
        .group-scroll::-webkit-scrollbar { display: none; }
        
        .group-tab { background: #E8ECEF; color: #7A869A; padding: 6px 12px; border-radius: 20px; font-size: 14px; font-weight: 600; transition: all 0.2s ease; border: 1px solid transparent; cursor: pointer; }
        .group-tab.active { background: var(--primary); color: white; box-shadow: 0 4px 10px rgba(107, 127, 148, 0.4); transform: translateY(-1px); }
        .add-group-btn { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: #E8ECEF; border-radius: 50%; color: var(--text); font-size: 20px; flex-shrink: 0; cursor: pointer; transition: background 0.2s; }
        .add-group-btn:active { background: #DDE2E6; }

        /* Tag Editor Styles */
        .tags-display { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; margin-bottom: 8px; }
        .tag-pill { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 12px; font-size: 12px; font-weight: 600; color: white; }
        .tag-pill.removable { cursor: pointer; padding-right: 6px; }
        .tag-remove { margin-left: 6px; font-size: 14px; opacity: 0.7; }
        .tag-pool { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
        .tag-pool-item { padding: 6px 12px; background: #E8ECEF; border-radius: 12px; color: #55606E; font-size: 13px; font-weight: 600; cursor: pointer; border: 1px solid transparent; }
        .tag-pool-item:active { background: #DDE2E6; }
        
        /* Note Display */
        .note-box { background: #F8F9FA; padding: 12px 16px; border-radius: 12px; margin: 10px 24px; font-size: 13px; color: #55606E; line-height: 1.5; border: 1px solid #E8ECEF; position: relative; cursor: pointer; }
        .note-box:active { background: #EFEFEF; }
        .note-label { font-size: 11px; color: #8F9BAD; font-weight: 700; margin-bottom: 4px; display: block; text-transform: uppercase; letter-spacing: 0.5px; }
        
        /* --- K線週期切換按鈕 --- */
        .period-selector { padding: 10px 20px; display: flex; gap: 8px; background: var(--card); border-bottom: 1px solid #F0F2F5; }
        .period-btn { background: var(--bg); border: 1px solid #DDE2E6; color: #7A869A; padding: 4px 14px; border-radius: 12px; font-size: 12px; font-weight: 700; cursor: pointer; transition: 0.2s; }
        .period-btn.active { background: var(--primary); color: white; border-color: var(--primary); }
        
        /* --- 頂部 K 線詳細數據列 --- */
        .ohlc-strip { background: var(--card); padding: 12px 0px; border-bottom: 1px solid #F0F2F5; font-size: 13px; font-weight: 700; display: flex; flex-direction: column; gap: 6px; }
        .ohlc-row { display: flex; flex-wrap: wrap; gap: 10px 8px; align-items: center; }
        .ohlc-item { display: flex; gap: 4px; align-items: baseline; }
        .ohlc-label { color: var(--text); opacity: 0.9; font-size: 12px; font-weight: 600; }
        .ohlc-val { color: var(--text); font-size: 14px; }
        .ma-item { display: flex; gap: 4px; align-items: baseline; font-size: 12px; font-weight: 700; }

        /* --- Chrome 風格分頁列 --- */
        .chrome-tab-bar {
            display: flex;
            background: #E8ECEF; 
            padding: 8px 16px 0 16px;
            border-bottom: 1px solid var(--card); 
            gap: 6px;
            margin-top: 6px;
        }
        .chrome-tab {
            padding: 10px 20px;
            background: #DDE2E6; 
            color: #7A869A;
            border-radius: 12px 12px 0 0; 
            font-size: 14px;
            font-weight: 700;
            cursor: pointer;
            position: relative;
            bottom: -1px; 
            transition: all 0.2s;
            z-index: 1;
        }
        .chrome-tab.active {
            background: var(--card); 
            color: var(--primary); 
            z-index: 2; 
            box-shadow: 0 -2px 10px rgba(0,0,0,0.02);
        }
        
        .chrome-content { display: none; background: var(--card); padding: 0 5px 5px; }
        .chrome-content.active { display: block; animation: fadeIn 0.3s ease; }
    
        /* --- 基本面數據專屬樣式 --- */
        .fund-section { padding: 12px 20px; border-bottom: 1px solid #F0F2F5; }
        .fund-section:last-child { border-bottom: none; padding-bottom: 30px; }
        .fund-title { font-size: 13px; font-weight: 700; color: var(--primary); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; letter-spacing: 0.5px; }
        .fund-title::before { content: ''; display: block; width: 4px; height: 14px; background: var(--tag-bg-2); border-radius: 2px; }
        .fund-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 15px; }
        .fund-item { background: var(--bg); padding: 8px 12px; border-radius: 12px; display: flex; flex-direction: column; justify-content: center; min-height: 56px;transition: transform 0.2s; }
        .fund-item:active { transform: scale(0.98); background: #E8ECEF; }
        .fund-label { font-size: 11px; color: #8F9BAD; margin-bottom: 2px; font-weight: 600; }
        .fund-val { font-size: 16px; font-weight: 700; color: var(--text); letter-spacing: -0.3px; }

        /* --- 市場指標頁面專屬樣式 (緊湊版) --- */
        .market-dashboard { padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; padding-bottom: 120px; }
        .indicator-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
        .indicator-card { background-color: var(--card); border-radius: 12px; padding: 12px 14px; box-shadow: 0 2px 8px rgba(0,0,0,0.02); display: flex; flex-direction: column; border: 1px solid rgba(0,0,0,0.02); }
        .indicator-title { font-size: 12px; color: #8F9BAD; margin-bottom: 4px; font-weight: 600; }
        .indicator-value { font-size: 20px; font-weight: 700; color: var(--text); line-height: 1.1; }
        .indicator-change { font-size: 12px; font-weight: 600; margin-top: 4px; }

        /* --- 圖表參數設定介面專屬樣式 --- */
        .cfg-row { display: flex; align-items: center; justify-content: space-between; background: var(--input-bg); padding: 10px 14px; border-radius: 12px; margin-bottom: 8px; border: 1px solid transparent; transition: 0.2s; }
        .cfg-row:focus-within { border-color: var(--primary); background: #FFF; }
        .cfg-row-left { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 14px; color: var(--text); }
        .cfg-color { width: 26px; height: 26px; border: none; border-radius: 6px; padding: 0; cursor: pointer; background: transparent; outline: none; }
        .cfg-color::-webkit-color-swatch-wrapper { padding: 0; }
        .cfg-color::-webkit-color-swatch { border: none; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1); }
        .cfg-num { width: 60px; background: #FFFFFF; border: 1px solid #DDE2E6; border-radius: 8px; padding: 6px; text-align: center; font-weight: 700; font-size: 14px; outline: none; color: var(--text); }
        .cfg-chk { width: 20px; height: 20px; accent-color: var(--primary); }

        /* --- 取消「無底部導覽列」子頁面的多餘留白，解決幽靈捲動 --- */
        #page-watch-detail, 
        #page-add-stock, 
        #page-edit-stock-tx {
            padding-bottom: 30px; 
        }