:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#202620;background:var(--page);font-synthesis:none;text-rendering:optimizeLegibility;letter-spacing:0;--ink: #202620;--muted: #697069;--line: #dfe3dc;--surface: #ffffff;--soft: #eef2ec;--green: #16765a;--green-dark: #0d5742;--green-soft: #dff0e8;--warm: #c45336;--warm-soft: #fae8e2;--focus: #116caa;--page: #f7f8f5;--header: rgba(247, 248, 245, .96);--footer: #f1f3ef;--tab-track: #e9ede7;--input-line: #d4d9d1;--input-hover: #aab2a9;--progress-track: #dce2dc;--chart-text: #697069;--chart-line: #d9ddd6;--chart-grid: #e2e5df;--chart-target: #dc6b4d;--chart-principal-stroke: #697069;--chart-principal-fill: #cbd1ca;--chart-gains-fill: #69b39b;--chart-shadow: 0 8px 24px rgba(33, 42, 35, .08);--inverse-surface: #202620;--inverse-ink: #ffffff;color-scheme:light}[data-theme=dark]{--ink: #edf3ee;--muted: #a8b4ab;--line: #35443b;--surface: #17211c;--soft: #202c25;--green: #58c49d;--green-dark: #82d7b8;--green-soft: #203e32;--warm: #f08a6f;--warm-soft: #4a2c25;--focus: #6db9ee;--page: #0f1713;--header: rgba(15, 23, 19, .94);--footer: #121c17;--tab-track: #26332b;--input-line: #405047;--input-hover: #64756b;--progress-track: #33443a;--chart-text: #a8b4ab;--chart-line: #405047;--chart-grid: #314038;--chart-target: #f08a6f;--chart-principal-stroke: #9aa69e;--chart-principal-fill: #46544b;--chart-gains-fill: #347c64;--chart-shadow: 0 8px 24px rgba(0, 0, 0, .3);--inverse-surface: #edf3ee;--inverse-ink: #152019;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:var(--page);color:var(--ink)}button,input,select{font:inherit;letter-spacing:0}button,select{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid color-mix(in srgb,var(--focus) 35%,transparent);outline-offset:2px}.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}.site-header{height:72px;background:var(--header);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.header-inner{max-width:1240px;height:100%;margin:0 auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:11px;min-width:0}.brand-mark{width:36px;height:36px;display:grid;place-items:center;background:var(--inverse-surface);color:var(--inverse-ink);border-radius:8px;flex:0 0 auto}.brand>span:last-child{display:grid;gap:1px}.brand strong{font-size:16px;line-height:1.15}.brand small{color:var(--muted);font-size:11px;white-space:nowrap}.header-controls{display:flex;align-items:center;gap:10px}.theme-toggle{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink)}.theme-toggle:hover{color:var(--green);border-color:var(--input-hover)}.segmented{display:flex;align-items:center}.segmented.compact{height:36px;padding:3px 4px 3px 9px;gap:2px;border:1px solid var(--line);background:var(--surface);border-radius:7px;color:var(--muted)}.segmented button{border:0;background:transparent;color:var(--muted);min-width:34px;height:28px;border-radius:5px;font-size:12px;font-weight:700}.segmented button[aria-label=日本語]{min-width:52px}.segmented button.active{background:var(--inverse-surface);color:var(--inverse-ink)}.currency-select select{height:36px;min-width:76px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);padding:0 28px 0 10px;font-size:12px;font-weight:700}.intro-band{background:var(--surface);border-bottom:1px solid var(--line)}.intro-inner{max-width:1240px;margin:0 auto;min-height:230px;padding:42px 28px 32px;display:flex;align-items:flex-end;justify-content:space-between;gap:48px}.intro-copy{max-width:700px}.eyebrow{margin:0 0 12px;color:var(--green);font-size:12px;line-height:1;font-weight:800;text-transform:uppercase}.intro-copy h1{margin:0;max-width:680px;font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:0}.intro-copy>p:last-child{margin:15px 0 0;max-width:610px;color:var(--muted);font-size:16px;line-height:1.65}.hero-target{min-width:280px;padding:20px 0 5px 28px;border-left:1px solid var(--line)}.hero-target span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13px;font-weight:650}.hero-target strong{display:block;margin-top:6px;color:var(--green-dark);font-size:32px;line-height:1.2;white-space:nowrap}.tool-nav-wrap{max-width:1240px;margin:0 auto;padding:22px 28px 0}.tool-tabs{width:fit-content;display:flex;padding:4px;background:var(--tab-track);border-radius:8px}.tool-tabs button{min-height:42px;padding:0 18px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:14px;font-weight:750;white-space:nowrap}.tool-tabs button.active{background:var(--surface);color:var(--ink);box-shadow:0 1px 5px #212b2317}.calculator-layout{max-width:1240px;margin:0 auto;padding:22px 28px 72px;display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:28px;align-items:start}.inputs-panel{position:sticky;top:94px;padding:22px;border:1px solid var(--line);border-radius:8px;background:var(--soft)}.section-heading,.section-heading>div,.chart-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-heading>div{justify-content:flex-start}.section-heading h2,.chart-heading h2{margin:0;font-size:15px;line-height:1.3}.reset-button{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--muted);padding:6px;font-size:12px;font-weight:650}.reset-button:hover{color:var(--green-dark)}.fields-grid{margin-top:21px;display:grid;gap:16px}.number-field{display:grid;gap:7px}.field-label{color:var(--muted);font-size:12px;font-weight:700}.input-shell{height:46px;position:relative;display:flex;align-items:center}.input-shell input{width:100%;height:100%;border:1px solid var(--input-line);border-radius:6px;background:var(--surface);color:var(--ink);padding:0 67px 0 12px;font-size:15px;font-weight:650;transition:border-color .18s,box-shadow .18s}.input-shell input:hover{border-color:var(--input-hover)}.input-shell input:focus{border-color:var(--focus);box-shadow:0 0 0 1px var(--focus);outline:none}.input-shell input::-webkit-inner-spin-button{opacity:.45}.field-unit{position:absolute;right:12px;color:var(--muted);font-size:11px;font-weight:750;pointer-events:none}.field-helper{color:var(--muted);font-size:11px;line-height:1.4}.results-panel{min-width:0;display:grid;gap:20px}.outcome-banner{min-height:152px;display:flex;align-items:center;gap:18px;padding:25px 28px;border-radius:8px;background:#173d34;color:#fff}.outcome-banner.success{background:#145f49}.outcome-banner.warning{background:#654136}.outcome-banner.compound{background:#25483f}.outcome-icon{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:#ffffff1a}.outcome-label{color:#ffffffb3;font-size:11px;font-weight:800;text-transform:uppercase}.outcome-banner h2{margin:5px 0 6px;font-size:25px;line-height:1.25}.outcome-banner h2.balance-value{font-size:32px}.outcome-banner p{margin:0;color:#ffffffb8;font-size:13px;line-height:1.55}.progress-section{padding:2px 1px}.progress-heading{margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:700}.progress-heading strong{color:var(--green-dark);font-size:13px}.progress-track{height:8px;overflow:hidden;background:var(--progress-track);border-radius:4px}.progress-track span{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width .35s ease}.metrics-grid{display:grid;gap:12px}.metrics-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.metrics-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.metric{min-height:92px;padding:16px;display:grid;align-content:space-between;gap:12px;border:1px solid var(--line);border-radius:7px;background:var(--surface)}.metric span{color:var(--muted);font-size:11px;font-weight:700}.metric strong{font-size:16px;line-height:1.25;overflow-wrap:anywhere}.metric-accent{border-top:3px solid var(--green)}.metric-accent strong{color:var(--green-dark)}.metric-warm{border-top:3px solid var(--warm)}.metric-warm strong{color:var(--warm)}.chart-section{padding:22px 22px 15px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.chart-heading{align-items:flex-start;color:var(--muted)}.chart-heading h2{color:var(--ink)}.chart-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}.chart-wrap{width:100%;height:320px;margin-top:16px}.seo-content{border-top:1px solid var(--line);background:var(--surface)}.seo-inner{max-width:1240px;margin:0 auto;padding:64px 28px 72px}.seo-intro{max-width:780px}.seo-intro h2,.faq-block h2{margin:0;font-size:30px;line-height:1.2;letter-spacing:-.02em}.seo-intro>p:last-child{margin:15px 0 0;color:var(--muted);font-size:15px;line-height:1.75}.seo-guide-grid{margin-top:34px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.seo-guide-grid article{padding:23px;border:1px solid var(--line);border-radius:8px;background:var(--soft)}.seo-guide-grid h3{margin:0;font-size:16px;line-height:1.35}.seo-guide-grid p{margin:11px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.faq-block{max-width:860px;margin-top:60px}.faq-block h2{font-size:24px}.faq-list{margin-top:18px;border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{position:relative;padding:19px 34px 19px 0;cursor:pointer;color:var(--ink);font-size:14px;font-weight:750;line-height:1.45;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";position:absolute;top:17px;right:4px;color:var(--green-dark);font-size:20px;font-weight:500}.faq-list details[open] summary:after{content:"−"}.faq-list details p{margin:-3px 38px 19px 0;color:var(--muted);font-size:13px;line-height:1.75}footer{border-top:1px solid var(--line);background:var(--footer)}footer p{max-width:1240px;margin:0 auto;padding:26px 28px;color:var(--muted);font-size:11px;line-height:1.6}@media (max-width: 960px){.intro-inner{min-height:210px;align-items:center}.hero-target{min-width:230px}.calculator-layout{grid-template-columns:290px minmax(0,1fr);gap:20px}.metrics-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 760px){.site-header{height:64px}.header-inner{padding:0 16px}.brand small{display:none}.segmented.compact>svg{display:none}.segmented.compact{padding-left:4px}.intro-inner{min-height:230px;padding:34px 18px 26px;display:block}.intro-copy h1{font-size:36px}.intro-copy>p:last-child{font-size:14px}.hero-target{min-width:0;margin-top:25px;padding:17px 0 0;border-left:0;border-top:1px solid var(--line)}.hero-target strong{font-size:27px}.tool-nav-wrap{padding:16px 16px 0}.tool-tabs{width:100%}.tool-tabs button{min-width:0;flex:1;padding:0 9px;font-size:12px}.calculator-layout{padding:16px 16px 48px;grid-template-columns:1fr;gap:18px}.inputs-panel{position:static;top:auto;padding:18px}.fields-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.results-panel{gap:16px}.outcome-banner{min-height:145px;padding:22px}.outcome-banner h2{font-size:21px}.outcome-banner h2.balance-value{font-size:29px}.metrics-grid.three{grid-template-columns:1fr 1fr}.metrics-grid.three .metric:first-child{grid-column:1 / -1}.chart-section{padding:18px 10px 12px}.chart-heading{padding:0 8px}.chart-wrap{height:280px}.seo-inner{padding:46px 16px 54px}.seo-guide-grid{grid-template-columns:1fr}.faq-block{margin-top:46px}}@media (max-width: 480px){.header-inner{padding:0 12px}.brand>span:last-child{display:none}.brand-mark{width:33px;height:33px}.brand strong{font-size:14px}.currency-select select{min-width:68px;padding-left:8px}.header-controls{gap:4px}.segmented button{min-width:29px}.intro-copy h1{font-size:33px}.fields-grid{grid-template-columns:1fr}.reset-button span{display:none}.outcome-banner{align-items:flex-start;padding:20px}.outcome-icon{width:40px;height:40px}.metrics-grid.four{grid-template-columns:1fr 1fr}.metric{min-height:88px;padding:14px 12px}.metric strong{font-size:14px}.chart-wrap{height:260px}.seo-intro h2{font-size:26px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
