:root{--navy:#0b3b67;--blue:#1768ac;--yellow:#f3b61f;--ink:#142333;--muted:#637181;--line:#dbe5ee;--bg:#eef4f8;--white:#fff;accent-color:var(--blue)}*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#dcebf5 0,#f5f8fa 420px);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif;font-size:16px;line-height:1.55}main{width:min(100%,660px);margin:auto;padding:20px 16px 52px}.top{display:flex;align-items:center;gap:12px;margin:4px 0 18px}.mark{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:var(--navy);color:var(--yellow);font-size:26px;font-weight:900;box-shadow:0 7px 18px #0b3b6729}.top h1{margin:0;font-size:1.42rem;letter-spacing:-.04em}.eyebrow{margin:0;color:var(--blue);font-weight:800;font-size:.82rem}.reset{margin-left:auto;border:0;background:transparent;color:var(--muted);font-size:.9rem;padding:10px 4px;text-decoration:underline;text-underline-offset:4px}.calculator,.result,.notice{background:var(--white);border:1px solid #fff;border-radius:24px;box-shadow:0 10px 30px #24435c14;padding:22px;margin-bottom:16px}.intro h2,.notice h2{font-size:1.22rem;margin:0 0 2px}.intro p{margin:0;color:var(--muted);font-size:.93rem}.field{padding:22px 0 5px;border-bottom:1px solid var(--line)}.labelrow{display:flex;justify-content:space-between;align-items:center;gap:16px}.labelrow label{font-weight:750}.labelrow output{color:var(--navy);font-size:1.12rem;font-weight:900}input[type=range]{width:100%;height:32px;margin:11px 0 0;cursor:pointer}.ends{display:flex;justify-content:space-between;color:#8793a0;font-size:.75rem}.hint{color:var(--muted);font-size:.82rem;margin:7px 0 0}details{margin-top:14px}summary{cursor:pointer;color:var(--blue);font-weight:750;padding:5px 0}.nested{border:0;padding-bottom:0}.result{background:var(--navy);color:white;position:relative;overflow:hidden}.result:after{content:"₩";position:absolute;right:-18px;top:35px;font-size:170px;font-weight:900;color:#ffffff0a;line-height:1;pointer-events:none}.resultHead{display:flex;justify-content:space-between;align-items:start}.resultHead p{margin:0;color:#b9d8ed;font-weight:700}.resultHead h2{margin:1px 0 0;font-size:1.1rem}.badge{background:var(--yellow);color:#463200;padding:5px 9px;border-radius:99px;font-size:.76rem;font-weight:850}.amount{display:flex;align-items:baseline;gap:5px;margin:16px 0 2px}.amount strong{font-size:clamp(2.5rem,11vw,4.2rem);letter-spacing:-.07em;line-height:1;font-variant-numeric:tabular-nums}.amount span{font-weight:800}.period{margin:0 0 20px;color:#b9d8ed}.compare{display:grid;grid-template-columns:1fr 1fr;gap:9px;position:relative;z-index:1}.compare article{background:#ffffff12;border:1px solid #ffffff17;border-radius:16px;padding:13px}.compare span,.compare small{display:block;color:#c6dce9;font-size:.78rem}.compare strong{display:block;font-size:1.08rem;margin:3px 0}.lifetime{display:flex;justify-content:space-between;gap:12px;margin-top:13px;padding:13px 2px 2px;color:#c6dce9;font-size:.88rem}.lifetime strong{color:white}.share{position:relative;z-index:1;width:100%;margin-top:17px;padding:15px;border:0;border-radius:14px;background:var(--yellow);color:#392900;font-weight:900;font-size:1rem}.notice{box-shadow:none;background:#ffffffa6}.notice h2{font-size:1rem}.notice p{color:var(--muted);font-size:.86rem}.links{display:grid;gap:8px;margin-top:15px}.links a{display:block;text-align:center;border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--navy);font-weight:800;text-decoration:none;background:white}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:#142333;color:white;padding:11px 18px;border-radius:99px;opacity:0;pointer-events:none;transition:.25s;font-weight:750}.toast.show{opacity:1;transform:translate(-50%,0)}button,a,input,summary{touch-action:manipulation}@media(min-width:680px){main{padding-top:38px}.calculator,.result,.notice{padding:28px}.compare{gap:12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
