
*{box-sizing:border-box}body{margin:0;background:#f6f7f9;color:#172b34;font-family:Arial,'Noto Sans KR',sans-serif;font-size:15px}header{height:82px;background:white;border-bottom:1px solid #e4e8ec;display:flex;align-items:center;justify-content:space-between;padding:0 6%}.brand{font-size:26px;font-weight:800;letter-spacing:-1px}.brand b{color:#16847a}.badge{font-size:12px;color:#638078;background:#eaf5ef;padding:8px 12px;border-radius:20px}main{max-width:1190px;margin:48px auto;padding:0 24px}.eyebrow{color:#228377;font-size:12px;letter-spacing:2px;font-weight:bold}h1{font-size:36px;letter-spacing:-1.8px;margin:16px 0}p{color:#77838d;line-height:1.7}.tabs{display:flex;gap:8px;margin:32px 0 25px;border-bottom:1px solid #dce3e6;padding-bottom:14px}.tabs button{border:0;background:transparent;padding:13px 22px;color:#71808a;border-radius:9px;font-size:15px;cursor:pointer}.tabs button.active{background:#163f3d;color:white}.layout{display:grid;grid-template-columns:350px 1fr;gap:24px}.card{background:white;border:1px solid #e3e8eb;border-radius:16px;padding:28px}h2{font-size:18px;margin:0 0 7px}label{display:block;color:#55636d;font-size:13px;margin:23px 0 9px}.input{display:flex;align-items:center;border:1px solid #dce3e7;border-radius:8px;padding:0 14px;background:#fff}.input:focus-within{border-color:#228c7f}input,select{width:100%;border:0;background:transparent;padding:14px 0;font-size:16px;color:#243b42;outline:none}input[type=file]{font-size:12px}small{color:#98a0a7}button.primary{width:100%;background:#178576;color:white;border:0;padding:16px;border-radius:8px;font-size:15px;font-weight:bold;margin-top:27px;cursor:pointer}.result-head{display:flex;justify-content:space-between;align-items:center}.chip{color:#188678;background:#edf8f3;padding:6px 10px;border-radius:6px;font-size:11px}.hero-number{font-size:38px;font-weight:750;margin:18px 0 6px;letter-spacing:-1px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:25px 0}.metric{background:#f7f9fa;border-radius:10px;padding:18px}.metric span{font-size:12px;color:#7a8790}.metric strong{display:block;font-size:21px;margin-top:9px}.green{color:#178576}.chart{height:250px;width:100%;margin-top:12px}.legend{display:flex;gap:22px;font-size:12px;color:#7d8990}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#168577;margin-right:7px}.hint{font-size:12px;padding:16px 0 0;border-top:1px solid #edf0f2;color:#859099;line-height:1.7}.bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0}.bottom div{padding:21px;border:1px solid #e3e8eb;border-radius:12px;background:#fff}.bottom strong{display:block;font-size:14px;margin-bottom:8px}.bottom p{font-size:12px;margin:0}footer{display:flex;justify-content:space-between;font-size:11px;color:#929ca4;padding:15px 0 30px}.error{color:#bd3838;font-size:13px;margin-top:12px}textarea{width:100%;height:100px;border:1px solid #dce3e7;border-radius:8px;padding:10px;font-family:monospace;font-size:12px}table{width:100%;font-size:12px;border-collapse:collapse;margin-top:20px}td,th{text-align:right;padding:10px;border-bottom:1px solid #edf0f2}td:first-child,th:first-child{text-align:left}@media(max-width:800px){main{margin:28px auto}.layout{grid-template-columns:1fr}h1{font-size:28px}.tabs{gap:0;overflow:auto}.tabs button{white-space:nowrap;padding:12px}.bottom{grid-template-columns:1fr}.hero-number{font-size:30px}header{padding:0 24px}footer{display:block;line-height:2}.card{padding:22px}}

a{color:#167d70;text-decoration:none}a:hover{text-decoration:underline}a:focus-visible,button:focus-visible{outline:3px solid #e5a43b;outline-offset:4px}.brand{text-decoration:none;color:#172b34}.topnav{display:flex;gap:22px;font-size:13px}.tabs a{display:block;padding:13px 20px;color:#566b73;border-radius:9px;white-space:nowrap}.tabs a.active{background:#163f3d;color:white}.article{max-width:800px;margin:38px auto;background:white;border:1px solid #e3e8eb;border-radius:16px;padding:38px}.article h2{margin:34px 0 12px;font-size:22px;letter-spacing:-.5px}.article h3{margin:26px 0 12px;font-size:17px}.article p,.article li{font-size:15px;line-height:1.95;color:#4e626b}.article li{margin-bottom:8px}.article ul,.article ol{padding-left:23px}.article .lead{font-size:18px;color:#2c4c53}.article table{font-size:14px}.article td,.article th{white-space:normal;text-align:left;padding:14px 10px;line-height:1.6}.formula{padding:20px;background:#edf6f2;border-left:3px solid #1b8778;border-radius:8px;overflow:auto;color:#28574e;line-height:1.9}.meta{font-size:12px;color:#71858c}.notice{padding:16px 20px;border-radius:10px;background:#edf6f2;color:#456b60;line-height:1.8;font-size:13px;margin:22px 0}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:30px 0}.tool{display:block;background:white;border:1px solid #dfe7e7;border-radius:14px;padding:28px;color:#172b34;transition:transform .15s,border-color .15s}.tool:hover{transform:translateY(-3px);border-color:#238b7c;text-decoration:none}.tool span{font-size:12px;letter-spacing:2px;color:#228377}.tool h2{margin:18px 0 10px;font-size:23px}.tool p{margin:0;font-size:14px}.tool b{display:block;color:#168577;font-size:13px;margin-top:20px}.links{display:flex;gap:18px;flex-wrap:wrap}.homehero{padding:25px 0 5px}.homehero h1{font-size:42px;line-height:1.35;max-width:700px}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:10px;background:white;padding:10px;z-index:5}.guidecards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0}.guidecards a{padding:24px;border:1px solid #dfe7e7;border-radius:12px;background:white}.guidecards h3{font-size:17px;color:#29474d;line-height:1.6}.guidecards p{font-size:13px}.footer-nav{display:flex;gap:20px;flex-wrap:wrap}footer{gap:25px;flex-wrap:wrap}footer a{color:#5a747b}.empty{color:#71838c;font-size:14px}.breadcrumb{font-size:12px;color:#7b8f95}.tablewrap{overflow:auto}pre{background:#f6f8f9;padding:18px;border-radius:8px;overflow:auto;line-height:1.8}.article details{border-bottom:1px solid #e7eeee;padding:18px 0}.article summary{cursor:pointer;font-weight:bold;line-height:1.6}.article details p{margin-bottom:0}@media(max-width:800px){.topnav{gap:12px;font-size:12px}.badge{display:none}.grid,.guidecards{grid-template-columns:1fr}.homehero h1{font-size:30px}.article{padding:23px;margin:25px auto}.article h2{font-size:20px}.tabs a{padding:12px 14px}.hero-number{overflow-wrap:anywhere}header{height:72px}.topnav a:last-child{display:none}}
.quiz-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(250px,1fr);gap:24px;margin-top:30px}.quiz-main{min-height:465px}.quiz-aside p,.quiz-aside li{color:#5b7178;font-size:14px;line-height:1.9}.quiz-aside h2{margin-top:25px}progress{width:100%;height:6px;margin:24px 0 35px;accent-color:#168577}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:25px;font-weight:bold;line-height:1.6;margin-bottom:23px;letter-spacing:-.5px}.answer{display:flex;align-items:flex-start;gap:12px;margin:12px 0;padding:17px;border:1px solid #dde7e7;border-radius:10px;color:#38555d;cursor:pointer;font-size:15px;line-height:1.6}.answer:has(input:checked){border-color:#168577;background:#edf7f3}.answer input{width:17px;height:17px;margin-top:4px;flex:none;accent-color:#168577}.quiz-actions{display:flex;align-items:center;gap:15px;margin-top:30px}.quiz-actions .primary{margin:0;flex:1}.secondary{border:1px solid #cbdcd8;border-radius:8px;background:white;color:#27675c;padding:14px 18px;font-size:14px;cursor:pointer}.secondary:disabled{opacity:.45;cursor:default}.wide{width:100%;margin-top:20px}.micro{font-size:11px;line-height:1.8;color:#667c83}.quiz-title{font-size:36px;margin:20px 0;letter-spacing:-1px}.quiz-score{display:flex;gap:10px;margin:24px 0;flex-wrap:wrap}.quiz-score span{border-radius:20px;padding:9px 13px;background:#edf7f3;font-size:12px;color:#277666}.time-illustration{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:60px 10px;color:#759087}.time-illustration b{font-size:45px;color:#168577}.feature-grid{margin-top:0}.feature{background:#edf6f2}.data-table{table-layout:fixed}.data-table td{overflow-wrap:anywhere}.negative{color:#b23f45}.topnav{flex-wrap:wrap}.topnav a:last-child{display:inline}@media(max-width:800px){.quiz-layout{grid-template-columns:1fr}.quiz-title{font-size:29px}legend{font-size:21px}.topnav{gap:10px;max-width:65%;justify-content:flex-end}.topnav a{font-size:11px}header{padding:0 18px}.brand span{display:none}.quiz-main{padding:20px}.answer{padding:13px}.time-illustration{padding:40px 0}}

[hidden]{display:none!important}

.feature-grid{grid-template-columns:1fr}.guidecards{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:800px){.guidecards{grid-template-columns:1fr}}
.grid:not(.feature-grid){grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:800px){.grid:not(.feature-grid){grid-template-columns:1fr}}

.pnl-section-title{font-size:14px;color:#526d73;margin:25px 0 -10px}.metric strong.pnl-profit,.metric small.pnl-profit{color:#178576}.metric strong.pnl-loss,.metric small.pnl-loss{color:#b23f45}.metric small{display:block;margin-top:7px;font-size:12px}

.tabs{overflow-x:auto}.tabs a{flex-shrink:0}.breakdown{margin:5px 0 25px;border-top:1px solid #edf0f2}.breakdown div{display:flex;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid #edf0f2;font-size:13px;color:#6d8188}.breakdown b{color:#405b64}.input select{min-width:0}.micro{line-height:1.8}

.input small{white-space:nowrap;flex-shrink:0}

.amount-hint{font-size:12px;line-height:1.5;color:#178576;margin:6px 2px 0;min-height:18px;overflow-wrap:anywhere}

.compound-schedule{border-top:1px solid #edf0f2;margin-top:24px;padding-top:12px}.compound-schedule h3{font-size:16px}.schedule-scroll{overflow:auto;max-height:450px}.schedule-scroll table{min-width:520px;margin-top:0}.schedule-scroll thead{position:sticky;top:0;background:#f2f7f5}.schedule-scroll th{white-space:nowrap}.schedule-scroll tbody th{font-weight:400}.schedule-final{background:#eaf5ef;font-weight:bold}.schedule-pages{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;font-size:11px;color:#71808a}.schedule-pages button{padding:7px 12px;background:white;border:1px solid #dce3e7;border-radius:6px;color:#163f3d;cursor:pointer}.schedule-pages button:disabled{opacity:.4;cursor:default}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.layout>.card{min-width:0}

header{height:auto;min-height:82px;gap:16px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}.topnav{margin-left:auto}.language-picker{margin:0;display:flex;align-items:center;gap:8px;font-size:11px;color:#526b72;white-space:nowrap}.language-picker select{border:1px solid #dce3e7;border-radius:7px;padding:8px;width:auto;font-size:13px;background:white}.language-picker span{font-size:10px}html[lang=en] .tabs a{font-size:13px;padding:12px 15px}html[lang=en] .hero-number{font-size:clamp(24px,3vw,38px);overflow-wrap:anywhere}html[lang=en] .metric strong{font-size:18px;overflow-wrap:anywhere}html[lang=en] .brand{font-size:24px;letter-spacing:-.5px}@media(max-width:800px){.language-picker{margin-left:auto}.language-picker span{display:none}.topnav{max-width:none;gap:12px}html[lang=en] .brand span{display:none}html[lang=en] .topnav a{font-size:11px}header{gap:12px}html[lang=en] .metrics{gap:9px}html[lang=en] .metric{padding:13px}html[lang=en] .metric strong{font-size:16px}}

.guide-table{overflow-x:auto;margin:22px 0}.guide-table table{min-width:440px;margin:0}.guide-article .formula{white-space:pre-line}.guidecards h3{line-height:1.55}.guidecards p{line-height:1.8}

.brand-controls{display:flex;align-items:center;gap:18px;flex-shrink:0}.brand-controls .brand{white-space:nowrap}.theme-switch{display:inline-flex;gap:3px;padding:4px;border:1px solid #dce5e8;border-radius:24px;background:#edf2f5}.theme-switch button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:transparent;color:#647b88;cursor:pointer}.theme-switch button[aria-pressed=true]{background:white;color:#167d70;box-shadow:0 1px 5px #1934471c}.theme-switch button:hover{color:#167d70}.theme-switch button:focus-visible{outline:3px solid #d39b39;outline-offset:2px}
html[data-theme=dark]{color-scheme:dark;--navy-bg:#243449;--navy-card:#2e4057;--navy-soft:#354960;--navy-border:#4b6078;--navy-text:#edf3fb;--navy-muted:#bfccdd;--navy-accent:#94e2cc}
html[data-theme=dark] body{background:var(--navy-bg);color:var(--navy-text)}
html[data-theme=dark] header{background:#293b51;border-color:var(--navy-border)}
html[data-theme=dark] .brand,html[data-theme=dark] .tool,html[data-theme=dark] .guidecards h3{color:var(--navy-text)}
html[data-theme=dark] a,html[data-theme=dark] .brand b,html[data-theme=dark] .eyebrow,html[data-theme=dark] .tool span,html[data-theme=dark] .tool b,html[data-theme=dark] .green,html[data-theme=dark] .amount-hint{color:var(--navy-accent)}
html[data-theme=dark] p,html[data-theme=dark] label,html[data-theme=dark] small,html[data-theme=dark] .article p,html[data-theme=dark] .article li,html[data-theme=dark] .article .lead,html[data-theme=dark] .metric span,html[data-theme=dark] .meta,html[data-theme=dark] .breadcrumb,html[data-theme=dark] .legend,html[data-theme=dark] .hint,html[data-theme=dark] .micro,html[data-theme=dark] footer,html[data-theme=dark] footer a,html[data-theme=dark] .empty,html[data-theme=dark] .quiz-aside li,html[data-theme=dark] .quiz-aside p,html[data-theme=dark] .pnl-section-title,html[data-theme=dark] .schedule-pages,html[data-theme=dark] .language-picker{color:var(--navy-muted)}
html[data-theme=dark] .card,html[data-theme=dark] .article,html[data-theme=dark] .tool,html[data-theme=dark] .guidecards a,html[data-theme=dark] .bottom div{background:var(--navy-card);border-color:var(--navy-border)}
html[data-theme=dark] .metric,html[data-theme=dark] pre,html[data-theme=dark] .schedule-scroll thead{background:var(--navy-soft)}
html[data-theme=dark] .input,html[data-theme=dark] textarea,html[data-theme=dark] .language-picker select{background:#25374d;border-color:var(--navy-border);color:var(--navy-text)}
html[data-theme=dark] input,html[data-theme=dark] select{color:var(--navy-text)}
html[data-theme=dark] option{background:#293b51;color:var(--navy-text)}
html[data-theme=dark] .input:focus-within{border-color:var(--navy-accent)}
html[data-theme=dark] .tabs,html[data-theme=dark] .hint,html[data-theme=dark] .compound-schedule,html[data-theme=dark] td,html[data-theme=dark] th,html[data-theme=dark] .article details,html[data-theme=dark] .breakdown,html[data-theme=dark] .breakdown div{border-color:var(--navy-border)}
html[data-theme=dark] .tabs a,html[data-theme=dark] .tabs button{color:var(--navy-muted)}
html[data-theme=dark] .tabs a.active,html[data-theme=dark] .tabs button.active{background:#49617f;color:white}
html[data-theme=dark] .notice,html[data-theme=dark] .formula,html[data-theme=dark] .feature,html[data-theme=dark] .chip,html[data-theme=dark] .badge,html[data-theme=dark] .quiz-score span,html[data-theme=dark] .schedule-final{background:#344f60;color:#d3f5e9}
html[data-theme=dark] .formula{border-left-color:var(--navy-accent)}
html[data-theme=dark] .secondary,html[data-theme=dark] .schedule-pages button{background:#354b64;color:var(--navy-text);border-color:var(--navy-border)}
html[data-theme=dark] .answer{color:var(--navy-text);border-color:var(--navy-border)}
html[data-theme=dark] .answer:has(input:checked){background:#365c64;border-color:var(--navy-accent)}
html[data-theme=dark] .quiz-main li{color:var(--navy-muted)!important}
html[data-theme=dark] .breakdown div,html[data-theme=dark] .breakdown b,html[data-theme=dark] .time-illustration{color:var(--navy-muted)}
html[data-theme=dark] .time-illustration b,html[data-theme=dark] .metric strong.pnl-profit,html[data-theme=dark] .metric small.pnl-profit{color:var(--navy-accent)}
html[data-theme=dark] .negative,html[data-theme=dark] .metric strong.pnl-loss,html[data-theme=dark] .metric small.pnl-loss,html[data-theme=dark] .error{color:#ffb0b7}
html[data-theme=dark] .chart text{fill:var(--navy-muted)}
html[data-theme=dark] .chart line{stroke:#4c6078}
html[data-theme=dark] .chart polyline{stroke:#94e2cc}
html[data-theme=dark] .chart polyline[stroke="#bac6cd"]{stroke:#adc1db}
html[data-theme=dark] .skip:focus{background:var(--navy-card);color:var(--navy-text)}
html[data-theme=dark] .theme-switch{background:#223247;border-color:var(--navy-border)}
html[data-theme=dark] .theme-switch button{color:#bed0e5}
html[data-theme=dark] .theme-switch button[aria-pressed=true]{background:#506887;color:#ffe2a0;box-shadow:0 1px 5px #16263a33}
html[data-theme=dark] .theme-switch button:hover{color:#ffe2a0}
@media(max-width:800px){.brand-controls{gap:14px;flex-wrap:wrap}header .brand-controls{flex:1 0 100%}.topnav{margin-left:0}.theme-switch button{width:30px;height:30px}.language-picker{margin-left:auto}}

html[data-theme=dark] .dot:not([style]){background:var(--navy-accent)}
