:root { 
    --paper-bg: #fefdf5; 
    --ink-color: #4b3832; 
    --border-thick: 3px; 
}

body { font-family: 'Zen Maru Gothic', sans-serif; background-color: var(--paper-bg); color: var(--ink-color); margin: 0; padding: 0; }

.hand-drawn-card { 
    background: white; 
    border: var(--border-thick) solid var(--ink-color); 
    border-radius: 20px; 
    box-shadow: 6px 6px 0px var(--ink-color); 
}

/* 資產燈顏色 */
.liquidity-green { background-color: #34d399; } 
.liquidity-yellow { background-color: #fbbf24; } 
.liquidity-orange { background-color: #fb923c; } 
.liquidity-gray { background-color: #9ca3af; }   

/* 卡片翻面：固定高度防止疊影 */
.flip-container { perspective: 1000px; height: 240px; width: 100%; position: relative; margin-bottom: 15px; }
.flip-inner { 
    position: relative; width: 100%; height: 100%; 
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); 
    transform-style: preserve-3d; 
}
.is-flipped { transform: rotateY(180deg); }

.card-front, .card-back { 
    position: absolute; width: 100%; height: 100%; 
    backface-visibility: hidden; 
    -webkit-backface-visibility: hidden;
    top: 0; left: 0; border-radius: 20px; overflow: hidden;
}
.card-back { transform: rotateY(180deg); }
.card-locked { opacity: 0.5; filter: grayscale(0.8); }

/* 表格：支援左右挪動與縮放 */
.table-container { 
    border: var(--border-thick) solid var(--ink-color); 
    border-radius: 15px; background: white; 
    overflow-x: auto; 
}
table { 
    border-collapse: collapse; table-layout: fixed; 
    width: max-content; min-width: 100%; 
}
th { 
    position: relative; background: #f8fafc; 
    border-bottom: var(--border-thick) solid var(--ink-color); 
    padding: 12px; font-weight: 900; 
    resize: horizontal; overflow: hidden; /* 支援手動調寬 */
}
td { border-bottom: 1px dashed #e2e8f0; padding: 10px; text-align: center; font-weight: 700; }
td.col-left { text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.inline-input { background: #fffcea; border: none; width: 100%; font-weight: 900; outline: none; text-align: inherit; }
.table-container::-webkit-scrollbar { height: 12px; }
.table-container::-webkit-scrollbar-thumb { background: var(--ink-color); border-radius: 10px; }