body { 
    background-color: #020617; 
    color: #f8fafc; 
    margin: 0; 
    padding: 0; 
    overflow-y: auto; 
    user-select: none; 
}
#chart-container { 
    font-family: 'Inter', 'Pretendard', sans-serif; 
    position: relative; 
    width: 100%; 
    height: 450px; 
    border-bottom: 2px solid #1e293b; 
    background: #020617; 
    overflow: hidden; 
}
canvas { 
    image-rendering: auto; 
    display: block; 
    cursor: grab; 
    width: 100%; 
    height: 100%; 
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}
canvas:active { cursor: grabbing; }
.info-overlay { 
    position: absolute; top: 15px; left: 15px; z-index: 50; 
    background: rgba(15, 23, 42, 0.9); padding: 18px; border-radius: 4px;
    border: 1px solid #334155; pointer-events: auto; backdrop-filter: blur(12px);
    cursor: move; width: 340px; box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5);
}
#depth-bar { 
    position: absolute; right: 0; top: 0; width: 45px; height: 450px; 
    z-index: 10; display: flex; flex-direction: column; 
    border-left: 1px solid #1e293b; background: #020617; 
}
.depth-label { 
    position: absolute; width: 100%; text-align: center; 
    font-size: 9px; font-weight: bold; color: white; 
    text-shadow: 1px 1px 2px black; z-index: 11; 
}
#bid-label { top: 5px; }
#ask-label { bottom: 5px; }
.status-bar { position: absolute; bottom: 10px; right: 55px; font-size: 10px; color: #475569; display: flex; gap: 15px; z-index: 20; }
.btn-tool { background: #1e293b; color: #94a3b8; padding: 2px 8px; border-radius: 2px; font-size: 10px; border: 1px solid #475569; transition: all 0.2s; cursor: pointer; }
.btn-tool:hover { background: #334155; color: #f8fafc; }
.btn-tool.active { background: #334155; color: #38bdf8; border-color: #38bdf8; }
.briefing-card { background: #0f172a; border: 1px solid #1e293b; border-radius: 4px; padding: 12px; display: flex; flex-direction: column; height: 100%; }
#briefing-content { height: 150px; overflow-y: auto; scroll-behavior: smooth; }
#briefing-content::-webkit-scrollbar { width: 4px; }
#briefing-content::-webkit-scrollbar-thumb { background-color: #334155; border-radius: 10px; }
#ratio-monitor, #score-monitor { width: 100%; height: 25px; background: #010409; display: flex; align-items: center; padding: 0 10px; border-bottom: 1px solid #1e293b; }
.ratio-bar-container, .score-bar-container { flex: 1; height: 4px; background: #111827; border-radius: 10px; overflow: hidden; position: relative; border: 1px solid #1e293b; margin: 0 10px; }
#buy-ratio-fill { height: 100%; background: #f43f5e; transition: width 0.5s ease-out; }
#sell-ratio-fill { height: 100%; background: #3b82f6; transition: width 0.5s ease-out; }
#score-fill { position: absolute; left: 50%; height: 100%; width: 0%; transition: all 0.4s cubic-bezier(0.1, 0.7, 1.0, 0.1); }
#log-container { padding: 1.5rem; display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; background: #010409; max-height: 250px; overflow: hidden; }
#manual-container { height: 130px; background: #020617; border-top: 1px solid #1e293b; padding: 12px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; overflow: hidden; }
.manual-box { background: #0f172a; border: 1px solid #334155; border-radius: 4px; padding: 10px; }
.score-text-block { font-family: 'JetBrains Mono', monospace; font-size: 12px; line-height: 1.4; border-bottom: 1px solid #1e293b; padding-bottom: 8px; margin-bottom: 8px; }
/* 봉 선택 툴바 */
#tf-toolbar { 
    width: 100%; height: 32px; background: #010409; 
    display: flex; align-items: center; padding: 0 10px; gap: 6px;
    border-bottom: 1px solid #1e293b;
    font-family: 'Inter', 'Pretendard', sans-serif; 
}
.tf-btn { 
    background: #1e293b; color: #64748b; padding: 2px 10px; border-radius: 2px; 
    font-size: 10px; font-family: 'JetBrains Mono', monospace; font-weight: bold;
    border: 1px solid #334155; cursor: pointer; transition: all 0.15s;
}
.tf-btn:hover { color: #f8fafc; background: #334155; }
.tf-btn.active { background: #0f3460; color: #38bdf8; border-color: #38bdf8; }
#tf-market-label { margin-left: auto; font-size: 11px; font-family: 'JetBrains Mono', monospace; color: #475569; }
#refresh-countdown { font-size: 10px; color: #334155; font-family: 'JetBrains Mono', monospace; margin-left: 8px; }