/* Gold motion system, derived from the supplied four-path clover. */
.clover-mark { width:100%; height:100%; display:block; overflow:visible; color:#b59d6b; }
.clover-fill { fill:currentColor; }
.clover-outline { fill:none; stroke:currentColor; stroke-width:.65; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:0; opacity:0; }
.clover-rotor { transform-origin:38.335px 38.335px; }
[data-clover] { width:56px; height:56px; display:inline-block; }
[data-clover="leaves"] .clover-leaf { animation:clover-leaves 1.8s linear infinite; opacity:0; }
@keyframes clover-leaves { 0% {opacity:0} 14%,65% {opacity:1} 86%,100% {opacity:0} }
[data-clover="leaves"] .clover-leaf:nth-child(2) {animation-name:clover-leaves-two}
[data-clover="leaves"] .clover-leaf:nth-child(3) {animation-name:clover-leaves-three}
[data-clover="leaves"] .clover-leaf:nth-child(4) {animation-name:clover-leaves-four}
@keyframes clover-leaves-two { 0%,14% {opacity:0} 28%,65% {opacity:1} 86%,100% {opacity:0} }
@keyframes clover-leaves-three { 0%,28% {opacity:0} 42%,65% {opacity:1} 86%,100% {opacity:0} }
@keyframes clover-leaves-four { 0%,42% {opacity:0} 56%,65% {opacity:1} 86%,100% {opacity:0} }
[data-clover="spin"] { animation:clover-arrive .45s ease-out both; }
[data-clover="spin"] .clover-rotor { animation:clover-spin 3s linear infinite; animation-delay:.45s; }
@keyframes clover-arrive { from {opacity:0;transform:scale(.85)} to {opacity:1;transform:scale(1)} }
@keyframes clover-spin { to {transform:rotate(360deg)} }
[data-clover="trace"] .clover-outline { animation:clover-trace 2.8s ease-in-out infinite; animation-delay:calc(var(--leaf) * .12s); opacity:1; }
[data-clover="trace"] .clover-fill { animation:clover-fill 2.8s ease-in-out infinite; animation-delay:calc(var(--leaf) * .12s); opacity:0; }
@keyframes clover-trace { 0% {stroke-dashoffset:100;opacity:0} 18% {opacity:1} 55%,70% {stroke-dashoffset:0;opacity:1} 95%,100% {stroke-dashoffset:0;opacity:0} }
@keyframes clover-fill { 0%,40% {opacity:0} 65%,78% {opacity:1} 100% {opacity:0} }

html.planner-intro-pending { background:#151914; }
.planner-intro-pending body>:not(.planner-intro) { visibility:hidden; }
.planner-intro { --motion-gold:#b59d6b; position:fixed; inset:0; z-index:10000; overflow:hidden; display:grid; place-items:center; background:#151914; color:#f3efe3; isolation:isolate; font-family:'Montserrat',system-ui,sans-serif; }
.intro-aura { position:absolute; inset:-20%; z-index:-1; background:radial-gradient(ellipse at 50% 47%,#ab935126 0,#53604410 28%,transparent 56%); opacity:0; }
.is-playing .intro-aura { animation:intro-aura 3.5s ease-out both; }
@keyframes intro-aura { 0% {opacity:0;transform:scale(.7)} 60%,100% {opacity:1;transform:scale(1.13)} }
.intro-grid { position:absolute; inset:0; pointer-events:none; opacity:.045; background-image:linear-gradient(#cdbb8e 1px,transparent 1px),linear-gradient(90deg,#cdbb8e 1px,transparent 1px); background-size:120px 120px; mask-image:radial-gradient(ellipse,black,transparent 65%); }
.intro-topline,.intro-bottom { position:absolute; left:5vw; right:5vw; display:flex; justify-content:space-between; align-items:center; font-size:9px; letter-spacing:.27em; color:#ac9c79; }
.intro-topline { top:max(25px,env(safe-area-inset-top)); }.intro-bottom { bottom:max(28px,env(safe-area-inset-bottom)); color:#7c806c; font-size:8px; }
.intro-skip { padding:12px 16px; border:1px solid #b59d6b40; border-radius:999px; background:#ffffff04; font:500 11px 'Montserrat',system-ui,sans-serif; color:#d1c5aa; cursor:pointer; min-height:44px; }
.intro-skip span { margin-left:16px; }.intro-skip:hover { background:#b59d6b16; }.intro-skip:focus-visible { outline:2px solid #cfb97f;outline-offset:5px; }
.intro-center { display:flex; flex-direction:column; align-items:center; width:min(100%,640px); padding:30px; margin-top:-35px; }
.intro-emblem { width:270px; height:270px; position:relative; display:grid; place-items:center; }
.intro-symbol { width:230px; height:230px; z-index:2; }
.intro-symbol .clover-mark { color:var(--motion-gold); filter:drop-shadow(0 0 14px #b59d6b25); }
.intro-symbol .clover-fill { opacity:0; }
.intro-symbol .clover-outline { opacity:0; stroke:#e0cfa0; stroke-width:.35; }
.is-playing .intro-symbol .clover-leaf { animation:intro-leaf 1.4s cubic-bezier(.16,1,.3,1) both; animation-delay:calc(var(--leaf) * .105s); }
@keyframes intro-leaf { from {transform:translate(var(--dx),var(--dy));opacity:0} 30% {opacity:1} to {transform:translate(0,0);opacity:1} }
.is-playing .intro-symbol .clover-outline { animation:intro-trace 1.5s ease both; animation-delay:calc(var(--leaf) * .105s); }
@keyframes intro-trace { 0% {stroke-dashoffset:100;opacity:0} 12% {opacity:1} 65% {stroke-dashoffset:0;opacity:1} 100% {stroke-dashoffset:0;opacity:.3} }
.is-playing .intro-symbol .clover-fill { animation:intro-fill 1.3s ease both; animation-delay:calc(.5s + var(--leaf) * .105s); }
@keyframes intro-fill { from {opacity:0} to {opacity:1} }
.is-playing .intro-symbol .clover-rotor { animation:intro-turn 2.25s cubic-bezier(.4,0,.15,1) 1.05s both; }
@keyframes intro-turn { from {transform:rotate(-12deg)} to {transform:rotate(168deg)} }
.intro-orbit { position:absolute; border-radius:50%; opacity:0; pointer-events:none; }
.orbit-one { inset:11px; border:1px solid #b59d6b26; }
.orbit-two { inset:-8px; border:1px solid transparent; border-top-color:#d2b87870; border-bottom-color:#b59d6b24; }
.orbit-three { inset:-40px; border:1px solid #b59d6b14; }
.is-playing .orbit-one { animation:intro-orbit 3.5s ease .2s both; }
.is-playing .orbit-two { animation:intro-orbit 3.4s ease .35s both; }
.is-playing .orbit-three { animation:intro-orbit 3.3s ease .5s both; }
@keyframes intro-orbit { 0% {opacity:0;transform:scale(.7) rotate(-70deg)} 35% {opacity:1} 100% {opacity:.55;transform:scale(1) rotate(100deg)} }
.intro-glint { position:absolute; inset:-9px; border-radius:50%; opacity:0; }
.intro-glint::before { content:''; position:absolute; top:4px; left:50%; width:4px; height:4px; background:#f4e3b5; border-radius:50%; box-shadow:0 0 9px 3px #c3a66b60; }
.is-playing .intro-glint { animation:intro-glint 2.7s cubic-bezier(.3,0,.2,1) .5s both; }
@keyframes intro-glint { 0% {opacity:0;transform:rotate(-140deg)} 20%,80% {opacity:1} 100% {opacity:0;transform:rotate(200deg)} }
.intro-wordmark { font-family:'Cormorant Garamond',Georgia,serif; font-size:clamp(34px,5.2vw,62px); font-weight:400; letter-spacing:.26em; padding-left:.26em; display:flex; margin-top:34px; line-height:1.1; }
.intro-wordmark span { opacity:0; }.is-playing .intro-wordmark span { animation:intro-letter 1s cubic-bezier(.16,1,.3,1) both; animation-delay:calc(.85s + var(--letter) * .065s); }
@keyframes intro-letter { from {opacity:0;transform:translateY(15px);filter:blur(7px)} to {opacity:1;transform:translateY(0);filter:blur(0)} }
.intro-hairline { margin-top:24px; width:110px; height:1px; background:linear-gradient(90deg,transparent,#c8ae72,transparent); transform:scaleX(0); }.is-playing .intro-hairline { animation:intro-line 1s ease 1.25s forwards; }
@keyframes intro-line { to {transform:scaleX(1)} }
.intro-tagline { text-align:center; color:#b7b9a8; font-size:12px; line-height:1.9; letter-spacing:.06em; margin:22px 0 0; opacity:0; }.is-playing .intro-tagline { animation:intro-letter 1s ease 1.45s forwards; }
.planner-intro.is-exiting { animation:intro-exit .65s cubic-bezier(.4,0,.2,1) both; pointer-events:none; }
@keyframes intro-exit { to {opacity:0;transform:scale(1.035)} }
@media(max-width:600px) { .intro-emblem {width:210px;height:210px}.intro-symbol {width:190px;height:190px}.intro-wordmark {margin-top:36px}.intro-bottom span:last-child {display:none}.intro-topline {font-size:8px;letter-spacing:.15em}.intro-center {margin-top:0}.orbit-three {inset:-25px} }
@media(prefers-reduced-motion:reduce) { [data-clover] *,[data-clover],.planner-intro * {animation:none!important;transition:none!important;filter:none!important}.clover-leaf,.clover-fill {opacity:1!important}.clover-outline {opacity:0!important}.planner-intro.is-exiting {animation:none}.intro-wordmark span,.intro-tagline {opacity:1} }
