:root{--forest:#213e35;--deep:#193229;--sage:#687e6d;--gold:#b98b43;--ochre:#d9b76d;--paper:#f6f4ed;--cream:#eeece2;--ink:#293a32;--muted:#81877c;--line:#e3e5da;--orange:#c96e43;--serif:Georgia,'Times New Roman',serif;--sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:14px/1.5 var(--sans)}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.icon,svg.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.site-header{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw;border-bottom:1px solid var(--line);background:#fbfaf5}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;font:17px var(--serif);line-height:1.1}.brand b{display:block;font-size:26px;letter-spacing:-.7px;font-weight:normal}.brand-emblem{background:var(--forest);border-radius:50% 50% 44% 44%;color:var(--ochre);width:43px;height:48px;display:grid;place-items:center}.brand-emblem svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.1}.header-right{display:flex;align-items:center;gap:30px}.header-location{color:var(--sage);display:flex;align-items:center;gap:7px;font-size:12px}.text-button{border:0;background:none;display:inline-flex;align-items:center;gap:9px;color:var(--forest);padding:10px 0;font-size:13px}.app-shell{max-width:1600px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 390px;padding:38px 4.5vw 22px;gap:38px;align-items:start}.map-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 25px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--sage)}h1,h2,h3,p{margin-top:0}.map-heading h1{font:32px/1.25 var(--serif);letter-spacing:-.7px;margin:8px 0}.map-heading p{font-size:12px;color:var(--sage);margin:0}.estate-seal{font:italic 37px var(--serif);color:var(--gold);width:69px;height:69px;border:1px solid #d8cfb7;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 5px #e0d9c7}.estate-seal span{font:6px var(--sans);letter-spacing:1.5px;margin-top:-3px}.map-frame{height:calc(100vh - 285px);min-height:480px;max-height:790px;position:relative;border-radius:16px;border:1px solid #d4d9c8;overflow:hidden;box-shadow:0 6px 28px #213e3507;background:#e7ead9}#map{height:100%;width:100%;background:#e9eadb}.leaflet-container{font:11px var(--sans)}.leaflet-control-attribution{font-size:9px!important;background:#f8f7eccf!important}.leaflet-control-attribution a{color:#50664f}.leaflet-control-zoom{box-shadow:0 2px 10px #203b341a!important;border:1px solid #d2d9c9!important;border-radius:10px!important;overflow:hidden;margin:82px 0 0 18px!important}.leaflet-control-zoom a{background:#fffef8!important;color:var(--forest)!important;width:34px!important;height:34px!important;line-height:34px!important;font-size:20px!important}.map-top{position:absolute;top:18px;left:18px;right:18px;display:flex;align-items:start;justify-content:space-between;pointer-events:none;z-index:500}.gps-badge{background:#fffef8ed;padding:9px 13px;border:1px solid #d6dccf;border-radius:25px;font-size:10px;color:#687565;box-shadow:0 2px 7px #284b3010;display:flex;gap:7px;align-items:center}.gps-badge i{width:6px;height:6px;border-radius:50%;background:#a7ad99}.gps-badge.active i{background:#4a8b62;box-shadow:0 0 0 3px #4a8b621a}.gps-badge.demo{background:#fff2d7;color:#8b652e}.gps-badge.demo i{background:#c99438}.north-arrow{display:flex;flex-direction:column;align-items:center;font:10px var(--serif);color:#617362}.north-arrow svg{width:36px;height:36px;fill:#f8f7ec;stroke:#617362;stroke-width:1}.map-actions{position:absolute;top:82px;right:18px;display:flex;flex-direction:column;gap:8px;z-index:500}.map-control{height:35px;width:35px;border:1px solid #d0d9c6;border-radius:10px;background:#fffef8;display:grid;place-items:center;color:var(--forest);box-shadow:0 2px 7px #284b3010}.map-bottom{position:absolute;bottom:26px;left:18px;right:18px;display:flex;justify-content:space-between;gap:10px;align-items:center;z-index:500;pointer-events:none}.map-bottom>*{pointer-events:auto}.map-legend{display:flex;align-items:center;gap:7px;font-size:9px;background:#fffef8e8;padding:8px 10px;border-radius:7px;color:#617362}.legend-path{width:17px;height:3px;background:#ad8b52}.legend-you{width:8px;height:8px;border:2px solid white;box-shadow:0 0 0 1px #538478;border-radius:50%;background:#538478;margin-left:7px}.map-layer{background:#fffef8;border:1px solid #d2d9c9;padding:7px 12px;border-radius:7px;color:#405d4c;font-size:10px}.map-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px;font-size:10px;color:#6f7a6b}.map-caption>span:first-child{display:flex;gap:7px;align-items:center}.map-caption .icon{width:16px;height:16px}.map-caption i{padding:0 7px;font-style:normal;color:#abb29d}.route-note{font-size:10px;line-height:1.6;color:#8a8d80;margin:12px 0 0;max-width:700px}.quest-panel{background:#fffef9;border:1px solid #e0e3d6;border-radius:17px;overflow:hidden;box-shadow:0 7px 22px #203b3404}.panel-topline{padding:21px 26px 17px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eeeee5;font-size:9px;letter-spacing:1.7px;font-weight:600;color:var(--sage)}.panel-topline svg{width:16px;height:16px;color:var(--gold)}.intro-art{height:153px;position:relative;margin:18px 20px 0;border-radius:10px;background:linear-gradient(0deg,#1d3b3433,#1d3b3400),url("/assets/elswout-map-preview-710872b6.webp") center 64%/cover;overflow:hidden}.intro-art:after{content:'HET LANDGOED ROEPT';position:absolute;bottom:14px;left:16px;color:#fff8e4;font:9px var(--sans);letter-spacing:2px;text-shadow:0 1px 4px #16271b}.panel-body{padding:23px 26px}.panel-body h2{font:31px/1.17 var(--serif);letter-spacing:-.5px;margin-bottom:13px}.body-copy{color:#7b8477;font-size:12px;line-height:1.8;margin-bottom:21px}.rules{display:flex;gap:13px;margin-bottom:23px;padding-bottom:20px;border-bottom:1px solid #e9ebdf}.rule{flex:1;display:flex;gap:7px;align-items:center;color:#6d7b6a;font-size:10px;line-height:1.4}.rule .icon{width:19px;height:19px;color:var(--gold)}label{display:block;color:#53664f;font-size:11px;font-weight:600;margin-bottom:7px}.optional{font-weight:400;color:#9b9e91}input{width:100%;border:1px solid #dce0d2;border-radius:8px;background:#fffef9;padding:11px 13px;color:var(--forest);font-size:12px}input::placeholder{color:#a1a696}input:focus{border-color:#879e7e;outline:none;box-shadow:0 0 0 3px #829e7612}.form-field{margin-bottom:16px}.age-row{display:flex;gap:12px;align-items:center}.age-row input{width:78px}.age-row small{font-size:10px;line-height:1.5;color:#8d9486}.primary-button,.secondary-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;border:1px solid var(--forest);border-radius:8px;padding:13px 17px;background:var(--forest);color:#fffef4;font-size:12px;font-weight:500;transition:background .15s}.primary-button:hover{background:#315548}.primary-button .icon{width:17px;height:17px}.secondary-button{background:transparent;color:var(--forest);border-color:#dce2d1;font-size:11px;padding:10px}.secondary-button:hover{background:#f1f3e8}.small-note{font-size:9px;line-height:1.6;color:#93998b;text-align:center;margin:10px 0 0}.demo-link{border:0;background:none;text-decoration:underline;text-underline-offset:3px;color:#839178;width:100%;font-size:10px;margin-top:15px;padding:4px}.panel-footer{display:flex;gap:6px;align-items:center;justify-content:center;padding:15px 16px;background:#f6f7ee;border-top:1px solid #e7eadf;font-size:9px;color:#8a9581}.panel-footer .icon{width:13px;height:13px}.progress-header{padding:22px 25px 18px;border-bottom:1px solid #e7ebdf}.team-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.team-name{font:21px var(--serif);max-width:230px;overflow-wrap:anywhere}.age-pill{font-size:9px;white-space:nowrap;color:#6c7b63;background:#f1f3e8;border-radius:5px;padding:4px 7px}.progress-labels{display:flex;justify-content:space-between;font-size:9px;color:#8d9685;margin-bottom:9px}.progress-track{display:flex;gap:3px}.progress-segment{height:4px;background:#e7ebde;border-radius:3px;flex:1}.progress-segment.done{background:#688e64}.progress-segment.current{background:#d7b064}.stop-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.stop-number{font-size:9px;font-weight:600;letter-spacing:1.6px;color:#7b8b71}.status-chip{background:#f0f3e7;color:#75896c;padding:4px 7px;border-radius:5px;font-size:9px}.status-chip.arrived{color:#3f7952;background:#eaf3e7}.landmark-icon{height:75px;width:75px;background:#eef1e3;border:1px solid #e0e7d4;border-radius:50%;display:grid;place-items:center;margin:0 0 17px;font-size:37px}.walking-title{font-size:28px!important;line-height:1.2!important}.distance-box{display:flex;align-items:center;gap:14px;padding:14px 16px;background:#f4f5ed;border:1px solid #e6eadb;border-radius:9px;margin:20px 0}.distance-box>.icon{width:26px;height:26px;color:#8da17d}.distance-value{font:27px var(--serif);line-height:1.2}.distance-label{font-size:9px;color:#89917e}.distance-hint{margin-left:auto;color:#8f9b83;font-size:9px;max-width:115px;text-align:right}.arrival-note{padding:13px;border:1px dashed #d7dfc8;background:#fafbf5;border-radius:8px;font-size:11px;color:#819073;line-height:1.7;margin-bottom:16px}.arrival-note b{font-weight:600;color:#5c7351}.up-next{border-top:1px solid #e8ecdf;margin-top:23px;padding-top:19px;display:flex;gap:12px;color:#b1b8a8;font-size:11px;align-items:center}.up-next .icon{width:18px;height:18px}.up-next small{display:block;font-size:9px;margin-top:3px;color:#a1aa94}.question-title{font:23px/1.45 var(--serif);margin-bottom:19px}.answer-list{display:flex;flex-direction:column;gap:9px}.answer-option{display:flex;align-items:center;gap:12px;text-align:left;background:#fffef9;border:1px solid #dde4d3;border-radius:8px;padding:12px 13px;font-size:12px;color:#5a6b52;line-height:1.6;width:100%}.answer-letter{display:grid;place-items:center;width:25px;height:25px;border:1px solid #e0e5d6;border-radius:5px;flex-shrink:0;font:11px var(--sans);color:#8c987f}.answer-option:hover{background:#f4f6ec;border-color:#b2c0a3}.answer-option[aria-pressed=true]{border-color:#6f8b60;background:#f0f4e5;box-shadow:0 0 0 1px #6f8b60}.answer-option[aria-pressed=true] .answer-letter{color:white;background:#6b875d;border-color:#6b875d}.question-submit{margin-top:20px}.stats-row{display:flex;gap:10px;margin:20px 0}.stat-card{flex:1;background:#f3f5ea;border-radius:9px;padding:15px;text-align:center}.stat-card strong{font:24px var(--serif);display:block;color:#526c47}.stat-card span{font-size:9px;color:#89967e}.completed-art{font-size:66px;text-align:center;margin:15px 0}.completed-title{text-align:center}.session-tools{padding:0 26px 15px;display:flex;justify-content:space-between;font-size:9px;color:#a2ab95}.session-tools button{border:0;background:none;color:#99a38d;text-decoration:underline;font-size:9px;padding:0}.feedback,.connection-error,.gps-error{margin:15px 20px;padding:12px 14px;font-size:11px;border-radius:7px;line-height:1.7}.feedback{background:#edf4e6;color:#506c43;border:1px solid #dce8d0}.feedback.wrong,.connection-error,.gps-error{background:#fbf1df;color:#94713e;border:1px solid #ebdfc5}.demo-tools{border-top:1px dashed #e0d8c4;background:#fbf5e8;padding:14px 20px}.demo-tools>span{font-size:8px;letter-spacing:1.4px;color:#a18759;display:block;margin-bottom:9px}.demo-tools small{display:block;text-align:center;font-size:9px;color:#a79470;margin-top:6px}.demo-tools .secondary-button{border-color:#e1d7bd;color:#8a784e}.loading-state{padding:50px 20px;text-align:center;color:#8b977e;font-size:12px}.loading-state .icon{display:block;margin:0 auto 20px;width:34px;height:34px;color:#b19661}.story-dialog{border:1px solid #d2d8c3;border-radius:16px;padding:30px;max-width:630px;width:calc(100% - 30px);max-height:90vh;overflow:auto;background:#fffaf0;color:var(--forest)}.story-dialog::backdrop{background:#172c26a6;backdrop-filter:blur(4px)}.story-dialog h2{font:31px var(--serif);margin:15px 0}.story-dialog p{font-size:12px;color:#7b8770;line-height:1.8}.story-dialog img{width:100%;border-radius:8px}.dialog-close{position:absolute;top:9px;right:14px;border:0;background:none;color:#7e8b73;font-size:26px}.map-pin{background:none;border:none}.pin-body{height:40px;width:40px;background:var(--forest);border:3px solid #fffdf2;border-radius:50% 50% 50% 6px;transform:rotate(-45deg);box-shadow:0 3px 9px #203c3530;display:grid;place-items:center;color:white}.pin-body span{transform:rotate(45deg);font:16px var(--serif)}.pin-body.done{height:24px;width:24px;background:#7c976d;border-width:2px;border-radius:50%;margin:8px;transform:none}.pin-body.done span{transform:none;font:12px var(--sans)}.target-label{border:none!important;background:#fffdf3!important;border-radius:7px!important;color:#37523b!important;box-shadow:0 2px 7px #294b2315!important;padding:6px 10px!important;font:11px var(--serif)!important}.estate-label{font:italic 35px var(--serif);letter-spacing:5px;color:#849774;opacity:.55;white-space:nowrap;pointer-events:none}.forest-label{font:italic 15px var(--serif);color:#8a9c7a;white-space:nowrap;pointer-events:none}.noscript{padding:20px;background:#fff1cc;position:fixed;bottom:0;z-index:2000;width:100%}#map-fallback{position:absolute;bottom:80px;left:20px;right:20px;z-index:600;padding:14px;border-radius:8px;background:#fff8e8;color:#8b7346;font-size:12px}[hidden]{display:none!important}@media(min-width:1500px){.app-shell{grid-template-columns:minmax(0,1fr) 420px;gap:50px}.panel-body{padding:28px 30px}.map-heading h1{font-size:38px}}@media(max-width:1100px){.app-shell{padding:28px 25px;gap:25px;grid-template-columns:minmax(0,1fr) 350px}.map-heading h1{font-size:27px}.estate-seal{display:none}.map-caption{flex-direction:column;align-items:flex-start;gap:6px}.panel-body{padding:22px}.site-header{padding:0 25px}.map-frame{min-height:520px}}@media(max-width:780px){.site-header{height:73px;padding:0 20px}.brand{font-size:14px;gap:9px}.brand b{font-size:22px}.brand-emblem{width:36px;height:41px}.brand-emblem svg{width:26px;height:26px}.header-location{display:none}.header-right{gap:0}.text-button{font-size:11px}.app-shell{display:flex;flex-direction:column;padding:20px 16px;gap:20px;max-width:560px}.map-section{width:100%}.map-heading{margin-bottom:15px}.map-heading h1{font-size:26px}.map-heading p{font-size:11px}.eyebrow{font-size:8px}.map-frame{height:43vh;min-height:300px;max-height:470px;border-radius:13px}.map-caption{font-size:9px;flex-direction:row;gap:6px;margin-top:11px}.map-caption>span:first-child{display:none}.route-note{font-size:9px;margin-top:9px}.quest-panel{width:100%}.intro-art{height:120px}.panel-body{padding:24px}.panel-topline{padding:16px 24px}.panel-body h2{font-size:30px}.rules{gap:15px}.map-top{top:12px;left:12px;right:12px}.map-actions{right:12px;top:65px}.leaflet-control-zoom{margin:65px 0 0 12px!important}.map-bottom{left:12px;right:12px}.question-title{font-size:22px}.answer-option{font-size:13px;padding:13px}.estate-label{font-size:25px}.header-right .icon{width:17px;height:17px}.body-copy{font-size:13px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.panel-body .question-title{font:24px/1.4 var(--serif);letter-spacing:-.2px}@media(max-width:780px){.panel-body .question-title{font-size:24px}}

.override-status{font-size:11px;line-height:1.6;color:#927844;margin-bottom:12px;overflow-wrap:anywhere}.override-coordinates{display:grid;grid-template-columns:1fr 1fr;gap:9px}.override-coordinates input{min-width:0;padding:9px;font-variant-numeric:tabular-nums;font-size:11px}.override-accuracy{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0}.override-accuracy label{margin:0;font-size:10px}.override-accuracy input{width:82px;padding:7px 9px;font-size:11px}.override-presets{display:flex;gap:6px;margin:10px 0}.override-presets .secondary-button{padding:9px 4px;font-size:10px}.override-map-toggle{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:400;line-height:1.6;margin:12px 0;color:#8a784e}.override-map-toggle input{width:15px;height:15px;margin:0;accent-color:#a4874e}.location-picking,.location-picking .leaflet-interactive{cursor:crosshair!important}

.start-route-length{display:flex;align-items:center;gap:13px;padding:14px 16px;margin:0 0 22px;background:#f0f3e7;border:1px solid #dfe6d2;border-radius:9px;color:var(--forest)}.start-route-length>.icon{width:28px;height:28px;color:var(--gold)}.start-route-length strong{display:block;font:27px/1.2 var(--serif)}.start-route-length span{display:block;font-size:10px;color:#7b8b70;margin-top:4px}

.arrival-card{padding:18px;background:#f0f3e7;border:1px solid #dfe6d2;border-radius:10px;margin-bottom:18px}.arrival-card h3{font:24px/1.2 var(--serif);color:var(--forest);margin:10px 0}.arrival-card p{font-size:13px;line-height:1.7;color:#64715f}.arrival-card .primary-button{margin-top:12px;font-size:12px}.directions-link{text-decoration:none;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px}.arrival-ready{font-size:13px;color:var(--forest);line-height:1.6}

.guardian-reveal{overflow:hidden;border:1px solid #d9d9bd;border-radius:14px;margin:18px 0 24px;background:#f4f0df;text-align:center}.guardian-scene{height:148px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 80%,#d9c78255,transparent 65%),linear-gradient(150deg,#284d42,#102c29);overflow:hidden}.guardian-scene:before,.guardian-scene:after{content:"";position:absolute;width:130px;height:180px;border-radius:50%;background:#43644555;bottom:-120px;left:-25px;transform:rotate(-25deg)}.guardian-scene:after{left:auto;right:-25px;transform:rotate(25deg)}.guardian-emblem{display:grid;place-items:center;position:relative;width:88px;height:88px;font:52px Georgia,serif;color:#f5d38b;text-shadow:0 0 25px #f5d38b88;background:#f9e9b80a;border:1px solid #e9cc7966;border-radius:50%;box-shadow:0 0 36px #d5b76822}.guardian-orbit{position:absolute;width:114px;height:114px;border:1px dashed #e7d39055;border-radius:50%;transform:rotate(25deg)}.guardian-star{position:absolute;color:#ecd596;font-size:19px}.star-one{left:20%;top:28px}.star-two{right:20%;top:45px;font-size:27px}.star-three{right:31%;bottom:17px;font-size:12px}.guardian-caption{padding:17px 12px 19px}.guardian-caption strong{display:block;font:23px/1.3 var(--serif);color:var(--forest);margin:7px 0}.guardian-caption>span:last-child{font:italic 12px/1.5 var(--serif);color:#7b8063}.guardian-victory .guardian-scene{height:190px;background:radial-gradient(ellipse at center,#8c783b66,transparent 70%),linear-gradient(140deg,#304e37,#102c29)}.guardian-victory .guardian-emblem{font-size:65px;width:110px;height:110px}.guardian-victory .guardian-orbit{width:142px;height:142px}.guardian-animate .guardian-emblem{animation:guardian-arrive 1.2s ease-out both}.guardian-animate .guardian-star{animation:guardian-spark 1.8s ease-out both}.guardian-animate .star-two{animation-delay:.15s}.guardian-animate .star-three{animation-delay:.3s}@keyframes guardian-arrive{from{opacity:0;transform:translateY(12px) scale(.75);filter:blur(4px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes guardian-spark{0%{opacity:0;transform:scale(.3)}55%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.guardian-animate .guardian-emblem,.guardian-animate .guardian-star{animation:none}}

.arrival-overlay{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border:0;padding:24px;background:radial-gradient(ellipse at center,#52633b 0%,#183e32 45%,#071f1c 100%);color:#f1dfb5;overflow:auto}.arrival-overlay::backdrop{background:#071f1c}.arrival-fullscreen-content{min-height:100%;width:min(620px,100%);margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.arrival-fullscreen-content>.eyebrow{color:#e3c684;letter-spacing:3px}.arrival-fullscreen-content #arrival-art{width:100%}.arrival-fullscreen-content .guardian-reveal{border:0;background:none;margin:26px 0}.arrival-fullscreen-content .guardian-scene{height:260px;background:none;overflow:visible}.arrival-fullscreen-content .guardian-scene:before,.arrival-fullscreen-content .guardian-scene:after{display:none}.arrival-fullscreen-content .guardian-emblem{width:170px;height:170px;font-size:96px;box-shadow:0 0 100px #dec07544}.arrival-fullscreen-content .guardian-orbit{width:220px;height:220px;animation:arrival-orbit 7s linear both}.arrival-fullscreen-content .guardian-caption strong{color:#f7e7c2;font-size:clamp(30px,7vw,48px)}.arrival-fullscreen-content .guardian-caption .eyebrow,.arrival-fullscreen-content .guardian-caption>span:last-child{color:#d1c29a}.arrival-fullscreen-content .guardian-caption>span:last-child{font-size:18px}.arrival-fullscreen-content .guardian-star{animation:arrival-shimmer 2s ease-in-out 3}.arrival-fullscreen-content .guardian-emblem{animation:guardian-arrive 1.4s ease-out both,arrival-glow 5s 1.4s ease-in-out}.arrival-fullscreen-content>p{font-size:12px;color:#c4c7aa}.arrival-overlay-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;align-items:center;margin:15px 0}.arrival-overlay-controls button{background:none;border:1px solid #e6d49c66;border-radius:20px;padding:10px 16px;color:#f3e4c2;font-size:12px;cursor:pointer}.arrival-overlay-controls label{font-size:11px;color:#d1c29a;display:flex;gap:6px;align-items:center;margin:0}.arrival-overlay-controls input{width:14px;height:14px;margin:0}.arrival-duration{height:2px;width:180px;background:#d7bf7e;transform-origin:left;animation:arrival-duration 7s linear forwards;margin-top:18px}@keyframes arrival-orbit{to{transform:rotate(205deg)}}@keyframes arrival-shimmer{50%{opacity:.35;transform:scale(.7)}100%{opacity:1;transform:scale(1)}}@keyframes arrival-glow{50%{box-shadow:0 0 130px #dec07588}}@keyframes arrival-duration{to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.arrival-fullscreen-content .guardian-orbit,.arrival-fullscreen-content .guardian-star,.arrival-fullscreen-content .guardian-emblem,.arrival-duration{animation:none}}

.sound-choice{border:1px solid #dfe6d2;border-radius:9px;padding:14px;margin:0 0 20px;background:#f7f7ef}.sound-choice legend{font-size:12px;font-weight:600;color:var(--forest);padding:0 5px}.sound-choice p,.sound-choice small{font-size:11px;line-height:1.6;color:#7b8063;margin:0 0 12px}.sound-choice label{display:flex;align-items:center;gap:9px;font-size:13px;margin:12px 0;cursor:pointer}.sound-choice input{width:17px;height:17px;margin:0;accent-color:var(--forest)}.sound-choice small{display:block;margin:12px 0 0}

.arrival-fullscreen-content #arrival-art{position:relative;isolation:isolate}.arrival-fullscreen-content .guardian-reveal{position:relative;z-index:2}.arrival-rays{position:absolute;z-index:-1;inset:-20%;border-radius:50%;background:repeating-conic-gradient(from 0deg,#e8c96b18 0deg 7deg,transparent 7deg 25deg);mask-image:radial-gradient(ellipse,#000 5%,transparent 67%);animation:arrival-rays 8s ease-out both;pointer-events:none}.arrival-wave{position:absolute;left:50%;top:155px;width:200px;height:200px;margin:-100px;border:2px solid #f3d78b88;box-shadow:0 0 35px #e9c96d55,inset 0 0 30px #e9c96d33;border-radius:50%;animation:arrival-wave 3s .7s ease-out both;pointer-events:none}.arrival-wave.wave-two{animation-delay:1.4s}.arrival-particles{position:absolute;left:50%;top:155px;pointer-events:none;z-index:3}.arrival-particles i{position:absolute;font-style:normal;font-size:15px;color:#ffe5a1;text-shadow:0 0 12px #ffdf79;animation:arrival-burst 5s calc(.8s + var(--delay)) ease-out both}.arrival-fullscreen-content .guardian-emblem{animation:arrival-summon 2s cubic-bezier(.2,.7,.3,1) both,arrival-glow 5s 2s ease-in-out}.arrival-fullscreen-content .guardian-caption{animation:arrival-caption 1.4s 1.3s ease-out both}.arrival-duration{animation-duration:8s}.arrival-overlay-controls .arrival-speaker{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;padding:10px}.arrival-speaker svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.arrival-speaker[aria-pressed=true]{background:#d9bc7030;border-color:#e4cd8c}.arrival-speaker:focus-visible{outline:2px solid #fff0b9;outline-offset:4px}@keyframes arrival-rays{from{opacity:0;transform:rotate(-35deg) scale(.4)}30%{opacity:1}to{opacity:.55;transform:rotate(30deg) scale(1.3)}}@keyframes arrival-wave{from{opacity:0;transform:scale(.3)}15%{opacity:1}to{opacity:0;transform:scale(3)}}@keyframes arrival-burst{0%{opacity:0;transform:rotate(var(--angle)) translateX(15px) scale(0)}18%{opacity:1}75%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateX(var(--distance)) scale(.5)}}@keyframes arrival-summon{0%{opacity:0;transform:translateY(35px) scale(.3) rotate(-18deg);filter:blur(15px)}65%{opacity:1;transform:translateY(-6px) scale(1.08) rotate(3deg);filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes arrival-caption{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.arrival-rays,.arrival-wave,.arrival-particles{display:none}.arrival-fullscreen-content .guardian-emblem,.arrival-fullscreen-content .guardian-caption{animation:none}}

/* A mobile adventure up to 1024px; development tools need a wider viewport. */
:root{--app-header:64px;--app-max-width:1024px;--tour-width:min(100vw,var(--app-max-width));--tour-left:max(0px,calc((100vw - var(--app-max-width))/2))}
.quest-page{height:100dvh;overflow:hidden;background:var(--paper)}
.site-header{height:var(--app-header);width:var(--tour-width);max-width:var(--app-max-width);margin:0 0 0 var(--tour-left);padding:0 24px;position:relative;z-index:20}
.site-header .header-location{display:none}.site-header .brand{font-size:12px;gap:9px}.site-header .brand b{font-size:21px}.site-header .brand-emblem{width:33px;height:38px}.site-header .brand-emblem svg{width:25px;height:25px}.site-header .text-button{font-size:12px}
.app-shell{display:block;position:relative;width:var(--tour-width);max-width:var(--app-max-width);height:calc(100dvh - var(--app-header));margin:0 0 0 var(--tour-left);padding:0;isolation:isolate}
.map-section{position:absolute;inset:0;width:100%;height:100%;z-index:0}.map-heading,.map-caption,.route-note{display:none}.map-frame{height:100%;min-height:0;max-height:none;border:0;border-radius:0;box-shadow:none}.map-top{top:14px;left:14px;right:14px}.map-actions{top:68px;right:14px}.leaflet-control-zoom{margin:68px 0 0 14px!important}.map-bottom{bottom:206px;left:14px;right:14px}.map-legend{display:none}.map-layer{background:#fffef8ed}.leaflet-control-attribution{max-width:85%;font-size:8px!important}
.quest-panel{position:absolute;inset:0;width:100%;border:0;border-radius:0;background:var(--paper);z-index:10;overflow:auto;overscroll-behavior:contain;box-shadow:none;padding-bottom:env(safe-area-inset-bottom)}
.quest-panel .panel-body{padding:26px 24px}.quest-panel .panel-body h2{font-size:30px}.quest-panel .panel-body .question-title{font-size:25px;line-height:1.35}.quest-panel .panel-topline{padding:18px 24px}.quest-panel .intro-art{height:150px}.quest-panel .progress-header{padding:18px 24px;background:#eeeee3;position:relative}.quest-panel .answer-option{padding:17px 14px;min-height:58px;font-size:15px}.quest-panel .primary-button,.quest-panel .secondary-button{min-height:48px}.quest-panel input{font-size:16px}.quest-panel .panel-footer{padding:18px 24px}.quest-panel .small-note{font-size:11px}.quest-panel .body-copy{font-size:15px;line-height:1.75}.quest-panel .up-next{margin-top:22px}.quest-panel .session-tools{font-size:10px;padding:12px 24px 18px;gap:12px}.quest-panel .session-tools button{font-size:11px;min-height:32px;white-space:nowrap}.quest-panel .stop-heading{margin-bottom:18px}.screen-enter{animation:quest-screen-enter .35s ease-out both}
.app-shell[data-view=sheet] .map-section{visibility:hidden}.app-shell[data-view=map] .quest-panel{inset:auto 12px calc(16px + env(safe-area-inset-bottom));width:auto;overflow:visible;background:#fffdf5f5;border:1px solid #d4dac6;border-radius:16px;box-shadow:0 5px 30px #143a3433;padding:0;backdrop-filter:blur(10px)}
.app-shell[data-view=map] .panel-footer{display:none}.app-shell[data-view=map] .session-tools{padding:0 15px 5px;font-size:9px;align-items:center}.app-shell[data-view=map] .session-tools button{font-size:10px}.navigation-card{padding:16px 16px 8px}.navigation-heading{display:flex;gap:10px;align-items:center}.navigation-symbol{font-size:27px;flex-shrink:0}.navigation-heading>div{flex:1;min-width:0}.navigation-heading .eyebrow{font-size:8px;letter-spacing:1.4px}.navigation-heading h2{font:22px/1.2 var(--serif);margin:4px 0}.navigation-heading>strong{font:23px/1 var(--serif);white-space:nowrap;color:var(--forest)}.navigation-card p{font-size:12px;line-height:1.6;margin:10px 0 7px;color:#68745f}.navigation-meta{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:10px;color:#7b8063}.navigation-meta button{background:none;border:0;text-decoration:underline;color:var(--forest);padding:4px 0;font-size:11px;min-height:30px}.app-shell[data-view=map] .connection-error,.app-shell[data-view=map] .gps-error,.app-shell[data-view=map] .feedback{margin:8px 12px;font-size:11px;padding:8px 10px}
.app-shell>.demo-tools{display:none;position:absolute;left:calc(100% + 24px);top:24px;width:300px;border:1px solid #ded6bf;border-radius:12px;max-height:calc(100% - 48px);overflow:auto;padding:20px;z-index:20}.demo-tools input{width:100%;border:1px solid #d8d1bb;border-radius:6px;background:#fffdf6}.demo-tools label{display:block;font-size:11px}.demo-tools .override-map-toggle{display:flex}.demo-tools .override-map-toggle input{width:16px}.demo-tools .secondary-button{min-height:40px}.demo-tools>span{font-size:10px}
@media(min-width:1025px){
  .quest-page.development-environment{--tour-width:min(var(--app-max-width),calc(100vw - 372px));--tour-left:max(24px,calc((100vw - 1348px)/2))}
  .app-shell>.demo-tools{display:block}
  .app-shell{border-left:1px solid #d2d8c7;border-right:1px solid #d2d8c7}
}
.arrival-overlay{left:var(--tour-left);right:auto;width:var(--tour-width);max-width:var(--app-max-width)}
@media(max-width:400px){.quest-panel .panel-body{padding:22px 20px}.navigation-heading h2{font-size:20px}.navigation-heading>strong{font-size:21px}.quest-panel .panel-body .question-title{font-size:23px}.quest-panel .rules{gap:10px}}
@keyframes quest-screen-enter{from{opacity:.6;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.screen-enter{animation:none}}
.app-shell[data-view=sheet] .map-section{visibility:visible}.app-shell[data-stage=welcome] .map-section{visibility:hidden}.app-shell[data-view=sheet] .quest-panel{animation:quest-panel-enter .4s ease-out both}.screen-enter{animation:none}@keyframes quest-panel-enter{from{transform:translateY(100%)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.app-shell[data-view=sheet] .quest-panel{animation:none}}

.family-info{font-size:13px;line-height:1.7;color:var(--sage);margin:0 0 22px}.tour-clock{display:inline-block;margin-left:8px;color:var(--forest);font-variant-numeric:tabular-nums;font-size:12px;font-weight:600}.records-card{border:1px solid #d9d9bd;background:#f1f1e5;border-radius:12px;padding:18px;margin-top:24px}.records-card>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #dde0cc;font-size:13px}.records-card strong{font:24px var(--serif);color:var(--forest);font-variant-numeric:tabular-nums}.records-card p{font-size:11px;line-height:1.6;color:var(--sage);margin:14px 0 0}.stat-card strong{font-variant-numeric:tabular-nums}
.age-pill{max-width:135px;white-space:normal;text-align:right;font-size:9px}.team-row{gap:12px}.navigation-heading>strong{font-size:21px}.navigation-card .session-tools{flex-wrap:wrap}

/* Large, high-contrast live markers remain readable over the illustration. */
.pin-body{height:52px;width:52px;border-width:4px;box-shadow:0 3px 12px #12362c66}.pin-body span{font:700 21px var(--sans)}.pin-body.done{height:32px;width:32px;margin:4px;border-width:3px}.pin-body.done span{font-size:16px}.target-label{font:600 14px/1.3 var(--sans)!important;padding:9px 13px!important;border:1px solid #d5dccb!important;box-shadow:0 3px 12px #153a3530!important;max-width:240px;white-space:normal!important;text-align:center}
#dev-layer-button{margin-top:14px}

#dev-skip-question{margin-top:14px;background:#f1e6c9;border-color:#d3bd7b;color:#675527}.photo-dialog{background:var(--paper);color:var(--forest);border:0;border-radius:16px;width:min(900px,calc(100% - 32px));max-width:none;max-height:94dvh;padding:24px;overflow:auto}.photo-dialog::backdrop{background:#0c241fdd;backdrop-filter:blur(5px)}.photo-header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}.photo-header h2{font:30px var(--serif);margin:6px 0 0}.photo-header>button{border:1px solid #d8ddcc;background:none;color:var(--forest);border-radius:50%;width:42px;height:42px;font-size:27px;flex-shrink:0}.photo-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;align-items:start}.photo-stage{position:relative;aspect-ratio:4/5;overflow:hidden;background:radial-gradient(ellipse,#526c48,#183e32);border-radius:10px;isolation:isolate}.photo-stage video,.photo-stage img,.photo-stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.photo-stage video.mirrored{transform:scaleX(-1)}.photo-stage canvas{pointer-events:none;z-index:3}.photo-stage img{z-index:4}#photo-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:#ead49b}#photo-placeholder>span{font:90px var(--serif)}#photo-placeholder p{font:25px/1.4 var(--serif)}.photo-controls>button,.photo-file-label,#photo-result-actions>button{margin:0 0 12px;min-height:48px}.photo-controls>p:first-child{font-size:13px;line-height:1.7}.photo-file-label{position:relative;cursor:pointer;display:flex;justify-content:center;align-items:center;font-size:13px}.photo-file-label input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.photo-file-label:focus-within{outline:3px solid var(--gold);outline-offset:3px}#photo-result-actions{border-top:1px solid #d9dfce;margin-top:8px;padding-top:20px}.photo-dialog .small-note{font-size:11px;line-height:1.7}
@media(max-width:1024px){.photo-dialog{position:fixed;inset:0;border-radius:0;width:100%;height:100dvh;max-height:none;margin:0;padding:20px 18px calc(20px + env(safe-area-inset-bottom))}.photo-header{margin-bottom:16px}.photo-header h2{font-size:25px}.photo-layout{display:block}.photo-stage{width:100%;max-width:460px;margin:auto}.photo-controls{padding-top:16px}.photo-controls>button,.photo-file-label,#photo-result-actions>button{width:100%}}
@media(min-width:1025px){.photo-stage{width:min(100%,calc((94dvh - 150px)*.8));justify-self:center}}

/* The original photograph and transparent frame remain separate layers. */
.photo-stage img{z-index:2}.photo-stage canvas{z-index:3}
/* Keepsake pages share one fluid column, independent of viewport breakpoints. */
.keepsake-page {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  height: auto;
  min-height: 100dvh;
  overflow: auto;
  background: var(--paper);
  color: var(--forest);
}
.keepsake-brand {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  padding: clamp(16px, 3vw, 24px);
  border-bottom: 1px solid #dfe2d3;
}
.keepsake-brand a { color: var(--forest); text-decoration: none; font: 18px var(--serif); }
.keepsake-brand strong { font-size: 25px; }
.keepsake-brand > span { font-size: 12px; color: var(--sage); }
.keepsake-content, .keepsake-landing {
  width: 100%;
  min-width: 0;
  max-width: 1024px;
  margin: 0 auto;
  padding: clamp(20px, 4vw, 36px) clamp(16px, 3vw, 32px) 0;
}
.keepsake-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  padding-bottom: 36px;
}
.keepsake-portrait {
  position: relative;
  width: 100%;
  max-width: 460px;
  min-width: 0;
  margin: 0 auto;
  aspect-ratio: 4 / 5;
  border-radius: 14px;
  overflow: hidden;
  background: #183e32;
  box-shadow: 0 12px 36px #153a3520;
}
.keepsake-portrait > img, .keepsake-portrait > canvas, .keepsake-no-script {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.keepsake-portrait > canvas { pointer-events: none; }
.keepsake-no-script { z-index: 2; }
.keepsake-story, .invitation-intro {
  width: 100%;
  max-width: 620px;
  min-width: 0;
  margin-inline: auto;
}
.keepsake-story h1 { font: clamp(28px, 4.5vw, 36px)/1.17 var(--serif); margin: 14px 0; }
.keepsake-story > p { font-size: 14px; line-height: 1.8; color: var(--sage); }
.keepsake-story .eyebrow { font-size: 8px; letter-spacing: 1.2px; }
.keepsake-story .keepsake-family { font-size: 12px; color: #8b723b; overflow-wrap: anywhere; }
.keepsake-sharing {
  min-width: 0;
  margin-top: 28px;
  padding: clamp(16px, 3vw, 24px);
  border: 1px solid #d6ddc8;
  border-radius: 14px;
  background: #e9eddc;
}
.keepsake-sharing h2 { font: clamp(24px, 3.5vw, 28px)/1.2 var(--serif); margin: 0 0 12px; }
.keepsake-sharing > p { font-size: 14px; line-height: 1.75; color: var(--sage); }
.keepsake-share-actions { display: grid; gap: 10px; width: 100%; max-width: 360px; margin: 24px auto 0; }
.keepsake-story button { min-height: 48px; white-space: normal; }
.keepsake-story .small-note { font-size: 11px; }
.keepsake-preview-link, .keepsake-back-link {
  display: inline-block;
  max-width: 100%;
  color: var(--forest);
  font-size: 12px;
  line-height: 1.6;
  margin-top: 18px;
  text-underline-offset: 4px;
  overflow-wrap: anywhere;
}
.keepsake-back-link { margin-top: 28px; }
#share-link-fallback { min-width: 0; }
#share-link-fallback label { display: block; font-size: 12px; margin: 12px 0 6px; }
#keepsake-link { width: 100%; min-width: 0; font-size: 16px; padding: 12px; border: 1px solid #cdd5bd; border-radius: 8px; }
.invitation-hero { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 40px); align-items: center; text-align: center; }
.invitation-family { width: 100%; max-width: 460px; min-width: 0; margin: 0 auto; }
.invitation-family figcaption { display: flex; flex-direction: column; gap: 8px; padding: 20px 8px 0; text-align: center; }
.invitation-family figcaption span { font-size: 8px; font-weight: 600; letter-spacing: 1.8px; color: #8b723b; }
.invitation-family figcaption strong { font: 22px var(--serif); overflow-wrap: anywhere; }
.invitation-family figcaption small { font-size: 11px; color: var(--sage); }
.invitation-intro .eyebrow { font-size: 8px; letter-spacing: 1.5px; }
.invitation-intro h1 { font: clamp(32px, 5.8vw, 52px)/1.1 var(--serif); letter-spacing: -.7px; margin: 18px 0; }
.invitation-intro > p { font-size: clamp(14px, 2vw, 16px); line-height: 1.8; color: var(--sage); }
.invitation-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 2vw, 24px); list-style: none; margin: 24px 0; padding: 0; }
.invitation-facts li { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.invitation-facts strong { font: clamp(18px, 3vw, 23px)/1.2 var(--serif); color: var(--forest); }
.invitation-facts span { font-size: clamp(9px, 1.5vw, 11px); color: var(--sage); }
.invitation-cta { display: flex; align-items: center; justify-content: center; gap: 16px; width: 100%; max-width: 360px; min-height: 52px; margin-inline: auto; text-decoration: none; white-space: normal; font-size: 14px; }
.invitation-plan-link { display: inline-block; margin-top: 18px; color: var(--sage); font-size: 12px; text-underline-offset: 4px; }
.invitation-visit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  align-items: center;
  gap: clamp(24px, 3vw, 36px);
  min-width: 0;
  margin-top: clamp(36px, 5vw, 52px);
  padding: clamp(20px, 3vw, 32px);
  scroll-margin-top: 24px;
  background: #213e35;
  color: #fff5df;
  border-radius: 18px;
}
.invitation-visit-copy { min-width: 0; }
.invitation-visit .eyebrow { font-size: 8px; letter-spacing: 1.4px; color: #d7bd7a; }
.invitation-visit h2, .invitation-finale h2 { font: clamp(28px, 3.5vw, 36px)/1.14 var(--serif); letter-spacing: -.5px; margin: 16px 0; }
.invitation-visit p { font-size: 14px; line-height: 1.85; color: #d6dfcb; }
.invitation-directions { display: flex; gap: 12px; align-items: center; justify-content: center; min-height: 48px; margin-top: 24px; text-decoration: none; color: #fff4d5; border-color: #819782; background: transparent; }
.invitation-map { position: relative; width: 100%; max-width: 420px; min-width: 0; margin: 0 auto; overflow: hidden; border-radius: 12px; aspect-ratio: 4 / 5; }
.invitation-map img { display: block; width: 100%; height: 100%; object-fit: cover; }
.invitation-map figcaption { position: absolute; inset: auto 0 0; padding: 32px 14px 16px; background: linear-gradient(transparent, #14372dec); color: #fff5df; font: 16px/1.4 var(--serif); text-align: center; }
.invitation-finale { width: 100%; max-width: 650px; margin: 0 auto; padding: clamp(36px, 5vw, 60px) 0; text-align: center; }
.invitation-finale > span { color: #b39452; font: 34px var(--serif); }
.invitation-finale p { font-size: 14px; line-height: 1.8; color: var(--sage); }
.invitation-finale .invitation-cta { margin-top: 24px; }
@media (max-width: 600px) { .keepsake-brand > span { display: none; } }

/* Fireflies move geographically in the browser; their sparkles use CSS. */
.map-top{gap:8px}.firefly-result{margin:24px 0 16px;padding:24px 18px;border-radius:16px;background:radial-gradient(ellipse at top,#496849,#173c30);color:#fff1b7;text-align:center}.firefly-result>span{display:block;font-size:10px;letter-spacing:1.5px}.firefly-result>span:first-child{font-size:30px;color:#ffe78a;text-shadow:0 0 18px #ffeb90}.firefly-result>strong{display:block;font:64px/1.2 var(--serif);font-variant-numeric:tabular-nums}.firefly-result p{font-size:11px;line-height:1.7;margin:14px 0 0;color:#e7e9c9}.arrival-firefly-bonus{position:relative;z-index:4;margin:12px auto 0;color:#ffe694;font:17px/1.5 var(--serif);text-shadow:0 0 16px #dcb63c}
.firefly-overlay{position:fixed;inset:0 auto 0 var(--tour-left);width:var(--tour-width);max-width:1024px;height:100dvh;max-height:none;margin:0;padding:0;border:0;overflow:hidden;color:#fff3ce;background:radial-gradient(ellipse at 50% 35%,#52724c,#183e32 50%,#0c251f)}.firefly-overlay[open]{display:grid;place-items:center}.firefly-overlay::backdrop{background:#0a211dcf;backdrop-filter:blur(5px)}.firefly-effect-content{width:min(520px,calc(100% - 40px));max-height:calc(100dvh - 32px);overflow:auto;text-align:center;padding:20px 4px}.firefly-effect-content>.eyebrow{font-size:9px;line-height:1.8;color:#e6cf87;letter-spacing:2px}.firefly-effect-content h2{font:clamp(27px,5vw,37px)/1.15 var(--serif);margin:14px 0}.firefly-effect-content>p{max-width:360px;margin:0 auto;color:#dfebcb;font-size:14px;line-height:1.8}.firefly-effect-content>strong{display:block;margin:20px 0;color:#ffe8a0;font:26px var(--serif)}.firefly-effect-controls{display:flex;justify-content:center;gap:12px;align-items:center;margin-top:24px}.firefly-effect-controls button{min-height:44px;color:#fff0bb;border:1px solid #ccbd7980;background:#192f2433;border-radius:24px;padding:10px 22px;font-size:12px}.firefly-effect-controls #firefly-speaker{width:44px;padding:8px;font-size:20px}.firefly-effect-controls #firefly-speaker[aria-pressed=true]{background:#b8983233}.firefly-effect-progress{height:3px;width:150px;overflow:hidden;border-radius:3px;background:#e5d18530;margin:22px auto 0}.firefly-effect-progress:after{content:'';display:block;width:100%;height:100%;background:#e5d185;transform-origin:left;animation:arrival-duration var(--firefly-duration,6s) linear forwards}
@media(max-width:400px){.map-top .gps-badge{font-size:9px;padding:8px 9px}.map-top .north-arrow{display:none}}
#firefly-speaker svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.quest-firefly-score{color:#82651f;font-size:11px;letter-spacing:0}.quest-firefly-score b{font-variant-numeric:tabular-nums;font-size:13px}

/* A bright core, a cross-shaped glint and fading dust replace the insect icon. */
.map-firefly { background: none; border: 0; pointer-events: none; }
.firefly-sprite { display: block; position: relative; width: 34px; height: 34px; filter: drop-shadow(0 0 5px #ffde68); }
.firefly-sprite > i { position: absolute; left: 14px; top: 14px; width: 7px; height: 7px; border-radius: 50%; background: #fffef1; box-shadow: 0 0 3px 2px #fff3a9, 0 0 10px 5px #ffd863aa, 0 0 22px 9px #f6d45c44; animation: spark-heart 1.4s var(--flight-phase,0s) ease-in-out infinite alternate; }
.firefly-sprite:before, .firefly-sprite:after { content: ''; position: absolute; background: linear-gradient(transparent,#fff8ce,transparent); top: 5px; left: 16px; width: 2px; height: 25px; animation: spark-glint 2.1s var(--flight-phase,0s) ease-in-out infinite; }
.firefly-sprite:after { transform: rotate(90deg); }
.firefly-sprite > b { position: absolute; left: 7px; top: 22px; width: 3px; height: 3px; background: #fff1ad; box-shadow: 0 0 5px #ffe58b; border-radius: 50%; animation: spark-dust 1.6s var(--flight-phase,0s) ease-out infinite; }
.firefly-sprite > b:nth-of-type(2) { left: 25px; top: 9px; animation-delay: calc(var(--flight-phase,0s) - .4s); }
.firefly-sprite > b:nth-of-type(3) { left: 3px; top: 10px; animation-delay: calc(var(--flight-phase,0s) - .8s); }
.firefly-sprite > b:nth-of-type(4) { left: 24px; top: 28px; animation-delay: calc(var(--flight-phase,0s) - 1.2s); }
@keyframes spark-heart { to { transform: scale(.65); opacity: .7; } }
@keyframes spark-glint { 0%,100% { opacity: .3; scale: .65; } 45% { opacity: 1; scale: 1; } }
@keyframes spark-dust { 0% { opacity: 0; transform: scale(.3); } 25% { opacity: 1; } 100% { opacity: 0; transform: translate(-7px,9px) scale(.2); } }

#firefly-effect-art { height: 320px; position: relative; isolation: isolate; --change-at: 2.5s; }
.firefly-aura { position: absolute; inset: 30px -20px -30px; border-radius: 50%; background: radial-gradient(ellipse,#ebd46b30,transparent 65%); animation: jar-aura 5s ease-out both; }
.firefly-jar { position: absolute; top: 108px; left: 50%; width: 190px; height: 202px; transform: translateX(-50%); border: 2px solid #f7e9b8a6; border-top: 0; border-radius: 22px 22px 44px 44px; background: linear-gradient(100deg,#faffdd24,transparent 25%,transparent 70%,#efffdb1f),radial-gradient(ellipse at 50% 80%,#d2d88215,transparent 70%); box-shadow: inset 0 -5px 15px #c7e3c21c,inset 7px 0 8px #f4ffd51a,0 10px 35px #071f1c66; }
.firefly-jar:before { content: ''; position: absolute; left: 17px; right: 17px; top: -13px; height: 22px; border: 2px solid #fff2bfaa; border-radius: 50%; background: #abcab222; box-shadow: 0 -4px 0 -2px #f3e9b16b,0 4px 0 -1px #efffc829; }
.firefly-jar:after { content: ''; position: absolute; left: 15px; top: 28px; bottom: 36px; width: 7px; border-radius: 100%; background: linear-gradient(#fff9d854,transparent); transform: rotate(3deg); }
.jar-lights { position: absolute; inset: 10px 5px 12px; overflow: hidden; border-radius: 24px 24px 34px 34px; pointer-events: none; }
.jar-flight { position: absolute; inset: 18px; animation: jar-flight var(--flight-time) var(--flight-delay) cubic-bezier(.45,0,.55,1) infinite; }
.jar-light { position: absolute; left: -4.5px; top: -4.5px; width: 9px; height: 9px; border-radius: 50%; background: #fffde1; box-shadow: 0 0 6px 2px #ffe282dd,0 0 18px #ffd656aa; animation: jar-twinkle var(--twinkle) var(--delay) ease-in-out infinite alternate; }
.jar-light:after { content: ''; position: absolute; inset: -5px 4px; background: #fff8d1cc; }
.jar-light.incoming { animation: jar-enter .5s var(--change-at,2.5s) both,jar-twinkle var(--twinkle) calc(var(--change-at,2.5s) + .5s) ease-in-out infinite alternate; }
.jar-light.outgoing { animation: jar-leave .2s var(--change-at,1.3s) both; }
.firefly-effect-insect { position: absolute; left: calc(50% - 17px); top: 95px; z-index: 2; animation: spark-caught 3s cubic-bezier(.3,.1,.25,1) both; }
.firefly-effect-insect .firefly-sprite { filter: drop-shadow(0 0 14px #ffe984); }
.firefly-effect-burst { position: absolute; top: 160px; left: 50%; z-index: 3; pointer-events: none; }
.firefly-effect-burst i { position: absolute; font: 13px/1 var(--serif); color: #fff0a6; text-shadow: 0 0 10px #ffe36d; animation: jar-burst 1.4s calc(var(--change-at,2.5s) + var(--spark-delay)) ease-out both; }
.jar-delta { position: absolute; top: 92px; right: calc(50% - 125px); z-index: 4; color: #fff0ab; font: 32px/1 var(--serif); text-shadow: 0 0 15px #f5ce57; animation: jar-delta 2s var(--change-at,2.5s) both; }
.firefly-overlay[data-kind=escape] #firefly-effect-art { --change-at: 1.3s; }
.firefly-overlay[data-kind=escape] .firefly-effect-insect { animation: spark-escaped 3s ease-in both; }
.firefly-overlay[data-kind=escape] .firefly-effect-burst { top: 110px; }
.firefly-overlay[data-kind=escape] .firefly-effect-burst i { color: #d5e9c6; }
.firefly-overlay[data-kind=escape] .jar-delta { color: #e4dfce; }
.arrival-firefly-bonus { display: flex; align-items: center; justify-content: center; gap: 8px; text-align: left; margin: 0 auto -12px; --change-at: 2.5s; }
.arrival-bonus-pot { width: 105px; height: 125px; position: relative; flex-shrink: 0; text-align: center; }
.arrival-bonus-pot .firefly-jar { top: 20px; transform: translateX(-50%) scale(.47); transform-origin: top center; }
.arrival-firefly-bonus small, .arrival-firefly-bonus strong { display: block; }
.arrival-firefly-bonus small { font: 11px/1.8 var(--sans); color: #d3ddbc; }
.arrival-firefly-bonus strong { font: 12px/1.8 var(--sans); color: #fff1ba; }
@keyframes spark-caught { 0% { opacity: 0; transform: translate(-115px,-30px) scale(.5); } 12% { opacity: 1; } 30% { transform: translate(80px,-65px) scale(1.5); } 50% { transform: translate(-45px,-85px) scale(1.8); } 68% { transform: translate(0,-42px) scale(1.4); opacity: 1; } 84% { transform: translate(0,65px) scale(.35); opacity: 1; } 100% { transform: translate(0,75px) scale(.2); opacity: 0; } }
@keyframes spark-escaped { 0% { opacity: 0; transform: translate(0,75px) scale(.3); } 15% { opacity: 1; } 43% { transform: translate(0,-10px) scale(1.1); } 70% { transform: translate(75px,-70px) scale(1.4); opacity: 1; } 100% { transform: translate(-65px,-120px) scale(.15); opacity: 0; } }
@keyframes jar-twinkle { from { opacity: .45; transform: translate(-3px,3px) scale(.7); } to { opacity: 1; transform: translate(4px,-4px) scale(1.15); } }
@keyframes jar-flight {
  0%,100% { transform: translate(var(--x0),var(--y0)); }
  16.67% { transform: translate(var(--x1),var(--y1)); }
  33.33% { transform: translate(var(--x2),var(--y2)); }
  50% { transform: translate(var(--x3),var(--y3)); }
  66.67% { transform: translate(var(--x4),var(--y4)); }
  83.33% { transform: translate(var(--x5),var(--y5)); }
}
@keyframes jar-enter { from { opacity: 0; scale: .1; } to { opacity: 1; scale: 1; } }
@keyframes jar-leave { from { opacity: 1; } to { opacity: 0; } }
@keyframes jar-delta { 0% { opacity: 0; transform: translateY(12px) scale(.7); } 25%,65% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-26px); } }
@keyframes jar-burst { 0% { opacity: 0; transform: rotate(var(--angle)) translateX(15px) scale(.2); } 20% { opacity: 1; } 100% { opacity: 0; transform: rotate(var(--angle)) translateX(var(--reach)) scale(.15); } }
@keyframes jar-aura { 0% { opacity: .2; scale: .8; } 60% { opacity: 1; scale: 1.2; } 100% { opacity: .65; scale: 1; } }
@media (max-height: 720px) { #firefly-effect-art { height: 320px; scale: .84; margin-block: -22px 0; } .firefly-effect-content h2 { font-size: 27px; } .firefly-effect-content > strong { margin: 12px 0; font-size: 22px; } .firefly-effect-controls { margin-top: 12px; } .arrival-firefly-bonus { margin-bottom: -24px; } }
@media (prefers-reduced-motion: reduce) {
  .firefly-sprite > *, .firefly-sprite:before, .firefly-sprite:after, .firefly-effect-insect, .firefly-aura, .firefly-effect-burst i, .jar-delta, .jar-light, .jar-flight, .firefly-effect-progress:after { animation: none !important; }
  .jar-flight { transform: translate(var(--x0),var(--y0)); }
  .jar-light.outgoing, .firefly-effect-insect, .firefly-effect-burst, .jar-delta { display: none; }
}

/* A tap opens the collection; the score sits inside the glass silhouette. */
.map-top { align-items: flex-start; }
.map-firefly-score { position: relative; flex: 0 0 56px; width: 56px; height: 66px; padding: 0; border: 0; border-radius: 15px; background: #15382ff2; color: #fff1b7; box-shadow: 0 3px 14px #132d2666; pointer-events: auto; }
.map-firefly-score svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #eddb9c; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.map-firefly-score .jar-icon-glass { fill: #e8f6c413; }
.map-firefly-score .jar-icon-spark { fill: #ffe898; stroke-width: .5; }
.map-firefly-score b { position: absolute; left: 0; right: 0; top: 30px; text-align: center; font: bold 22px/1 var(--serif); font-variant-numeric: tabular-nums; text-shadow: 0 0 10px #dabc5166; }
.map-firefly-score:hover { background: #2c5140; }
.map-firefly-score:active { transform: scale(.96); }
/* A dark halo keeps the bright sparks visible over the illustrated paths. */
.map-firefly:before { content: ''; position: absolute; inset: -7px; border-radius: 50%; background: radial-gradient(circle,#173d32b3 0 22%,#173d3266 42%,transparent 72%); }
.map-firefly .firefly-sprite { transform: scale(1.35); filter: drop-shadow(0 1px 2px #17382b) drop-shadow(0 0 5px #ffd454); }
.map-firefly .firefly-sprite > i { width: 10px; height: 10px; left: 12px; top: 12px; box-shadow: 0 0 0 1px #8a6f21,0 0 5px 2px #fff1a6,0 0 13px 5px #ffd764aa; }
.map-firefly .firefly-sprite:before,.map-firefly .firefly-sprite:after { width: 3px; height: 29px; left: 15.5px; top: 2.5px; }
.jar-light:before { content: ''; position: absolute; inset: 4px -5px; background: #fff8d1cc; }
.firefly-overlay[data-kind=collection] #firefly-effect-art { height: 350px; --change-at: 0s; }
.firefly-overlay[data-kind=collection] .firefly-jar { top: 55px; width: 230px; height: 265px; }
.firefly-overlay[data-kind=collection] .firefly-aura { animation: none; }
.firefly-overlay[data-kind=collection] #firefly-speaker,.firefly-overlay[data-kind=collection] .firefly-effect-progress { display: none; }
@media(max-width:400px) { .map-firefly-score { flex-basis: 52px; width: 52px; height: 62px; } .map-firefly-score b { top: 28px; font-size: 21px; } }

@media (max-width:1024px) { .map-actions { top: 92px; } }

/* Collection, captures and correct answers share the same drop-down sheet. */
.firefly-overlay:is([data-kind=collection],[data-kind=catch]),
.arrival-overlay:is([data-kind=next],[data-kind=completed]) {
  inset: 0 auto auto var(--tour-left);
  height: auto;
  max-height: calc(100dvh - 38px);
  border-radius: 0 0 26px 26px;
  box-shadow: 0 18px 50px #071e2566;
  animation: collection-sheet-in 520ms cubic-bezier(.16,1,.3,1) both;
}
.firefly-overlay:is([data-kind=collection],[data-kind=catch]) .firefly-effect-content { max-height: calc(100dvh - 62px); padding-block: 24px; }
.arrival-overlay:is([data-kind=next],[data-kind=completed]) { overflow: hidden; }
.arrival-overlay:is([data-kind=next],[data-kind=completed]) .arrival-fullscreen-content { min-height: 0; max-height: calc(100dvh - 86px); overflow: auto; justify-content: flex-start; }
.firefly-overlay[data-kind=collection] #firefly-effect-art { height: 305px; }
.firefly-overlay[data-kind=collection] .firefly-jar { top: 28px; height: 255px; }
.firefly-overlay:is([data-kind=collection],[data-kind=catch])::backdrop,
.arrival-overlay:is([data-kind=next],[data-kind=completed])::backdrop { background: #0a211dcf; backdrop-filter: blur(5px); animation: collection-backdrop-in 400ms ease-out both; }
.firefly-overlay:is([data-kind=collection],[data-kind=catch])[data-motion=closing],
.arrival-overlay:is([data-kind=next],[data-kind=completed])[data-motion=closing] { animation: collection-sheet-out 400ms cubic-bezier(.4,0,.8,.2) both; }
.firefly-overlay:is([data-kind=collection],[data-kind=catch])[data-motion=closing]::backdrop,
.arrival-overlay:is([data-kind=next],[data-kind=completed])[data-motion=closing]::backdrop { animation: collection-backdrop-out 400ms ease-in both; }
@keyframes collection-sheet-in { from { transform: translateY(-105%); } to { transform: translateY(0); } }
@keyframes collection-sheet-out { from { transform: translateY(0); } to { transform: translateY(-105%); } }
@keyframes collection-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes collection-backdrop-out { from { opacity: 1; } to { opacity: 0; } }
@media (max-height:720px) {
  .firefly-overlay[data-kind=collection] #firefly-effect-art { height: 255px; margin-block: -12px 0; }
  .firefly-overlay[data-kind=collection] .firefly-jar { top: 22px; height: 240px; }
  .firefly-overlay[data-kind=collection] .firefly-effect-content > p { font-size: 12px; }
  .arrival-overlay:is([data-kind=next],[data-kind=completed]) .guardian-scene { height: 180px; }
  .arrival-overlay:is([data-kind=next],[data-kind=completed]) .guardian-emblem { width: 128px; height: 128px; font-size: 72px; }
  .arrival-overlay:is([data-kind=next],[data-kind=completed]) .guardian-orbit { width: 180px; height: 180px; }
  .arrival-overlay:is([data-kind=next],[data-kind=completed]) .guardian-reveal { margin-block: 12px; }
}
@media (prefers-reduced-motion:reduce) {
  .firefly-overlay:is([data-kind=collection],[data-kind=catch]),.firefly-overlay:is([data-kind=collection],[data-kind=catch])::backdrop,
  .arrival-overlay:is([data-kind=next],[data-kind=completed]),.arrival-overlay:is([data-kind=next],[data-kind=completed])::backdrop { animation: none !important; }
}

/* The page shows through the generated scroll's transparent outer edges. */
#map.fantasy-map,.map-frame.fantasy-frame { background: transparent; }

/* Map proportions belong to the trail; the theme supplies its paper. */
.scroll-map { width: 100%; }
.scroll-map img { display: block; width: 100%; height: auto; border-radius: 0; }
.invitation-map { aspect-ratio: auto; }

/* Arrival opens a dedicated full-screen setup sheet over the map. */
.app-shell[data-stage=group_setup] .quest-panel { animation: group-setup-enter .5s cubic-bezier(.16,1,.3,1) both; }
.group-setup { position: relative; width: 100%; max-width: 570px; margin-inline: auto; }
.group-setup-emblem { position: absolute; top: 26px; right: 24px; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; border: 1px solid #d8c488; color: #94712e; background: radial-gradient(circle,#fff5d2,#efe4c4); font: 30px/1 var(--serif); }
.group-setup h2 { margin-top: 12px; padding-right: 64px; }
.group-setup h2:focus { outline: none; }
.group-setup-facts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; color: #6e785d; font-size: 11px; }
.group-setup-facts span { padding: 6px 10px; border: 1px solid #dfe2cf; border-radius: 20px; }
.group-setup .form-field { margin-bottom: 22px; }
.group-setup .form-field > label { font-size: 14px; }
.group-setup input[name=group_name] { padding: 15px; background: #fffdf7; }
.group-setup .group-setup-note { margin-top: 18px; }
@keyframes group-setup-enter { from { transform: translateY(100%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion:reduce) { .app-shell[data-stage=group_setup] .quest-panel { animation: none; } }

.adventure-rules { margin: 24px 0; padding: 18px; border: 1px solid #dce1ce; border-radius: 12px; background: #f0f2e7; color: #586c4f; }
.adventure-rules h3 { margin: 0 0 12px; font: 20px/1.3 var(--serif); color: var(--forest); }
.adventure-rules ul { margin: 0; padding-left: 20px; }
.adventure-rules li { padding-left: 3px; margin: 0 0 10px; font-size: 14px; line-height: 1.7; }
.adventure-rules li:last-child { margin-bottom: 0; }

/* Quiet corner controls keep the adventure itself in focus. */
.arrival-overlay .animation-sound-toggle,.firefly-overlay .animation-sound-toggle { position: absolute; z-index: 5; top: 6px; left: 6px; display: grid; place-items: center; width: 44px; height: 44px; padding: 12px; border: 0; border-radius: 50%; background: transparent; color: #d8dfc2; opacity: .65; }
.arrival-overlay .animation-sound-toggle svg,.firefly-overlay .animation-sound-toggle svg { width: 18px; height: 18px; }
.arrival-overlay .animation-sound-toggle:hover,.firefly-overlay .animation-sound-toggle:hover,.arrival-overlay .animation-sound-toggle:focus-visible,.firefly-overlay .animation-sound-toggle:focus-visible { opacity: 1; background: #ffffff0c; }
.arrival-overlay .animation-sound-toggle[aria-pressed=true],.firefly-overlay .animation-sound-toggle[aria-pressed=true] { background: transparent; }
.arrival-overlay { padding-top: 44px; }
.arrival-overlay:is([data-kind=next],[data-kind=completed]) .arrival-fullscreen-content { max-height: calc(100dvh - 106px); }
.firefly-overlay[data-kind=catch] .firefly-effect-content,.firefly-overlay[data-kind=escape] .firefly-effect-content { padding-top: 44px; max-height: calc(100dvh - 62px); }
.firefly-overlay[data-kind=collection] .animation-sound-toggle { display: none; }

/* The platform directory is deliberately separate from an individual game. */
.catalog-page { background: #f6f4ed; }
.catalog-header { max-width: 1200px; margin: auto; padding: 26px 28px; display: flex; justify-content: space-between; align-items: center; gap: 20px; border-bottom: 1px solid #dce0d2; }
.catalog-header a { font: 25px Georgia,serif; text-decoration: none; }.catalog-header span { color: #687e6d; font-size: 12px; }
.catalog-main { max-width: 1200px; margin: auto; padding: 64px 28px 28px; }.catalog-intro { max-width: 700px; margin-bottom: 48px; }.catalog-intro h1 { font: clamp(36px,6vw,64px)/1.08 Georgia,serif; margin: 16px 0 22px; }.catalog-intro p { color: #687e6d; font-size: 17px; line-height: 1.8; max-width: 610px; }
.catalog-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,310px),1fr)); gap: 28px; }.catalog-card { max-width: 550px; overflow: hidden; border: 1px solid #dce0d2; border-radius: 22px; background: #fffef9; }.catalog-card>a { display: block; text-decoration: none; height: 100%; }.catalog-map { height: 280px; background: radial-gradient(ellipse,#e5e7d7,#eff0e5); padding: 12px; }.catalog-map img { width: 100%; height: 100%; object-fit: contain; }.catalog-card-body { padding: 28px; }.catalog-card h2 { font: 31px/1.2 Georgia,serif; margin: 12px 0; }.catalog-card p { color: #687e6d; line-height: 1.8; }.catalog-facts { display: flex; gap: 12px; flex-wrap: wrap; margin: 22px 0; font-size: 12px; color: #526c47; }.catalog-facts span { padding: 6px 10px; border-radius: 20px; background: #f0f3e7; }.catalog-card strong { color: #213e35; font-size: 14px; }.catalog-card:hover { box-shadow: 0 10px 36px #213e3512; }.catalog-footer { max-width: 650px; padding: 40px 0 12px; font-size: 12px; line-height: 1.8; color: #81877c; }
@media(max-width:600px) { .catalog-header { padding: 20px; }.catalog-header span { display: none; }.catalog-main { padding: 40px 20px 20px; }.catalog-map { height: 240px; } }
.collection-token { display: grid; width: 34px; height: 34px; place-items: center; font-size: 26px; filter: drop-shadow(0 0 6px #ffe98c); animation: spark-heart 1.6s ease-in-out infinite alternate; }
body[data-collectible-kind=token] .jar-light { background: none; box-shadow: none; }
body[data-collectible-kind=token] .jar-light:before { content: var(--collectible-symbol); inset: -5px; font: 17px/1 sans-serif; background: none; filter: drop-shadow(0 0 4px #ffe98c); }
body[data-collectible-kind=token] .jar-light:after { display: none; }
body[data-container-style=satchel] .firefly-jar { border-radius: 45% 45% 30% 30%; background: linear-gradient(110deg,#7a582a99,#b28a4d66,#6c4a2799); }
body[data-container-style=chest] .firefly-jar { border-radius: 25px 25px 8px 8px; background: linear-gradient(110deg,#97652a66,#d6ac5355,#704b2566); }
body[data-container-style=shell] .firefly-jar { border-radius: 48% 48% 38% 38%; background: repeating-conic-gradient(from 140deg at 50% 100%,#e8d7bc33 0 10deg,#f8eddc55 10deg 20deg); }
body[data-container-style=chest] .firefly-jar:before,body[data-container-style=shell] .firefly-jar:before { display: none; }
select { width: 100%; font: inherit; color: var(--ink); background: #fffef9; border: 1px solid #dce0d2; border-radius: 8px; padding: 12px; }
.catalog-pagination { display: flex; gap: 24px; margin-top: 28px; }.catalog-pagination a { color: var(--forest); font-weight: 600; text-underline-offset: 5px; }
body:is([data-container-style=satchel],[data-container-style=chest],[data-container-style=shell]) .map-firefly-score svg { display: none; }
body:is([data-container-style=satchel],[data-container-style=chest],[data-container-style=shell]) .map-firefly-score:before { display: block; position: absolute; top: 4px; left: 0; right: 0; font: 29px/1 sans-serif; content: '👝'; }
body[data-container-style=chest] .map-firefly-score:before { content: '🧰'; }
body[data-container-style=shell] .map-firefly-score:before { content: '🐚'; }
.brand { min-width: 0; }.brand-emblem { flex-shrink: 0; }.brand>span:last-child { min-width: 0; }
@media(max-width:600px) { .brand b { font-size: 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; } }

/* App-owned theme components. Trail documents contain no CSS or visual overrides. */
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) {
  --deep: color-mix(in srgb,var(--forest),black 28%);
  --sage: color-mix(in srgb,var(--forest),#fff 27%);
  --ink: color-mix(in srgb,var(--forest),#17202a 35%);
  --muted: color-mix(in srgb,var(--forest),#fff 30%);
  --ochre: var(--gold);
  --paper: #f6f7fb;
  --cream: #edf0f6;
  --line: #dce2eb;
}
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.firefly-overlay,.arrival-overlay,.firefly-result) {
  background: radial-gradient(ellipse at 50% 25%,color-mix(in srgb,var(--forest),white 18%),var(--forest) 55%,var(--deep));
}
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.guardian-emblem,.invitation-visit,.map-firefly-score) { background: var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.progress-header,.adventure-rules,.arrival-card,.group-setup-emblem) { background: var(--cream); color: var(--ink); border-color: var(--line); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.body-copy,.panel-topline,.small-note,.progress-detail,.question-meta,.invitation-facts,.invitation-intro) { color: var(--sage); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .primary-button:hover { background: var(--deep); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .answer-option.selected { border-color: var(--forest); background: var(--cream); color: var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .firefly-jar { border-color: var(--gold); background: linear-gradient(110deg,#ffffff33,#ffffff0d); }
body[data-container-style=trophy] .firefly-jar { border-width: 4px; border-radius: 12px 12px 70px 70px; }
body[data-container-style=trophy] .firefly-jar:before { inset: 28px -30px auto; height: 90px; border: 5px solid var(--gold); border-radius: 15px 15px 50% 50%; background: none; z-index: -1; }
body[data-container-style=trophy] .firefly-jar:after { inset: auto 65px -34px; height: 32px; width: auto; border-bottom: 7px solid var(--gold); border-radius: 0; background: var(--gold); transform: none; }
body[data-container-style=badge] .firefly-jar { border: 4px solid var(--gold); border-radius: 20px 20px 65px 65px; }
body[data-container-style=badge] .firefly-jar:before { inset: 8px; height: auto; border: 1px solid var(--gold); border-radius: 12px 12px 56px 56px; background: none; }
body[data-container-style=badge] .firefly-jar:after { display: none; }
body:is([data-container-style=trophy],[data-container-style=badge]) .map-firefly-score svg { visibility: hidden; }
body:is([data-container-style=trophy],[data-container-style=badge]) .map-firefly-score:before { content: var(--container-symbol); position: absolute; inset: 0; font-size: 44px; line-height: 1.3; text-align: center; opacity: .75; }
body:is([data-container-style=trophy],[data-container-style=badge]) .map-firefly-score b { top: 35px; font-family: var(--sans); text-shadow: 0 1px 5px #000; }
body[data-quest-theme=sports] :is(.group-setup-emblem,.guardian-emblem) { border-radius: 16px; border: 3px solid var(--gold); }
body[data-quest-theme=rescue] :is(.group-setup-emblem,.guardian-emblem) { border-radius: 18px 18px 45% 45%; border: 3px solid var(--gold); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.stat-card,.records-card,.keepsake-share-card) { background: var(--cream); border-color: var(--line); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) :is(.stat-card strong,.stat-card span) { color: var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .progress-segment.done { background: var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .progress-segment.current { background: var(--gold); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .answer-option[aria-pressed=true] { border-color: var(--forest); background: var(--cream); box-shadow: 0 0 0 1px var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .answer-option[aria-pressed=true] .answer-letter { background: var(--forest); border-color: var(--forest); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .panel-body .guardian-reveal { background: var(--cream); border-color: var(--line); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .panel-body .guardian-scene { background: radial-gradient(ellipse at center,color-mix(in srgb,var(--gold),transparent 70%),transparent 70%),linear-gradient(140deg,var(--forest),var(--deep)); }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .guardian-scene:before,body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .guardian-scene:after { display: none; }
body[data-quest-theme]:not([data-quest-theme=fairy_tale]) .panel-body .guardian-caption>span:last-child { color: var(--sage); }

/* Management has its own responsive layout, independent of trail UI themes. */
.admin-page { --forest:#203e36; --ink:#243c36; --sage:#61786f; background:#f4f6f3; color:var(--ink); font:14px/1.6 var(--sans); }
.admin-skip { position:absolute; left:20px; top:-80px; z-index:3; background:white; padding:12px; }.admin-skip:focus { top:8px; }
.admin-header { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px; padding:22px max(24px,calc((100vw - 1280px)/2)); border-bottom:1px solid #dfe6df; background:#fffef9; }
.admin-brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-size:21px; font-weight:750; }.admin-brand>span { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:#f1d79d; background:var(--forest); }.admin-brand small { font:9px var(--sans); letter-spacing:1.8px; color:var(--sage); padding-left:8px; }
.admin-header nav { display:flex; flex-wrap:wrap; gap:22px; font-size:12px; }.admin-header nav a { text-decoration:none; }.admin-header nav a[aria-current=page] { font-weight:700; border-bottom:2px solid #b48b43; }
.admin-main { max-width:1328px; margin:auto; padding:44px 24px; }.admin-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 0 30px; }.admin-heading>div { min-width:0; }.admin-heading h1 { font:700 clamp(29px,4vw,40px)/1.15 var(--sans); margin:10px 0 12px; overflow-wrap:anywhere; }.admin-heading p { max-width:720px; color:var(--sage); margin:0; }.admin-eyebrow { font-size:9px; font-weight:750; letter-spacing:1.8px; color:var(--sage); }.admin-badge { border:1px solid #d5dfd5; padding:8px 14px; border-radius:25px; white-space:nowrap; font-size:12px; background:#fffef9; }
.admin-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:32px; }.admin-metrics article { padding:24px; background:#fffefb; border:1px solid #e0e6dd; border-radius:16px; }.admin-metrics article>span { display:block; color:var(--sage); font-size:12px; }.admin-metrics strong { display:block; font-size:clamp(25px,3vw,36px); line-height:1.4; letter-spacing:-1px; margin:8px 0; }.admin-metrics small { color:var(--sage); font-size:11px; letter-spacing:0; }.admin-metrics strong small { font-size:18px; }
.admin-section { background:#fffefb; border:1px solid #e0e6dd; border-radius:18px; padding:28px; margin-bottom:26px; min-width:0; }.admin-section h2,.admin-section-heading h2 { font:700 20px/1.4 var(--sans); margin:0 0 4px; }.admin-section-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:22px; }.admin-section-heading p,.admin-section-heading>span { font-size:12px; color:var(--sage); margin:4px 0 0; max-width:720px; }
.admin-chart { display:flex; align-items:flex-end; gap:clamp(4px,1.7vw,24px); padding-top:8px; }.admin-chart>div { flex:1; min-width:0; text-align:center; font-size:11px; color:var(--sage); }.admin-chart-track { display:flex; align-items:flex-end; height:94px; border-bottom:1px solid #dfe6df; margin:5px 0; }.admin-chart-track i { display:block; width:100%; min-height:2px; max-width:44px; margin:auto auto 0; border-radius:5px 5px 0 0; background:#608c72; }.admin-chart small { font-size:10px; white-space:nowrap; }
.admin-filters { display:flex; gap:14px; align-items:flex-end; margin:22px 0; }.admin-filters>div:first-of-type { flex:1; }.admin-filters label,.admin-version-filter label { display:block; font-size:11px; font-weight:650; margin-bottom:6px; }.admin-filters input[type=search],.admin-filters select,.admin-version-filter select { background:white; border:1px solid #d3ddd3; border-radius:9px; padding:11px 12px; font:14px var(--sans); min-height:44px; width:100%; color:var(--ink); }.admin-button { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:11px 18px; border:1px solid var(--forest); border-radius:9px; background:var(--forest); color:#fffdf2; text-decoration:none; white-space:nowrap; font:600 12px var(--sans); cursor:pointer; }.admin-button:hover { background:#31574b; }
.admin-table-wrap { overflow-x:auto; }.admin-table { width:100%; border-collapse:collapse; text-align:left; font-size:13px; }.admin-table th { color:var(--sage); font-size:10px; letter-spacing:.3px; font-weight:650; white-space:nowrap; padding:10px 14px; background:#f5f7f2; }.admin-table td { padding:17px 14px; border-bottom:1px solid #e8ece3; vertical-align:middle; }.admin-table tr:last-child td { border:0; }.admin-table td small { display:block; font-size:10px; color:var(--sage); margin-top:4px; }.admin-table td a { text-underline-offset:4px; }.admin-title-link { font-weight:650; text-decoration:none; }.admin-table .admin-question-cell { min-width:220px; max-width:540px; }.admin-status { display:inline-block; font-size:10px; white-space:nowrap; border-radius:20px; background:#edf0ed; color:#626e65; padding:5px 10px; }.admin-status.is-live { background:#e6f1e6; color:#2f6b45; }
.admin-empty { color:var(--sage); padding:30px 12px; text-align:center; font-size:13px; }.admin-pagination { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:24px; margin:24px 0 4px; font-size:12px; }.admin-pagination a { text-underline-offset:4px; }.admin-back { display:inline-block; margin:0 0 26px; font-size:12px; text-decoration:none; }.admin-version-filter { display:flex; align-items:center; gap:10px; }.admin-version-filter select { width:auto; max-width:270px; }.admin-version-filter label { margin:0; }
.admin-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:22px 0 0; }.admin-details dt { color:var(--sage); font-size:11px; }.admin-details dd { margin:6px 0 0; font-weight:600; font-size:13px; }.admin-note { padding:16px; margin:24px 0 0; background:#f5f3e8; border-radius:10px; font-size:12px; color:#726744; }.admin-attempts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.admin-attempts article { padding:22px; border:1px solid #e0e6dd; border-radius:12px; }.admin-attempt-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; font-size:11px; }.admin-attempts article>small { color:var(--sage); font-size:10px; }.admin-attempts h3 { font-size:15px; margin:12px 0; }.admin-attempts p { font-size:12px; color:var(--sage); margin:0; }.admin-footer { text-align:center; font-size:11px; color:var(--sage); padding:0 24px 30px; }
@media(max-width:900px) { .admin-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }.admin-details { grid-template-columns:repeat(2,minmax(0,1fr)); }.admin-heading,.admin-section-heading { align-items:flex-start; flex-direction:column; }.admin-attempts { grid-template-columns:1fr; } }
@media(max-width:540px) { .admin-header { padding:18px; gap:14px; }.admin-brand { font-size:19px; }.admin-header nav { gap:16px; font-size:11px; }.admin-main { padding:28px 16px; }.admin-metrics { gap:10px; }.admin-metrics article { padding:16px; }.admin-section { padding:20px 16px; }.admin-filters { flex-wrap:wrap; }.admin-filters>div:first-of-type { flex-basis:100%; }.admin-filters>div:nth-of-type(2) { flex:1; }.admin-chart { gap:3px; }.admin-chart small { font-size:8px; }.admin-chart>div:nth-child(even) small { visibility:hidden; }.admin-table { min-width:620px; }.admin-version-filter { flex-wrap:wrap; }.admin-version-filter select { width:100%; max-width:100%; }.admin-version-filter label { flex-basis:100%; }.admin-details { grid-template-columns:1fr; gap:18px; } }

.admin-filters .admin-button { width:auto; flex:0 0 auto; }
.admin-auth-card { width:min(100%,520px); margin:50px auto; padding:36px; border:1px solid #dce3d9; border-radius:20px; background:#fffef9; }
.admin-auth-card h1 { font:700 clamp(28px,5vw,36px)/1.2 var(--sans); margin:14px 0; }.admin-auth-card p { color:var(--sage); line-height:1.8; }.admin-auth-card small { color:var(--sage); font-size:11px; }.admin-auth-card label { display:block; font-size:12px; font-weight:650; margin:20px 0 7px; }.admin-auth-card input { width:100%; font:16px var(--sans); padding:13px; border:1px solid #cfd9cc; border-radius:9px; margin-bottom:18px; }.admin-auth-card .admin-button { width:100%; }.admin-auth-card #passkey-status { font-size:13px; margin-top:18px; }.admin-header form { margin:0; }.admin-logout { border:0; padding:0; color:inherit; background:none; font:inherit; text-decoration:underline; text-underline-offset:4px; }.admin-header nav { align-items:center; }
@media(max-width:540px) { .admin-auth-card { padding:26px 22px; margin:24px auto; } }

/* Trail illustrations are separate from the geographically registered map. */
.adventure-art { position: relative; width: 100%; overflow: hidden; background: #e9e5d7; }
.adventure-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.adventure-art--hero { aspect-ratio: 2 / 1; }
.adventure-art--story { aspect-ratio: 3 / 4; max-width: 360px; margin: 24px auto; border-radius: 14px; }
.quest-panel > .adventure-art--hero { height: clamp(160px,30vw,300px); aspect-ratio: auto; }
.story-dialog .adventure-art--story { max-width: 320px; }
.catalog-map { height: auto; aspect-ratio: 2 / 1; padding: 0; }
.catalog-map .adventure-art { height: 100%; }
.invitation-art { overflow: visible; border-radius: 0; }
.invitation-art .adventure-art { margin: 0 auto; }
.invitation-art figcaption { position: static; background: none; color: var(--forest); padding: 12px 0; }
.adventure-art-placeholder { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; color: #e9c983; background: radial-gradient(ellipse at 70% 20%,#73957366,transparent 60%),linear-gradient(145deg,#123a30,#355b40); }
.adventure-art-placeholder::before,.adventure-art-placeholder::after { content: ''; position: absolute; width: 70%; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; opacity: .13; transform: translate(-50%,35%); }
.adventure-art-placeholder::after { transform: translate(55%,-30%); width: 90%; }
.adventure-art-placeholder > span { font: 100px/1 Georgia,serif; opacity: .8; text-shadow: 0 3px 30px #f7d37c35; }
.adventure-art-placeholder > i { position: absolute; top: 25%; left: 22%; font: 28px/1 Georgia,serif; opacity: .55; }
.adventure-art-placeholder > i:last-child { top: 65%; left: 78%; font-size: 17px; }
[data-art-theme=sports] .adventure-art-placeholder { color: #ffcb47; background: radial-gradient(ellipse at 70% 20%,#4187bf66,transparent 60%),linear-gradient(145deg,#102d50,#24588c); }
[data-art-theme=rescue] .adventure-art-placeholder { color: #ffbd59; background: radial-gradient(ellipse at 70% 20%,#4fabb766,transparent 60%),linear-gradient(145deg,#123344,#286479); }

/* Keep location permission and proximity visible before a family starts. */
.start-location{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--paper);text-align:left}
.start-location-heading{display:flex;align-items:center;gap:9px;color:var(--forest);font-size:15px;line-height:1.4}
.start-location-heading .icon{color:var(--gold)}
.start-location p,.arrival-card .start-location p{margin:10px 0 0;font-size:13px;line-height:1.6;color:var(--ink)}
.start-location .start-location-distance,.arrival-card .start-location-distance{font-size:19px;font-weight:600;overflow-wrap:anywhere}
.start-location .secondary-button{margin-top:14px;min-height:44px}
.start-location[data-ready=true]{border-color:var(--forest)}
.start-location [hidden]{display:none}

.start-route-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.start-route-facts .start-route-length{margin:0;min-width:0;padding:14px 12px}
.start-route-facts .start-route-length strong{font-size:clamp(19px,4.5vw,27px);overflow-wrap:anywhere}
.start-route-facts .start-route-length>.icon{width:22px;height:22px}
.start-age{color:var(--sage);font-size:12px;margin:10px 0 20px}


/* The collection total belongs immediately below the jar, outside the glass. */
.firefly-overlay[data-kind=collection] .firefly-effect-content{display:grid;grid-template-areas:"label" "title" "art" "score" "copy" "controls";justify-items:center}
.firefly-overlay[data-kind=collection] #firefly-effect-label{grid-area:label}
.firefly-overlay[data-kind=collection] #firefly-effect-title{grid-area:title}
.firefly-overlay[data-kind=collection] #firefly-effect-art{grid-area:art;width:100%}
.firefly-overlay[data-kind=collection] #firefly-effect-score{grid-area:score;margin:0 0 14px;font-size:clamp(21px,5vw,26px);line-height:1.4}
.firefly-overlay[data-kind=collection] #firefly-effect-copy{grid-area:copy}
.firefly-overlay[data-kind=collection] .firefly-effect-controls{grid-area:controls}