@font-face{font-family:Archivo;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/archivo-latin.woff2)format("woff2")}@font-face{font-family:Archivo;font-style:italic;font-weight:100 900;font-display:swap;src:url(/fonts/archivo-latin-italic.woff2)format("woff2")}@font-face{font-family:Yellowtail;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/yellowtail-latin.woff2)format("woff2")}:root{--bg-top:oklch(90% .055 315);--bg-bot:oklch(86% .075 316);--surface:oklch(96% .022 316/.55);--surface-2:oklch(98% .012 316/.78);--fg:oklch(30% .015 300);--ink:oklch(18% .01 300);--plum:oklch(38% .19 310);--plum-2:oklch(52% .19 312);--plum-lite:oklch(66% .15 315);--plum-text:oklch(45% .2 310);--muted:oklch(58% .08 312);--line:oklch(70% .08 315/.55);--shadow:0 18px 40px -18px oklch(35% .12 310/.45);--font-display:"Archivo","Helvetica Neue",Arial,sans-serif;--font-body:"Archivo","Helvetica Neue",Arial,sans-serif;--font-script:"Yellowtail",cursive;--u:.0703cqh}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-body);color:var(--fg);background:linear-gradient(178deg,var(--bg-top) 0%, var(--bg-bot) 62%, oklch(85% .085 320) 100%);-webkit-font-smoothing:antialiased;overflow:hidden}#root{place-items:center;width:100vw;height:100dvh;display:grid;overflow:hidden}button{cursor:pointer;font-family:inherit}.bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.bg:after{content:"";background:radial-gradient(120% 70% at 50% 0,#0000 55%,oklch(80% .09 320/.35) 100%);position:absolute;inset:0}.bg:before{content:"";background:radial-gradient(38% 30% at 22% 28%,oklch(93% .07 330/.55),#0000 70%),radial-gradient(34% 26% at 78% 72%,oklch(90% .06 280/.5),#0000 70%);animation:26s ease-in-out infinite alternate drift;position:absolute;inset:-20%}@keyframes drift{0%{transform:translate(-2%,-1%)scale(1)rotate(0)}50%{transform:translate(3%,2%)scale(1.08)rotate(2deg)}to{transform:translate(-1%,3%)scale(1.02)rotate(-2deg)}}.frame{z-index:2;width:100vw;height:100dvh;position:relative;container-type:size}.stage{width:100%;height:100%;padding:calc(34*var(--u)) calc(40*var(--u)) calc(30*var(--u));flex-direction:column;display:flex;position:relative;overflow:hidden}.stage>.screen,.stage>.brand{z-index:2}.motes{pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.mote{fill:oklch(100% 0 0/.85);will-change:transform,opacity;animation:linear infinite float;position:absolute;bottom:0}.mote i{animation:ease-in-out infinite moteGlow;display:block}@keyframes float{0%{transform:translateY(8vh)rotate(0)}to{transform:translate3d(var(--dx,2vw),-108vh,0) rotate(200deg)}}@keyframes moteGlow{0%,to{opacity:.15}50%{opacity:.9}}.brand{top:calc(34*var(--u));left:calc(40*var(--u));letter-spacing:-.02em;font-weight:800;font-size:calc(30*var(--u));color:var(--ink);z-index:6;position:absolute}.brand span{font-weight:400}.screen{padding:calc(34*var(--u)) calc(40*var(--u)) calc(36*var(--u));-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-direction:column;align-items:center;display:flex;position:absolute;inset:0;overflow-y:auto}.screen::-webkit-scrollbar{display:none}.screen[data-state=out]{opacity:0;transform:translateY(calc(-14*var(--u))) scale(.985);pointer-events:none}.screen[data-state=in]{opacity:1;transition:opacity .5s,transform .6s cubic-bezier(.2,.9,.25,1);transform:none}.screen[data-state=pre]{opacity:0;transform:translateY(calc(22*var(--u))) scale(.99);pointer-events:none}.idle-screen{justify-content:center;gap:calc(20*var(--u));cursor:pointer;text-align:center}.idle-screen .wordmark{width:calc(560*var(--u));max-width:82%;height:auto}.idle-screen .tagline{font-family:var(--font-script);font-size:calc(72*var(--u));background:linear-gradient(96deg,var(--plum) 0%,var(--plum-2) 100%);color:#0000;padding:0 calc(20*var(--u));-webkit-background-clip:text;background-clip:text;line-height:1.4}.idle-screen .cue{margin-top:calc(10*var(--u));font-size:calc(24*var(--u));color:var(--plum-text);letter-spacing:.04em;animation:2.6s ease-in-out infinite cueBreath}@keyframes cueBreath{0%,to{opacity:.55}50%{opacity:1}}.nav{top:calc(96*var(--u));left:calc(40*var(--u));right:calc(40*var(--u));z-index:5;justify-content:space-between;align-items:center;display:flex;position:absolute}.icon-btn{width:calc(58*var(--u));height:calc(58*var(--u));background:radial-gradient(120% 120% at 30% 20%, var(--plum-2), var(--plum));color:#fff;cursor:pointer;box-shadow:var(--shadow), inset 0 1px 0 oklch(100% 0 0/.35);border:none;border-radius:50%;place-items:center;transition:transform .25s cubic-bezier(.2,1.6,.4,1),filter .25s;display:grid}.icon-btn:active{transform:scale(.94)}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;width:44%;height:44%}.pill-next{align-items:center;gap:calc(16*var(--u));padding:calc(6*var(--u)) calc(6*var(--u)) calc(6*var(--u)) calc(30*var(--u));cursor:pointer;background:var(--surface-2);box-shadow:var(--shadow);font-family:var(--font-body);font-style:italic;font-weight:500;font-size:calc(22*var(--u));color:var(--plum-text);border:none;border-radius:999px;transition:transform .3s cubic-bezier(.2,1.4,.4,1),opacity .3s,box-shadow .3s;display:flex}.pill-next .dot{width:calc(52*var(--u));height:calc(52*var(--u));background:radial-gradient(120% 120% at 30% 20%, var(--plum-2), var(--plum));color:#fff;border-radius:50%;place-items:center;display:grid;box-shadow:inset 0 1px oklch(100% 0 0/.35)}.pill-next .dot svg{fill:none;stroke:currentColor;stroke-width:2.8px;stroke-linecap:round;stroke-linejoin:round;width:44%;height:44%}.pill-next:disabled{opacity:.42;cursor:not-allowed;filter:saturate(.4)}.pill-next.ready{animation:2.4s ease-in-out infinite beckon}@keyframes beckon{0%,to{box-shadow:var(--shadow)}50%{box-shadow:var(--shadow),0 0 0 calc(9*var(--u)) oklch(70% .13 315/.16)}}.h1{font-family:var(--font-display);letter-spacing:-.035em;font-weight:700;font-size:calc(112*var(--u));color:var(--ink);text-align:center;text-wrap:balance;line-height:.94}.h1 .script{font-family:var(--font-script);letter-spacing:0;font-weight:400;font-size:calc(104*var(--u));vertical-align:baseline;margin:calc(-30*var(--u)) calc(-2*var(--u)) calc(-22*var(--u));padding:0 calc(22*var(--u)) 0 calc(14*var(--u));background:linear-gradient(96deg,var(--plum) 0%,var(--plum-2) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;line-height:1.5;display:inline-block;overflow:visible}.h2{font-family:var(--font-display);letter-spacing:-.03em;font-weight:600;font-size:calc(86*var(--u));text-align:center;background:linear-gradient(94deg,var(--plum) 8%,var(--plum-2) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;line-height:1}.sub{font-size:calc(24*var(--u));color:var(--plum-text);margin-top:calc(10*var(--u));letter-spacing:.005em}.screen-head{margin-top:calc(150*var(--u));place-items:center;display:grid}.cap-h1{margin-top:calc(72*var(--u))}.word{opacity:0;animation:.7s cubic-bezier(.2,.9,.2,1) forwards wordUp;display:inline-block;transform:translateY(.5em)rotate(1.5deg)}@keyframes wordUp{to{opacity:1;transform:none}}.script-in{opacity:0;animation:.9s cubic-bezier(.2,1.35,.3,1) forwards scriptIn;display:inline-block;transform:translateY(.35em)rotate(-7deg)scale(.8)}@keyframes scriptIn{60%{opacity:1}to{opacity:1;transform:rotate(-2.5deg)}}.flourish{margin-top:calc(18*var(--u));width:calc(220*var(--u));opacity:0;animation:.8s .9s forwards fadeIn}.flourish path{stroke:oklch(52% .16 5);stroke-width:1.6px;fill:none;stroke-dasharray:var(--len,420);stroke-dashoffset:var(--len,420);animation:1.6s cubic-bezier(.5,0,.2,1) .9s forwards draw}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadeIn{to{opacity:1}}.cam-wrap{margin-top:calc(26*var(--u));flex:1;place-items:center;width:100%;display:grid;position:relative}.cam-ring{width:calc(560*var(--u));aspect-ratio:.71;border-radius:999px;place-items:center;display:grid;position:relative}.cam-ring:after{content:"";pointer-events:none;border:1.5px solid var(--line);border-radius:inherit;animation:5s ease-in-out infinite ringBreath;position:absolute;inset:0}@keyframes ringBreath{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.018)}}.cam-oval{background:linear-gradient(160deg,oklch(72% .03 300),oklch(58% .02 300));border:2px solid oklch(62% .14 312/.8);border-radius:999px;width:80%;height:88.5%;animation:1s cubic-bezier(.2,1.1,.3,1) .25s both ovalIn;position:relative;overflow:hidden;transform:translateZ(0);box-shadow:0 26px 60px -26px oklch(30% .12 310/.6)}@keyframes ovalIn{0%{opacity:0;transform:translateY(calc(40*var(--u))) scale(.92)}}.cam-oval video,.cam-oval .frozen{object-fit:cover;width:100%;height:100%;display:block;transform:scaleX(-1)}.cam-oval .fallback{place-items:center;gap:calc(10*var(--u));text-align:center;color:oklch(97% .01 315);font-size:calc(19*var(--u));background:linear-gradient(160deg,oklch(66% .04 305),oklch(50% .03 305));padding:0 12%;line-height:1.5;display:grid;position:absolute;inset:0}.cam-oval .fallback b{font-size:calc(22*var(--u));margin-bottom:calc(6*var(--u));font-weight:600;display:block}.cam-oval .fallback .skip{margin-top:calc(20*var(--u));color:#fff;cursor:pointer;padding:calc(12*var(--u)) calc(26*var(--u));font-family:var(--font-body);font-size:calc(18*var(--u));letter-spacing:.02em;background:oklch(100% 0 0/.16);border:1px solid oklch(100% 0 0/.6);border-radius:999px;font-weight:600;transition:background .25s,transform .25s;display:inline-block}.cam-oval .fallback .skip:active{transform:translateX(calc(3*var(--u)));background:oklch(100% 0 0/.28)}.frame-hint{left:50%;bottom:calc(72*var(--u));text-align:center;white-space:nowrap;max-width:88%;padding:calc(14*var(--u)) calc(30*var(--u));font-family:var(--font-body);font-weight:600;font-size:calc(30*var(--u));letter-spacing:.01em;color:oklch(99% .01 315);-webkit-backdrop-filter:blur(12px);box-shadow:0 calc(12*var(--u)) calc(34*var(--u)) -8px oklch(20% .1 310/.55);pointer-events:none;background:oklch(32% .05 310/.52);border:1px solid oklch(100% 0 0/.3);border-radius:999px;animation:.28s cubic-bezier(.2,1.1,.3,1) both hintIn;position:absolute;transform:translate(-50%)}.frame-hint.ok{color:oklch(98% .03 155);background:oklch(46% .12 158/.5);border-color:oklch(85% .15 158/.55)}@keyframes hintIn{0%{opacity:0;transform:translate(-50%,calc(12*var(--u)))}to{opacity:1;transform:translate(-50%)}}.flash{opacity:0;pointer-events:none;background:#fff;position:absolute;inset:0}.flash.go{animation:.55s ease-out flash}@keyframes flash{0%{opacity:0}8%{opacity:.92}to{opacity:0}}.count{pointer-events:none;font-family:var(--font-display);font-weight:700;font-size:calc(190*var(--u));color:oklch(100% 0 0/.92);text-shadow:0 calc(6*var(--u)) calc(30*var(--u)) oklch(30% .12 310/.5);place-items:center;display:grid;position:absolute;inset:0}.count span{animation:.9s cubic-bezier(.2,1.3,.3,1) countPop}@keyframes countPop{0%{opacity:0;transform:scale(1.7)}30%{opacity:1;transform:scale(1)}70%{opacity:1}to{opacity:0;transform:scale(.82)}}.spark{width:calc(34*var(--u));fill:var(--plum-lite);opacity:.9;animation:3.2s ease-in-out infinite twinkle;position:absolute;top:50%}.spark.l{left:calc(-46*var(--u));transform:translateY(-50%)}.spark.r{right:calc(-46*var(--u));animation-delay:1.1s;transform:translateY(-50%)}@keyframes twinkle{0%,to{opacity:.35;transform:translateY(-50%)scale(.8)rotate(0)}50%{opacity:1;transform:translateY(-50%)scale(1.15)rotate(90deg)}}.capture-row{justify-content:center;align-items:center;gap:calc(18*var(--u));margin-top:calc(30*var(--u));animation:.8s cubic-bezier(.2,1,.3,1) .5s both riseIn;display:flex}.capture{padding:calc(6*var(--u)) calc(48*var(--u)) calc(6*var(--u)) calc(6*var(--u));align-items:center;gap:calc(28*var(--u));background:var(--surface);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;box-shadow:var(--shadow);border:1px solid oklch(100% 0 0/.6);border-radius:999px;transition:transform .3s cubic-bezier(.2,1.4,.4,1);display:flex;position:relative}.capture:active{transform:scale(.97)}.capture:disabled{opacity:.55;cursor:wait}.capture .lens{width:calc(96*var(--u));height:calc(96*var(--u));background:radial-gradient(130% 130% at 32% 22%, var(--plum-2), var(--plum) 72%);border:calc(4*var(--u)) solid oklch(100% 0 0/.7);color:#fff;border-radius:50%;place-items:center;animation:2.6s ease-out infinite pulse;display:grid;box-shadow:0 0 oklch(52% .19 312/.45)}@keyframes pulse{0%{box-shadow:0 0 oklch(52% .19 312/.5)}70%,to{box-shadow:0 0 0 calc(26*var(--u)) oklch(52% .19 312/0)}}.capture .lens svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:52%;height:52%}.capture .label{letter-spacing:.14em;font-weight:600;font-size:calc(23*var(--u));color:var(--plum-text)}.retake{background:var(--surface-2);color:var(--plum-text);font-family:var(--font-body);letter-spacing:.02em;font-weight:600;font-size:calc(22*var(--u));padding:calc(24*var(--u)) calc(40*var(--u));cursor:pointer;box-shadow:var(--shadow);border:1px solid oklch(100% 0 0/.6);border-radius:999px;transition:transform .3s cubic-bezier(.2,1.4,.4,1)}.retake:active{transform:scale(.97)}.tip{margin-top:calc(24*var(--u));font-size:calc(20*var(--u));color:var(--plum-text);align-items:center;gap:calc(14*var(--u));opacity:0;animation:.9s 1.2s forwards fadeIn;display:flex}.tip svg{width:calc(18*var(--u));fill:oklch(100% 0 0/.95)}@keyframes riseIn{0%{opacity:0;transform:translateY(calc(30*var(--u)))}to{opacity:1;transform:none}}.quiz-card{width:100%;margin-top:calc(40*var(--u));border-radius:calc(56*var(--u));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:calc(46*var(--u)) calc(30*var(--u)) calc(52*var(--u));gap:calc(30*var(--u));background:linear-gradient(oklch(97% .02 316/.5),oklch(93% .05 318/.28));border:1px solid oklch(100% 0 0/.45);flex-direction:column;animation:.85s cubic-bezier(.2,1,.3,1) .1s both riseIn;display:flex;box-shadow:0 30px 70px -40px oklch(35% .12 310/.5)}.q-block{opacity:0;animation:.7s cubic-bezier(.2,1,.3,1) forwards riseIn}.q-head{padding:calc(20*var(--u));text-align:center;font-family:var(--font-display);letter-spacing:.02em;font-weight:700;font-size:calc(30*var(--u));color:var(--ink);text-transform:uppercase;background:oklch(98% .008 316/.72);border:1px solid oklch(100% 0 0/.6);border-radius:999px;box-shadow:inset 0 1px oklch(100% 0 0/.7),0 8px 20px -14px oklch(35% .1 310/.5)}.chips{gap:calc(18*var(--u));margin-top:calc(22*var(--u));grid-template-columns:repeat(4,1fr);display:grid}.chip{cursor:pointer;padding:calc(20*var(--u)) calc(8*var(--u));font-family:var(--font-body);font-size:calc(24*var(--u));color:var(--plum-lite);opacity:0;transform:translateY(calc(14*var(--u))) scale(.94);background:oklch(97% .012 320/.8);border:none;border-radius:999px;font-weight:500;transition:color .25s,background .25s,transform .35s cubic-bezier(.2,1.5,.4,1),box-shadow .3s;animation:.55s cubic-bezier(.2,1.5,.35,1) forwards chipIn;position:relative;box-shadow:0 6px 14px -10px oklch(35% .1 310/.6),inset 0 1px oklch(100% 0 0/.8)}@keyframes chipIn{to{opacity:1;transform:none}}.chip.on{color:#fff;opacity:1;background:linear-gradient(96deg,var(--plum) 0%,var(--plum-2) 100%);font-weight:600;transform:none;box-shadow:0 14px 26px -14px oklch(38% .19 310/.9),inset 0 1px oklch(100% 0 0/.35)}.chip.on:after{content:"";border-radius:999px;animation:.7s ease-out ripple;position:absolute;inset:0;box-shadow:0 0 oklch(52% .19 312/.5)}@keyframes ripple{to{box-shadow:0 0 0 calc(20*var(--u)) oklch(52% .19 312/0)}}.progress{margin-top:calc(26*var(--u));align-items:center;gap:calc(12*var(--u));font-size:calc(19*var(--u));color:var(--plum-text);letter-spacing:.06em;display:flex}.progress .bar{width:calc(180*var(--u));height:calc(6*var(--u));background:oklch(100% 0 0/.55);border-radius:99px;overflow:hidden}.progress .bar i{background:linear-gradient(90deg,var(--plum),var(--plum-lite));transform-origin:0;border-radius:99px;width:100%;height:100%;transition:transform .5s cubic-bezier(.2,1,.3,1);display:block}.polas{width:100%;margin-top:calc(34*var(--u));perspective:1400px;flex:1;grid-template-columns:repeat(3,1fr);align-items:start;display:grid;position:relative}.pola{--tilt:0deg;padding:calc(14*var(--u)) calc(14*var(--u)) calc(74*var(--u));transform-origin:50% 100%;opacity:0;background:linear-gradient(#fbfafb,#eceaee);animation:1.05s cubic-bezier(.18,1.15,.3,1) forwards polaIn,7s ease-in-out infinite sway;position:relative;box-shadow:0 30px 55px -28px oklch(30% .1 310/.65)}@keyframes polaIn{0%{opacity:0;transform:translateY(calc(220*var(--u))) rotate(calc(var(--tilt) * 3)) scale(.82)}55%{opacity:1}70%{transform:translateY(calc(-12*var(--u))) rotate(calc(var(--tilt) * .55)) scale(1.02)}to{opacity:1;transform:translateY(0) rotate(var(--tilt)) scale(1)}}@keyframes sway{0%,to{filter:brightness()}50%{filter:brightness(1.03)}}.pola .shot{aspect-ratio:.8;object-fit:cover;background:linear-gradient(160deg,oklch(70% .03 300),oklch(56% .02 300));width:100%;display:block}.pola .sku{left:calc(14*var(--u));bottom:calc(18*var(--u));height:calc(46*var(--u));width:calc(168*var(--u));white-space:nowrap;color:#fff;font-size:calc(17*var(--u));letter-spacing:.02em;clip-path:inset(0 100% 0 0);place-items:center;animation:.7s cubic-bezier(.2,.9,.2,1) forwards skuFill;display:grid;position:absolute;overflow:hidden}.pola .sku em{opacity:0;padding:0 calc(18*var(--u));font-style:normal;animation:.4s .35s forwards fadeIn}@keyframes skuFill{to{clip-path:inset(0)}}.pola:first-child{--tilt:-7deg;margin-top:calc(6*var(--u));z-index:2}.pola:nth-child(2){--tilt:1.5deg;margin-top:calc(150*var(--u));z-index:3;margin-left:calc(-24*var(--u));margin-right:calc(-24*var(--u))}.pola:nth-child(3){--tilt:6deg;margin-top:calc(24*var(--u));z-index:1}.note{width:100%;margin-top:calc(28*var(--u));border-radius:calc(70*var(--u));padding:calc(56*var(--u)) calc(70*var(--u));text-align:center;opacity:0;background:linear-gradient(oklch(96% .03 318/.72),oklch(92% .055 320/.5));border:1px solid oklch(100% 0 0/.5);animation:.9s cubic-bezier(.2,1,.3,1) 1.75s forwards riseIn;position:relative;box-shadow:0 26px 60px -40px oklch(35% .12 310/.5)}.note p{font-family:var(--font-display);letter-spacing:-.02em;font-weight:500;font-size:calc(44*var(--u));color:var(--plum-text);min-height:calc(2 * 1.28 * 44 * var(--u));text-wrap:balance;line-height:1.28}.note .caret{vertical-align:-.12em;background:var(--plum-text);width:.06em;height:.92em;margin-left:.04em;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.note .spark{opacity:.55;top:50%}.glow-wait{justify-content:center;align-items:center;gap:calc(24*var(--u));flex-direction:column;flex:1;display:flex}.glow-wait .orb{width:calc(120*var(--u));height:calc(120*var(--u));background:radial-gradient(120% 120% at 30% 20%, var(--plum-lite), var(--plum));box-shadow:0 0 calc(60*var(--u)) calc(6*var(--u)) oklch(60% .16 315/.5);border-radius:50%;animation:1.8s ease-in-out infinite orbPulse}@keyframes orbPulse{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}.glow-wait p{font-family:var(--font-display);font-weight:500;font-size:calc(34*var(--u));color:var(--plum-text)}.keep{width:100%;margin-top:calc(30*var(--u));flex-direction:column;flex:1;align-items:center;display:flex}.strip{padding:calc(18*var(--u)) calc(18*var(--u)) calc(24*var(--u));gap:calc(12*var(--u));width:calc(250*var(--u));background:linear-gradient(#fbfafb,#eceaee);animation:1s cubic-bezier(.18,1.15,.3,1) .15s both stripIn;display:grid;position:relative;transform:rotate(-1.6deg);box-shadow:0 30px 60px -30px oklch(30% .1 310/.7)}@keyframes stripIn{0%{opacity:0;transform:translateY(calc(140*var(--u))) rotate(-8deg) scale(.9)}70%{transform:translateY(calc(-8*var(--u))) rotate(-.6deg) scale(1.01)}to{opacity:1;transform:rotate(-1.6deg)}}.strip .shot{aspect-ratio:1;object-fit:cover;background:linear-gradient(160deg,oklch(70% .03 300),oklch(56% .02 300));width:100%;display:block}.strip .cap{text-align:center;font-family:var(--font-script);font-size:calc(30*var(--u));color:var(--plum-text);padding-top:calc(4*var(--u))}.keep-side{justify-content:center;align-items:center;gap:calc(26*var(--u));text-align:center;flex-direction:column;flex:1;display:flex}.keep-row{grid-template-columns:calc(250*var(--u)) 1fr;gap:calc(46*var(--u));align-items:center;width:100%;display:grid}.keep h3{font-family:var(--font-display);letter-spacing:-.025em;font-weight:600;font-size:calc(46*var(--u));color:var(--plum-text)}.keep .lede{font-size:calc(22*var(--u));color:var(--muted);max-width:38ch;line-height:1.5}.qr{width:calc(230*var(--u));height:calc(230*var(--u));border-radius:calc(20*var(--u));border:calc(10*var(--u)) solid #fff;box-shadow:var(--shadow);background:#fff;place-items:center;animation:.8s cubic-bezier(.2,1,.3,1) .5s both riseIn;display:grid;overflow:hidden}.qr svg{width:100%;height:100%;display:block}.qr.pending{background:repeating-conic-gradient(var(--ink) 0 25%, transparent 0 50%) 0 0/ calc(28*var(--u)) calc(28*var(--u));opacity:.35}.shades{width:100%;margin-top:calc(30*var(--u));gap:calc(12*var(--u));display:grid}.shade{align-items:center;gap:calc(20*var(--u));padding:calc(16*var(--u)) calc(24*var(--u));opacity:0;background:oklch(98% .012 318/.7);border:1px solid oklch(100% 0 0/.55);border-radius:999px;animation:.6s cubic-bezier(.2,1,.3,1) forwards riseIn;display:flex}.shade .dot{width:calc(38*var(--u));height:calc(38*var(--u));border-radius:50%;box-shadow:inset 0 2px 4px oklch(0% 0 0/.25)}.shade .name{font-size:calc(24*var(--u));color:var(--ink);font-weight:500}.shade .why{font-size:calc(19*var(--u));color:var(--muted);margin-left:auto;font-style:italic}.actions{gap:calc(18*var(--u));width:100%;margin-top:calc(30*var(--u));display:flex}.btn{cursor:pointer;padding:calc(26*var(--u));font-family:var(--font-body);font-size:calc(24*var(--u));letter-spacing:.02em;border:none;border-radius:999px;flex:1;font-weight:600;transition:transform .3s cubic-bezier(.2,1.4,.4,1),box-shadow .3s}.btn:active{transform:scale(.98)}.btn.primary{background:linear-gradient(96deg,var(--plum),var(--plum-2));color:#fff;box-shadow:var(--shadow)}.btn.quiet{color:var(--plum-text);background:oklch(98% .012 318/.7);border:1px solid oklch(100% 0 0/.6)}.idle{margin-top:calc(22*var(--u));font-size:calc(19*var(--u));color:var(--muted);align-items:center;gap:calc(12*var(--u));display:flex}.idle .track{width:calc(120*var(--u));height:calc(4*var(--u));background:oklch(100% 0 0/.6);border-radius:99px;overflow:hidden}.idle .track i{background:var(--plum-lite);transform-origin:0;height:100%;animation:drain var(--drain,45s) linear forwards;display:block}@keyframes drain{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media (orientation:landscape){.screen{padding:calc(26*var(--u)) calc(70*var(--u))}.screen-head{margin-top:calc(56*var(--u))}.screen--capture{grid-template-columns:calc(560*var(--u)) auto;place-content:center space-evenly;align-items:center;row-gap:calc(16*var(--u));grid-template-areas:"cam title""cam capture""cam tip";display:grid}.screen--capture .h1{text-align:left;text-wrap:balance;grid-area:title}.screen--capture .cap-h1{margin-top:0}.screen--capture .flourish{display:none}.screen--capture .cam-wrap{grid-area:cam;margin-top:0}.screen--capture .capture-row{grid-area:capture;justify-content:flex-start;margin-top:0}.screen--capture .tip{grid-area:tip;justify-content:flex-start;margin-top:0}.screen--quiz{justify-content:center}.screen--quiz .quiz-card{max-width:calc(1120*var(--u));margin:calc(24*var(--u)) auto 0}.screen--note{justify-content:center}.screen--note .polas{max-width:calc(820*var(--u));margin:calc(10*var(--u)) auto 0;flex:none}.screen--note .pola:nth-child(2){margin-top:calc(70*var(--u))}.screen--note .note{max-width:calc(940*var(--u));margin:calc(26*var(--u)) auto 0}.screen--keepsake .keep{align-content:center;column-gap:calc(54*var(--u));row-gap:calc(20*var(--u));margin-top:calc(14*var(--u));grid-template-columns:1.15fr .85fr;grid-template-areas:"row shades""row actions""row idle";display:grid}.screen--keepsake .keep-row{grid-area:row;align-self:center}.screen--keepsake .shades{grid-area:shades;align-self:end;margin-top:0}.screen--keepsake .actions{grid-area:actions;margin-top:0}.screen--keepsake .idle{grid-area:idle;margin-top:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
