:root{--slate:#1D232A;--deep:#14181D;--surface:#2A323C;--raised:#343E4A;--indigo:#7480FF;--indigo-pale:#B4BBFF;--paper:#F2F4F8;--mist:#A6ADBB;--wide:"Encode Sans Expanded","Encode Sans",system-ui,sans-serif;--text:"Encode Sans",system-ui,sans-serif;--peek:72px;}*,*::before,*::after{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--slate);color:var(--paper);font-family:var(--text);font-weight:400;-webkit-font-smoothing:antialiased;overflow:hidden;-webkit-tap-highlight-color:transparent;}.field{position:fixed;inset:0;overflow:hidden;display:none}.field i{position:absolute;border-radius:50%}.field i:nth-child(1){width:560px;height:560px;left:-180px;bottom:-220px;background:var(--surface)}.field i:nth-child(2){width:300px;height:300px;right:8%;top:-120px;background:var(--indigo);opacity:.9}.field i:nth-child(3){width:120px;height:120px;right:16%;bottom:12%;background:var(--raised)}.app{position:relative;height:100vh;height:100dvh;max-width:480px;margin:0 auto;display:flex;flex-direction:column;background:var(--slate);padding-top:env(safe-area-inset-top);overflow:hidden;}.bar{display:flex;align-items:center;gap:12px;padding:10px 16px 6px;flex:none;}.logo{width:48px;height:48px;border-radius:14px;display:block;flex:none;box-shadow:0 1px 2px rgba(0,0,0,.4),0 4px 10px rgba(0,0,0,.25)}.brand{font-family:var(--wide);font-weight:600;font-size:clamp(.95rem,.9rem + .3vw,1.05rem);letter-spacing:.01em}.bar .tag{margin-left:auto;font-size:.8rem;color:var(--mist)}main{flex:1;min-height:0;display:flex;flex-direction:column}.head{padding:10px 16px 14px;flex:none}h1{margin:0;font-family:var(--wide);font-weight:800;font-size:clamp(1.4rem,1.02rem + 1.7vw,1.7rem);line-height:1.16;letter-spacing:-.01em;text-wrap:balance;}h1 em{font-style:normal;color:var(--indigo-pale)}.sub{margin:10px 0 0;font-size:clamp(.92rem,.88rem + .2vw,1rem);line-height:1.45;color:var(--mist);max-width:38ch;}.well{position:relative;flex:1;min-height:0;overflow:hidden}.stage{position:absolute;left:16px;right:16px;top:2px;bottom:calc(var(--peek) + 14px);transform-origin:50% 0;will-change:transform,opacity;}.page{height:100%;background:var(--surface);border-radius:20px;padding:12px;display:flex;flex-direction:column;gap:10px;box-shadow:0 1px 2px rgba(0,0,0,.35),0 6px 16px rgba(0,0,0,.22);}.page-top{display:flex;align-items:center;justify-content:space-between;flex:none}.chip{font-family:var(--wide);font-weight:600;font-size:.74rem;letter-spacing:.04em;color:var(--deep);background:var(--indigo-pale);padding:6px 12px;border-radius:8px;}.track{display:flex;gap:5px;align-items:center}.track i{width:18px;height:4px;border-radius:2px;background:var(--raised)}.track i:first-child{background:var(--indigo)}.panels{flex:1;min-height:0;display:grid;gap:8px;grid-template-columns:1.25fr 1fr;grid-template-rows:1.2fr 1fr;}.panels > span{position:relative;background:var(--raised);border-radius:10px;overflow:hidden;display:block}.panels .a{grid-row:1 / 3}.panels .b{background:var(--indigo)}.panels i{position:absolute;display:block}.a .sun{width:64%;aspect-ratio:1;border-radius:50%;background:var(--slate);left:18%;bottom:-14%}.a .head2{width:30%;aspect-ratio:1;border-radius:50%;background:var(--mist);left:35%;bottom:38%}.a .bub{width:46%;height:20%;border-radius:50%;background:var(--paper);right:8%;top:9%}.a .bub::after{content:"";position:absolute;left:22%;bottom:-18%;width:22%;height:40%;background:var(--paper);border-radius:0 0 100% 0}.b .bolt{left:-10%;right:-10%;top:42%;height:16%;background:var(--deep);transform:rotate(-14deg)}.b .dot{width:26%;aspect-ratio:1;border-radius:50%;background:var(--paper);right:12%;top:14%}.c .l1,.c .l2,.c .l3{left:12%;height:9%;border-radius:4px;background:var(--mist);opacity:.75}.c .l1{top:22%;width:70%}.c .l2{top:44%;width:52%}.c .l3{top:66%;width:62%;background:var(--indigo-pale);opacity:1}.sheet{position:absolute;left:0;right:0;top:0;height:100%;background:var(--raised);border-radius:28px 28px 0 0;box-shadow:0 -1px 2px rgba(0,0,0,.3),0 -8px 24px rgba(0,0,0,.28);display:flex;flex-direction:column;touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:contain;will-change:transform;transform:translate3d(0,calc(100% - var(--peek)),0);cursor:grab;}.sheet.dragging{cursor:grabbing}.sheet::after{content:"";position:absolute;left:0;right:0;top:100%;height:200px;background:var(--raised)}.handle{all:unset;box-sizing:border-box;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;height:var(--peek);flex:none;padding:20px 20px 0;position:relative;cursor:inherit;border-radius:28px 28px 0 0;transition:transform .12s cubic-bezier(.2,.8,.2,1);}.handle:active{transform:scale(.985)}.handle::before{content:"";position:absolute;left:50%;top:10px;width:32px;height:4px;margin-left:-16px;border-radius:2px;background:var(--mist);opacity:.7}.handle:focus-visible{outline:3px solid var(--indigo-pale);outline-offset:-4px}.handle .t{font-family:var(--wide);font-weight:600;font-size:clamp(.86rem,.82rem + .25vw,.95rem);color:var(--paper)}.handle .chev{width:40px;height:40px;border-radius:50%;background:var(--surface);display:grid;place-items:center;flex:none}.handle .chev svg{width:20px;height:20px;display:block;will-change:transform}.rows{list-style:none;margin:0;padding:6px 12px 12px;flex:1;min-height:0;display:flex;flex-direction:column;gap:6px}.rows li{flex:1;min-height:0;display:grid;grid-template-columns:40px 1fr;align-items:center;column-gap:14px;padding:8px 12px;background:var(--surface);border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.25);will-change:transform,opacity;}.rows .ic{width:40px;height:40px;border-radius:12px;background:var(--indigo);display:grid;place-items:center}.rows .ic svg{width:22px;height:22px;display:block}.rows strong{display:block;font-family:var(--wide);font-weight:600;font-size:clamp(.82rem,.79rem + .2vw,.9rem);color:var(--paper);line-height:1.25}.rows small{display:block;font-size:clamp(.8rem,.77rem + .15vw,.86rem);color:var(--mist);line-height:1.3;margin-top:2px}.action{position:relative;z-index:2;flex:none;background:var(--surface);padding:14px 16px 10px;box-shadow:0 -1px 2px rgba(0,0,0,.3),0 -6px 18px rgba(0,0,0,.22);}.cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;width:100%;background:var(--paper);color:var(--deep);border-radius:28px;font-family:var(--wide);font-weight:800;font-size:clamp(.98rem,.93rem + .3vw,1.08rem);text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.28);transition:transform .12s cubic-bezier(.2,.8,.2,1);}.cta svg{width:20px;height:20px;display:block}.cta:active{transform:scale(.97)}.cta:focus-visible{outline:3px solid var(--indigo-pale);outline-offset:3px}.worry{margin:10px 0 0;text-align:center;font-size:clamp(.8rem,.77rem + .15vw,.86rem);line-height:1.4;color:var(--mist)}footer{position:relative;z-index:2;flex:none;background:var(--surface);text-align:center;font-size:.75rem;color:var(--mist);padding:2px 16px calc(10px + env(safe-area-inset-bottom));}@media (hover: hover){.cta:hover{background:#fff}.handle:hover .chev{background:var(--slate)}}@media (max-height: 640px){.sub{display:none}.rows small{display:none}:root{--peek:64px}}@media (min-width: 700px){body{background:var(--deep);display:grid;place-items:center}.field{display:block}.app{width:440px;height:min(100dvh - 48px,860px);border-radius:32px;box-shadow:0 2px 4px rgba(0,0,0,.4),0 24px 60px rgba(0,0,0,.45);}.bar{padding-top:18px}}@media (min-width: 1000px){.bar .logo{position:fixed;left:56px;top:48px;width:112px;height:112px;border-radius:28px}}@media (prefers-reduced-motion: reduce){.cta,.handle{transition:none}}html,body{max-width:100%;overflow-x:clip}