/* 所选海底世界纸感手账视觉，所有计算与交互沿用原工具。 */
body{background:#f8f2e6 url('纸感手账背景_20261025.test.webp') center top/cover fixed;color:#123e4b}
main{width:min(1420px,calc(100% - 72px));margin:28px auto 18px;display:grid;grid-template-columns:minmax(285px,29%) minmax(0,1fr) 172px;gap:16px;align-items:stretch}
.topbar{grid-column:1/-1;min-height:68px;margin:0;align-items:start}.brand{font-family:KaiTi,STKaiti,'Microsoft YaHei',sans-serif;font-size:48px;color:#103e4d;letter-spacing:1px;font-weight:900;line-height:1.35}.brand-icon{display:none}.top-note{max-width:145px;font-family:KaiTi,serif;font-size:17px;line-height:1.65;color:#23464a;margin:6px 4px 0 0}
.intro{grid-column:1/-1;display:block;margin:0 0 17px}.intro h1,.intro-badge,.eyebrow{display:none}.intro p{margin:0;color:#52696a;font-size:16px}.layout{display:contents}
.plan-card,.result,.route-card{border:1px solid #e8dfcc;border-radius:5px;background:#fffdf7e8;box-shadow:0 4px 12px #4b392008}.plan-card{padding:29px 25px 21px;grid-column:1;min-height:716px}.card-heading{margin-bottom:31px;gap:10px}.card-heading h2{font-family:KaiTi,STKaiti,sans-serif;font-size:25px;color:#123e4b;line-height:1.35}.step-tag{background:#fae6b6;color:#134955;border-radius:8px}.field{margin-bottom:25px}label{font-size:15px;color:#344e59;margin-bottom:10px}.input-wrap{background:#fffefb;border:1px solid #b8cbce;border-radius:9px}.input-wrap:focus-within{border-color:#1d6e70;box-shadow:0 0 0 3px #3e8b891b}input{font-size:25px;color:#153e4e;padding:15px 12px;font-weight:750}#goal{font-size:20px;padding:17px 12px}.input-unit{color:#778d96;font-size:13px;padding-right:12px}.numbers{gap:12px}.weekly-wrap{background:#f0f6fa;border-color:#a6c7df}.field-note{font-size:12px;color:#7b8e98;line-height:1.6;margin-top:9px}.plan-button{background:#14555d;border:1px solid #16484e;color:#fffef8;border-radius:8px;box-shadow:0 3px 0 #123f4815;padding:16px;font-size:18px}.reset-button{font-size:13px;color:#587e8d;margin-top:21px}.calculate-status{font-size:12px;color:#25666a;margin-top:7px}.field-error,.error{font-size:13px;line-height:1.65;color:#b33e2b;font-weight:500}.field-error{padding:8px 10px;border-left:3px solid #e1795a;background:#fff0e7;margin-top:9px}.error{padding-top:3px}input[aria-invalid=true]{outline:2px solid #d47154;outline-offset:0}
.result{grid-column:2;padding:29px 28px 20px;min-height:716px;display:flex;flex-direction:column;isolation:isolate;color:#143f4b;background:#faf3e2;overflow:hidden}.result:before{display:none}.result-top{display:none}.goal-name{color:#123f4b;font-family:KaiTi,STKaiti,sans-serif;font-size:34px;font-weight:900;margin:0;line-height:1.35;z-index:3;max-width:87%}.result-main{position:static;display:block;flex:1;min-height:470px}.wish-art{position:absolute;inset:72px 0 150px;height:auto;display:block;grid-column:auto;grid-row:auto;pointer-events:none}.wish-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:55% center;max-width:none;filter:none;margin:0;transform:none}.wish-percent{top:4px;right:22px;width:87px;height:87px;background:#fff9edee;border-radius:50%;box-shadow:0 2px 7px #493e2020}.wish-percent svg{width:79px;height:79px}.wish-percent circle{stroke:#eadfc5}.wish-percent #wishArc{stroke:#ecb94f}.wish-percent b{font-size:18px;color:#164653}.result #answer{position:absolute;top:139px;left:28px;width:236px;z-index:2}.answer-intro{color:#285362;font-size:14px;max-width:210px;margin:0 0 12px;line-height:1.6}.weeks{font-family:KaiTi,STKaiti,sans-serif;font-size:83px;color:#124d54;letter-spacing:-2px}.weeks small{color:#163e4d;font-size:27px}.answer-sub{color:#285363;font-size:15px;line-height:1.9;margin-top:25px}.answer-sub b{font-size:31px;color:#ed7449}.progress{display:none}.stats{position:relative;z-index:3;background:#fffdf4ed;border-radius:2px;box-shadow:none;padding:17px 16px;margin:0 0 16px;gap:14px}.stat{border-color:#dfd8c5}.stat span{font-size:12px;color:#607a80}.stat b,.stat:first-child b{font-size:27px;color:#164951}.stat:last-child b{color:#e46c47}.stat b small{font-size:12px}.add-button{position:relative;z-index:3;background:#ff805c;border:1px solid #f38965;box-shadow:0 3px 0 #e16b4430;color:#fffef7;font-size:19px;border-radius:7px;padding:15px}.result.invalid .wish-art{opacity:.34}.result.invalid #answer{width:260px}.empty{font-size:25px;color:#154650;line-height:1.5;max-width:230px}.result.invalid .answer-sub{margin-top:12px}.complete-text{font-size:48px}.result.updated{outline-color:#7db4a3!important}
.route-card{grid-column:3;margin:0;padding:25px 15px 18px;min-width:0;min-height:716px;display:flex;flex-direction:column}.route-top{display:block;margin:0 0 25px}.route-top h2{font-family:KaiTi,STKaiti,sans-serif;font-size:23px;line-height:1.4;color:#153f4a}.route-top .step-tag{display:none}.route-top p{font-size:11px;line-height:1.7;margin:9px 0 0;color:#829295}.milestones{display:flex;flex-direction:column;gap:35px;flex:1}.milestones:before{top:16px;bottom:20px;left:17px;right:auto;width:2px;height:auto;background:#b9c9c6}.milestone,.milestone:first-child,.milestone:last-child{display:grid;grid-template-columns:35px 1fr;grid-template-rows:24px 20px;column-gap:12px;flex:0;text-align:left;align-items:center}.dot,.milestone:first-child .dot,.milestone:last-child .dot{grid-column:1;grid-row:1/3;width:35px;height:35px;margin:0;font-size:14px;background:#e7edf3;border-color:#c0d0de;color:#2f5f78}.milestone:first-child .dot{background:#187b7d;border-color:#a8ceca;color:#fff}.milestone:last-child .dot{background:#f5cf75;border-color:#f0ce80;color:#966617}.milestone b,.milestone.current b{grid-column:2;color:#184655;font-size:13px;margin:0}.milestone small{grid-column:2;color:#63818b;font-size:13px}.calc-detail{margin-top:17px;padding-top:12px;border-color:#ded8c7;font-size:12px}.calc-detail summary{color:#306474;max-width:100%;line-height:1.6}.formula{font-size:11px;color:#526b73;overflow-wrap:anywhere;line-height:1.8}.foot{grid-column:1/-1;margin:1px 0;color:#718686;font-size:11px}
@media(min-width:1500px){main{margin-top:38px;grid-template-columns:30% 1fr 180px}.result,.plan-card,.route-card{min-height:770px}.wish-art{inset:80px 0 150px}.result #answer{top:160px}}
@media(max-width:1100px) and (min-width:761px){main{width:calc(100% - 36px);grid-template-columns:31% 1fr 145px;gap:11px}.brand{font-size:39px}.plan-card{padding:23px 17px}.card-heading h2{font-size:22px}.field{margin-bottom:21px}.result{padding:25px 19px}.goal-name{font-size:29px}.result #answer{left:20px;top:144px;width:190px}.answer-intro{font-size:12px}.weeks{font-size:68px}.answer-sub{font-size:13px}.wish-art{inset:85px 0 154px}.route-card{padding:23px 12px}.route-top h2{font-size:20px}.milestone{column-gap:5px}.wish-percent{transform:scale(.82);right:6px}}
@media(max-width:760px){body{background-size:auto 1100px;background-attachment:scroll}main{display:flex;flex-direction:column;width:calc(100% - 24px);margin:16px auto;gap:14px}.topbar{min-height:54px}.brand{font-size:32px}.top-note{display:none}.intro{margin:0 0 3px}.intro p{font-size:13px}.result{order:3;min-height:600px;padding:22px}.plan-card{order:2;min-height:0;padding:23px}.route-card{order:4;min-height:0;padding:24px}.foot{order:5}.goal-name{font-size:29px}.wish-art{inset:78px 0 144px}.result #answer{top:130px;left:21px;width:185px}.weeks{font-size:67px}.answer-intro{font-size:12px}.answer-sub{font-size:13px;margin-top:19px}.answer-sub b{font-size:26px}.wish-percent{transform:scale(.8);right:4px}.stats{padding:12px;gap:9px}.stat b{font-size:24px}.stat span{font-size:11px}.add-button{font-size:17px}.milestones{flex-direction:row;gap:0;justify-content:space-between}.milestones:before{left:16px;right:16px;top:16px;bottom:auto;height:2px;width:auto}.milestone,.milestone:first-child,.milestone:last-child{display:flex;flex-direction:column;gap:5px;align-items:center;flex:1;text-align:center}.milestone b,.milestone small{font-size:10px}.dot,.milestone:first-child .dot,.milestone:last-child .dot{width:31px;height:31px;font-size:12px}.route-top p{font-size:12px}.calc-detail{margin-top:20px}.formula{font-size:13px}.plan-button{font-size:17px}.field{margin-bottom:20px}}

.result .answer-sub{background:#fff9e7e8;padding:6px 8px;display:table;border-radius:3px}

@media(min-width:1101px){.topbar{min-height:84px}.brand{font-size:56px}.intro{margin-bottom:24px}.intro p{font-size:17px}.plan-card,.result,.route-card{min-height:clamp(680px,calc(100vh - 235px),800px)}.card-heading h2{font-size:28px}.goal-name{font-size:38px}.result #answer{top:159px}.weeks{font-size:98px}.wish-percent{width:100px;height:100px}.wish-percent svg{width:91px;height:91px}.wish-percent b{font-size:20px}}

@media(min-width:1101px){.plan-card .field{margin-bottom:30px}.plan-card input{padding-top:17px;padding-bottom:17px}.plan-card #goal{padding-top:19px;padding-bottom:19px}.card-heading{margin-bottom:36px}}

input[aria-invalid=true]{outline:none}.input-wrap:has(input[aria-invalid=true]){border-color:#d88362;box-shadow:inset 0 0 0 1px #d88362}

/* 完整展示工具内容，给页边与愿望路线留足空间。 */
@media(min-width:1101px){main{padding:14px;grid-template-columns:minmax(300px,29%) minmax(0,1fr) 220px}.top-note{max-width:210px}.route-card{padding-left:18px;padding-right:18px}.route-top h2{font-size:23px;flex-wrap:wrap}}