:root{--ink:#18251f;--muted:#6d7972;--paper:#f5f4ef;--card:#fff;--green:#1e5b45;--green2:#2c7759;--lime:#ddec9c;--line:#dfe3dd;--danger:#a6453b;--shadow:0 18px 60px rgba(29,55,44,.09)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans KR',sans-serif}button,input,select,textarea{font:inherit}button,a{cursor:pointer}a{color:inherit;text-decoration:none}.hidden{display:none!important}.ambient{position:fixed;border-radius:50%;opacity:.55;z-index:-1}.ambient-one{width:480px;height:480px;background:#dbe8c2;top:-240px;right:-100px}.ambient-two{width:350px;height:350px;background:#d8e9e2;bottom:-220px;left:25%}.brand{display:flex;align-items:center;gap:12px;font-family:'DM Sans',sans-serif;font-weight:700;letter-spacing:.13em}.brand-mark{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--lime);color:var(--green);font-size:18px}.eyebrow{margin:0 0 10px;font:700 11px 'DM Sans',sans-serif;letter-spacing:.16em;color:var(--green2)}.auth-layout{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr}.brand-panel{padding:52px 7vw;display:flex;flex-direction:column;background:var(--green);color:white;position:relative;overflow:hidden}.brand-panel:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.12);border-radius:50%;right:-230px;bottom:-170px;box-shadow:0 0 0 80px rgba(255,255,255,.035),0 0 0 160px rgba(255,255,255,.025)}.hero-copy{margin:auto 0;max-width:670px;position:relative;z-index:1}.hero-copy .eyebrow{color:var(--lime)}.hero-copy h1{font-size:clamp(56px,6vw,90px);line-height:1.03;letter-spacing:-.055em;margin:0 0 28px;font-weight:600}.hero-copy em{font-family:serif;font-weight:400;color:var(--lime)}.hero-copy>p:last-child{max-width:530px;color:#d6e2db;font-size:18px;line-height:1.8}.trust-row{display:flex;gap:28px;color:#b8cfc3;font-size:13px}.auth-panel{display:grid;place-items:center;padding:40px}.auth-card{width:min(430px,100%)}.mobile-brand{display:none}.auth-card h2,.modal-card h2{font-size:34px;line-height:1.35;letter-spacing:-.04em;margin:0 0 32px}.auth-card form,.modal-card{display:grid;gap:14px}label{display:grid;gap:8px;font-size:13px;font-weight:600}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:#fff;padding:14px 15px;outline:none;color:var(--ink)}input:focus,select:focus,textarea:focus{border-color:var(--green2);box-shadow:0 0 0 3px rgba(44,119,89,.1)}.button{border:0;border-radius:12px;padding:13px 18px;font-weight:700;display:inline-flex;justify-content:center;align-items:center;gap:12px;transition:.2s}.button:hover{transform:translateY(-1px)}.primary{background:var(--green);color:white}.secondary{background:#fff;color:var(--ink);border:1px solid var(--line)}.danger{background:#fff1ee;color:var(--danger);border:1px solid #efcbc5}.full{width:100%}.compact{padding:9px 14px}.divider{display:flex;align-items:center;gap:12px;margin:25px 0;color:#87918c;font-size:12px}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}.auth-note,.muted{font-size:12px;line-height:1.7;color:var(--muted);margin-top:20px}.app-layout{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:#f0f1eb;border-right:1px solid var(--line);padding:30px 22px;display:flex;flex-direction:column;z-index:10}.sidebar nav{display:grid;gap:7px;margin-top:55px}.sidebar nav a{padding:13px 14px;border-radius:11px;color:#68736d;font-size:14px;font-weight:600}.sidebar nav a span{display:inline-block;width:25px}.sidebar nav a:hover,.sidebar nav a.active{background:#fff;color:var(--green);box-shadow:0 5px 20px rgba(33,70,53,.05)}.sidebar-footer{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}.profile-dot{width:35px;height:35px;border-radius:50%;background:var(--green);color:white;display:grid;place-items:center;font-size:12px}.sidebar-footer strong,.sidebar-footer small{display:block;max-width:120px;overflow:hidden;text-overflow:ellipsis}.sidebar-footer strong{font-size:11px}.sidebar-footer small{font-size:9px;color:var(--muted)}.icon-button{border:0;background:transparent;font-size:18px;color:var(--muted)}main{margin-left:245px;padding:0 5vw 60px;max-width:1600px}.topbar{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:40px}.topbar h2{font-size:18px;margin:0}.top-actions{display:flex;align-items:center;gap:18px}.sync-state{font-size:11px;color:var(--green2)}.page{display:none;animation:rise .3s ease}.page.active{display:block}@keyframes rise{from{opacity:0;transform:translateY(8px)}}.welcome-row,.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:28px}.welcome-row h1,.section-head h1{font-size:34px;letter-spacing:-.04em;margin:0 0 7px}.welcome-row p,.section-head p{color:var(--muted);margin:0}.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.metric{min-height:150px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:23px;display:flex;flex-direction:column}.metric.featured{background:var(--green);color:white;border-color:var(--green)}.metric span{font-size:12px;color:var(--muted)}.metric.featured span,.metric.featured small{color:#c4d5cc}.metric strong{font:600 30px 'DM Sans',sans-serif;margin:auto 0 4px}.metric small{color:var(--muted);font-size:11px}.overview-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:20px}.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}.panel-head{display:flex;align-items:start;justify-content:space-between;margin-bottom:20px}.panel-head h3{margin:0;font-size:18px}.panel-head a{font-size:12px;color:var(--green2);font-weight:700}.goal-list{display:grid;gap:12px}.goal-row{padding:17px;border:1px solid var(--line);border-radius:14px}.goal-row-head{display:flex;justify-content:space-between;gap:15px;align-items:center}.goal-row h4{margin:0 0 4px}.goal-row small{color:var(--muted)}.progress-track{height:7px;background:#edf0eb;border-radius:10px;overflow:hidden;margin:15px 0 9px}.progress-track i{display:block;height:100%;background:var(--green2);border-radius:10px}.goal-meta{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.badge{display:inline-block;padding:5px 9px;border-radius:50px;background:#edf5df;color:#49702e;font-size:10px;font-weight:700}.badge.warn{background:#fff2d7;color:#9b6817}.badge.risk{background:#ffebe8;color:#a6473c}.composition{display:grid;gap:13px}.composition-item{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:12px}.composition-item .bar{grid-column:1/-1;height:5px;background:#edf0eb;border-radius:8px}.composition-item .bar i{display:block;height:100%;background:var(--lime);border-radius:8px}.cards-grid{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:17px}.item-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:21px}.item-card h3{margin:14px 0 4px;font-size:17px}.item-card .amount{font:600 25px 'DM Sans',sans-serif;margin:18px 0}.card-actions{display:flex;gap:7px;margin-top:18px;flex-wrap:wrap}.card-actions button{font-size:11px;padding:8px 10px}.meta-line{font-size:11px;color:var(--muted)}.next-action{font-size:12px;line-height:1.65;color:#506159;background:#f3f6f1;padding:11px;border-radius:10px;margin-top:13px}.empty-state{text-align:center;padding:50px 20px;color:var(--muted)}.empty-state span{font-size:35px;color:var(--green2)}.empty-state h3{color:var(--ink)}.compact-metrics .metric{min-height:120px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:14px 10px;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted);font-size:11px}.scenario-layout{display:grid;grid-template-columns:330px 1fr;gap:20px}.form-panel{display:grid;gap:17px;align-self:start}.scenario-results{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.scenario-results.empty-state{display:block;background:#fff;border:1px dashed var(--line);border-radius:18px}.scenario-card{background:white;border:1px solid var(--line);border-radius:17px;padding:20px}.scenario-card.best{border-color:var(--green2)}.scenario-card strong{display:block;font-size:21px;margin:14px 0}.scenario-card dl{margin:0;display:grid;gap:10px}.scenario-card dl div{display:flex;justify-content:space-between;font-size:11px}.scenario-card dt{color:var(--muted)}dialog{border:0;border-radius:20px;padding:0;box-shadow:var(--shadow);width:min(480px,calc(100% - 30px));color:var(--ink)}dialog::backdrop{background:rgba(16,32,25,.45);backdrop-filter:blur(5px)}.modal-card{padding:30px;position:relative}.modal-close{position:absolute;right:20px;top:16px;border:0;background:transparent;font-size:24px;color:var(--muted)}.modal-card code{padding:15px;background:#f0f3ed;border-radius:10px;word-break:break-all;font-size:12px}.notice{position:fixed;right:25px;top:25px;z-index:50;background:var(--ink);color:white;padding:13px 18px;border-radius:11px;box-shadow:var(--shadow);font-size:13px}.notice.error{background:var(--danger)}.mobile-only{display:none}
.trend-panel{margin-bottom:18px}.trend-panel svg{display:block;width:100%;height:190px;overflow:visible}.trend-grid{stroke:#e6eae4;stroke-width:1}.trend-line{fill:none;stroke:var(--green2);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.trend-area{fill:url(#trendFill)}.trend-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:8px}.asset-cards{margin-top:18px}.allocation-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.allocation-list>span{display:flex;align-items:center;gap:6px;padding:7px 9px;border-radius:9px;background:#eef3ec;font-size:10px;color:#52635a}.allocation-list button{border:0;background:transparent;color:var(--danger);padding:0;font-size:15px}.allocation-list [data-action="edit-allocation"]{color:var(--green);font-size:10px;font-weight:700}.explanation-card{background:linear-gradient(145deg,#fff 0%,#f0f5e8 100%)}.explanation-text{font-size:16px;line-height:1.9;white-space:pre-wrap;margin:18px 0;padding:18px;border-left:3px solid var(--green2);background:rgba(255,255,255,.65);border-radius:0 12px 12px 0}
.plan-health{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 18px;padding:16px 20px;border:1px solid #cfe0d1;border-radius:14px;background:#f1f7ef;color:#385344}.plan-health div{display:grid;gap:3px}.plan-health span{font-size:10px;font-weight:800;letter-spacing:.08em}.plan-health strong{font-size:14px}.plan-health p{margin:0;color:#607167;font-size:12px}.plan-health.risk{border-color:#efc8c3;background:#fff3f1;color:#8a3f37}.plan-health.risk p{color:#8a514b}@media(max-width:700px){.plan-health{align-items:flex-start;flex-direction:column;gap:8px}}
.onboarding-guide{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px;padding:18px 20px;border-radius:16px;background:#202d27;color:#fff}.onboarding-guide h3,.onboarding-guide p{margin:0}.onboarding-guide .eyebrow{color:#a9cdb2;margin-bottom:5px}.onboarding-steps{display:flex;flex-wrap:wrap;gap:7px}.onboarding-steps button{display:flex;align-items:center;gap:6px;border:1px solid #53655c;border-radius:999px;background:transparent;color:#fff;padding:7px 10px;font:inherit;font-size:10px;cursor:pointer}.onboarding-steps button span{display:grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#ddecdb;color:#263b30;font-weight:800}.onboarding-steps button.done{opacity:.55;cursor:default}@media(max-width:900px){.onboarding-guide{align-items:flex-start;flex-direction:column}}
@media(max-width:1000px){.cards-grid{grid-template-columns:repeat(2,1fr)}.overview-grid{grid-template-columns:1fr}.scenario-layout{grid-template-columns:1fr}}
@media(max-width:760px){.auth-layout{display:block}.brand-panel{display:none}.auth-panel{min-height:100vh;padding:28px}.mobile-brand{display:flex;align-items:center;gap:10px;margin-bottom:70px;font:700 13px 'DM Sans',sans-serif;letter-spacing:.12em}.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none;box-shadow:var(--shadow)}main{margin-left:0;padding:0 20px 45px}.topbar{height:88px;margin-bottom:28px}.mobile-only{display:block}.top-actions .sync-state{display:none}.welcome-row,.section-head{align-items:start;gap:20px}.welcome-row h1,.section-head h1{font-size:27px}.metrics-grid,.cards-grid,.scenario-results{grid-template-columns:1fr}.metric{min-height:125px}.topbar h2{font-size:15px}.topbar .eyebrow{font-size:9px}.section-head{flex-direction:column}.section-head .button{align-self:stretch}}
#auth-view .auth-lead{font-size:0}#auth-view .auth-lead:after{content:'가입하고 토스증권을 연결하면, 오늘 내 돈의 방향을 바로 알려줄게요 ✨';font-size:16px;line-height:1.8;color:var(--muted)}
#auth-view .hero-copy h1{font-size:0}#auth-view .hero-copy h1:after{content:'내 돈의 방향을';display:block;font-size:clamp(56px,6vw,90px);line-height:1.03;letter-spacing:-.055em;color:#fff}#auth-view .hero-copy h1 em{font-size:clamp(56px,6vw,90px)}
#auth-view{background:#f7f8f4}#auth-view .brand-panel{background:linear-gradient(145deg,#154b3a 0%,#1e6a4e 58%,#2a8060 100%);padding:48px 8vw}#auth-view .brand-panel:before{content:'✦';position:absolute;right:18%;top:20%;font-size:80px;color:rgba(221,236,156,.18);transform:rotate(15deg)}#auth-view .hero-copy h1{font-family:'Noto Sans KR',sans-serif;font-weight:800;letter-spacing:-.075em}#auth-view .hero-copy em{font-family:'Noto Sans KR',sans-serif;font-weight:400;font-style:normal}#auth-view .hero-copy>p:last-child{font-size:16px;line-height:1.9;color:#e4eee8}#auth-view .trust-row{gap:12px}#auth-view .trust-row span{padding:9px 13px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.07)}#auth-view .auth-panel{background:#f7f8f4;padding:56px 7vw}#auth-view .auth-card{background:rgba(255,255,255,.82);border:1px solid rgba(30,91,69,.1);border-radius:28px;padding:42px 40px;box-shadow:0 24px 80px rgba(29,55,44,.12);backdrop-filter:blur(12px)}#auth-view .auth-card h2{font-size:30px;margin-bottom:18px}#auth-view .auth-card .auth-lead{margin:0 0 24px}#auth-view .auth-card input{border-radius:14px;background:#fbfcfa;padding:16px}#auth-view .auth-card .button{border-radius:14px;padding:15px}#auth-view .auth-card .primary{box-shadow:0 10px 20px rgba(30,91,69,.2)}
/* Refined auth experience */
.auth-layout{background:linear-gradient(135deg,#f8faf4 0%,#eef5ea 48%,#dcecdf 100%);gap:0}
.brand-panel{background:linear-gradient(160deg,#0e5b46,#174f42 60%,#123b35);position:relative;overflow:hidden}
.brand-panel:after{content:'';position:absolute;width:520px;height:520px;border:80px solid rgba(210,239,130,.16);border-radius:50%;right:-180px;bottom:-220px}
.hero-copy h1{font-size:clamp(3rem,5vw,6rem);letter-spacing:-.08em;line-height:1.05}
.hero-copy h1 em{color:#d8f27c;font-style:normal}
.auth-panel{background:rgba(255,255,255,.58);backdrop-filter:blur(12px)}
.auth-card{border:1px solid rgba(20,80,60,.1);box-shadow:0 24px 70px rgba(19,61,45,.12);border-radius:28px}
.auth-card h2{letter-spacing:-.06em}
.auth-card .button.primary{box-shadow:0 10px 24px rgba(24,104,78,.2)}
/* Compass navy system */
:root{--ink:#101b35;--muted:#6f7890;--paper:#f5f7fb;--green:#102b5c;--green2:#2859c7;--lime:#b9f28a;--line:#e1e6f0;--shadow:0 18px 60px rgba(16,43,92,.12)}
body{background:var(--paper)}.ambient-one{background:#dfe8ff}.ambient-two{background:#d9f5ed}.brand-mark{background:var(--lime);color:var(--green)}.eyebrow{color:var(--green2)}
.brand-panel{background:linear-gradient(145deg,#071a3b,#102b5c 58%,#193c84)}.sidebar{background:#0b2149;color:#dce7ff;border-right:0}.sidebar nav a{color:#b7c8e8}.sidebar nav a:hover,.sidebar nav a.active{background:#2859c7;color:#fff;box-shadow:0 8px 24px rgba(40,89,199,.35)}.sidebar-footer{border-color:#294875}.sidebar-footer small{color:#9fb2d4}.profile-dot{background:#2859c7}.topbar{border-color:var(--line)}.sync-state{color:var(--green2)}
.primary,.metric.featured{background:linear-gradient(135deg,#173d86,#2859c7);border-color:#2859c7}.secondary{color:var(--ink)}.button.primary{box-shadow:0 10px 20px rgba(40,89,199,.2)}.progress-track i,.trend-line{background:#2859c7;stroke:#2859c7}.badge{background:#e8f7d8;color:#356d3a}.ai-briefing,.explanation-card{background:linear-gradient(135deg,#eef1ff,#f5f8ff)}
