/* ═══════════════════════════════════════════════
   style.css — StockDash 반응형 대시보드
   Mobile : 앱 레이아웃 (하단 탭바)
   Desktop: 사이드바 + 멀티컬럼 그리드
   ══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=JetBrains+Mono:wght@400;500;600&family=Pretendard:wght@300;400;500;600;700&display=swap');

/* ─ CSS 변수 ─────────────────────────────────── */
:root {
  --bg:        #080c14;
  --bg2:       #0d1220;
  --bg3:       #131929;
  --card:      #111827;
  --card2:     #1a2236;
  --border:    #1e2d45;
  --border2:   #243350;
  --text:      #e2e8f0;
  --text2:     #94a3b8;
  --text3:     #64748b;
  --accent:    #3b82f6;
  --accent2:   #1d4ed8;
  --pos:       #10b981;
  --pos-bg:    #10b98115;
  --neg:       #ef4444;
  --neg-bg:    #ef444415;
  --warn:      #f59e0b;
  --cyan:      #06b6d4;
  --purple:    #8b5cf6;
  --shadow:    0 4px 24px rgba(0,0,0,.6);
  --radius:    12px;
  --radius-sm: 8px;
  --sidebar-w: 220px;
  --nav-h:     64px;
  --transition:.2s cubic-bezier(.4,0,.2,1);
  --font-num:  'JetBrains Mono', monospace;
  --font-ui:   'Pretendard', 'Apple SD Gothic Neo', sans-serif;
  --font-head: 'Syne', sans-serif;
}
[data-theme="light"] {
  --bg:#f1f5f9; --bg2:#e2e8f0; --bg3:#f8fafc;
  --card:#fff; --card2:#f0f4ff;
  --border:#cbd5e1; --border2:#94a3b8;
  --text:#0f172a; --text2:#334155; --text3:#64748b;
  --shadow:0 4px 24px rgba(0,0,0,.12);
}

/* ─ Reset ───────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;min-height:100dvh;overflow-x:hidden;}
button{cursor:pointer;border:none;background:none;font-family:inherit;}
input,select,textarea{font-family:inherit;}
a{color:inherit;text-decoration:none;}
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:4px;}

/* ══════════════════════════════════════════════
   MOBILE 레이아웃 (기본 — < 1024px)
   ══════════════════════════════════════════════ */
#app-shell{display:flex;flex-direction:column;min-height:100dvh;position:relative;}
#sidebar{display:none;}
#main-wrap{flex:1;overflow-y:auto;padding-bottom:calc(var(--nav-h) + 8px);}
#page-content{max-width:480px;margin:0 auto;}
#nav-bar{
  position:fixed;bottom:0;left:0;right:0;
  height:var(--nav-h);background:var(--bg2);
  border-top:1px solid var(--border);
  display:flex;align-items:center;padding:0 8px;
  z-index:100;backdrop-filter:blur(16px);
}
.nav-item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:8px 4px;border-radius:var(--radius-sm);
  color:var(--text3);font-size:.65rem;font-weight:500;
  transition:color var(--transition),background var(--transition);
}
.nav-item svg{transition:transform var(--transition);}
.nav-item.active{color:var(--accent);}
.nav-item.active svg{transform:scale(1.1);}
.nav-item:active{background:var(--border);}

/* ══════════════════════════════════════════════
   DESKTOP 레이아웃 (≥ 1024px)
   ══════════════════════════════════════════════ */
@media (min-width: 1024px) {
  #app-shell{
    flex-direction:row;
    min-height:100vh;
    overflow:hidden;
  }

  /* 사이드바 */
  #sidebar{
    display:flex;flex-direction:column;
    width:var(--sidebar-w);
    min-height:100vh;
    background:var(--bg2);
    border-right:1px solid var(--border);
    position:fixed;left:0;top:0;bottom:0;
    z-index:50;
    flex-shrink:0;
    padding:0 0 24px;
  }
  .sidebar-logo{
    display:flex;align-items:center;gap:10px;
    padding:22px 20px 20px;
    border-bottom:1px solid var(--border);
    margin-bottom:8px;
  }
  .logo-mark{
    width:32px;height:32px;border-radius:8px;
    background:linear-gradient(135deg,var(--accent),var(--cyan));
    display:flex;align-items:center;justify-content:center;
    font-family:var(--font-head);font-weight:800;font-size:.95rem;color:#fff;
    flex-shrink:0;
  }
  .logo-text{
    font-family:var(--font-head);font-weight:800;font-size:1rem;
    background:linear-gradient(135deg,var(--accent),var(--cyan));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  }
  .sidebar-nav{
    display:flex;flex-direction:column;gap:2px;
    padding:8px 12px;flex:1;
  }
  .snav-item{
    display:flex;align-items:center;gap:10px;
    padding:10px 12px;border-radius:var(--radius-sm);
    color:var(--text3);font-size:.85rem;font-weight:500;
    transition:all var(--transition);text-align:left;
    width:100%;
  }
  .snav-item:hover{background:var(--bg3);color:var(--text);}
  .snav-item.active{
    background:rgba(59,130,246,.12);color:var(--accent);
    border:1px solid rgba(59,130,246,.2);
  }
  .snav-item.active svg{stroke:var(--accent);}
  .sidebar-market-status{
    display:flex;align-items:center;gap:6px;
    padding:12px 20px;margin-top:auto;
    border-top:1px solid var(--border);
    font-size:.72rem;color:var(--text3);
  }

  /* 메인 영역 */
  #main-wrap{
    margin-left:var(--sidebar-w);
    flex:1;overflow-y:auto;
    height:100vh;
    padding-bottom:0;
  }
  #page-content{max-width:none;margin:0;}
  #nav-bar{display:none;}

  /* 데스크탑 페이지 패딩 */
  .page{padding:0 0 32px;}
  .page-header{
    padding:20px 28px 16px;
    position:sticky;top:0;z-index:10;
    background:var(--bg);
  }
  .sticky-header{background:var(--bg2) !important;}
  .section{padding:24px 28px 0;}

  /* ── 홈: 2컬럼 그리드 ── */
  .home-page .home-grid{
    display:grid;
    grid-template-columns:1fr 380px;
    gap:0;
    min-height:calc(100vh - 120px);
  }
  .home-grid-main{
    border-right:1px solid var(--border);
    overflow-y:auto;
    padding-bottom:32px;
  }
  .home-grid-side{
    overflow-y:auto;
    padding:24px 24px 32px;
    display:flex;flex-direction:column;gap:20px;
  }
  .home-grid-side .section{padding:0;}

  /* 시장 배너 */
  .market-ticker-wrap{border-top:none;}

  /* 포트폴리오 요약 — 데스크탑에서 더 넓게 */
  .portfolio-summary-card{border-radius:var(--radius);}
  .ps-value{font-size:2rem;}

  /* 종목 리스트 — 데스크탑에서 테이블형 */
  .stock-list{gap:1px;}
  .stock-row{border-radius:0;border-left:none;border-right:none;border-top:none;}
  .stock-list .stock-row:first-child{border-radius:var(--radius-sm) var(--radius-sm) 0 0;border-top:1px solid var(--border);}
  .stock-list .stock-row:last-child{border-radius:0 0 var(--radius-sm) var(--radius-sm);}

  /* ── 포트폴리오: 그리드 카드 ── */
  .holdings-list{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    gap:12px;
    padding:20px 28px;
  }
  .holding-card{transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);}
  .holding-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.4);}

  /* ── 관심종목: 테이블형 ── */
  .watchlist{padding:0;gap:0;}
  .watch-card{border-radius:0;border-left:none;border-right:none;border-top:none;padding:14px 28px;}
  .watchlist .watch-card:first-child{border-top:1px solid var(--border);}

  /* ── 종목 상세: 2컬럼 ── */
  .detail-page{
    display:grid;
    grid-template-rows:auto auto auto 1fr;
    min-height:100vh;
  }
  .detail-price-card{padding:24px 28px 20px;}
  .dpc-price{font-size:2.4rem;}
  .dpc-stats{grid-template-columns:repeat(6,1fr);}
  .detail-tabs{position:sticky;top:0;padding:0 28px;}
  .detail-tabs .dtab{padding:14px 20px;font-size:.82rem;}
  .detail-tab-content{padding:0;}
  .ai-card{margin:20px 28px;}
  .news-row,.filing-row{padding:16px 28px;}
  .fundflow-page{padding:20px 28px;}
  .cal-list{padding:0 28px;}
  .section-sub{padding:0 28px;}

  /* ── 캘린더 ── */
  .calendar-page .cal-event-list{
    padding:12px 28px;
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
    gap:8px;align-items:start;
  }
  .cal-date-group{break-inside:avoid;}
  .cal-tabs{padding:12px 28px;}

  /* ── 설정 ── */
  .settings-page{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 32px;
    padding:24px 28px 32px;
    align-items:start;
  }
  .settings-page .page-header{grid-column:1/-1;padding:0 0 16px;}
  .settings-group{margin:0 0 20px;}
  .sg-title{padding:0 0 8px;}
  .setting-row:first-of-type{border-radius:var(--radius-sm) var(--radius-sm) 0 0;}
  .api-key-row{border-radius:0;}
  .settings-version{grid-column:1/-1;text-align:center;padding:16px 0 0;}
  .settings-info-note{border-radius:0 0 var(--radius-sm) var(--radius-sm);}

  /* 포트폴리오 배너 — 데스크탑 */
  .portfolio-banner{padding:16px 28px;}

  /* 페이지 헤더 타이틀 */
  .page-title{font-size:1.6rem;}
}

/* 와이드 데스크탑 (≥ 1400px) */
@media (min-width: 1400px) {
  :root{--sidebar-w:240px;}

  /* 홈 사이드패널 더 넓게 */
  .home-page .home-grid{grid-template-columns:1fr 420px;}

  /* 포트폴리오 3컬럼 */
  .holdings-list{grid-template-columns:repeat(3,1fr);}

  /* 종목상세 수급 바 더 넓게 */
  .dpc-stats{grid-template-columns:repeat(6,1fr);}
}

/* ══════════════════════════════════════════════
   공통 컴포넌트
   ══════════════════════════════════════════════ */

/* 스플래시 */
#splash{position:fixed;inset:0;z-index:999;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;transition:opacity .6s ease,transform .6s ease;}
#splash.splash-out{opacity:0;transform:scale(1.04);pointer-events:none;}
.splash-logo{font-family:var(--font-head);font-size:28px;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-1px;}
.splash-bar{width:120px;height:2px;background:var(--border);border-radius:2px;overflow:hidden;}
.splash-bar::after{content:'';display:block;height:100%;width:40%;background:linear-gradient(90deg,var(--accent),var(--cyan));animation:splashLoad 1.2s ease-in-out infinite;}
@keyframes splashLoad{0%{transform:translateX(-100%);}100%{transform:translateX(350%);}}
.splash-sub{color:var(--text3);font-size:.8rem;}

/* 페이지 트랜지션 */
.page-enter{animation:pageIn .22s cubic-bezier(.4,0,.2,1) forwards;}
.page-exit{animation:pageOut .18s ease forwards;}
@keyframes pageIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
@keyframes pageOut{from{opacity:1;}to{opacity:0;}}
.tab-enter{animation:tabIn .18s ease forwards;}
@keyframes tabIn{from{opacity:0;transform:translateX(6px);}to{opacity:1;transform:translateX(0);}}

/* 공통 페이지 */
.page{padding:0 0 16px;}
.page-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 12px;position:sticky;top:0;z-index:10;background:var(--bg);}
.sticky-header{background:var(--bg2) !important;border-bottom:1px solid var(--border);backdrop-filter:blur(20px);}
.page-title{font-family:var(--font-head);font-size:1.4rem;font-weight:800;letter-spacing:-.5px;}
.page-title-area{display:flex;align-items:center;gap:10px;}

/* 마켓 상태 */
.market-status{display:flex;align-items:center;gap:5px;font-size:.7rem;color:var(--text3);}
.status-dot{width:6px;height:6px;border-radius:50%;background:#10b981;box-shadow:0 0 6px #10b981;}

/* 마켓 티커 배너 */
.market-ticker-wrap{overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--bg2);padding:7px 0;white-space:nowrap;}
.market-ticker{overflow:hidden;}
.ticker-track{display:inline-flex;gap:0;}
@keyframes tickerScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.ticker-item{display:inline-flex;align-items:center;gap:6px;padding:0 20px;border-right:1px solid var(--border);font-size:.72rem;}
.ticker-label{color:var(--text3);font-weight:600;letter-spacing:.3px;}
.ticker-price{font-family:var(--font-num);font-weight:500;}
.ticker-chg{font-family:var(--font-num);font-size:.68rem;}
.ticker-item .pos{color:var(--pos);}
.ticker-item .neg{color:var(--neg);}

/* 섹션 */
.section{padding:20px 16px 0;}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.section-title{display:flex;align-items:center;gap:6px;font-size:.9rem;font-weight:700;letter-spacing:-.2px;}
.section-title-sm{font-size:.82rem;font-weight:600;color:var(--text2);margin-bottom:10px;}
.title-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.title-dot.red{background:var(--neg);box-shadow:0 0 6px var(--neg);}
.title-dot.blue{background:var(--accent);box-shadow:0 0 6px var(--accent);}
.title-dot.cyan{background:var(--cyan);box-shadow:0 0 6px var(--cyan);}
.title-dot.yellow{background:var(--warn);box-shadow:0 0 6px var(--warn);}
.title-dot.purple{background:var(--purple);box-shadow:0 0 6px var(--purple);}
.see-all{font-size:.72rem;color:var(--accent);font-weight:500;}
.section-sub{margin-top:16px;}

/* 포트폴리오 요약 카드 */
.portfolio-summary-card{background:linear-gradient(135deg,var(--card),var(--card2));border:1px solid var(--border2);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow),0 0 40px rgba(59,130,246,.06);overflow:hidden;position:relative;}
.portfolio-summary-card::before{content:'';position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(59,130,246,.08) 0%,transparent 70%);}
.ps-loading{display:flex;justify-content:center;padding:20px;}
.ps-empty{text-align:center;padding:24px 0;}
.ps-empty-icon{font-size:2.5rem;margin-bottom:8px;}
.ps-empty p{color:var(--text3);font-size:.85rem;margin-bottom:14px;}
.ps-top{margin-bottom:16px;}
.ps-label{font-size:.72rem;color:var(--text3);margin-bottom:4px;letter-spacing:.5px;text-transform:uppercase;}
.ps-value{font-family:var(--font-num);font-size:1.8rem;font-weight:600;letter-spacing:-.5px;}
.ps-pnl{display:flex;align-items:center;gap:10px;margin-top:4px;font-family:var(--font-num);}
.ps-rate{font-size:.8rem;background:var(--border);padding:2px 8px;border-radius:4px;}
.ps-bottom{display:flex;gap:0;border-top:1px solid var(--border);padding-top:14px;}
.ps-item{flex:1;text-align:center;}
.ps-item+.ps-item{border-left:1px solid var(--border);}
.ps-item-label{font-size:.65rem;color:var(--text3);letter-spacing:.3px;}
.ps-item-val{font-family:var(--font-num);font-size:.85rem;font-weight:600;margin-top:2px;display:block;}

/* 종목 행 */
.stock-list{display:flex;flex-direction:column;gap:2px;}
.stock-row{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;cursor:pointer;transition:background var(--transition),border-color var(--transition),transform var(--transition);}
.stock-row:active{transform:scale(.99);background:var(--card2);}
.stock-row:hover{border-color:var(--border2);background:var(--card2);}
.sr-left{flex:1.2;min-width:0;}
.sr-mid{flex:1.5;text-align:center;}
.sr-right{flex:1;text-align:right;}
.sr-ticker{font-family:var(--font-num);font-size:.82rem;font-weight:600;color:var(--accent);}
.sr-name{font-size:.72rem;color:var(--text3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sr-price{font-family:var(--font-num);font-size:.9rem;font-weight:600;}
.sr-change{font-family:var(--font-num);font-size:.72rem;margin-top:2px;}
.sr-pnl{font-family:var(--font-num);font-size:.82rem;font-weight:600;}
.sr-rate{font-family:var(--font-num);font-size:.7rem;margin-top:2px;}
.sr-vol{font-size:.65rem;color:var(--text3);}
.sr-vol-val{font-family:var(--font-num);font-size:.72rem;color:var(--text2);margin-top:2px;}

/* 색상 */
.positive{color:var(--pos) !important;}
.negative{color:var(--neg) !important;}
.neutral{color:var(--text2);}
.pos{color:var(--pos);}
.neg{color:var(--neg);}

/* 가격 플래시 */
.flash-up{animation:flashUp .7s ease forwards;}
.flash-down{animation:flashDown .7s ease forwards;}
@keyframes flashUp{0%{background:var(--pos-bg);}100%{background:transparent;}}
@keyframes flashDown{0%{background:var(--neg-bg);}100%{background:transparent;}}

/* 이벤트 카드 */
.event-cards{display:flex;flex-direction:column;gap:8px;}
.event-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;cursor:pointer;transition:transform var(--transition),border-color var(--transition);border-left-width:3px;}
.event-card.positive{border-left-color:var(--pos);}
.event-card.negative{border-left-color:var(--neg);}
.event-card.neutral{border-left-color:var(--border2);}
.event-card:active{transform:scale(.99);}
.ec-top{display:flex;align-items:center;gap:6px;margin-bottom:8px;}
.ec-badge{font-size:.65rem;font-weight:700;padding:2px 8px;border-radius:4px;letter-spacing:.3px;}
.ec-badge.positive{background:var(--pos-bg);color:var(--pos);}
.ec-badge.negative{background:var(--neg-bg);color:var(--neg);}
.ec-badge.neutral{background:var(--border);color:var(--text3);}
.ec-imp{font-size:.6rem;color:var(--warn);}
.ec-time{font-size:.65rem;color:var(--text3);margin-left:auto;}
.ec-title{font-size:.85rem;font-weight:500;line-height:1.4;margin-bottom:6px;}
.ec-source{font-size:.65rem;color:var(--text3);}
.ec-reasons{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px;}
.ec-reasons span{font-size:.65rem;padding:2px 6px;border-radius:4px;}
.ec-reasons.pos span{background:var(--pos-bg);color:var(--pos);}
.ec-reasons.neg span{background:var(--neg-bg);color:var(--neg);}

/* 수급 테이블 */
.flow-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;overflow:hidden;}
.flow-title{font-size:.8rem;font-weight:600;color:var(--text2);margin-bottom:12px;}
.flow-table{width:100%;border-collapse:collapse;font-size:.78rem;}
.flow-table th{color:var(--text3);font-weight:500;padding:6px 8px;text-align:right;border-bottom:1px solid var(--border);font-size:.68rem;letter-spacing:.3px;}
.flow-table th:first-child{text-align:left;}
.flow-table td{padding:8px;text-align:right;border-bottom:1px solid var(--border)10;}
.flow-table.full th,.flow-table.full td{padding:10px 12px;}
.flow-label{font-weight:600;color:var(--text2);text-align:left !important;}
.flow-val{font-family:var(--font-num);font-size:.78rem;}
.flow-val.pos{color:var(--pos);}
.flow-val.neg{color:var(--neg);}

/* 캘린더 미리보기 */
.cal-preview{display:flex;flex-direction:column;gap:6px;}
.cal-item{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;cursor:pointer;transition:background var(--transition);}
.cal-item:hover{background:var(--card2);}
.cal-dday{font-family:var(--font-num);font-size:.82rem;font-weight:700;min-width:40px;}
.cal-info{flex:1;}
.cal-label{display:inline-block;font-size:.6rem;font-weight:700;padding:2px 6px;border-radius:4px;margin-bottom:3px;letter-spacing:.3px;}
.cal-name{font-size:.82rem;font-weight:500;}
.cal-date{font-size:.65rem;color:var(--text3);margin-top:2px;}
.cal-imp{font-size:.55rem;color:var(--warn);}

/* 포트폴리오 배너 */
.portfolio-banner{display:flex;align-items:center;background:var(--card);border-bottom:1px solid var(--border);padding:14px 16px;gap:0;}
.pb-item{flex:1;text-align:center;}
.pb-label{font-size:.65rem;color:var(--text3);margin-bottom:3px;}
.pb-value{font-family:var(--font-num);font-size:.95rem;font-weight:600;}
.pb-divider{width:1px;background:var(--border);height:32px;}

/* 보유종목 카드 */
.holdings-list{display:flex;flex-direction:column;gap:8px;padding:12px 16px;}
.holding-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;cursor:pointer;transition:border-color var(--transition),box-shadow var(--transition);}
.holding-card:hover{border-color:var(--border2);box-shadow:var(--shadow);}
.hc-header{display:flex;align-items:center;gap:8px;padding:12px 14px 8px;border-bottom:1px solid var(--border);}
.hc-ticker{font-family:var(--font-num);font-weight:700;color:var(--accent);font-size:.88rem;}
.hc-market{font-size:.6rem;background:var(--border);color:var(--text3);padding:2px 6px;border-radius:4px;}
.hc-name{font-size:.78rem;color:var(--text2);flex:1;}
.hc-actions{display:flex;gap:4px;margin-left:auto;}
.hc-body{padding:12px 14px;}
.hc-price-row{display:flex;align-items:baseline;gap:8px;margin-bottom:10px;}
.hc-price{font-family:var(--font-num);font-size:1.1rem;font-weight:600;}
.hc-chg{font-family:var(--font-num);font-size:.8rem;}
.hc-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px 8px;}
.hc-stat{display:flex;flex-direction:column;gap:2px;}
.hc-stat-l{font-size:.6rem;color:var(--text3);}
.hc-stat-v{font-family:var(--font-num);font-size:.78rem;font-weight:500;}
.hc-memo{font-size:.72rem;color:var(--text3);padding:8px 14px;border-top:1px solid var(--border);background:var(--bg2);}
.hc-pnl-bar{height:2px;background:var(--border);}
.hc-pnl-fill{height:100%;border-radius:2px;transition:width .8s ease;}
.hc-pnl-fill.positive{background:var(--pos);}
.hc-pnl-fill.negative{background:var(--neg);}

/* 관심종목 카드 */
.watchlist{display:flex;flex-direction:column;gap:6px;padding:12px 16px;}
.watch-card{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;cursor:pointer;transition:background var(--transition),border-color var(--transition);}
.watch-card:hover{background:var(--card2);border-color:var(--border2);}
.wc-left{flex:1.2;min-width:0;}
.wc-ticker{font-family:var(--font-num);font-weight:700;color:var(--accent);font-size:.88rem;}
.wc-name{font-size:.75rem;color:var(--text2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wc-market{font-size:.6rem;color:var(--text3);margin-top:2px;}
.wc-center{flex:.8;}
.wc-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px;}
.wc-price{font-family:var(--font-num);font-size:.88rem;font-weight:600;}
.wc-change{font-family:var(--font-num);font-size:.72rem;}
.wc-vol{font-size:.65rem;color:var(--text3);}

/* 스파크라인 */
.sparkline{display:flex;align-items:flex-end;gap:2px;height:28px;}
.spark-bar{width:5px;background:var(--border2);border-radius:2px 2px 0 0;transition:height .5s ease;}
.spark-bar.pos{background:var(--pos);opacity:.7;}
.spark-bar.neg{background:var(--neg);opacity:.7;}

/* 종목 상세 */
.detail-ticker-header{flex:1;text-align:center;}
.dth-ticker{font-family:var(--font-num);font-weight:700;font-size:.9rem;color:var(--accent);}
.back-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;color:var(--text2);transition:background var(--transition);}
.back-btn:hover{background:var(--card2);}
.detail-price-card{background:var(--card2);padding:20px 16px 16px;border-bottom:1px solid var(--border);}
.dpc-skeleton{display:flex;justify-content:center;padding:20px;}
.dpc-error{color:var(--text3);text-align:center;padding:20px;}
.dpc-name{font-size:.8rem;color:var(--text3);margin-bottom:4px;}
.dpc-price{font-family:var(--font-num);font-size:2rem;font-weight:700;letter-spacing:-1px;padding:2px 4px;border-radius:4px;transition:background .3s;}
.dpc-change-row{display:flex;align-items:center;gap:8px;margin-top:4px;}
.dpc-arrow{font-size:.9rem;}
.dpc-change{font-family:var(--font-num);font-size:.9rem;font-weight:500;}
.dpc-rate{font-family:var(--font-num);font-size:.9rem;font-weight:600;background:var(--border);padding:2px 8px;border-radius:4px;}
.dpc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border);}
.dpc-stat{display:flex;flex-direction:column;gap:3px;}
.dpc-sl{font-size:.6rem;color:var(--text3);}
.dpc-sv{font-family:var(--font-num);font-size:.78rem;font-weight:500;}
.dpc-my-position{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:12px;padding:10px 12px;background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.2);border-radius:var(--radius-sm);font-size:.75rem;}
.dpc-pos-label{color:var(--accent);font-weight:600;}
.dpc-pos-qty{font-family:var(--font-num);font-weight:600;}
.dpc-pos-avg{color:var(--text3);}
.dpc-pos-pnl{font-family:var(--font-num);font-weight:600;margin-left:auto;}

/* 상세 탭 */
.detail-tabs{display:flex;border-bottom:1px solid var(--border);background:var(--bg2);position:sticky;top:57px;z-index:9;overflow-x:auto;scrollbar-width:none;}
.detail-tabs::-webkit-scrollbar{display:none;}
.dtab{flex:none;padding:12px 16px;font-size:.78rem;font-weight:600;color:var(--text3);border-bottom:2px solid transparent;transition:color var(--transition),border-color var(--transition);white-space:nowrap;}
.dtab.active{color:var(--accent);border-bottom-color:var(--accent);}
.detail-tab-content{padding:0;}

/* AI 카드 */
.ai-card{background:linear-gradient(135deg,rgba(59,130,246,.05),rgba(139,92,246,.05));border:1px solid rgba(59,130,246,.2);border-radius:var(--radius);padding:16px;margin:14px 16px;}
.ai-header{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.ai-badge{font-size:.65rem;font-weight:700;background:rgba(59,130,246,.15);color:var(--accent);padding:3px 8px;border-radius:4px;letter-spacing:.5px;}
.ai-rec{font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:4px;}
.ai-rec.rec-buy{background:var(--pos-bg);color:var(--pos);}
.ai-rec.rec-sell{background:var(--neg-bg);color:var(--neg);}
.ai-rec.rec-hold{background:var(--border);color:var(--text3);}
.ai-risk{font-size:.72rem;font-weight:600;margin-left:auto;}
.ai-summary{font-size:.82rem;line-height:1.6;color:var(--text2);margin-bottom:12px;}
.ai-reasons{display:flex;flex-direction:column;gap:8px;}
.reason-group{display:flex;flex-direction:column;gap:4px;}
.reason-title{font-size:.7rem;font-weight:700;margin-bottom:3px;}
.reason-title.pos{color:var(--pos);}
.reason-title.neg{color:var(--neg);}
.reason-item{font-size:.75rem;padding:4px 8px;border-radius:4px;}
.reason-item.pos{background:var(--pos-bg);color:var(--pos);}
.reason-item.neg{background:var(--neg-bg);color:var(--neg);}

/* 뉴스 / 공시 */
.news-list,.filing-list{display:flex;flex-direction:column;gap:0;}
.news-row,.filing-row{padding:14px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--transition);}
.news-row:hover,.filing-row:hover{background:var(--card);}
.nr-top,.fr-top{display:flex;align-items:center;gap:6px;margin-bottom:7px;}
.nr-badge{font-size:.65rem;font-weight:700;width:16px;text-align:center;}
.nr-badge.positive{color:var(--pos);}
.nr-badge.negative{color:var(--neg);}
.nr-source,.fr-time{font-size:.65rem;color:var(--text3);}
.nr-time{font-size:.65rem;color:var(--text3);margin-left:auto;}
.nr-imp,.fr-imp{font-size:.55rem;color:var(--warn);margin-left:auto;}
.nr-title,.fr-title{font-size:.85rem;font-weight:500;line-height:1.4;margin-bottom:6px;}
.fr-badge{font-size:.62rem;font-weight:600;background:var(--border);color:var(--text2);padding:2px 6px;border-radius:4px;}
.fr-summary{font-size:.72rem;color:var(--text3);margin-top:4px;}
.nr-reasons{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;}
.nr-reasons span{font-size:.65rem;padding:2px 6px;border-radius:4px;}
.nr-reasons.pos span{background:var(--pos-bg);color:var(--pos);}
.nr-reasons.neg span{background:var(--neg-bg);color:var(--neg);}
.nr-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;}
.tag{font-size:.62rem;background:var(--border);color:var(--text3);padding:2px 6px;border-radius:4px;}

/* 수급 탭 */
.fundflow-page{padding:16px;}
.ff-table-wrap{overflow-x:auto;}
.ff-bars{margin-top:20px;}
.ff-bars-title{font-size:.72rem;color:var(--text3);margin-bottom:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;}
.ff-bar-row{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.ff-bar-label{font-size:.75rem;font-weight:600;width:42px;color:var(--text2);}
.ff-bar-track{flex:1;height:6px;background:var(--border);border-radius:4px;overflow:hidden;}
.ff-bar-fill{height:100%;border-radius:4px;transition:width .8s cubic-bezier(.4,0,.2,1);min-width:2px;}
.ff-bar-fill.pos{background:var(--pos);}
.ff-bar-fill.neg{background:var(--neg);}
.ff-bar-val{font-family:var(--font-num);font-size:.72rem;font-weight:600;width:64px;text-align:right;}

/* 캘린더 페이지 */
.cal-tabs{display:flex;gap:4px;padding:10px 16px;overflow-x:auto;scrollbar-width:none;}
.cal-tabs::-webkit-scrollbar{display:none;}
.ctab{flex:none;padding:7px 14px;font-size:.76rem;font-weight:600;border-radius:20px;color:var(--text3);background:var(--card);border:1px solid var(--border);transition:all var(--transition);}
.ctab.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.cal-event-list{padding:8px 16px;display:flex;flex-direction:column;gap:8px;}
.cal-date-group{display:flex;flex-direction:column;gap:4px;}
.cal-date-header{display:flex;align-items:center;justify-content:space-between;padding:6px 2px;margin-top:8px;font-size:.7rem;font-weight:600;color:var(--text3);letter-spacing:.3px;text-transform:uppercase;}
.cal-dday-badge{font-family:var(--font-num);font-size:.68rem;background:var(--border);color:var(--text2);padding:2px 8px;border-radius:4px;}
.cal-event-big{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-left:3px solid;border-radius:var(--radius-sm);padding:12px 14px;cursor:pointer;transition:background var(--transition);}
.cal-event-big:hover{background:var(--card2);}
.ceb-left{flex:1;}
.ceb-type{display:inline-block;font-size:.62rem;font-weight:700;padding:2px 6px;border-radius:4px;margin-bottom:4px;letter-spacing:.3px;}
.ceb-title{font-size:.85rem;font-weight:500;}
.ceb-tickers{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;}
.ceb-tick{font-family:var(--font-num);font-size:.65rem;background:var(--border);padding:2px 6px;border-radius:4px;}
.ceb-right{text-align:right;}
.ceb-imp{font-size:.55rem;color:var(--warn);}
.cal-list{padding:0 16px;display:flex;flex-direction:column;gap:6px;}

/* 설정 */
.settings-page{padding-bottom:32px;}
.settings-group{margin:12px 0 0;}
.sg-title{font-size:.65rem;color:var(--text3);font-weight:600;letter-spacing:.5px;text-transform:uppercase;padding:8px 16px;}
.setting-row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border);background:var(--card);}
.setting-row:first-of-type{border-top:1px solid var(--border);}
.setting-row.clickable{cursor:pointer;transition:background var(--transition);}
.setting-row.clickable:hover{background:var(--card2);}
.setting-row.danger-row .sr-label{color:var(--neg);}
.sr-info{flex:1;}
.sr-label{font-size:.85rem;font-weight:500;}
.sr-desc{font-size:.7rem;color:var(--text3);margin-top:2px;}
.sr-arrow{font-size:1rem;color:var(--text3);}
.sr-arrow.danger{color:var(--neg);}
.setting-select{background:var(--bg2);color:var(--text);border:1px solid var(--border2);border-radius:var(--radius-sm);padding:7px 12px;font-size:.8rem;outline:none;cursor:pointer;}

/* API 키 입력 */
.api-key-row{display:flex;gap:8px;padding:6px 16px 10px;background:var(--card);border-bottom:1px solid var(--border);}
.api-key-input{flex:1;background:var(--bg3);border:1px solid var(--border2);color:var(--text);border-radius:var(--radius-sm);padding:9px 12px;font-size:.82rem;outline:none;font-family:var(--font-num);transition:border-color var(--transition);}
.api-key-input:focus{border-color:var(--accent);}
.api-key-input::placeholder{color:var(--text3);font-family:var(--font-ui);}
.btn-save-key{background:var(--accent);color:#fff;padding:9px 16px;border-radius:var(--radius-sm);font-size:.78rem;font-weight:700;white-space:nowrap;transition:background var(--transition);}
.btn-save-key:hover{background:var(--accent2);}
.settings-info-note{padding:10px 16px;font-size:.72rem;color:var(--text3);background:var(--card);border-bottom:1px solid var(--border);}
.settings-version{text-align:center;font-size:.7rem;color:var(--text3);padding:24px;}

/* 모달 */
.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .3s;backdrop-filter:blur(4px);}
.modal-overlay.modal-show{opacity:1;}
.modal-overlay.modal-show .modal-box{transform:translateY(0);}
.modal-box{background:var(--bg2);border:1px solid var(--border2);border-radius:20px 20px 0 0;padding:24px 20px;width:100%;max-width:480px;transform:translateY(40px);transition:transform .3s cubic-bezier(.4,0,.2,1);max-height:92dvh;overflow-y:auto;}
@media(min-width:1024px){
  .modal-overlay{align-items:center;}
  .modal-box{border-radius:var(--radius);max-width:460px;transform:scale(.95) translateY(0);}
  .modal-overlay.modal-show .modal-box{transform:scale(1) translateY(0);}
}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.modal-header h3{font-size:1.1rem;font-weight:700;}
.modal-body-text{font-size:.88rem;color:var(--text2);line-height:1.6;margin-bottom:20px;}

/* 폼 */
.modal-form{display:flex;flex-direction:column;gap:14px;}
.form-group{display:flex;flex-direction:column;gap:6px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-group label{font-size:.75rem;font-weight:600;color:var(--text2);}
.required{color:var(--neg);}
.form-group input,.form-group select{background:var(--bg3);border:1px solid var(--border2);color:var(--text);border-radius:var(--radius-sm);padding:10px 12px;font-size:.88rem;outline:none;transition:border-color var(--transition);}
.form-group input:focus,.form-group select:focus{border-color:var(--accent);}
.form-group input.disabled{opacity:.5;}
.form-group input::placeholder{color:var(--text3);}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:6px;}

/* 버튼 */
.btn-primary{background:var(--accent);color:#fff;padding:9px 18px;border-radius:var(--radius-sm);font-size:.82rem;font-weight:700;letter-spacing:.2px;transition:background var(--transition),transform var(--transition);}
.btn-primary:hover{background:var(--accent2);}
.btn-primary:active{transform:scale(.97);}
.btn-secondary{background:var(--card);color:var(--text2);border:1px solid var(--border2);padding:9px 18px;border-radius:var(--radius-sm);font-size:.82rem;font-weight:600;transition:background var(--transition);}
.btn-secondary:hover{background:var(--card2);}
.btn-danger{background:var(--neg);color:#fff;padding:9px 18px;border-radius:var(--radius-sm);font-size:.82rem;font-weight:700;}
.btn-sm{font-size:.72rem;padding:5px 12px;border-radius:4px;background:var(--accent);color:#fff;font-weight:600;}
.icon-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:var(--text3);font-size:.82rem;transition:background var(--transition),color var(--transition);}
.icon-btn:hover{background:var(--card2);color:var(--text);}
.icon-btn.danger:hover{color:var(--neg);}
.spinning svg{animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* 토스트 */
#toast-container{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;z-index:500;pointer-events:none;width:320px;}
@media(min-width:1024px){#toast-container{bottom:24px;left:calc(var(--sidebar-w) + 50%);transform:translateX(-50%);}}
.toast{display:flex;align-items:center;gap:8px;background:var(--card2);border:1px solid var(--border2);border-radius:100px;padding:10px 16px;font-size:.8rem;font-weight:500;box-shadow:var(--shadow);opacity:0;transform:translateY(10px) scale(.95);transition:all .3s cubic-bezier(.4,0,.2,1);pointer-events:auto;}
.toast.toast-show{opacity:1;transform:translateY(0) scale(1);}
.toast-icon{font-size:.9rem;}
.toast-success .toast-icon{color:var(--pos);}
.toast-error .toast-icon{color:var(--neg);}
.toast-warning .toast-icon{color:var(--warn);}
.toast-info .toast-icon{color:var(--accent);}

/* 스켈레톤 */
.skeleton{background:linear-gradient(90deg,var(--card) 25%,var(--card2) 50%,var(--card) 75%);background-size:200% 100%;animation:shimmer 1.4s ease-in-out infinite;border-radius:4px;display:inline-block;min-height:12px;}
@keyframes shimmer{from{background-position:200% 0;}to{background-position:-200% 0;}}
.skeleton-row{opacity:.7;}
.skeleton-card{height:80px;border-radius:var(--radius);}
.w40{width:40px;}.w60{width:60px;}.w70{width:70px;}.w80{width:80px;}.w80p{width:80%;}.w100{width:100px;}.w100p{width:100%;}.w120{width:120px;}
.h12{height:12px;}.h16{height:16px;}.h80{height:80px;}
.mt4{margin-top:4px;}.mt8{margin-top:8px;}.mt12{margin-top:12px;}.ml12{margin-left:12px;}

/* 스피너 */
.spinner{display:inline-block;width:20px;height:20px;border:2px solid var(--border2);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;}
.tab-loading{display:flex;justify-content:center;padding:32px;}

/* Empty state */
.empty-state{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;color:var(--text3);font-size:.82rem;text-align:center;}
.empty-full{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:10px;text-align:center;}
.empty-icon{font-size:3rem;}
.empty-text{font-size:1rem;font-weight:600;color:var(--text2);}
.empty-sub{font-size:.8rem;color:var(--text3);margin-bottom:4px;}

/* ── 캘린더 이벤트 카드 개선 ─────────────────── */
.ceb-main { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.ceb-dday { font-family:var(--font-num); font-size:.75rem; font-weight:700; margin-top:4px; color:var(--text3); }

/* ── 캘린더 종목 추천 카드 ──────────────────── */
.cal-rec-area {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.cal-rec-loading {
  display: flex; align-items:center; gap:8px;
  font-size: .72rem; color: var(--text3);
}
.spinner-sm {
  display:inline-block; width:12px; height:12px;
  border:1.5px solid var(--border2); border-top-color:var(--accent);
  border-radius:50%; animation:spin .7s linear infinite;
}
.cal-rec-card { display:flex; flex-direction:column; gap:10px; }
.cal-rec-header {
  display: flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.cal-rec-signal {
  font-size:.72rem; font-weight:700;
  padding: 4px 12px; border-radius:20px;
  border: 1px solid;
  letter-spacing:.3px;
}
.cal-rec-confidence {
  display:flex; align-items:center; gap:6px; flex:1;
}
.conf-bar-track {
  flex:1; height:4px; background:var(--border);
  border-radius:4px; overflow:hidden;
}
.conf-bar-fill {
  height:100%; border-radius:4px;
  transition: width 1s cubic-bezier(.4,0,.2,1);
  min-width: 4px;
}
.conf-val { font-family:var(--font-num); font-size:.72rem; font-weight:600; }
.cal-rec-go {
  font-size:.72rem; font-weight:600;
  color:var(--accent); padding:4px 8px;
  border:1px solid rgba(59,130,246,.3); border-radius:6px;
  transition: background var(--transition);
}
.cal-rec-go:hover { background:rgba(59,130,246,.1); }
.cal-rec-body {
  display: flex; gap:12px; flex-wrap:wrap;
}
.cal-rec-col { flex:1; min-width:140px; display:flex; flex-direction:column; gap:4px; }
.cal-rec-col-title {
  font-size:.65rem; font-weight:700; margin-bottom:2px;
  letter-spacing:.3px;
}
.cal-rec-col-title.pos { color:var(--pos); }
.cal-rec-col-title.neg { color:var(--warn); }
.cal-rec-item {
  font-size:.72rem; padding:3px 8px; border-radius:4px;
}
.cal-rec-item.pos { background:var(--pos-bg); color:var(--pos); }
.cal-rec-item.neg { background:rgba(245,158,11,.12); color:var(--warn); }
.cal-rec-meta {
  display:flex; flex-wrap:wrap; gap:8px;
  font-size:.62rem; color:var(--text3);
  padding-top:6px; border-top:1px solid var(--border);
}

/* 설정 API 키 상태 */
.key-status {
  font-size:.72rem; font-weight:600;
  padding:3px 10px; border-radius:20px;
  background:var(--pos-bg); color:var(--pos);
  white-space:nowrap;
}
.key-status:not(:contains('✓')) { background:var(--border); color:var(--text3); }

/* 캘린더 로딩 */
.cal-loading {
  display:flex; align-items:center; justify-content:center;
  gap:10px; padding:40px; color:var(--text3); font-size:.85rem;
}

/* 데스크탑 캘린더 추천 2컬럼 */
@media(min-width:1024px) {
  .cal-rec-body { gap:16px; }
  .cal-rec-col  { min-width:180px; }
  .ceb-main     { align-items:center; }
}

/* ─ 캘린더 추천 패널 ─────────────────────────── */
.ceb-hint { font-size:.62rem; color:var(--accent); margin-top:4px; opacity:.7; }
.cal-event-big.active-event { border-color:var(--accent) !important; background:var(--card2); }

.cal-recommend-panel {
  background: linear-gradient(135deg, rgba(59,130,246,.06), rgba(139,92,246,.04));
  border: 1px solid rgba(59,130,246,.25);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius);
  margin: 4px 0 8px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .25s ease, transform .25s ease;
}
.cal-recommend-panel.crp-show { opacity:1; transform:translateY(0); }
.crp-header {
  display: flex; align-items: center; gap:8px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  background: rgba(59,130,246,.05);
}
.crp-title { font-size:.78rem; font-weight:700; color:var(--accent); }
.crp-event { font-size:.72rem; color:var(--text3); flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.crp-close { width:24px; height:24px; font-size:.7rem; flex-shrink:0; }
.crp-loading {
  display: flex; flex-direction:column; gap:8px;
  padding: 12px 14px;
}

/* 추천 카드 */
.rec-card {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background var(--transition);
}
.rec-card:last-child { border-bottom: none; }
.rec-card:hover { background: rgba(255,255,255,.03); }
.rec-top {
  display: flex; align-items: center; gap:8px; margin-bottom:5px;
}
.rec-ticker { font-family:var(--font-num); font-size:.82rem; font-weight:700; color:var(--accent); }
.rec-name   { font-size:.78rem; color:var(--text2); flex:1; }
.rec-dir    { font-size:.65rem; font-weight:700; padding:2px 8px; border-radius:4px; white-space:nowrap; }
.rec-dir-buy  { background:var(--pos-bg); color:var(--pos); }
.rec-dir-sell { background:var(--neg-bg); color:var(--neg); }
.rec-dir-hold { background:var(--border); color:var(--text3); }
.rec-keypoint {
  font-size:.72rem; font-weight:600; color:var(--warn);
  margin-bottom:4px;
}
.rec-reason {
  font-size:.75rem; color:var(--text2); line-height:1.5;
  margin-bottom:6px;
}
.rec-price-row { display:flex; align-items:center; gap:8px; }
.rec-price { font-family:var(--font-num); font-size:.82rem; font-weight:600; }
.rec-chg   { font-family:var(--font-num); font-size:.72rem; }

/* 설정 키 상태 */
.key-status {
  font-size:.7rem; font-weight:600;
  color:var(--pos);
  padding:3px 8px; border-radius:4px;
  background: var(--pos-bg);
  white-space:nowrap;
}
.key-status:not(:contains('✓')) { color:var(--text3); background:var(--border); }

/* 캘린더 로딩 */
.cal-loading { display:flex; justify-content:center; padding:48px; }

@media(min-width:1024px) {
  .cal-recommend-panel { margin:4px 0 8px; }
}
