@charset "UTF-8";
:root{--paper:#f5f2e9;--paper-light:#fcfaf4;--ink:#263f35;--green:#245c45;--green-dark:#164632;--muted:#6d795f;--line:#dedfd2;--red:#b44e35;--serif:"Noto Serif SC","Songti SC","STSong","SimSun",serif;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:20px}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.7 var(--sans);-webkit-font-smoothing:antialiased;background-image:radial-gradient(#41614808 .7px,transparent .7px);background-size:5px 5px}
button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer;color:inherit;border:0;background:none}button:disabled{cursor:wait;opacity:.65}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #b27636;outline-offset:5px}
h1,h2,h3,p{margin:0}h1,h2{font-family:var(--serif);font-weight:500;letter-spacing:2px;line-height:1.6;font-size:27px}svg{display:block}
.wrap{max-width:1440px;width:calc(100% - 112px);margin:auto}
.site-header{height:88px;display:flex;align-items:center;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:13px;font:600 27px var(--serif);letter-spacing:1px}
.brand-seal{display:grid;place-content:center;position:relative;border:1.5px solid var(--green);width:38px;height:47px;font-size:20px;line-height:1.1;padding-left:2px;flex-shrink:0}
.brand-seal:after{content:"";position:absolute;inset:3px;border:.7px solid var(--green)}
.brand-sub{display:block;font:13px/1.4 var(--sans);letter-spacing:2px;margin-top:7px;color:var(--muted)}
.text-button{padding:0;font-size:inherit}.text-button:hover{text-decoration:underline;text-underline-offset:4px}
.journey-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start;padding-top:24px}
.map-panel,.journal-panel{border:1px solid var(--line);border-radius:6px;background:#faf9f0;min-width:0}
.section-topline{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:23px 25px 21px}
.section-kicker{display:block;font-size:12px;letter-spacing:2px;color:#71805f;margin-bottom:6px}
.map-hint{display:flex;align-items:center;gap:7px;font-size:13px;color:#71805f;white-space:nowrap}
.map-hint i{width:5px;height:5px;border-radius:50%;background:#78936c}
.map-frame{position:relative;aspect-ratio:1.38;overflow:hidden;background:#eef0dc}
.map-art{position:absolute;width:100%;height:100%;object-fit:cover;filter:saturate(.55);transition:filter 1.5s}
.map-frame[data-days="1"] .map-art{filter:saturate(.65)}.map-frame[data-days="2"] .map-art{filter:saturate(.8)}.map-frame[data-days="3"] .map-art{filter:saturate(.95)}.map-frame[data-days="4"] .map-art,.map-frame[data-days="5"] .map-art{filter:saturate(1.1)}
.map-mist{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 24%,#f6f7ecb0,transparent 45%),radial-gradient(ellipse at 85% 42%,#f4f5ebc4,transparent 45%);opacity:1;transition:opacity 1.5s}
.map-frame[data-days="1"] .map-mist{opacity:.8}.map-frame[data-days="2"] .map-mist{opacity:.6}.map-frame[data-days="3"] .map-mist{opacity:.35}.map-frame[data-days="4"] .map-mist{opacity:.15}.map-frame[data-days="5"] .map-mist{opacity:0}
.map-sun{position:absolute;width:65px;height:65px;right:15%;top:8%;border-radius:50%;background:radial-gradient(#eac37980,transparent 70%);opacity:.3;transition:opacity 1s}.map-frame[data-days="5"] .map-sun{opacity:1}
.map-caption{position:absolute;top:25px;left:25px;font:13px var(--serif);letter-spacing:3px;color:#7c8d71}
.map-corner{position:absolute;right:20px;bottom:22px;border:1px solid #7d8d6b70;padding:5px 4px;font:15px/1.3 var(--serif);letter-spacing:3px;color:#7a8c67}
.map-place{position:absolute;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px;isolation:isolate}
.place-pin{width:25px;height:25px;border-radius:50%;border:1px solid #fcfbec;background:#fdfaf0;box-shadow:0 2px 8px #34513922;color:#68836a;font:14px/23px Georgia,serif;transition:background .35s,box-shadow .35s}
.place-label{background:#fbf9efeb;padding:3px 11px;border:1px solid #d5dac5;border-radius:2px;box-shadow:0 2px 5px #203d2310;white-space:nowrap;font:16px/1.7 var(--serif);letter-spacing:1px;transition:background .3s,color .3s}
.map-place:hover .place-label{background:var(--green);color:white}
.map-place.visited .place-pin{background:var(--green);color:white;border-color:#e8e9cb;box-shadow:0 0 0 4px #a5bc7140,0 0 28px 12px #f1d78b80}
.map-place.visited .place-label{color:var(--green);border-color:#9baa82;background:#fcfbed}
.map-place.visited:before{content:"";position:absolute;width:65px;height:30px;background:#ffdd7790;top:-21px;border-radius:50%;filter:blur(12px);z-index:-1;pointer-events:none}
.map-frame.celebrate .map-place.visited .place-pin{animation:pin-glow 1.4s ease}
.map-footer{min-height:65px;display:flex;align-items:center;gap:16px;padding:15px 23px;color:var(--muted);font-size:13px}
.map-footer>span{white-space:nowrap}.map-footer strong{font-weight:500;color:var(--green)}.map-footer p{font-size:13px;border-left:1px solid var(--line);padding-left:16px}
.legend-dot{width:6px;height:6px;display:inline-block;background:#6a8c53;border-radius:50%;margin-right:7px}
.map-celebration{position:absolute;inset:0;pointer-events:none;opacity:0;color:#b9913e}.map-celebration span{position:absolute;left:25%;top:40%}.map-celebration span:nth-child(2){left:65%;top:24%}.map-celebration span:nth-child(3){left:44%;top:62%}.map-celebration span:nth-child(4){left:80%;top:70%}.map-celebration span:nth-child(5){left:33%;top:16%}.celebrate .map-celebration{animation:celebrate 1.8s ease}
.journal-panel{background:#fdfbf5}.small-sprig{font-size:36px;color:#879c72;transform:rotate(-25deg)}
.day-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0 22px;border-bottom:1px solid var(--line);gap:3px}
.day-tab{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:8px 0 16px;color:#768367}
.day-tab strong{font:23px Georgia,serif}.day-tab span{font-size:12px}.day-tab[aria-selected="true"]{color:var(--green)}
.day-tab[aria-selected="true"]:after{content:"";position:absolute;bottom:-1px;height:2px;left:10px;right:10px;background:var(--green)}
.day-tab.recorded strong{background:#e7ecdc;border-radius:50%;width:32px;height:32px;line-height:32px;margin:-5px 0}.day-tab.recorded .tab-check{position:absolute;top:-3px;right:2px;font-size:12px;color:var(--green)}
.day-content{padding:25px 24px 0}.full-width{width:100%}
.primary-button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;padding:13px 20px;border:1px solid var(--green);background:var(--green);color:#fffdf4;border-radius:3px;font-size:16px;transition:background .2s,transform .2s}
.primary-button:hover{background:var(--green-dark);transform:translateY(-1px)}.primary-button span{font:25px/1 var(--sans)}
.journey-progress{position:relative;display:grid;place-items:center;padding:42px 0 46px}
.progress-medallion{position:relative;width:150px;height:150px;display:grid;place-items:center}
.progress-medallion:before{content:"";position:absolute;inset:-11px;border:1px solid #dce0cf;border-radius:50%}
.progress-medallion svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke-width:1.6}.ring-base{stroke:#d9decc}.ring-fill{stroke:#486c48;stroke-width:3;stroke-dasharray:377;stroke-dashoffset:377;transition:stroke-dashoffset 1s ease}
.progress-medallion>div{text-align:center}.medallion-small{display:block;font:15px/1.6 var(--serif);letter-spacing:2px;color:#71805f}
.progress-medallion strong{display:block;font:46px/1.5 Georgia,serif;font-weight:400;color:var(--green)}.progress-medallion strong span{font-size:24px;color:#8a987b}
.red-seal{position:absolute;right:calc(50% - 93px);bottom:26px;border:1px solid var(--red);color:var(--red);font:15px/1.2 var(--serif);padding:5px 4px;transform:rotate(5deg);letter-spacing:2px}
.closing-note{display:flex;align-items:center;justify-content:center;gap:23px;padding:35px 0;border-bottom:1px solid var(--line)}.closing-note>span:first-child{font-size:44px;color:#97a178}.closing-note p{font:18px/1.9 var(--serif);letter-spacing:2px}.closing-signature{font-size:13px;color:#71805f;margin-left:40px;letter-spacing:2px}
.site-footer{display:flex;justify-content:space-between;gap:20px;font-size:13px;color:#71805f;letter-spacing:1px;padding:22px 0 27px}.site-footer .text-button{color:#637a5a}
.dialog{border:1px solid #e4e5d7;border-radius:9px;background:var(--paper-light);color:var(--ink);width:min(600px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:31px;box-shadow:0 25px 90px #14261e30;overflow:auto}
.dialog[open]{animation:dialog-in .2s ease}.dialog::backdrop{background:#24382a69;backdrop-filter:blur(4px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}.dialog-top .section-kicker{margin:0}.dialog h2{font-size:31px}
.close-button{font:31px/1 var(--sans);width:36px;height:36px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;color:#71805f;display:grid;place-items:center}.close-button:hover{background:#e5eadb}
.dialog-intro{font-size:15px;color:#65755e;line-height:1.9;margin:12px 0 22px}
.place-dialog-icon{width:65px;height:65px;border-radius:50%;background:#e8edde;color:#52714c;display:grid;place-items:center;margin:16px 0}.place-dialog-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.place-subtitle{color:#65755e;font-size:15px;margin-top:7px}.place-description{font-size:16px;line-height:2;margin:23px 0}
.place-suggestion{background:#edf0e3;padding:16px 18px;border-left:2px solid #a0ae87}.place-suggestion>span{font-size:13px;letter-spacing:2px;color:#6b7c59}.place-suggestion p{font:18px/1.9 var(--serif);margin-top:7px}.place-history{font-size:14px;color:#71805f;margin:19px 0}.place-history:empty{margin:20px 0}
.backup-option{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}.backup-option h3{font-size:16px;font-weight:500}.backup-option p{font-size:14px;line-height:1.8;color:#6b795e;margin-top:5px}
.secondary-button{flex-shrink:0;padding:9px 13px;border:1px solid #bdc8ad;border-radius:3px;font-size:14px;color:var(--green)}.secondary-button:hover{background:#e7ecdc}.privacy-note{font-size:14px;line-height:1.9;color:#6b795e;padding:23px 0}.privacy-note p+p{margin-top:10px}.danger{color:#a65642}#reset-button{font-size:14px}
.form-error{background:#fff0e6;border:1px solid #e8c4b6;color:#a04d39;padding:10px 13px;margin-top:14px;font-size:15px;border-radius:3px}
.confirm-dialog{width:min(480px,calc(100% - 32px))}.confirm-dialog h2{font-size:27px}.confirm-dialog>p{font-size:15px;color:#65755e;line-height:2;margin-top:13px;white-space:pre-line}.confirm-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.confirm-actions .primary-button{font-size:14px;padding:9px 17px}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);max-width:calc(100% - 40px);padding:12px 22px;border-radius:5px;background:#224735f5;color:#faf9ed;font-size:15px;box-shadow:0 6px 30px #223e2929;z-index:20;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s}.toast.visible{opacity:1;visibility:visible;transform:translate(-50%,0)}
.warning{border:1px solid #e0c6a6;background:#fff5e2;padding:14px 20px;font-size:15px;color:#8e6436;border-radius:4px;margin-top:20px}
.skip-link{position:absolute;left:10px;top:-70px;z-index:30;padding:12px;background:white}.skip-link:focus{top:10px}.noscript-notice{position:fixed;bottom:0;left:0;right:0;background:#fff1d4;padding:16px;text-align:center;z-index:30}.noscript-notice a{text-decoration:underline}[hidden]{display:none!important}body:has(dialog[open]){overflow:hidden}
@keyframes dialog-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes celebrate{0%{opacity:0;transform:translateY(8px)}30%{opacity:1}100%{opacity:0;transform:translateY(-25px)}}
@keyframes pin-glow{0%,100%{transform:scale(1)}45%{transform:scale(1.25);box-shadow:0 0 32px 16px #f7d47a99}}
@media(min-width:1450px){.map-frame{aspect-ratio:1.43}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.journey-layout{grid-template-columns:minmax(0,1fr) 300px;gap:18px}.section-topline{padding:20px}.map-frame{aspect-ratio:1.15}.map-art{object-fit:fill}.map-caption{font-size:11px;letter-spacing:2px;top:18px;left:18px}.map-footer{padding:15px 17px;gap:10px}.map-footer p{padding-left:10px}.day-content{padding:22px 20px 0}}
@media(max-width:850px){.wrap{width:calc(100% - 40px)}.site-header{height:82px}.brand{font-size:25px}.journey-layout{grid-template-columns:1fr;padding-top:20px}.map-frame{aspect-ratio:1.45}.day-content{padding:23px 24px 0}.journal-panel .section-topline{padding:22px 24px 17px}.day-tabs{margin:0 24px;gap:8px}.journey-progress{padding:37px 0 40px}.progress-medallion{width:138px;height:138px}.red-seal{right:calc(50% - 87px);bottom:24px}}
@media(max-width:540px){
  .wrap{width:calc(100% - 32px)}.site-header{height:76px}.brand{font-size:clamp(18px,5vw,22px);gap:10px;letter-spacing:.5px}.brand-seal{width:31px;height:40px;font-size:16px}.brand-sub{font-size:11px;letter-spacing:1.5px;margin-top:6px}
  .journey-layout{padding-top:16px;gap:18px}.section-topline{gap:10px;flex-wrap:wrap;padding:19px 17px 17px}.section-topline h1,.section-topline h2{font-size:25px;letter-spacing:1px}.section-kicker{font-size:11px}.map-hint{margin-left:auto;font-size:12px}.map-frame{aspect-ratio:1.08}.map-caption{top:15px;left:15px;font-size:11px;letter-spacing:1px}.map-corner{bottom:17px;right:12px;font-size:13px}.map-place{gap:3px;padding:6px}.place-pin{width:22px;height:22px;font-size:12px;line-height:20px}.place-label{font-size:15px;padding:3px 7px;letter-spacing:0}.map-footer{padding:14px;gap:10px;font-size:12px;min-height:64px}.map-footer p{font-size:12px;line-height:1.8}.map-sun{width:40px;height:40px}
  .journal-panel .section-topline{padding:20px 20px 15px}.day-tabs{margin:0 20px;gap:4px}.day-tab strong{font-size:23px}.day-tab span{font-size:12px}.day-content{padding:24px 20px 0}.primary-button{font-size:16px;padding:13px 18px}.journey-progress{padding:38px 0 42px}.progress-medallion{width:132px;height:132px}.progress-medallion strong{font-size:42px;line-height:1.5}.progress-medallion strong span{font-size:23px}.medallion-small{font-size:14px}.red-seal{right:calc(50% - 84px);font-size:14px;bottom:25px}
  .closing-note{gap:15px;padding:25px 5px;justify-content:flex-start}.closing-note>span:first-child{font-size:35px}.closing-note p{font-size:16px;letter-spacing:1px}.closing-signature{font-size:10px;margin-left:auto;writing-mode:vertical-rl;letter-spacing:2px}.site-footer{font-size:12px;padding:20px 0;gap:12px;letter-spacing:.5px}
  .dialog{padding:23px 21px;max-height:calc(100dvh - 28px)}.dialog h2{font-size:28px}.dialog-intro{font-size:15px}.backup-option{gap:10px}.backup-option p{font-size:13px}.secondary-button{font-size:13px;padding:9px 10px}.privacy-note{font-size:13px}.place-description{font-size:16px}.place-suggestion p{font-size:17px}.toast{font-size:14px;bottom:18px;width:max-content;text-align:center}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
