/* ============================================================
   COTRADING Journal — Violet Terminal 리스킨 (2026-07-11)
   journal_dashboard.html 인라인 <style> **뒤에** 로드 → 소스순서로 승리.
   인라인의 descendant 셀렉터는 동일 특이도로 미러해 덮음(블리드 방지).
   레이아웃(padding/flex)은 인라인 유지, 색·보더·라디우스·폰트만 재도색.
   콘셉트: 4채널 중 저널=바이올렛. 손익 green/red 시맨틱 고정, XP·복기=amber.
   ============================================================ */
:root{
  --bg:#0A090F; --panel:#100E17; --raise:#151220;
  --tx:#E4E0EC; --tx2:#9C95AC; --tx3:#6A6478; --tx4:#4E4960;
  --ln:rgba(196,181,253,.13); --ln-strong:rgba(196,181,253,.32);
  --ln-neutral:rgba(228,224,236,.12);
  --v:#C4B5FD; --v2:#8B7BD8; --v-dim:rgba(196,181,253,.09);
  --g:#4ADE80; --r:#F87171; --a:#FACC15; --c:#7DD3FC;
  --g-dim:rgba(74,222,128,.12); --r-dim:rgba(248,113,113,.11); --a-dim:rgba(250,204,21,.10);
  --sans:'IBM Plex Sans KR','Pretendard',-apple-system,'Segoe UI','Malgun Gothic',sans-serif;
  --mono:'IBM Plex Mono','Cascadia Mono','Consolas',monospace;
}

/* ── ground ── */
body{background:var(--bg);color:var(--tx);font-family:var(--sans);max-width:1180px}

/* ── 헤더 ── */
h1{font-family:var(--sans);letter-spacing:.01em}
h1 .b{background:linear-gradient(90deg,#C4B5FD,#8B7BD8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sub{color:var(--tx2)}
.langsw{border:1px solid var(--ln-neutral);border-radius:7px}
.langsw button{color:var(--tx3);border-right:1px solid var(--ln-neutral)}
.langsw button.on{background:var(--v-dim);color:var(--v)}

/* ── 사이트 네비 스트립 ── */
.jnav{border-bottom:1px solid var(--ln)}
.jnav a{color:var(--tx2);border:1px solid var(--ln-neutral);background:var(--raise);border-radius:6px}
.jnav a:hover{color:var(--tx);background:rgba(196,181,253,.07)}
.jnav a.home{border-color:var(--ln-strong);color:var(--v)}
.jnav a.cur{border-color:var(--ln-strong);color:var(--v);background:var(--v-dim)}
.jnav a.out{color:var(--tx3)}

/* ── 거래소 연결/백필 ── */
.exrow{border-bottom:1px solid rgba(228,224,236,.05)}
.exname{color:var(--tx)}
.exbf{background:var(--v-dim);border:1px solid var(--ln-strong);color:var(--v);border-radius:6px}
.exbf:hover{background:rgba(196,181,253,.16)}
.exhint{color:var(--tx4);font-family:var(--mono)}

/* ── 카드 공통 ── */
.card{background:var(--panel);border:1px solid var(--ln);border-radius:12px}
.card:hover{border-color:rgba(196,181,253,.2)}
.ttl{color:var(--tx);letter-spacing:-.01em}
.ttl small{color:var(--tx3)!important}

/* ── ★AI 복기 카드 — 핵심 기능 hero 강조 ── */
#ai-card{
  border:1px solid var(--ln-strong)!important;
  background:linear-gradient(160deg,rgba(196,181,253,.10),rgba(139,123,216,.03) 60%,rgba(255,255,255,.02))!important;
  box-shadow:0 0 0 1px rgba(196,181,253,.10), 0 18px 46px rgba(139,123,216,.14);
  padding:26px 28px;
}
#ai-card .ttl{font-size:1.12rem}
#ai-card .ttl [data-i18n="ai_title"]{font-weight:800;color:var(--v)}
#ai-card #ai-period{font-family:var(--mono);color:var(--tx3)}
#ai-one{border-left:2px solid var(--v)!important;color:var(--v)!important;
  font-size:.92rem!important;background:rgba(196,181,253,.05);border-radius:0 8px 8px 0;padding:8px 14px!important}
#ai-sample-note{color:var(--tx4)!important}
.ai-newbadge{display:inline-block;font:800 .58rem var(--mono);letter-spacing:.08em;
  color:#0A090F;background:var(--v);border-radius:4px;padding:2px 7px;margin-left:8px;vertical-align:middle}

/* ── XP 헤더 (gamification=amber) ── */
.lvl{color:var(--a);font-family:var(--mono)}
.bartrack{background:rgba(228,224,236,.07)}
.barfill{background:linear-gradient(90deg,#D9A514,#FACC15)}
.barlbl{color:var(--tx3);font-family:var(--mono)}
.streak{color:var(--a);font-family:var(--mono)}
.meta{color:var(--tx3)}
.meta b{color:var(--tx)}
.badge{border:1px solid var(--ln-neutral);border-radius:6px;color:var(--tx2)}
.badge:hover{border-color:var(--ln-strong)}
.badge.on{background:var(--a-dim);border-color:rgba(250,204,21,.4);color:var(--a)}
.badge .bprog{background:rgba(228,224,236,.1)}
.badge .bprog i{background:linear-gradient(90deg,var(--v2),var(--v))}
.badge .bcap{color:var(--tx3)}
.recent{color:var(--tx3)}
.recent .xp{color:var(--g)}

/* ── 거래 테이블 ── */
table{font-variant-numeric:tabular-nums}
th{color:var(--tx3);border-bottom:1px solid var(--ln);font-family:var(--mono);font-weight:500}
td{border-bottom:1px solid rgba(228,224,236,.05)}
.pos{color:var(--g)} .neg{color:var(--r)}
.side{border-radius:4px;font-family:var(--mono)}
.long{background:var(--g-dim);color:var(--g)} .short{background:var(--r-dim);color:var(--r)}
.chip{background:var(--v-dim);color:var(--v);border-radius:4px}
.jbtn{border:1px solid var(--ln-neutral);color:var(--tx2);border-radius:6px}
.jbox input{background:var(--raise);border:1px solid var(--ln-neutral);color:var(--tx);border-radius:6px}
.jbox .save{background:var(--v);color:#0A090F}
.btn{background:var(--v-dim);border:1px solid var(--ln-strong);color:var(--v);border-radius:7px}
#toast{background:var(--raise);border:1px solid var(--ln-strong);color:var(--v);border-radius:9px}
.brk{color:var(--tx3)}

/* ── 돈 KPI 스트립 ── */
.ks{background:var(--panel);border:1px solid var(--ln);border-radius:10px}
.ks.hl{border-color:var(--ln-strong);background:linear-gradient(180deg,var(--v-dim),transparent)}
.ks .v{font-family:var(--mono)}
.ks .k{color:var(--tx3);font-family:var(--mono)}

/* ── 월 캘린더 ── */
.calnav{background:var(--raise);border:1px solid var(--ln-neutral);color:var(--tx2);border-radius:6px}
.calnav:hover{background:rgba(196,181,253,.1)}
.calmonth{font-family:var(--mono)}
.calmtot{color:var(--g);font-family:var(--mono)}
.caldow{color:var(--tx4);font-family:var(--mono)}
.calday{background:var(--raise);border:1px solid rgba(228,224,236,.05);border-radius:7px}
.calday .dn{color:var(--tx4);font-family:var(--mono)}
.calday .dp{font-family:var(--mono)}
.calday .dc{color:var(--tx4);font-family:var(--mono)}
.calday.win{background:var(--g-dim);border-color:rgba(74,222,128,.28)}
.calday.win .dp{color:var(--g)}
.calday.loss{background:var(--r-dim);border-color:rgba(248,113,113,.26)}
.calday.loss .dp{color:var(--r)}
.calwk{background:var(--v-dim);border:1px solid var(--ln);color:var(--tx3);border-radius:7px;font-family:var(--mono)}
.calwk .wv{font-family:var(--mono);color:var(--tx)}

/* ── 규율 스코어 ── */
.discring .scn{font-family:var(--mono);color:var(--v)}
.discring .scg{color:var(--tx3);font-family:var(--mono)}
.dc-row{color:var(--tx2)}
.dc-lbl{color:var(--tx2)}
.dc-bar{background:rgba(228,224,236,.07)}
.dc-fill{background:linear-gradient(90deg,var(--v2),var(--v))!important}
.dc-val{color:var(--tx3);font-family:var(--mono)}
.dischint{color:var(--tx2);background:var(--v-dim);border:1px solid var(--ln);border-radius:8px}
.dischint b{color:var(--v)}

/* ── 오늘의 복기 (amber) ── */
.daily{background:linear-gradient(135deg,rgba(250,204,21,.08),rgba(196,181,253,.05))!important;border-color:rgba(250,204,21,.24)!important}
.dttl{color:var(--tx)}
.dstreak{color:var(--a);font-family:var(--mono)}
.dctx{color:var(--tx3)}
.dot{background:var(--raise);border:1px solid var(--ln-neutral);color:var(--tx4);border-radius:7px;font-family:var(--mono)}
.dot.on{background:var(--a-dim);border-color:rgba(250,204,21,.4);color:var(--a)}
.dot.today{outline:1.5px solid var(--a)}
.mood{border:1px solid transparent;border-radius:8px}
.mood.sel{background:var(--a-dim);border-color:rgba(250,204,21,.4)}
.daily textarea{background:var(--raise);border:1px solid var(--ln-neutral);color:var(--tx);border-radius:8px;font-family:var(--sans)}
.dsave{background:var(--v);color:#0A090F}
.ddone{color:var(--g)}
.ddone .note{color:var(--tx2);background:var(--raise)}
.obtxt{color:var(--a)} .obtxt span{color:var(--tx3)}
.obbar{background:rgba(228,224,236,.08)}
.obfill{background:linear-gradient(90deg,#D9A514,#FACC15)}

/* ── 거래 필터 ── */
.filterbar select{background:var(--raise);border:1px solid var(--ln-neutral);color:var(--tx);border-radius:6px}
select option{background-color:#151220;color:var(--tx)}
.seg{border:1px solid var(--ln-neutral);border-radius:6px}
.seg button{color:var(--tx3);border-right:1px solid var(--ln-neutral)}
.seg button.on{background:var(--v-dim);color:var(--v)}
.fcount{color:var(--tx4);font-family:var(--mono)}
.sarr{color:var(--v)}

/* ── 거래 상세 모달 ── */
.modal{background:rgba(5,4,10,.78)}
.mbox{background:var(--panel);border:1px solid var(--ln-strong);border-radius:14px}
.mhead .sym{font-family:var(--mono)}
.mclose{background:var(--raise);color:var(--tx2);border-radius:7px}
.mg{background:var(--raise);border:1px solid var(--ln-neutral);border-radius:8px}
.mg .mv{font-family:var(--mono)}
.mg .mk{color:var(--tx3);font-family:var(--mono)}
.mjournal{color:var(--tx2)}
.chip.tag{background:var(--v-dim);color:var(--v)}
.chip.mis{background:var(--r-dim);color:var(--r)}
.daylist .drow{border-bottom:1px solid rgba(228,224,236,.05)}
.daylist .drow:hover{background:rgba(196,181,253,.04)}
.daylist .drow .ds{color:var(--v);font-family:var(--mono)}
.dayrev{color:var(--tx2);background:var(--raise);border:1px solid var(--ln-neutral);border-radius:8px}
.dayrev .rl{color:var(--tx3);font-family:var(--mono)}
.bdet .bd-desc{color:var(--tx2)}
.bdet .bd-bar{background:rgba(228,224,236,.08)}
.bdet .bd-bar i{background:linear-gradient(90deg,var(--v2),var(--v))}
.bdet .bd-cap{color:var(--tx3);font-family:var(--mono)}

/* ── P2 분석 ── */
.ana-lbl{color:var(--tx3);font-family:var(--mono);letter-spacing:.03em}
.ana-lbl b{color:var(--tx)}
.hourcell{border:1px solid rgba(228,224,236,.05);border-radius:5px;color:var(--tx2)}
.hourcell .hh{color:var(--tx3);font-family:var(--mono)}
.hourcell .hn{font-family:var(--mono)}
.hourcell.clickable:hover{border-color:var(--ln-strong);box-shadow:0 0 0 1px var(--ln-strong) inset}
.hourchip{color:var(--v);background:var(--v-dim);border:1px solid var(--ln-strong);border-radius:6px;font-family:var(--mono)}
.exbar .exb-name{color:var(--tx2);font-family:var(--mono)}
.exbar .exb-track{background:rgba(228,224,236,.06)}
.exbar .exb-meta{color:var(--tx3);font-family:var(--mono)}
.rhcol .rh-n{color:var(--tx2);font-family:var(--mono)}
.rhcol .rh-x{color:var(--tx4);font-family:var(--mono)}

/* ── 태그 손익 칩 ── */
.tagpnl .tp{border:1px solid var(--ln-neutral);background:var(--raise);border-radius:6px;font-family:var(--mono)}
.tagpnl .tp:hover{border-color:var(--ln-strong)}
.tagpnl .tp.on{border-color:var(--ln-strong);background:var(--v-dim)}
.tagpnl .tp .tpn{color:var(--v)}
.tagpnl .tp .tpc{color:var(--tx3)}

/* ── 스크린샷 ── */
.shots .sh-hd .sh-t{color:var(--tx3);font-family:var(--mono)}
.shots .sh-up{background:var(--v-dim);border:1px solid var(--ln-strong);color:var(--v);border-radius:7px}
.shots .sh-thumb{border:1px solid var(--ln-neutral);border-radius:8px;background:var(--raise)}
.csrc.real{background:var(--g-dim);color:var(--g)}
.csrc.synth{background:rgba(148,163,184,.15);color:var(--tx3)}

/* ── 예측 트래커 ── */
.predsum{color:var(--tx3);font-family:var(--mono)}
.predsum b{color:var(--v)}
.predrow{border-bottom:1px solid rgba(228,224,236,.05)}
.predrow .pr-d{color:var(--tx3);font-family:var(--mono)}
.predrow .pr-mk{background:var(--v-dim);color:var(--v);font-family:var(--mono)}
.predrow .pr-sym{color:var(--tx);font-family:var(--mono)}
.predrow .pr-nm{color:var(--tx3)}
.predrow .pr-hit{font-family:var(--mono)}
.predrow .pr-hit.hit{background:var(--g-dim);color:var(--g)}
.predrow .pr-hit.miss{background:var(--r-dim);color:var(--r)}
.predrow .pr-hit.pend{background:rgba(148,163,184,.14);color:var(--tx3)}

/* ── 데모 배너 ── */
#demo-banner{background:linear-gradient(90deg,rgba(196,181,253,.14),rgba(74,222,128,.06))!important;
  border:1px solid var(--ln-strong)!important;color:#EBE3FF!important;border-radius:10px!important}

/* ── symbol 요약 박스 (인라인 블루 → 바이올렛) ── */
#sym-summary, #m-symsum{background:var(--v-dim)!important;border:1px solid var(--ln-strong)!important;color:var(--tx2)}