:root{--ground:#F8F8F8;--sheet:#FFFFFF;--ink:#222222;--blue:#3B63FB;--orange:#C2520B;--soft:rgba(34,34,34,.74);--t-big:clamp(2rem,1.45rem + 2.3vw,3.25rem);--t-body:clamp(1.1875rem,1.1rem + 0.4vw,1.375rem);--t-small:0.9375rem;--gut:clamp(16px,3vw,24px);color-scheme:light;scrollbar-color:var(--ink) var(--ground);}*{box-sizing:border-box}html{background:var(--ground);color:var(--ink);font-family:"Source Sans 3",system-ui,sans-serif;font-size:100%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;overflow-x:clip;min-height:100dvh;padding:0 env(safe-area-inset-right) 0 env(safe-area-inset-left)}::selection{background:var(--blue);color:#fff}p{margin:0;text-wrap:pretty}a{color:inherit}.top{position:relative;max-width:40rem;margin:0 auto;height:136px;padding:0 var(--gut)}.cord{position:absolute;top:0;left:calc(var(--gut) + 28px + 53px);width:2px;height:22px;background:var(--ink)}.badge{position:absolute;top:22px;left:calc(var(--gut) + 28px);width:108px;height:108px;border-radius:16px;background:var(--sheet);display:grid;place-items:center;box-shadow:0 1px 2px rgba(34,34,34,.10),0 4px 10px rgba(34,34,34,.08),0 12px 28px rgba(34,34,34,.08)}.badge img{display:block;width:96px;height:96px}.stack{position:relative;isolation:isolate;max-width:40rem;margin:0 auto;padding:0 12px}.stack::before{content:"";position:absolute;z-index:-1;left:26px;right:26px;top:12px;bottom:-12px;background:var(--sheet);border-radius:16px;box-shadow:0 1px 2px rgba(34,34,34,.08),0 8px 20px rgba(34,34,34,.06)}.sheet{position:relative;background:var(--sheet);border-radius:16px;padding:clamp(20px,2rem + 1vw,56px) clamp(20px,1rem + 3vw,56px) clamp(32px,2rem + 2vw,64px);box-shadow:0 1px 2px rgba(34,34,34,.10),0 6px 14px rgba(34,34,34,.07),0 18px 40px rgba(34,34,34,.07)}h1{font-family:"Encode Sans","Source Sans 3",sans-serif;font-size:var(--t-big);line-height:1.04;font-weight:700;font-variation-settings:"wdth" 100;letter-spacing:-0.02em;margin:0 0 16px;text-wrap:balance;animation:breathe 1.3s cubic-bezier(.16,1,.3,1) both}h1 span{transition:font-variation-settings .35s cubic-bezier(.16,1,.3,1),font-weight .35s cubic-bezier(.16,1,.3,1)}h1 span.swell{font-weight:800;font-variation-settings:"wdth" 112}@keyframes breathe{from{font-weight:500;font-variation-settings:"wdth" 78}}.note p{font-size:var(--t-body);line-height:1.55;max-width:38ch}.note .lede{margin-bottom:24px}.main-btn{display:flex;align-items:center;justify-content:center;width:100%;max-width:22rem;min-width:240px;min-height:56px;padding:0 24px;background:var(--orange);color:#fff;font-size:var(--t-body);font-weight:600;text-decoration:none;border-radius:8px;box-shadow:0 1px 2px rgba(34,34,34,.18),0 4px 12px rgba(194,82,11,.22);transition:transform .15s cubic-bezier(.16,1,.3,1);-webkit-tap-highlight-color:transparent}.main-btn:active{transform:scale(.97)}.main-btn:focus-visible,.sw:focus-visible{outline:3px solid var(--blue);outline-offset:4px}@media (hover: hover){.main-btn:hover{background:#A9470A}}.under{font-size:var(--t-small);color:var(--soft);margin-top:12px;max-width:38ch}.flip{margin-top:48px}.sw{appearance:none;display:block;width:100%;background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:pan-y;border-radius:999px}.track{--h:clamp(64px,56px + 2vw,80px);position:relative;display:block;height:var(--h);border-radius:999px;background:var(--blue);box-shadow:inset 0 0 0 2px var(--blue);transition:background .25s,box-shadow .25s}.knob{position:absolute;top:8px;right:8px;width:calc(var(--h) - 16px);height:calc(var(--h) - 16px);border-radius:50%;background:var(--sheet);display:grid;place-items:center;color:var(--blue);box-shadow:0 1px 2px rgba(34,34,34,.2),0 3px 8px rgba(34,34,34,.14);transition:transform .3s cubic-bezier(.16,1,.3,1),background .25s,color .25s;view-transition-name:knob;animation:nudge .7s .5s cubic-bezier(.16,1,.3,1) 1}.knob svg{width:45%;height:45%}.knob .ico-off{display:none}@keyframes nudge{40%{transform:translateX(-7px)}}.sw-labels{display:flex;justify-content:space-between;margin-top:8px;font-size:var(--t-small);font-weight:600}.sw-labels .off{color:var(--soft)}html[data-side="without"] .track{background:var(--sheet);box-shadow:inset 0 0 0 2px rgba(34,34,34,.55)}html[data-side="without"] .knob{background:#5C5C5C;color:#fff}html[data-side="without"] .knob .ico-on{display:none}html[data-side="without"] .knob .ico-off{display:block}html[data-side="without"] .sw-labels .off{color:var(--ink)}html[data-side="without"] .sw-labels .on{color:var(--soft)}.fig{margin:32px 0 0;view-transition-name:fig;transition:opacity .15s}.fig svg{display:block;width:100%;max-width:400px;height:auto;margin:0 auto}.fig text{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:600}.cap{font-size:var(--t-small);color:var(--soft);margin-top:16px;max-width:38ch}.piece{transform-box:fill-box;transform-origin:center;animation:outward .8s cubic-bezier(.16,1,.3,1) both}@keyframes outward{from{transform:translate(var(--dx),var(--dy)) scale(.55)}}.body{margin-top:56px;display:grid;gap:20px}.body .main-btn{margin-top:8px}.sign{font-weight:600}footer{margin-top:clamp(64px,3rem + 4vw,112px);background:var(--ink);color:#F8F8F8;padding:40px var(--gut) calc(40px + env(safe-area-inset-bottom))}.foot{max-width:40rem;margin:0 auto;padding:0 12px;display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:center;font-size:var(--t-small)}.foot strong{font-family:"Encode Sans",sans-serif;font-weight:700;font-size:var(--t-body)}.foot a{display:inline-flex;align-items:center;min-height:44px;color:#F8F8F8;text-underline-offset:4px}.foot a:focus-visible{outline:3px solid #F8F8F8;outline-offset:3px}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}h1,.knob,.piece{animation:none}.knob,.main-btn,.fig,h1 span{transition:none}}html{overflow-x:clip;max-inline-size:100%;}body{overflow-x:clip;max-inline-size:100%;}