.mf-page{background:var(--cobalt)}.mf{min-height:100svh;outline:none;padding:84px var(--gutter) clamp(48px,6vw,80px);display:grid;gap:clamp(20px,3vw,36px);align-content:start}.mf__top{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}.mf__title{font:800 clamp(1.7rem,1rem + 2.4vw,3.2rem)/.95 var(--display);font-stretch:80%;letter-spacing:-.03em;margin-right:auto}.mf__dots{display:flex;gap:8px}.mf__dots li{width:30px;height:6px;border-radius:6px;background:#f4f3ee33;transition:background-color .3s,width .3s}.mf__dots li.is-now{width:46px;background:#f4f3ee99}.mf__dots li.is-done{background:var(--accent)}.mf__skip{min-height:44px;padding:8px 16px;border-radius:999px;cursor:pointer;background:transparent;border:1.5px solid var(--line);font-weight:600}@media(min-width:1000px){.play{grid-template-columns:minmax(280px,380px) minmax(0,1fr);column-gap:clamp(32px,4vw,64px);grid-template-areas:"brief frame" "tray frame" "status frame";align-items:start;grid-template-rows:auto auto 1fr}.play__brief{grid-area:brief}.tray{grid-area:tray}.play__status{grid-area:status}.frame--play{grid-area:frame;justify-self:center}.frame--play .frame__site{min-height:clamp(320px,48vh,520px)}}.play{display:grid;gap:18px;justify-items:start;min-width:0}.play[hidden]{display:none}.play__brief{display:grid;gap:6px;order:1}.tray{order:2}.frame--play{order:3}.play__status{order:4}.play__count{font-weight:600;opacity:.7}.play__move{font:800 clamp(2rem,1.2rem + 2.6vw,3.6rem)/.95 var(--display);font-stretch:80%;letter-spacing:-.035em}.play__how{font-size:var(--t-lede);max-width:46ch;opacity:.92}.play__status{min-height:1.5em;font-weight:600}.frame--play{width:min(100%,860px);container-type:inline-size;transition:width .55s var(--ease),box-shadow .3s,outline-color .3s;outline:3px dashed transparent;outline-offset:6px;touch-action:pan-y;user-select:none;-webkit-user-select:none}.frame--play.is-resizing{transition:none}.frame--play.is-target{outline-color:var(--accent);box-shadow:0 40px 90px -30px color-mix(in srgb,var(--accent) 60%,transparent)}.frame--play .frame__site{min-height:clamp(280px,30vh,380px);position:relative;overflow:hidden}.frame--play .mock__big{color:var(--accent);max-width:8.5ch}.mock__burger{display:none;gap:4px;flex-direction:column}.mock__burger i{width:22px;height:2px;background:currentColor;border-radius:2px}.frame--play .mock__anchor{right:8%;top:50%;width:clamp(140px,32cqi,300px);transform:translateY(-50%);transition:transform .9s cubic-bezier(.55,0,.7,.2),opacity .9s}.frame--play .mock__anchor.is-launched{transform:translateY(-160vh) scale(.3)}.frame--play .frame__site.is-spinning{cursor:grabbing}.play[data-move="4"] .frame__site{cursor:grab}@container (max-width: 520px){.frame--play .mock__links,.frame--play .mock__nav em{display:none}.frame--play .mock__burger{display:flex}.frame--play .mock__big{font-size:2.3rem}.frame--play .mock__sub{font-size:.95rem}.frame--play .mock__anchor{right:50%;top:32%;transform:translate(50%,-50%);width:150px}.frame--play .mock__anchor.is-launched{transform:translate(50%,-160vh) scale(.3)}}.frame__handle{position:absolute;right:12px;bottom:12px;z-index:5;width:52px;height:52px;border-radius:50%;border:0;cursor:ew-resize;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;box-shadow:0 10px 24px -8px #030832b3;animation:nudge 1.6s ease-in-out infinite;touch-action:none}.frame__handle[hidden]{display:none}.frame__handle svg{width:24px;height:24px}@keyframes nudge{50%{transform:translate(-8px)}}.frame__load{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:.82rem;font-weight:600;white-space:nowrap}.frame__load[hidden]{display:none}.frame__load-bar{width:90px;height:6px;border-radius:6px;background:#f4f3ee26;overflow:hidden}.frame__load-bar i{display:block;height:100%;background:#ff6b5a;transition:width .45s var(--ease),background-color .3s}.frame__load.is-fast .frame__load-bar i{background:#5ce39a}.frame__load.is-fast{color:#5ce39a}.junk{position:absolute;inset:0;pointer-events:none;z-index:3}.junk__item{position:absolute;left:var(--x);top:var(--y);pointer-events:auto;transform:rotate(var(--r));max-width:46%;padding:12px 16px;border-radius:10px;cursor:grab;touch-action:none;background:#fff;color:#222;border:2px solid #222;font:700 .92rem/1.2 var(--text);box-shadow:4px 4px #222;text-align:left;transition:transform .55s cubic-bezier(.5,0,.75,0),opacity .55s}.junk__item:nth-child(2n){background:#ffef5c}.junk__item:nth-child(3n){background:#ff9fd0;font-family:Georgia,serif}.junk__item:hover{transform:rotate(var(--r)) scale(1.04)}.junk__item.is-gone{transform:translate(var(--fx, 400px),-120px) rotate(calc(var(--r) * 6));opacity:0;pointer-events:none}.tray{display:flex;flex-wrap:wrap;gap:10px;min-height:52px}.token,.pill{min-height:52px;padding:10px 20px 10px 14px;border-radius:999px;cursor:grab;border:1px solid rgba(244,243,238,.25);color:var(--white);font-weight:700;font-size:1rem;background:linear-gradient(135deg,#ffffff24,#ffffff0d);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:inline-flex;align-items:center;gap:10px;touch-action:none}.pill{cursor:pointer;padding:10px 22px}.pill--loud{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.pill--loud.is-ready{animation:ready 1s ease-in-out infinite}.pill--quiet{background:transparent}@keyframes ready{50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--accent) 30%,transparent)}}.token.is-lifted{opacity:.35}.token__icon{width:26px;height:26px;border-radius:8px;background:#f4f3ee29;position:relative}.token__icon--battery:after{content:"";position:absolute;inset:5px 8px;border-radius:3px;border:2px solid currentColor}.token__icon--ball:after{content:"";position:absolute;inset:5px;border-radius:50%;background:currentColor}.token__icon--bottle:after{content:"";position:absolute;inset:4px 8px;border-radius:4px 4px 6px 6px;border:2px solid currentColor}.token__icon--car:after{content:"";position:absolute;inset:9px 3px 7px;border-radius:6px 8px 3px 3px;background:currentColor}.swatch{width:56px;height:56px;border-radius:50%;cursor:grab;touch-action:none;background:var(--c);border:3px solid rgba(244,243,238,.85);box-shadow:0 10px 24px -10px #030832b3}.swatch.is-lifted{opacity:.35}.ghost{position:fixed;left:0;top:0;z-index:70;pointer-events:none;opacity:.95;margin:0}.creed{display:grid;gap:18px;align-content:start}.creed__title{font:800 clamp(1.5rem,1rem + 1.4vw,2.2rem)/1 var(--display);font-stretch:85%;outline:none}.creed__list{display:grid;gap:16px;counter-reset:line}.creed__list li{display:grid;gap:4px;padding-left:40px;position:relative;counter-increment:line}.creed__list li:before{content:counter(line);position:absolute;left:0;top:.1em;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink);font:800 .9rem/1 var(--display)}.creed__list strong{font:700 clamp(1.15rem,1rem + .6vw,1.5rem)/1.15 var(--display)}.creed__list span{opacity:.85}.mf--playing .creed__list li:not(.is-unlocked){display:none}.mf--playing .creed__end{display:none}.mf--playing .creed:not(:has(.is-unlocked)) .creed__title:after{content:" will appear here";opacity:.5;font-weight:600;font-size:.7em}.creed__end{display:grid;gap:18px;margin-top:18px}.creed__close{font:800 clamp(2.4rem,1.2rem + 4vw,5.4rem)/.95 var(--display);font-stretch:80%;letter-spacing:-.035em}.creed__actions{display:flex;flex-wrap:wrap;gap:12px}.creed__cta,.creed__again{min-height:52px;padding:14px 28px;border-radius:999px;font-weight:700;font-size:1.05rem;display:inline-flex;align-items:center;text-decoration:none;cursor:pointer}.creed__cta{background:var(--accent);color:var(--accent-ink)}.creed__again{background:transparent;border:1.5px solid var(--line)}.creed__again[hidden]{display:none}.mf--done .creed{max-width:900px}.mf--done .creed__list strong{font-size:clamp(1.6rem,1rem + 2.2vw,3rem);font-stretch:80%;letter-spacing:-.02em;font-weight:800}.mf--done .creed__list{gap:26px}.mf--done .creed__list li{padding-left:52px}.mf--done .creed__list li:before{width:36px;height:36px;font-size:1rem;top:.2em}.unlock{position:fixed;inset:0;z-index:60;display:grid;align-content:center;gap:16px;padding:0 var(--gutter);cursor:pointer;background:color-mix(in srgb,var(--cobalt-deep) 55%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:unlock-in .5s var(--ease) both}.unlock[hidden]{display:none}.unlock.is-out{animation:unlock-out .35s ease-in both}.unlock__n{font-weight:700;color:var(--accent)}.unlock__line{font:800 clamp(3rem,1.2rem + 7vw,9rem)/.88 var(--display);font-stretch:75%;letter-spacing:-.045em;max-width:12ch;animation:line-in .7s .05s var(--ease) both}.unlock__sub{font-size:var(--t-lede);max-width:40ch;opacity:.9;animation:line-in .7s .18s var(--ease) both}@keyframes unlock-in{0%{opacity:0}}@keyframes unlock-out{to{opacity:0}}@keyframes line-in{0%{opacity:0;transform:translateY(40px)}}
