/* 240 Island Guide — one motion vocabulary, layered over the approved island UI. */
:root{--motion-quick:160ms;--motion-response:320ms;--motion-reveal:650ms;--motion-spring:cubic-bezier(.16,1,.3,1);--motion-ease:cubic-bezier(.22,.61,.36,1);--atmosphere:#71dbdc;--atmosphere-warm:#f3c77d;--motion-edge:rgba(225,249,245,.32)}
body[data-island-time=morning]{--atmosphere:#afdfcd;--atmosphere-warm:#f8dbaa}body[data-island-time=afternoon]{--atmosphere:#62dce1;--atmosphere-warm:#e9d29d}body[data-island-time=sunset]{--atmosphere:#c58b9f;--atmosphere-warm:#ffbb74}body[data-island-time=night]{--atmosphere:#619abb;--atmosphere-warm:#c8ba92}
.motion-atmosphere{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:-1;contain:strict}.motion-bloom{position:absolute;width:70vw;height:70vw;min-width:420px;min-height:420px;border-radius:50%;background:radial-gradient(ellipse,var(--atmosphere),transparent 65%);opacity:.08;left:-25vw;top:10%;animation:ambient-drift 26s ease-in-out infinite alternate}.motion-bloom.warm{background:radial-gradient(ellipse,var(--atmosphere-warm),transparent 65%);left:60%;top:40%;opacity:.07;animation-delay:-13s}
@keyframes ambient-drift{to{transform:translate3d(6vw,-4vh,0) scale(1.08);opacity:.12}}
button:not(.tour-map-marker),a.video-link,.place-chapters a{transition:transform var(--motion-response) var(--motion-spring),background-color var(--motion-response),border-color var(--motion-response),box-shadow var(--motion-response),color var(--motion-response);-webkit-tap-highlight-color:transparent}
button:not(.tour-map-marker):active,a.video-link:active{transform:scale(.975)}.category-nav button:active .category-orb{transform:scale(.94)}.tour-map-marker:active .island-pin{transform:scale(.93)}
@media(hover:hover){button:not(.tour-map-marker):hover{transform:translateY(-2px)}.photo-place-card:hover img{transform:scale(1.025)}}
.card,.search,.maptitle,.favorites-tile{border-color:var(--motion-edge);box-shadow:inset 0 1px 0 #f3fffd55,0 8px 24px #001b3340}.primary-nav{position:relative;z-index:15}.primary-nav button{box-shadow:inset 0 1px 1px #fff8,0 8px 22px #00182766}.primary-nav button.active{transition:background-color var(--motion-reveal),box-shadow var(--motion-reveal),color var(--motion-response)}
#detail{box-shadow:inset 0 1px 0 #fff9,inset 1px 0 0 #dbf1f133,0 28px 85px #001b3b66}#sidebar{box-shadow:inset 0 1px 0 #f3fffd55,0 24px 65px #00172b66}.story{box-shadow:inset 0 1px 0 #fff1}.gallery-cover>img,.place-photo img{transition:transform var(--motion-reveal) var(--motion-ease)}
/* Only focal markers breathe. Never transform MapLibre's positioning element. */
.island-pin{animation:none}.tour-map-marker .island-pin{transition:transform var(--motion-response) var(--motion-spring),opacity var(--motion-response);transform-origin:50% 70%}.tour-map-marker.is-selected{z-index:10}.tour-map-marker.is-selected .island-pin{transform:scale(1.18);border-color:#ffefb5}.tour-map-marker.is-selected .island-pin::before,.tour-map-marker.is-nearby .island-pin::before{content:'';position:absolute;inset:-7px;border:1px solid #ffe3a677;border-radius:50%;animation:destination-beacon 3.6s ease-out infinite;pointer-events:none}.tour-map-marker.is-nearby:not(.is-selected) .island-pin::before{inset:-3px;border-color:#8ee5df55;animation-duration:6s}.tour-map-marker.is-complete .island-pin{border-color:#a0edc8}.tour-map-marker.is-complete .island-pin .ui-icon{opacity:.65}.your-location::before{content:'';position:absolute;inset:-11px;border-radius:50%;border:1px solid #76dfffaa;animation:location-beacon 3s ease-out infinite;pointer-events:none}.your-location{z-index:15!important}.discovery-cluster{transition:transform var(--motion-response) var(--motion-spring)}
@keyframes destination-beacon{0%{transform:scale(.94);opacity:0}25%{opacity:.65}100%{transform:scale(1.28);opacity:0}}@keyframes location-beacon{0%{transform:scale(.5);opacity:0}20%{opacity:.8}100%{transform:scale(1.3);opacity:0}}
.category-orb{position:relative;overflow:hidden;isolation:isolate}.category-orb::before{content:'';position:absolute;inset:-55%;pointer-events:none;z-index:-1;opacity:.25;background:linear-gradient(115deg,transparent 35%,#fff8 49%,transparent 60%);transform:translateX(-35%)}.category-orb.food::before{background:radial-gradient(ellipse,#ffc58266,transparent 65%);animation:category-warm 12s ease-in-out infinite alternate}.category-orb.adventure::before{background:repeating-radial-gradient(ellipse at 35% 35%,transparent 0 12px,#beffd62a 13px 14px,transparent 15px 24px);animation:category-terrain 18s ease-in-out infinite alternate}.category-orb.tours::before{background:conic-gradient(from 0deg,transparent 0deg 300deg,#b6f3ff88 340deg,transparent 360deg);animation:category-route 18s linear infinite}.category-orb.shopping::before{animation:category-shimmer 16s var(--motion-ease) infinite}.category-orb.relax::before{background:radial-gradient(ellipse,#ffe29f77,transparent 65%);animation:category-warm 9s ease-in-out infinite alternate}
@keyframes category-warm{to{transform:translate3d(8px,-5px,0) scale(1.18);opacity:.45}}@keyframes category-terrain{to{transform:translate3d(8px,6px,0) rotate(12deg)}}@keyframes category-route{to{transform:rotate(360deg)}}@keyframes category-shimmer{0%,70%{transform:translateX(-65%);opacity:0}80%{opacity:.24}100%{transform:translateX(65%);opacity:0}}
.motion-pressed{box-shadow:inset 0 1px 1px #fff9,0 0 18px #a8efea33!important}.trip-flight{position:fixed;z-index:10000;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffefbc,#ddbb75);color:#163949;box-shadow:0 0 24px #ffd98566;pointer-events:none;font-size:18px}.trip-progress{display:flex;gap:5px;margin:12px 0 6px}.trip-progress span{height:4px;flex:1;border-radius:3px;background:#ffffff25;overflow:hidden}.trip-progress span::after{content:'';display:block;height:100%;background:linear-gradient(90deg,#81d7d0,#f7d58f);transform:scaleX(0);transform-origin:left;transition:transform var(--motion-reveal) var(--motion-ease)}.trip-progress span.is-done::after{transform:scaleX(1)}.trip-progress span.is-next::after{transform:scaleX(.35)}.tour-progress-label{font-size:11px;color:#cee5e3;margin:4px 0 10px}.discovery-distance{color:#bddfde;font-size:10px;letter-spacing:.04em}
.motion-intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 60%,#144b59,#031b2c 65%);pointer-events:none}.motion-intro-inner{text-align:center;width:min(420px,80vw)}.motion-intro img{width:110px;height:58px;object-fit:contain;opacity:0;animation:intro-brand 700ms var(--motion-ease) 100ms forwards}.motion-intro h1{font:500 clamp(22px,4vw,32px)/1.2 'Manrope',sans-serif;letter-spacing:.14em;color:#fff0cf;opacity:0;animation:intro-brand 800ms var(--motion-ease) 250ms forwards}.motion-intro p{font-size:10px;letter-spacing:.27em;color:#b8d8df;opacity:0;animation:intro-brand 700ms var(--motion-ease) 450ms forwards}.motion-island{width:210px;height:170px;margin:0 auto;display:block;overflow:visible}.motion-island path{fill:#45878522;stroke:#bee0d5;stroke-width:1;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:island-trace 1300ms var(--motion-ease) 400ms forwards}.motion-island .island-light{fill:none;stroke:#ffe0a4;stroke-width:2;stroke-dasharray:.1 .9;animation:island-light 1400ms var(--motion-ease) 700ms forwards;opacity:.8}.motion-loading header,.motion-loading .primary-nav,.motion-loading .discovery-tools{opacity:0;transform:translateY(10px)}body.motion-entered header,body.motion-entered .primary-nav,body.motion-entered .discovery-tools{animation:interface-arrive 650ms var(--motion-spring) both}body.motion-entered .primary-nav{animation-delay:80ms}body.motion-entered .discovery-tools{animation-delay:150ms}
@keyframes intro-brand{to{opacity:1;transform:none}}@keyframes island-trace{to{stroke-dashoffset:0}}@keyframes island-light{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes interface-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* Passenger attract is a presentation layer, not a navigation or tour-state change. */
#island-attract{position:fixed;inset:0;z-index:60;display:grid;align-items:center;padding:clamp(20px,4vw,56px);background:linear-gradient(125deg,#031f32dd,#073d4799 65%,#092b4077);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff}.attract-layout{width:min(1200px,100%);margin:auto;display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:clamp(24px,4vw,65px)}.attract-photo{position:relative;aspect-ratio:4/3;border-radius:32px;overflow:hidden;background:#0b3a49;box-shadow:0 25px 75px #00142599;border:1px solid #caeee85a}.attract-photo img{width:100%;height:100%;object-fit:cover}.attract-photo::after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#051e35aa);pointer-events:none}.attract-credit{position:absolute;bottom:16px;left:20px;right:20px;z-index:1;font-size:11px;color:#edf7f5;line-height:1.45}.attract-copy h2{font:400 clamp(32px,4.6vw,65px)/1.06 Georgia,serif;letter-spacing:-.03em;text-wrap:balance;margin:18px 0 20px;color:#fff0cf}.attract-copy p{font-size:clamp(16px,1.8vw,21px);line-height:1.6;color:#d4e9e7}.attract-location{font-size:12px!important;letter-spacing:.09em;text-transform:uppercase;color:#b2dddc!important}.attract-top{position:absolute;top:calc(20px + env(safe-area-inset-top));left:clamp(20px,4vw,56px);right:clamp(20px,4vw,56px);display:flex;justify-content:space-between;align-items:center;gap:15px}.attract-top img{width:70px;height:38px;object-fit:contain}.attract-top button{min-width:44px;min-height:44px}.attract-invitation{display:inline-flex;align-items:center;gap:15px;margin-top:20px;border:1px solid #ffe4b577;padding:16px 25px;border-radius:30px;background:linear-gradient(130deg,#fff0bd,#d9bb78);color:#123642;font-weight:700;box-shadow:0 0 25px #ffddad22}.attract-footer{position:absolute;bottom:calc(24px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:11px;letter-spacing:.15em;color:#b8d8d5}.attract-footer span{display:inline-block;width:6px;height:6px;margin:0 5px;border-radius:50%;background:#ffffff35}.attract-footer span.active{background:#ffe1a1}.attract-footer small{display:block;margin-top:15px;letter-spacing:.1em}.attract-photo img{animation:attract-pan 8s var(--motion-ease) both}@keyframes attract-pan{from{transform:scale(1.055)}to{transform:scale(1)}}
@media(max-width:650px){#island-attract{padding:80px 22px 100px}.attract-layout{grid-template-columns:1fr;gap:22px}.attract-photo{aspect-ratio:16/10;border-radius:23px}.attract-copy h2{font-size:34px;margin:10px 0}.attract-copy p{font-size:15px;margin:10px 0}.attract-copy .eyebrow{font-size:9px}.attract-invitation{margin-top:10px;padding:13px 23px}.attract-credit{font-size:9px;bottom:10px;left:12px}.attract-footer{bottom:20px}}
@media(orientation:landscape) and (max-height:600px){#island-attract{padding:70px 25px 55px}.attract-layout{grid-template-columns:1.1fr 1fr;gap:25px}.attract-photo{aspect-ratio:16/10;max-height:65dvh}.attract-copy h2{font-size:32px;margin:10px 0}.attract-copy p{font-size:14px;line-height:1.45;margin:8px 0}.attract-invitation{padding:10px 20px;margin-top:5px}.attract-top{top:10px}.attract-footer{bottom:9px}.attract-footer small{display:none}}
body.motion-suspended *,body.motion-suspended *::before,body.motion-suspended *::after{animation-play-state:paused!important}body.motion-lite .motion-bloom.warm{display:none}body.motion-lite .category-orb::before{animation:none}body.motion-lite .motion-atmosphere{opacity:.65}body.motion-lite #island-attract{backdrop-filter:none;-webkit-backdrop-filter:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-atmosphere,.motion-intro{display:none!important}.motion-loading header,.motion-loading .primary-nav,.motion-loading .discovery-tools{opacity:1;transform:none}.trip-flight{display:none}.attract-photo img{transform:none}}

@media(max-width:800px){#trip-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;font-size:10px;padding:1px 3px;border-radius:6px}}
