/* A quiet path at rest; an illustrated stage when a milestone is earned. */
.milestone-dialog{background:linear-gradient(155deg,#fffdf4,#faf9ee 55%,#eef5e9)}
.milestone-scene.celebrating{padding-block:12px 4px;background:radial-gradient(ellipse at 50% 45%,#ffe7a456,transparent 68%)}
.milestone-scene.celebrating>.milestone-art{width:min(92%,350px);filter:drop-shadow(0 12px 10px #77522415)}
.milestone-art [data-disc],.milestone-art [data-ring],.milestone-art [data-laurel]{transform-box:fill-box;transform-origin:center}
.milestone-art [data-burst]{opacity:0}.milestone-art .award-halo{pointer-events:none}
.milestone-scene.celebrating .milestone-count{border:1px solid #debf7b;border-radius:24px;background:linear-gradient(110deg,#fff8e4,#f1ddad,#fff8e4);padding:9px 20px;box-shadow:0 5px 14px #8e6a2220;margin-top:0;min-height:48px}
.milestone-scene.celebrating .milestone-count strong{font-size:29px;font-variant-numeric:tabular-nums;color:#654d21}
.milestone-scene.celebrating+.milestone-story{padding-top:19px}
.milestone-story .milestone-unlock-peek{border-color:#bdd4b5;background:linear-gradient(110deg,#e8f2de,#f8f2dc);box-shadow:inset 0 1px #ffffff}
@media(max-height:760px){.milestone-scene.celebrating>.milestone-art{width:235px}.milestone-scene.celebrating{padding-top:0}.milestone-scene.celebrating .milestone-count{padding:5px 15px;min-height:38px}.milestone-scene.celebrating+.milestone-story{padding-top:12px}}
.milestone-path-card{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:10px 13px;padding:16px 18px;background:linear-gradient(115deg,#fff8e9,#edf5ef);border-color:#d5ddcb}
.milestone-path-icon{display:grid;place-items:center;width:42px;height:48px;color:#a5772e;background:#f9e8bf;border:1px solid #e7d3a5;border-radius:20px 20px 14px 14px;font-size:26px}
.milestone-path-summary{display:grid;gap:4px;min-width:0}.milestone-path-summary small{font-size:10px;letter-spacing:.04em;font-weight:800;color:#775533}.milestone-path-summary strong{font-size:15px;line-height:1.3;color:#214c40}.milestone-path-summary>span{font-size:11px;color:#53665b}.milestone-path-summary progress{width:100%;height:5px;border:0;border-radius:8px;overflow:hidden;background:#e1e8df;margin:3px 0}.milestone-path-summary progress::-webkit-progress-bar{background:#e1e8df}.milestone-path-summary progress::-webkit-progress-value{background:linear-gradient(90deg,#c89458,#357760)}
.milestone-path-open{grid-column:2;justify-self:start;min-height:44px;padding:8px 0;border:0;background:transparent;color:#155b49;font-weight:800;font-size:12px;text-align:start}.milestone-path-open span{margin-inline-start:12px}
.milestone-dialog{width:min(570px,calc(100vw - 24px));max-width:calc(100vw - 24px);height:auto;max-height:calc(100dvh - 32px);padding:0;border:1px solid #e2e6d7;border-radius:30px;color:#20483c;background:#fffdf6;overflow:hidden;box-shadow:0 28px 100px #113f3b4d}.milestone-dialog[open]{display:flex;flex-direction:column}.milestone-dialog::backdrop{background:#123f3acf;backdrop-filter:blur(7px)}
.milestone-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px 6px;flex:none}.milestone-top>span{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:#82603e;font-size:10px;font-weight:850;letter-spacing:.09em}.milestone-top>button{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #d9e0d2;border-radius:50%;background:#fffdf8;color:#295749;font-size:25px}.milestone-steps{display:flex;gap:4px}.milestone-steps i{display:block;width:16px;height:4px;border-radius:4px;background:#e1e8de}.milestone-steps i.filled{background:#51846b}
.milestone-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;scrollbar-color:#a3baab transparent}.milestone-scene{position:relative;display:grid;place-items:center;min-width:0;padding:0 18px;background:radial-gradient(ellipse at 50% 45%,#fff4d1aa,transparent 70%)}.milestone-art{display:block;width:min(100%,350px);height:auto;overflow:visible}.milestone-art [data-piece],.milestone-art [data-petal],.milestone-art [data-spark]{transform-box:fill-box;transform-origin:center}.milestone-art.mini{width:80px}
.milestone-count{display:flex;align-items:center;justify-content:center;gap:9px;min-height:32px;margin-top:-6px;color:#7d6040;font-size:11px;font-weight:800}.milestone-count strong{font:700 21px/1.1 Georgia,serif;color:#245748}.milestone-story{padding:10px 30px 18px;text-align:center}.milestone-story h2{font:700 clamp(27px,6vw,38px)/1.12 Georgia,serif;color:#174638;margin:0 0 10px;overflow-wrap:break-word}.milestone-story p{max-width:33ch;margin:0 auto;color:#56685c;font-size:15px;line-height:1.5}.milestone-unlock-peek{display:inline-flex;align-items:center;gap:8px;margin-top:17px;padding:9px 13px;border:1px solid #dce5d3;border-radius:14px;background:#f0f5e8;color:#2c624f;font-size:12px;font-weight:750}.milestone-unlock-peek>span{color:#a87a37}.milestone-preview-note,.milestone-price{display:block;margin:12px auto 0;font-size:11px;color:#79634b}.milestone-reader{margin:15px auto 0;max-width:310px}.milestone-reader .tour-audio-controls{margin:0}.milestone-reader .tour-audio-controls [data-tour-read]{min-height:44px;background:#eef3e7;color:#245342;border:1px solid #dae4d2}.milestone-reader .tour-audio-controls [data-tour-replay]{min-height:44px;min-width:44px;background:#eef3e7;color:#245342;border:1px solid #dae4d2}
.milestone-footer{flex:none;padding:13px 24px max(16px,env(safe-area-inset-bottom));border-top:1px solid #e5e9db;background:#fffdf8;display:grid;gap:7px}.milestone-primary,.milestone-secondary{display:flex;align-items:center;justify-content:center;gap:16px;min-height:52px;width:100%;padding:12px 18px;border:1px solid #215f4e;border-radius:17px;background:#175f4e;color:#fffef1;font-size:14px;font-weight:850;line-height:1.3}.milestone-secondary{background:#f2f6eb;color:#235c48;border-color:#d5dfcd}.milestone-primary span{font-size:19px}.milestone-footer-links{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:2px 12px}.milestone-footer-links button,.milestone-extra-link{padding:8px 0;min-height:44px;border:0;background:transparent;color:#536b5d;font-size:11px;font-weight:750}.milestone-extra-link{display:flex;gap:8px;justify-content:center;color:#95632e}.milestone-dialog button:focus-visible{outline:3px solid #bc803a;outline-offset:3px}.milestone-story h2:focus,.milestone-map-heading h2:focus{outline:none}
.milestone-map-heading{padding:9px 24px 16px}.milestone-map-heading small{font-size:10px;color:#8c6340;font-weight:800;letter-spacing:.1em}.milestone-map-heading h2{font:700 29px/1.12 Georgia,serif;color:#214f3f;margin:7px 0 12px}.milestone-map-heading p{font-size:13px;line-height:1.5;color:#5b7060;max-width:40ch;margin:0}.milestone-map-heading .tour-audio-controls{margin:0 0 16px}.milestone-map{list-style:none;margin:0;padding:0 20px 20px;display:grid;gap:10px}.milestone-map li{min-width:0;position:relative}.milestone-map button{display:grid;grid-template-columns:34px minmax(0,1fr) 64px;gap:8px;align-items:center;position:relative;width:100%;min-height:96px;padding:14px 12px;border:1px solid #e0e5d7;border-radius:21px;background:#f6f8ef;color:#254f40;text-align:start}.milestone-map .earned button{background:linear-gradient(110deg,#edf4e6,#fff8e9);border-color:#b6d0b9}.milestone-map-number{display:grid;place-items:center;width:30px;height:34px;border:1px solid #dbe1d1;border-radius:15px 15px 11px 11px;color:#81744d;font-size:12px;font-weight:850;background:#fffdf5}.earned .milestone-map-number{background:#337458;color:#fffdf0;border-color:#337458}.milestone-map-copy{display:grid;min-width:0;gap:4px}.milestone-map-copy small{color:#8b6b44;font-size:9px;font-weight:800}.milestone-map-copy strong{font-size:13px;line-height:1.3}.milestone-map-copy>span{font-size:10px;line-height:1.4;color:#677865}.milestone-map-art{width:64px;overflow:hidden}.milestone-map-art .milestone-art{width:64px}.milestone-map-arrow{position:absolute;inset-inline-end:14px;top:9px;font-size:10px;color:#8d9c7d}
.milestone-result-invitation{grid-template-columns:46px minmax(0,1fr);align-items:center;text-align:start;padding:16px;border-color:#d5dec6;background:linear-gradient(115deg,#fbf2de,#ecf4e9)}.milestone-result-invitation>div{display:grid;grid-template-columns:1fr;gap:4px;min-width:0}.milestone-result-invitation strong{font-size:13px;color:#285540}.milestone-invitation-number{display:grid;place-items:center;width:42px;height:48px;background:#f2dfb8;border-radius:20px 20px 13px 13px;font:700 20px Georgia,serif;color:#74552c}.milestone-result-invitation button{justify-self:start;min-height:44px;padding:8px 0;color:#235f49;border:0;background:transparent;font-size:12px;font-weight:800}
.developer-milestone-list{display:grid;gap:8px}.developer-milestone-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid #d9e2d3;border-radius:16px;background:#fffdf7}.developer-milestone-row>span{display:grid;place-items:center;width:36px;height:40px;border-radius:14px;background:#f3e5c8;color:#755c34;font-weight:850;font-size:12px}.developer-milestone-row strong{display:block;font-size:13px;color:#285341}.developer-milestone-row small{display:block;margin-top:4px;font-size:10px;color:#687663}.developer-milestone-row button{min-height:44px;padding:8px 12px;border:0;border-radius:12px;background:#20634f;color:white;font-weight:800;font-size:12px}
@media(max-width:380px){.milestone-top{padding-inline:15px}.milestone-story{padding-inline:20px}.milestone-footer{padding-inline:17px}.milestone-map{padding-inline:12px}.milestone-map button{grid-template-columns:28px minmax(0,1fr) 47px;padding:12px 10px}.milestone-map-art,.milestone-map-art .milestone-art{width:47px}.milestone-map-number{width:27px}.milestone-story h2{font-size:27px}}
@media(max-height:720px){.milestone-scene>.milestone-art{width:245px}.milestone-story{padding-top:6px}.milestone-story h2{font-size:28px}.milestone-story p{font-size:13px}.milestone-unlock-peek{margin-top:10px}.milestone-reader{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.milestone-dialog *{scroll-behavior:auto!important}}
.calm-mode .milestone-dialog *{scroll-behavior:auto!important}
.milestone-preview-nav{display:flex;justify-content:center;gap:5px;padding:0 15px 8px;border-bottom:1px dashed #d6deca;flex:none}.milestone-preview-nav button{min-width:44px;min-height:44px;border:1px solid #d7dfce;border-radius:12px;background:#f1f5e9;color:#3f604b;padding:7px 11px;font-size:12px;font-weight:750}.milestone-preview-nav button:disabled{opacity:.4}
.milestone-scene:not(.celebrating)>.milestone-art{width:250px}
.milestone-dialog[dir="rtl"] .milestone-primary>span{transform:scaleX(-1)}
@media(max-width:460px){.milestone-path-card{margin-inline-end:58px}.developer-preview .milestone-path-card{margin-inline-end:0}}