/* =====================================================================
   cp-pro.css — 프로 트레이딩 톤 (2026-10-07 상무님 지시: "만화틱·파스텔 → 전문 주식사이트처럼, 동선 정리")
   · 색 축: 진한 남색(상단·결과패널) + 흰 카드 + 짙은 금색 포인트. 상승=빨강, 하락=파랑.
   · 화면(@media screen)에만 적용한다. 인쇄(cp-print.css)는 건드리지 않는다.
   · 계산·기능 코드는 건드리지 않는다. 이 파일을 지우면 예전 모습으로 돌아간다.
   ===================================================================== */
@media screen {
:root, :root[data-theme="light"], :root[data-theme="dark"]{
  --pro-bg:#F3F5F9; --pro-bg2:#EEF1F7; --pro-line:#E1E6EF; --pro-line2:#CBD3E1;
  --pro-ink:#13203A; --pro-ink2:#4A5875; --pro-ink3:#8190A8;
  --pro-gold:#B8902F; --pro-gold2:#8A6A1C; --pro-navy:#0F2347; --pro-navy2:#16284A;
  --pro-up:#E03A3E; --pro-down:#2F6FDB;
  --bg:var(--pro-bg); --cp-bg:var(--pro-bg); --card:#fff; --white:#fff; --cp-surface:#fff;
  --text:var(--pro-ink); --cp-ink:var(--pro-ink); --cp-ink2:var(--pro-ink2); --cp-ink3:var(--pro-ink3);
  --muted:var(--pro-ink3); --border:var(--pro-line); --cp-line:var(--pro-line); --cp-hair:var(--pro-line);
  --primary:var(--pro-navy); --accent:var(--pro-gold); --cp-gold:var(--pro-gold); --cp-goldtx:var(--pro-gold2);
  --cp-raise:#F3F5F9; --cp-bg2:#fff; --cp-goldbg:rgba(184,144,47,.10); --cp-gold2:#8A6A1C; --cp-gold-dim:#C9AE73;
  --radius:8px; --radius-sm:6px;
  --shadow:0 1px 2px rgba(19,32,58,.05),0 10px 28px rgba(19,32,58,.06);
  --shadow-lg:0 2px 4px rgba(19,32,58,.06),0 18px 40px rgba(19,32,58,.10);
}
html,body{background:var(--pro-bg)!important}
body{background:
  radial-gradient(900px 380px at 12% -10%,rgba(184,144,47,.07),transparent 60%),
  radial-gradient(800px 420px at 100% 0%,rgba(47,111,219,.05),transparent 60%),var(--pro-bg)!important;
  color:var(--pro-ink)}

/* ── 상단 바 ── */
#page1 .page-header,#page2 .page-header{background:var(--pro-navy)!important;border-bottom:1px solid #1C3463!important;box-shadow:0 6px 22px rgba(15,35,71,.25)!important}
#page1 .page-header::before,#page2 .page-header::before{background:linear-gradient(90deg,transparent,#D8B76E,transparent)!important}
#page1 .page-header h1,#page2 .page-header h1,#page1 .page-header .logo-title,#page2 .page-header .logo-title,#page1 .logo-main-title,#page2 .logo-main-title{color:#fff!important}
#page1 .lt-kicker,#page2 .lt-kicker{color:#8FA3C7!important}

/* ── 입력 화면 동선: 1 → 2 → 3 한 줄 흐름 ── */
#page1 .page1-main,#page2 .page1-main{max-width:1500px!important;align-items:start}
#page1 .input-panel,#page2 .input-panel{grid-template-columns:1fr!important;gap:18px!important}
#page1 .step-card,#page2 .step-card{background:#fff!important;border:1px solid var(--pro-line)!important;border-radius:10px!important;box-shadow:var(--shadow)!important}
#page1 .step-card::before,#page2 .step-card::before,#page1 .step-card::after,#page2 .step-card::after{background:var(--pro-gold)!important}
#page1 .step-header,#page2 .step-header{border-bottom:1px solid var(--pro-line)!important}
#page1 .step-num,#page2 .step-num{background:var(--pro-navy)!important;color:#F0D79A!important;border:0!important;border-radius:4px!important;letter-spacing:.08em;font-weight:700}
#page1 .step-title,#page2 .step-title{color:var(--pro-ink)!important;font-weight:800}
#page1 .propose-date-inline,#page2 .propose-date-inline{background:var(--pro-bg2)!important;color:var(--pro-ink3)!important;border:0!important}
#page1 .form-group label,#page2 .form-group label{color:var(--pro-ink3)!important;font-size:11.5px!important;letter-spacing:.03em}
#page1 .form-group input[type=text],#page2 .form-group input[type=text],#page1 .form-group input[type=tel],#page2 .form-group input[type=tel],#page1 .form-group input[type=number],#page2 .form-group input[type=number],#page1 .amount-input-wrap input,#page2 .amount-input-wrap input{
  background:var(--pro-bg2)!important;border:1px solid var(--pro-line2)!important;border-radius:6px!important;color:var(--pro-ink)!important;box-shadow:none!important}
#page1 .form-group input:focus,#page2 .form-group input:focus,#page1 .amount-input-wrap input:focus,#page2 .amount-input-wrap input:focus{border-color:var(--pro-gold)!important;box-shadow:0 0 0 3px rgba(184,144,47,.14)!important;background:#fff!important}
#page1 .amount-input-wrap input,#page2 .amount-input-wrap input{font-weight:800!important;font-variant-numeric:tabular-nums}
#page1 .birth-hint.active,#page2 .birth-hint.active{color:var(--pro-gold2)!important}
#page1 .radio-label,#page2 .radio-label{background:var(--pro-bg2)!important;border:1px solid var(--pro-line2)!important;border-radius:6px!important;color:var(--pro-ink2)!important}
#page1 .radio-label:has(input:checked),#page2 .radio-label:has(input:checked){background:rgba(184,144,47,.10)!important;border-color:var(--pro-gold)!important;color:var(--pro-gold2)!important;font-weight:700}

/* 상품 선택 탭 */
#page1 .etab,#page2 .etab{background:var(--pro-bg2)!important;border:1px solid var(--pro-line2)!important;border-radius:6px!important;color:var(--pro-ink2)!important;box-shadow:none!important}
#page1 .etab:has(input:checked),#page2 .etab:has(input:checked),#page1 .etab.active,#page2 .etab.active,#page1 .etab.on,#page2 .etab.on{background:rgba(184,144,47,.10)!important;border-color:var(--pro-gold)!important;color:var(--pro-gold2)!important}
#page1 .etab-icon,#page2 .etab-icon{color:var(--pro-gold)!important;background:transparent!important}
#page1 .etab-badge,#page2 .etab-badge{background:var(--pro-navy)!important;color:#F0D79A!important;border:0!important;border-radius:4px!important}
#page1 .exp-banner,#page2 .exp-banner{background:var(--pro-bg)!important;border:1px dashed var(--pro-line2)!important;border-radius:8px!important;color:var(--pro-ink2)!important}
#page1 .exp-banner *,#page2 .exp-banner *{color:inherit}
#page1 .exp-banner b,#page2 .exp-banner b,#page1 .exp-banner strong,#page2 .exp-banner strong{color:var(--pro-ink)!important}

/* 금액 버튼 */
#page1 .amt-btn,#page2 .amt-btn{background:#fff!important;border:1px solid var(--pro-line2)!important;border-radius:4px!important;color:var(--pro-ink2)!important;box-shadow:none!important;font-variant-numeric:tabular-nums}
#page1 .amt-btn:hover,#page2 .amt-btn:hover{border-color:var(--pro-gold)!important;color:var(--pro-gold2)!important}
#page1 .amt-reset-btn,#page2 .amt-reset-btn{border-style:dashed!important}
#page1 .moki-lump-notice,#page2 .moki-lump-notice{background:var(--pro-bg)!important;border:1px solid var(--pro-line)!important;color:var(--pro-ink2)!important}
#page1 .levelup-death-benefit-box,#page2 .levelup-death-benefit-box{background:var(--pro-bg)!important;border:1px solid var(--pro-line)!important;border-radius:8px!important}

/* 프리셋·AI 추천 */
#page1 .preset-btn,#page2 .preset-btn{background:#fff!important;border:1px solid var(--pro-line2)!important;border-radius:999px!important;color:var(--pro-ink2)!important;box-shadow:none!important}
#page1 .preset-btn:hover,#page2 .preset-btn:hover{border-color:var(--pro-gold)!important;color:var(--pro-gold2)!important}
#page1 .preset-btn.reset,#page2 .preset-btn.reset{border-style:dashed!important}
#page1 .ai-recommend-box,#page2 .ai-recommend-box{background:#fff!important;border:1px solid var(--pro-line)!important;border-top:3px solid var(--pro-gold)!important;border-radius:10px!important;box-shadow:none!important}
#page1 .ai-badge,#page2 .ai-badge{background:var(--pro-navy)!important;color:#F0D79A!important;border:0!important;border-radius:4px!important}
#page1 .ai-rec-title,#page2 .ai-rec-title{color:var(--pro-ink)!important}.ai-rec-desc,.ai-rec-hint{color:var(--pro-ink3)!important}
#page1 .ai-rec-hint,#page2 .ai-rec-hint{background:var(--pro-bg)!important;border:1px dashed var(--pro-line2)!important;border-radius:6px!important}
#page1 .ai-btn,#page2 .ai-btn{background:#fff!important;border:1px solid var(--pro-line2)!important;border-radius:8px!important;box-shadow:none!important;color:var(--pro-ink)!important}
#page1 .ai-btn:hover,#page2 .ai-btn:hover{border-color:var(--pro-gold)!important;transform:none!important;box-shadow:0 8px 20px rgba(19,32,58,.08)!important}
#page1 .ai-btn-icon-wrap,#page2 .ai-btn-icon-wrap{background:var(--pro-navy)!important;border:0!important;border-radius:8px!important;box-shadow:none!important}
#page1 .ai-btn-icon-wrap *,#page2 .ai-btn-icon-wrap *{color:#F0D79A!important}
#page1 .ai-btn-name,#page2 .ai-btn-name{color:var(--pro-ink)!important}.ai-btn-desc{color:var(--pro-ink3)!important}
#page1 .ai-btn-glow,#page2 .ai-btn-glow{display:none!important}
#page1 .ai-btn-rec-badge,#page2 .ai-btn-rec-badge{background:var(--pro-gold)!important;color:#fff!important;border-radius:4px!important}
#page1 .ai-btn.selected,#page2 .ai-btn.selected,#page1 .ai-btn.active,#page2 .ai-btn.active{border-color:var(--pro-gold)!important;background:rgba(184,144,47,.07)!important}
#page1 .ai-result-box,#page2 .ai-result-box{background:var(--pro-bg)!important;border:1px solid var(--pro-line)!important;border-radius:8px!important;color:var(--pro-ink2)!important}
#page1 .ai-pulse-dot,#page2 .ai-pulse-dot{background:var(--pro-gold)!important}

/* ── 펀드 표: 증권사 시세표처럼 ── */
#page1 .fund-table-wrap,#page2 .fund-table-wrap{border:1px solid var(--pro-line);border-radius:8px;overflow:hidden;background:#fff}
#page1 .slider-card,#page2 .slider-card{background:#fff!important;border:0!important;border-bottom:1px solid var(--pro-line)!important;border-radius:0!important;box-shadow:none!important;position:relative;transition:opacity .15s}
#page1 .slider-card.zero-ratio,#page2 .slider-card.zero-ratio{opacity:.5}
#page1 .slider-card:not(.zero-ratio),#page2 .slider-card:not(.zero-ratio){background:linear-gradient(90deg,rgba(184,144,47,.11),rgba(184,144,47,.02) 70%)!important}
#page1 .slider-card:not(.zero-ratio)::before,#page2 .slider-card:not(.zero-ratio)::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--pro-gold)}
#page1 .sc-name,#page2 .sc-name{color:var(--pro-ink)!important;font-weight:700!important}
#page1 .sc-code,#page2 .sc-code,#page1 .sc-ret-label,#page2 .sc-ret-label{color:var(--pro-ink3)!important}
#page1 .type-badge,#page2 .type-badge{background:var(--pro-bg2)!important;border:1px solid var(--pro-line)!important;color:var(--pro-ink2)!important;border-radius:3px!important;box-shadow:none!important}
#page1 .sc-ratio-val,#page2 .sc-ratio-val{color:var(--pro-ink3)!important;font-variant-numeric:tabular-nums}
#page1 .slider-card:not(.zero-ratio) .sc-ratio-val,#page2 .slider-card:not(.zero-ratio) .sc-ratio-val{color:var(--pro-gold2)!important}
#page1 .sc-ret-item,#page2 .sc-ret-item{font-variant-numeric:tabular-nums;font-weight:700!important}
#page1 .sc-ret-item.pos,#page2 .sc-ret-item.pos{color:var(--pro-up)!important}.sc-ret-item.neg{color:var(--pro-down)!important}
#page1 .ks-tag,#page2 .ks-tag{background:var(--pro-bg2)!important;border:1px solid var(--pro-line)!important;color:var(--pro-ink2)!important;border-radius:3px!important;box-shadow:none!important}
#page1 .sc-slider,#page2 .sc-slider{accent-color:var(--pro-gold)}
#page1 .sc-track-fill,#page2 .sc-track-fill{background:var(--pro-gold)!important}

/* ── 오른쪽 결과 패널: 눈길이 모이는 곳(남색) ── */
#page1 .preview-panel,#page2 .preview-panel{top:76px!important}
#page1 .preview-card,#page2 .preview-card{background:linear-gradient(180deg,#16284A,#0F1D38)!important;border:1px solid #26365A!important;border-radius:10px!important;box-shadow:0 24px 50px rgba(15,35,71,.28)!important;color:#EEF1F6!important}
#page1 .preview-card .preview-title,#page2 .preview-card .preview-title,#page1 .preview-card .preview-title *,#page2 .preview-card .preview-title *{color:#D8B76E!important}
#page1 .preview-card .legend-item,#page2 .preview-card .legend-item{color:#B5C0D6!important}
#page1 .expected-return-card .return-item,#page2 .expected-return-card .return-item{background:rgba(0,0,0,.28)!important;border:1px solid #26365A!important;border-radius:6px!important}
#page1 .expected-return-card .return-label,#page2 .expected-return-card .return-label{color:#8FA3C7!important}
#page1 .expected-return-card .return-value,#page2 .expected-return-card .return-value{color:#FF6B6F!important;font-weight:800!important;font-variant-numeric:tabular-nums}
#page1 .return-notice,#page2 .return-notice{color:#8FA3C7!important}
#page1 .exp-side,#page2 .exp-side{background:var(--pro-bg)!important;border:1px dashed var(--pro-line2)!important;color:var(--pro-ink2)!important;border-radius:8px!important}
#page1 .generate-btn,#page2 .generate-btn{background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)!important;color:#2A1E05!important;border:0!important;border-radius:6px!important;font-weight:800!important;box-shadow:0 10px 26px rgba(184,144,47,.32)!important;letter-spacing:0}
#page1 .generate-btn:hover,#page2 .generate-btn:hover{filter:brightness(1.05)}
}

/* ── 펀드 표기: 대표 종목(위) + 펀드명(아래) — 화면·인쇄 공통 뼈대 ── */
.fn-stack{display:inline-flex;flex-direction:column;line-height:1.3;vertical-align:middle;min-width:0;text-align:left}
.fn-top{font-weight:700}
.fn-sub{font-size:.8em;opacity:.72;font-weight:500}
.sc-name-stack{display:flex;flex-direction:column;line-height:1.3;min-width:0;gap:2px}
.sc-name-wrap{align-items:center}
.sc-sub{font-size:11.5px;font-weight:500}
.fnc-fund-sub{font-size:.8em;opacity:.8;margin-top:2px}
.pie-legend .legend-item{align-items:flex-start;gap:8px}
.legend-pct{margin-left:auto;padding-left:10px;font-variant-numeric:tabular-nums}
@media screen {
#page1 .sc-name,#page2 .sc-name{font-size:14px!important;white-space:normal!important}
#page1 .sc-sub,#page2 .sc-sub{color:var(--pro-ink3)!important}
#page1 .sc-sub .sc-code,#page2 .sc-sub .sc-code{margin-left:4px;font-size:10.5px}
#page1 .preview-card .fn-top,#page2 .preview-card .fn-top{color:#EEF1F6}.preview-card .fn-sub{color:#8FA3C7;opacity:1}
#page1 .preview-card .legend-item,#page2 .preview-card .legend-item{display:flex!important;align-items:flex-start!important;width:100%}
#page1 .preview-card .legend-pct,#page2 .preview-card .legend-pct{color:#F0D79A}
#page1 .pie-legend,#page2 .pie-legend{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
}
@media screen {
#page1 .form-row-3,#page2 .form-row-3{grid-template-columns:1.5fr 1fr 1fr!important;gap:14px!important}
#page1 .chart-container,#page2 .chart-container{max-width:260px;margin-left:auto;margin-right:auto}
}
@media screen {
html body #page1 .fund-table-wrap .slider-row,html body #page1 .fund-table-wrap .slider-card-cell{background:#fff!important}
html body #page1 .fund-table-wrap .slider-card{background:#fff!important;border-radius:0!important;box-shadow:none!important}
html body #page1 .fund-table-wrap .slider-card:not(.zero-ratio){background:linear-gradient(90deg,rgba(184,144,47,.13),rgba(184,144,47,.02) 72%)!important}
html body #page1 .fund-table-wrap .slider-card.zero-ratio{opacity:.52}
html body #page1 .fund-table-wrap .slider-card .sc-slider-wrap{background:transparent!important}
}
@media screen {
html body #page1 .ai-recommend-box,html body #page1 .ai-rec-header,html body #page1 .ai-rec-types{background:#fff!important}
html body #page1 .ai-btn::after,html body #page1 .ai-btn::before{background:var(--pro-bg2)!important;color:var(--pro-gold2)!important;border-color:var(--pro-line)!important}
html body #page1 .ai-btn .ai-btn-text~*{background:var(--pro-bg2)!important;color:var(--pro-gold2)!important}
}
/* ── 제안서 결과 화면(화면용) ── */
@media screen {
html body #page2 .p2-portfolio-wrap,html body #page2 .p2-sim-wrap,html body #page2 .result-section{background:#fff!important;border:1px solid var(--pro-line)!important;border-radius:10px!important;box-shadow:var(--shadow)!important}
html body #page2 .pf-rg-header,html body #page2 .pf-rg-cell,html body #page2 .pf-sim-basis-card,html body #page2 .sim-avg-rate-box,html body #page2 .sim-accumulate-notice,html body #page2 .san-badge,html body #page2 .highlight-row,html body #page2 .highlight-row td{background:var(--pro-bg2)!important}
html body #page2 .year-badge{background:rgba(184,144,47,.12)!important;color:var(--pro-gold2)!important}
html body #page2 .pf-amount-row{background:linear-gradient(180deg,#16284A,#0F1D38)!important;border:1px solid #26365A!important;border-radius:8px!important;box-shadow:none!important}
html body #page2 .pf-amount-row *{color:#EEF1F6}
html body #page2 .pf-amount-row .pf-amount-value,html body #page2 .pf-amount-row b{color:#F0D79A!important}
html body #page2 .p2-left-col,html body #page2 .p2-right-col,html body #page2 .p2-profile-wrap{box-shadow:none!important;filter:none!important}
html body #page2 canvas{filter:none!important}
html body #page2 .section-title{color:var(--pro-ink)!important}
html body #page2 .pos,html body #page2 .pf-ret-value.pos,html body #page2 .return-value.pos{color:var(--pro-up)!important}
html body #page2 .neg{color:var(--pro-down)!important}
html body #page2 table thead th{background:var(--pro-navy)!important;color:#fff!important}
html body #page2 .pf-item-name .fn-top{color:var(--pro-ink)}
}
@media screen {
html body #page2 .pf-card.pf-amount-row,html body #page2 .pf-amount-row.pf-card{background:linear-gradient(180deg,#16284A,#0F1D38)!important;border:1px solid #26365A!important;box-shadow:none!important}
html body #page2 .donut-canvas-wrap,html body #page2 .donut-canvas-wrap canvas,html body #page2 #pieChart2{filter:none!important;box-shadow:none!important}
}
/* ── 메인(로그인) 화면: 남색 바탕 + 흰색 로그인 카드, 3D 로고는 유지 ── */
@media screen {
html body #pwLockOverlay{background:radial-gradient(900px 420px at 78% 0%,rgba(216,183,110,.18),transparent 60%),linear-gradient(120deg,#0C1D3D,#14305F 60%,#1A3B72)!important;backdrop-filter:none!important}
html body #pwLockOverlay .gate-fx{opacity:.35}
html body #pwLockOverlay .gate-logo3d iframe{mix-blend-mode:screen}
html body #pwLockOverlay{--cp-ink:#F4F6FB;--cp-ink2:#B7C4DD;--cp-ink3:#8FA3C7;--cp-goldtx:#F0D79A;--cp-gold:#D8B76E}
html body #pwLockOverlay .pw-lock-box{--cp-ink:#13203A;--cp-ink2:#4A5875;--cp-ink3:#8190A8;--cp-goldtx:#8A6A1C;--cp-gold:#B8902F;--cp-bg2:#EEF1F7;--cp-surface:#fff;--cp-raise:#fff;--cp-line:#CBD3E1;--cp-gold-dim:#B8902F;
  background:#fff!important;color:#13203A!important;border:0!important;border-radius:12px!important;box-shadow:0 30px 70px rgba(0,0,0,.35)!important}
html body #pwLockOverlay .pw-lock-box .gate-tabs{background:#EEF1F7!important;border:0!important;border-radius:8px!important}
html body #pwLockOverlay .pw-lock-box .gate-tabs button{color:#8190A8!important;border-radius:6px!important}
html body #pwLockOverlay .pw-lock-box .gate-tabs button.on{background:#fff!important;color:#13203A!important;box-shadow:0 1px 3px rgba(19,32,58,.14)!important}
html body #pwLockOverlay .pw-lock-title{color:#13203A!important}
html body #pwLockOverlay .pw-lock-desc,html body #pwLockOverlay .gate-field>span,html body #pwLockOverlay .gate-field>span em{color:#6A7789!important}
html body #pwLockOverlay .pw-lock-box .pw-input{background:#EEF1F7!important;border:1px solid #CBD3E1!important;color:#13203A!important;border-radius:6px!important;box-shadow:none!important}
html body #pwLockOverlay .pw-lock-box .pw-input:focus{border-color:#B8902F!important;background:#fff!important;box-shadow:0 0 0 3px rgba(184,144,47,.14)!important}
html body #pwLockOverlay .pw-login-submit-btn{background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)!important;color:#2A1E05!important;border:0!important;border-radius:6px!important;box-shadow:0 10px 26px rgba(184,144,47,.3)!important}
html body #pwLockOverlay .pw-signup-link{background:transparent!important;border:1px dashed #CBD3E1!important;color:#4A5875!important;border-radius:6px!important}
html body #pwLockOverlay .pw-signup-link *{color:inherit}
html body #pwLockOverlay .pw-signup-link b,html body #pwLockOverlay .pw-signup-link strong{color:#8A6A1C!important}
html body #pwLockOverlay .gate-plan>div:first-child>div{background:#fff!important;border:1px solid #CBD3E1!important;border-radius:8px!important}
html body #pwLockOverlay .gate-plan>div:first-child>div:nth-child(2){background:rgba(184,144,47,.08)!important;border-color:rgba(184,144,47,.55)!important}
html body #pwLockOverlay .gate-plan>div:first-child>div>div:nth-child(1){color:#8190A8!important}
html body #pwLockOverlay .gate-plan>div:first-child>div>div:nth-child(2){color:#13203A!important}
html body #pwLockOverlay .gate-plan>div:first-child>div:nth-child(2)>div:nth-child(2){color:#8A6A1C!important}
html body #pwLockOverlay .gate-plan>div:first-child>div>div:nth-child(3){color:#8190A8!important}
html body #pwLockOverlay .gate-plan>a{color:#4A5875!important}
html body #pwLockOverlay .gate-plan>button{background:#EEF1F7!important;color:#8190A8!important;border-radius:6px!important}
html body #pwLockOverlay .pw-visitor-bar{background:#F3F5F9!important;border:1px solid #E1E6EF!important;color:#4A5875!important}
html body #pwLockOverlay .pw-visitor-bar *{color:#4A5875!important}
}
@media screen {
html body #pwLockOverlay.pw-lock-overlay{background:radial-gradient(900px 420px at 78% 0%,rgba(216,183,110,.18),transparent 60%),linear-gradient(120deg,#0C1D3D,#14305F 60%,#1A3B72)!important;background-color:#0C1D3D!important}
html body #pwLockOverlay .pw-lock-box .pw-input::placeholder{color:#8190A8!important;opacity:1}
html body #pwLockOverlay .pw-lock-box .pw-pin{color:#13203A!important}
}
/* ── 회원가입 팝업: 로그인 카드와 한 몸처럼 같은 남색 바탕 + 흰 카드 ── */
@media screen {
html body .signup-overlay{background:radial-gradient(900px 420px at 78% 0%,rgba(216,183,110,.18),transparent 60%),linear-gradient(120deg,#0C1D3D,#14305F 60%,#1A3B72)!important;backdrop-filter:none!important}
html body .signup-overlay .signup-box{background:#fff!important;color:#13203A!important;border:0!important;border-radius:12px!important;box-shadow:0 30px 70px rgba(0,0,0,.35)!important}
html body .signup-overlay .signup-icon{background:#0F2347!important;border:0!important;color:#F0D79A!important;border-radius:8px!important;box-shadow:none!important}
html body .signup-overlay .signup-title{color:#13203A!important;font-weight:800!important}
html body .signup-overlay .signup-desc,html body .signup-overlay .signup-hint{color:#8190A8!important}
html body .signup-overlay .signup-field label{color:#4A5875!important;font-weight:700}
html body .signup-overlay .signup-field label i{color:#B8902F!important}
html body .signup-overlay .signup-field .req{color:#E03A3E!important}
html body .signup-overlay .signup-input{background:#EEF1F7!important;border:1px solid #CBD3E1!important;color:#13203A!important;border-radius:6px!important;box-shadow:none!important}
html body .signup-overlay .signup-input::placeholder{color:#8190A8!important;opacity:1}
html body .signup-overlay .signup-input:focus{background:#fff!important;border-color:#B8902F!important;box-shadow:0 0 0 3px rgba(184,144,47,.14)!important}
html body .signup-overlay .signup-submit-btn,html body .signup-overlay .signup-done-btn{background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)!important;color:#2A1E05!important;border:0!important;border-radius:6px!important;font-weight:800!important;box-shadow:0 10px 26px rgba(184,144,47,.3)!important}
html body .signup-overlay .signup-close{color:#8190A8!important}
html body .signup-overlay .signup-error{background:#FDECEC!important;border:1px solid #F3B8BA!important;color:#B42A2E!important;border-radius:6px!important}
html body .signup-overlay .signup-done-title{color:#13203A!important}
html body .signup-overlay .signup-done-desc{color:#4A5875!important}
html body .signup-overlay .signup-done-icon{color:#2F8F6B!important}
}
/* ── 동선 정리 (2026-10-07 상무님: "전체적인 동선이 주먹구구식") ──
   입력: 상품·금액 → AI 추천(주) → 직접 설정(보조) → 펀드 표 / 오른쪽은 결과 한 곳, 중복 안내 제거
   결과: 결론(평균 수익률·1/3/5/10년 숫자) → 그래프 → 근거 표 → 펀드 상세 → 절세 솔루션 */
@media screen {
html body #page1 .preview-panel .exp-banner.exp-side{display:none!important}
html body #page1 .step-card{flex-direction:column}
html body #page1 .step-card>.step-header{order:0}
html body #page1 .step-card>.ai-recommend-box{order:1}
html body #page1 .step-card>.ratio-helper{order:2;margin:14px 0 10px}
html body #page1 .step-card>.fund-table-wrap{order:3}
html body #page1 .ratio-helper::before{content:"직접 설정";font-size:11.5px;font-weight:700;color:var(--pro-ink3);margin-right:8px;letter-spacing:.04em}
html body #page1 .ratio-helper{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
html body #page2 .p2-sim-wrap{display:flex!important;flex-direction:column}
html body #page2 .p2-sim-wrap>.section-title{order:0}
html body #page2 .p2-sim-wrap>.sim-avg-rate-box{order:1}
html body #page2 .p2-sim-wrap>.sim-cards-row{order:2;margin:14px 0}
html body #page2 .p2-sim-wrap>.sim-line-chart-wrap{order:3}
html body #page2 .p2-sim-wrap>.sim-basis-row{order:4}
html body #page2 .p2-sim-wrap>.expenseBannerArea{order:4}
html body #page2 .p2-sim-wrap>.sim-table-wrap{order:6}
html body #page2 .p2-sim-wrap>.sim-notice{order:8}
html body #page2 .p2-sim-wrap>div:not([class]),html body #page2 .p2-sim-wrap>div[class=""]{order:7}
}
@media screen {
html body #page1 .step-card{display:flex!important;flex-direction:column!important}
html body #page1 .ai-recommend-box>*,html body #page1 .ai-recommend-box .ai-rec-header-left,html body #page1 .ai-recommend-box .ai-rec-titles{background:#fff!important;background-image:none!important}
html body #page1 .ai-recommend-box .ai-rec-hint{background:var(--pro-bg)!important}
html body #page1 .ai-recommend-box .ai-badge{background:var(--pro-navy)!important;color:#F0D79A!important}
}
@media screen {
html body #page1 .ai-recommend-box::before,html body #page1 .ai-recommend-box::after,html body #page1 .ai-rec-header::before,html body #page1 .ai-rec-header::after{display:none!important}
html body #page1 .ai-recommend-box .ai-rec-titles,html body #page1 .ai-recommend-box .ai-rec-titles *{background:transparent!important}
html body #page1 .ai-recommend-box .ai-rec-header{background:#fff!important;border-bottom:1px solid var(--pro-line)!important}
}
@media screen {
html body .cp-holo{display:none!important}
}

/* ===== 대문 = 홈페이지 (2026-10-07 상무님: "홈페이지 느낌이 안 난다") + 가입을 로그인과 한 몸으로 ===== */
@media screen {
html body #pwLockOverlay{padding:0 0 0!important;overflow-y:auto!important}
html body #pwLockOverlay .gate-brand .gate-mark{display:none!important}
html body #pwLockOverlay .gate{min-height:calc(100vh - 62px);align-items:center;padding-top:20px;padding-bottom:40px}
/* 메뉴 바 */
.gate-nav{position:sticky;top:0;z-index:20;background:rgba(15,35,71,.94);backdrop-filter:blur(8px);border-bottom:1px solid rgba(216,183,110,.35)}
.gn-in{max-width:1280px;margin:0 auto;height:62px;padding:0 28px;display:flex;align-items:center;gap:36px}
.gn-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff}
.gn-mk{width:30px;height:30px;border:1.5px solid #D8B76E;border-radius:7px;display:grid;place-items:center;color:#D8B76E;font-weight:800;font-size:19px;line-height:1}
.gn-nm{font-weight:800;font-size:17px;line-height:1.05}.gn-nm i{font-style:normal;color:#E6C57F}
.gn-nm small{display:block;font-size:9px;letter-spacing:.2em;color:#8FA3C7;font-weight:600;margin-top:3px}
.gn-menu{display:flex;gap:6px;margin-left:12px}
.gn-menu a{color:#B7C4DD;text-decoration:none;font-size:14px;font-weight:600;padding:8px 14px;border-radius:6px}
.gn-menu a:hover{color:#fff;background:rgba(255,255,255,.07)}
.gn-act{margin-left:auto;display:flex;gap:8px}
.gn-act button{height:36px;padding:0 18px;border-radius:6px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.gn-login{background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff}
.gn-join{border:0;color:#2A1E05;background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)}
/* 첫 화면 흐름 */
.gate-flow{display:flex;align-items:center;gap:12px;margin-top:30px;flex-wrap:wrap}
.gate-flow div{display:flex;align-items:center;gap:9px;padding:10px 15px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.05)}
.gate-flow b{width:22px;height:22px;border-radius:50%;background:#E6C57F;color:#2A1E05;display:grid;place-items:center;font-size:11.5px}
.gate-flow span{font-size:13px;font-weight:600;color:#EEF1F6}.gate-flow i{font-style:normal;color:#6F85AE}
/* 가로 구간 */
.gh{padding:84px 28px}
.gh-in{max-width:1180px;margin:0 auto}
.gh-eyebrow{font-size:12px;letter-spacing:.24em;color:#E6C57F;font-weight:700;margin-bottom:14px}
.gh-h{font-size:34px;font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1.3;margin:0}
.gh-h em{font-style:normal;color:#F0D79A}
.gh-sub{margin-top:14px;font-size:16px;color:#B7C4DD;line-height:1.7}
.gh-feat{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.07));border-top:1px solid rgba(255,255,255,.08)}
.gh-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.ghc{background:#fff;border-radius:12px;padding:28px 26px;border-top:3px solid #D8B76E;box-shadow:0 20px 50px rgba(0,0,0,.25);display:flex;flex-direction:column;gap:10px}
.ghc-no{font-style:normal;font-size:13px;font-weight:800;color:#B8902F;letter-spacing:.1em}
.ghc b{font-size:19px;font-weight:800;color:#13203A}
.ghc span{font-size:14px;color:#4A5875;line-height:1.7}
.gh-how{background:rgba(6,16,38,.35)}
.gh-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.ghs{display:flex;gap:16px;align-items:flex-start;padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.04)}
.ghs>b{flex:none;width:44px;height:44px;border-radius:50%;background:#E6C57F;color:#2A1E05;display:grid;place-items:center;font-size:20px;font-weight:800}
.ghs strong{display:block;font-size:17px;color:#fff;margin-bottom:6px}.ghs span{font-size:14px;color:#B7C4DD;line-height:1.6}
.gh-trust{display:flex;gap:28px;margin-top:40px;flex-wrap:wrap;font-size:13.5px;color:#8FA3C7}
.gh-trust span:before{content:"";display:inline-block;width:6px;height:6px;background:#E6C57F;border-radius:50%;margin-right:9px;vertical-align:middle}
.gh-price{text-align:center}
.gh-plans{display:flex;gap:20px;justify-content:center;margin-top:36px;flex-wrap:wrap}
.ghp{width:300px;background:#fff;border-radius:12px;padding:28px 26px;text-align:left;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.ghp small{display:block;font-size:12px;color:#8190A8;font-weight:700;margin-bottom:8px}
.ghp b{display:block;font-size:26px;font-weight:800;color:#13203A;margin-bottom:10px}
.ghp span{font-size:14px;color:#4A5875;line-height:1.7}
.ghp.pro{border:2px solid #D8B76E;background:linear-gradient(180deg,#fff,#FBF7EA)}.ghp.pro b{color:#8A6A1C}
.gh-more{display:inline-block;margin-top:22px;font-size:13px;color:#B7C4DD;text-decoration:underline}
.gh-cta{display:flex;gap:12px;justify-content:center;margin-top:30px}
.gh-cta button{height:50px;padding:0 30px;border-radius:6px;font:inherit;font-size:15px;font-weight:800;cursor:pointer;border:0;color:#2A1E05;background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)}
.gh-cta button.alt{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}
/* 맨 아래 회사 정보는 화면 고정이 아니라 홈페이지 푸터로 */
html body #pwLockOverlay>.cp-foot{position:static!important;padding:34px 16px 44px!important;border-top:1px solid rgba(255,255,255,.1);background:rgba(6,16,38,.5)}
/* ── 회원가입 카드: 로그인 카드와 같은 자리에서 바뀐다 ── */
html body #pwLockOverlay #signupOverlay.signup-inline{position:static!important;inset:auto!important;width:auto!important;height:auto!important;max-height:none!important;background:transparent!important;padding:0!important;overflow:visible!important;display:none!important}
html body.signup-open #pwLockOverlay #signupOverlay.signup-inline{display:block!important}
html body.signup-open #pwLockOverlay .pw-lock-box{display:none!important}
html body.signup-open #pwLockOverlay .gate-logo3d iframe{display:block!important}
html body #pwLockOverlay #signupOverlay .signup-box{width:100%!important;max-width:none!important;margin:0!important;max-height:none!important;padding:26px 28px 24px!important}
html body #pwLockOverlay #signupOverlay .gate-tabs{display:grid;grid-template-columns:1fr 1fr;background:#EEF1F7!important;border:0!important;border-radius:8px!important;padding:4px;margin-bottom:22px}
html body #pwLockOverlay #signupOverlay .gate-tabs button{padding:10px 0;border:0;border-radius:6px!important;background:transparent;color:#8190A8!important;font-size:14px;font-weight:700;cursor:pointer}
html body #pwLockOverlay #signupOverlay .gate-tabs button.on{background:#fff!important;color:#13203A!important;box-shadow:0 1px 3px rgba(19,32,58,.14)!important}
@media (max-width:900px){.gh-cards,.gh-steps{grid-template-columns:1fr}.gn-menu{display:none}.gh-h{font-size:26px}}
}
@media screen {
html body #pwLockOverlay>.gate-nav,html body #pwLockOverlay>.gh,html body #pwLockOverlay>.cp-foot{width:100%!important;max-width:none!important;align-self:stretch!important;box-sizing:border-box}
html body #pwLockOverlay>.gate{align-self:center}
}
@media screen {
html body #pwLockOverlay{justify-content:flex-start!important}
}
@media screen {
html body.signup-open #pwLockOverlay #signupOverlay,html body.signup-open #pwLockOverlay #signupOverlay *{animation:none!important;opacity:1!important}
html body.signup-open #pwLockOverlay #signupOverlay .signup-box{transform:none!important;animation:none!important}
html body.signup-open #pwLockOverlay #signupOverlay .signup-error[style*="display: none"]{display:none!important}
}
@media screen {
html body.signup-open #pwLockOverlay{animation:none!important;opacity:1!important}
}
/* 레벨UP 안내 칸(유족보상위로금 → 7년 후 저축성 전환): 흰 글자라 남색 바탕이어야 한다 */
@media screen {
html body #page2 .pf-card.pf-levelup-death-card{background:linear-gradient(180deg,#16284A,#0F1D38)!important;border:1px solid #26365A!important;border-radius:8px!important;box-shadow:none!important}
html body #page2 .pf-levelup-death-card .pf-ldb-title{color:#B5C0D6!important}
html body #page2 .pf-levelup-death-card .pf-ldb-desc{color:#fff!important}
html body #page2 .pf-levelup-death-card .pf-ldb-sub{color:#8FA3C7!important}
}
/* ===== 상단 메뉴 정리 (2026-10-07 상무님: "복잡하다 보기가") =====
   왼쪽=로고 하나 / 가운데=제목 한 줄 / 오른쪽=계정 한 알약 + 작은 테두리 버튼, 금색은 "인쇄하기" 하나만 */
@media screen {
html body #page1 .page-header,html body #page2 .page-header{padding:0!important}
html body #page1 .page-header .header-inner,html body #page2 .page-header .header-inner{max-width:1500px!important;margin:0 auto!important;height:64px;padding:0 24px!important;display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:12px!important;justify-content:flex-start!important}
html body .page-header .co-div,html body .page-header .etf-mark,html body .page-header .co-etf-txt{display:none!important}
html body #page1 .page-header .header-center{display:none!important}
html body #page1 .page-header .header-right-group{margin-left:auto!important;display:flex!important;align-items:center;gap:8px;flex-wrap:nowrap}
/* 결과 화면: 순서 = 로고 · 다시 설정 · 제목(가운데) · 계정 알약 · 연동 · 인쇄(금색) · 로그아웃 */
html body #page2 .page-header .header-co-logo{order:0}
html body #page2 .page-header .back-btn{order:1}
html body #page2 .page-header .proposal-title-area{order:2;flex:1 1 auto;min-width:0;text-align:center;padding:0 8px}
html body #page2 .page-header .proposal-main-title{font-size:18px!important;line-height:1.25!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #page2 .page-header .proposal-sub-title{font-size:11px!important;line-height:1.3!important;margin-top:2px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8FA3C7!important}
html body #page2 .page-header .proposal-ai-tag{display:none!important}
html body #page2 .page-header #loginUserBadgePage2{order:3}
html body #page2 .page-header .cp-plan-badge{order:4}
html body #page2 .page-header .socialLinkWrap{order:5}
html body #page2 .page-header .print-btn{order:6}
html body #page2 .page-header .logout-btn{order:7}
/* 계정 알약: 로그인중 + 이용권을 붙여서 한 덩어리로 */
html body .page-header .login-user-badge{display:inline-flex!important;align-items:center;gap:7px;height:34px;margin:0!important;padding:0 13px!important;border-radius:999px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.22)!important;color:#E4EAF5!important;font-size:12px!important;font-weight:600;white-space:nowrap}
html body .page-header .login-user-badge+.cp-plan-badge,html body .page-header .cp-plan-badge{display:inline-flex!important;align-items:center;height:34px;margin:0 0 0 -8px!important;padding:0 14px 0 16px!important;border-radius:0 999px 999px 0!important;background:rgba(216,183,110,.14)!important;border:1px solid rgba(216,183,110,.55)!important;border-left:0!important;color:#F0D79A!important;font-size:12px!important;font-weight:700!important;animation:none!important;box-shadow:none!important;white-space:nowrap}
html body .page-header .login-user-badge:has(+.cp-plan-badge){border-radius:999px 0 0 999px!important;border-right:0!important;padding-right:18px!important}
html body .page-header .cp-plan-badge.warn{background:#F0D79A!important;color:#2A1E05!important}
html body .page-header .cp-plan-badge.warn::after{content:"›"}
/* 보조 버튼: 테두리만 */
html body #page1 .page-header .logout-btn,html body #page2 .page-header .logout-btn,
html body #page1 .page-header .member-mgmt-btn,html body #page1 .page-header .pwa-install-btn,
html body #page2 .page-header .back-btn,html body .page-header .socialLinkToggle{
  display:inline-flex!important;align-items:center;gap:7px;height:34px;margin:0!important;padding:0 13px!important;border-radius:6px!important;background:transparent!important;border:1px solid rgba(255,255,255,.26)!important;color:#E4EAF5!important;font-size:12.5px!important;font-weight:600!important;box-shadow:none!important;white-space:nowrap;line-height:1}
html body .page-header .socialLinkToggle::before{content:"";width:8px;height:8px;border-radius:50%;background:#FEE500;display:inline-block}
html body .page-header .logout-btn:hover,html body .page-header .back-btn:hover,html body .page-header .socialLinkToggle:hover,html body .page-header .member-mgmt-btn:hover,html body .page-header .pwa-install-btn:hover{background:rgba(255,255,255,.08)!important;color:#fff!important}
/* 주 버튼: 금색은 인쇄하기 하나 */
html body #page2 .page-header .print-btn{display:inline-flex!important;align-items:center;gap:7px;height:36px;margin:0!important;padding:0 18px!important;border-radius:6px!important;border:0!important;background:linear-gradient(135deg,#F0D79A,#D8B76E 55%,#B8932F)!important;color:#2A1E05!important;font-size:13px!important;font-weight:800!important;box-shadow:0 6px 16px rgba(184,144,47,.3)!important;white-space:nowrap}
}
@media screen {
html body #pwLockOverlay{animation:none!important;opacity:1!important}
}

/* ===== 하단 회사 정보 푸터 (2026-10-07 상무님: "하단부 아이디어 내서 세련되게") =====
   남색 띠 · 왼쪽 브랜드/신뢰 배지 · 가운데 사업자 정보 표 · 오른쪽 안내 링크 · 맨 아래 한 줄 고지 */
@media screen {
html body .cp-foot.cp-foot-pro{display:block!important;position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:0!important;padding:44px 28px 20px!important;width:100%!important;max-width:none!important;box-sizing:border-box;text-align:left!important;font-size:13px!important;line-height:1.6!important;letter-spacing:0!important;
  background:linear-gradient(180deg,#0F2347,#0A1A38)!important;color:#B7C4DD!important;border-top:1px solid rgba(216,183,110,.45)!important}
html body .cp-foot.cp-foot-page.cp-foot-pro{margin-top:56px!important;padding-bottom:100px!important}
html body #pwLockOverlay>.cp-foot.cp-foot-pro{align-self:stretch!important;background:rgba(6,16,38,.55)!important;padding-bottom:26px!important}
.cf-in{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.05fr 1.7fr .8fr;gap:48px;align-items:start}
.cf-logo{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.cf-mk{width:32px;height:32px;border:1.5px solid #D8B76E;border-radius:7px;display:grid;place-items:center;color:#D8B76E;font-weight:800;font-size:20px;line-height:1}
.cf-nm{font-weight:800;font-size:18px;color:#fff;line-height:1.05}.cf-nm i{font-style:normal;color:#E6C57F}
.cf-nm small{display:block;font-size:9px;letter-spacing:.2em;color:#8FA3C7;font-weight:600;margin-top:4px}
.cf-made{margin:0 0 12px;color:#B7C4DD}.cf-made b{color:#fff;font-weight:700}
.cf-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.cf-badges span{padding:4px 11px;border:1px solid rgba(216,183,110,.5);border-radius:999px;color:#F0D79A;font-size:11.5px;font-weight:700}
.cf-contact{margin:0;color:#8FA3C7;font-size:12.5px}.cf-contact b{color:#E4EAF5;font-weight:700;margin-left:4px;letter-spacing:.02em}
.cf-info{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 28px}
.cf-info>div{display:block}
.cf-info .cf-wide{grid-column:1/-1}
.cf-info dt{font-size:11px;letter-spacing:.08em;color:#8FA3C7;font-weight:600;margin:0 0 3px}
.cf-info dd{margin:0;font-size:14px;color:#E4EAF5;font-weight:500}
.cf-links{display:flex;flex-direction:column;gap:9px}
.cf-links b{font-size:11px;letter-spacing:.14em;color:#E6C57F;margin-bottom:2px}
.cf-links a{color:#B7C4DD!important;text-decoration:none!important;font-size:13.5px;display:inline-flex;align-items:center;gap:7px}
.cf-links a::before{content:"›";color:#D8B76E;font-weight:800}
.cf-links a:hover{color:#fff!important}
.cf-bottom{max-width:1280px;margin:34px auto 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:11.5px;color:#8FA3C7}
@media (max-width:900px){.cf-in{grid-template-columns:1fr;gap:28px}.cf-info{grid-template-columns:1fr 1fr}}
}
@media print { .cp-foot.cp-foot-pro { display: none !important; } }

/* 2026-10-11 모바일: 3칸 입력줄이 좁은 화면에서 삐져나오던 것 보정 */
@media screen{#page1 .form-row-3 .form-group,#page2 .form-row-3 .form-group{min-width:0}}
@media screen and (max-width:900px){#page1 .form-row-3,#page2 .form-row-3{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)!important}}
@media screen and (max-width:640px){#page1 .form-row-3,#page2 .form-row-3{grid-template-columns:minmax(0,1fr)!important}}