@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 400;font-display:swap;
  src:url(/art/fraunces-latin.woff2) format('woff2')}


:root{
  --bg:#191519; --bg2:#0e0c0f;
  --ink:#f4efe6; --dim:#a29b93; --dimmer:#8c8680; --cream:#f6efe2;
  --gold:#e8c988; --gold-lo:#d9b46c; --gold-hi:#f7e3b0; --gold-ink:#2b2008;
  --edge:rgba(255,243,228,.20); --edge-soft:rgba(255,243,228,.11);
  --glass:rgba(255,245,232,.05);
  --r-pill:var(--round,12px);   
  --sans:'Avenir Next','Avenir','Segoe UI',system-ui,sans-serif;
  --serif:ui-serif,Georgia,serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
*{box-sizing:border-box;margin:0;padding:0}
body{overflow-x:clip}   

body{
  background:#0b090b;
  color:var(--ink); font:400 16px/1.6 var(--sans);
  min-height:100vh; -webkit-font-smoothing:antialiased;
}


.backdrop{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  will-change:transform;
  background:url('/art/process.jpg') no-repeat center 42%/cover;
  opacity:.92; transform-origin:50% 40%;
  
  -webkit-mask-image:radial-gradient(56% 40% at 50% 40%, rgba(0,0,0,.5) 0%, rgba(0,0,0,.84) 60%, #000 100%);
          mask-image:radial-gradient(56% 40% at 50% 40%, rgba(0,0,0,.5) 0%, rgba(0,0,0,.84) 60%, #000 100%);
}
@media(max-width:640px){
  .backdrop{
    opacity:.78;
    background-image:url('/art/process-mobile.jpg');
    background-position:50% 46%;
    -webkit-mask-image:radial-gradient(88% 52% at 50% 44%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.9) 66%, #000 100%);
            mask-image:radial-gradient(88% 52% at 50% 44%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.9) 66%, #000 100%);
  }
}

@keyframes fmDrift{
  from{ transform:translate3d(0,0,0) scale(1) }
  to  { transform:translate3d(0,-17vh,0) scale(1.08) }
}

@supports (animation-timeline: scroll()){
  .backdrop{ animation:fmDrift linear both; animation-timeline:scroll(root block) }
}
@media(prefers-reduced-motion:reduce){
  .backdrop{ transform:none !important; animation:none !important }
}
.scrim{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(46% 42% at 50% 38%, rgba(20,16,21,.74) 0%,
             rgba(20,16,21,.5) 46%, rgba(20,16,21,.14) 72%, transparent 88%);
}
@media(max-width:640px){
  
  .scrim{background:linear-gradient(180deg, rgba(20,16,21,.90) 0%, rgba(20,16,21,.82) 34%,
         rgba(20,16,21,.44) 62%, rgba(20,16,21,.18) 100%)}
}
.sky{
  position:fixed; inset:-30vh -30vw; z-index:0; pointer-events:none;
  background:
    radial-gradient(55% 45% at 18% 10%, rgba(232,201,136,.08), transparent 62%),
    radial-gradient(50% 42% at 85% 24%, rgba(155,188,220,.05), transparent 65%);
  animation:breathe 26s ease-in-out infinite alternate;
}
@keyframes breathe{ to{ transform:translate3d(2.5%,1.5%,0) scale(1.05) } }
main{position:relative; z-index:1; max-width:880px; margin:0 auto; padding:0 26px}


.avatarbtn{padding:0; border:0; background:none}
.brand em{color:var(--gold); font-style:normal}

.screen{min-height:100vh;min-height:100svh; display:flex; flex-direction:column; padding-bottom:10px}
h1{
  font:400 clamp(30px,4.4vw,46px)/1.05 var(--serif); color:var(--cream);
  letter-spacing:.01em; margin-bottom:12px;
}
h1 em{font-style:italic; color:var(--gold-hi)}
.cta{
  display:inline-flex; align-items:center; gap:9px; text-decoration:none; cursor:pointer;
  padding:12.5px 32px; border-radius:var(--r-pill); font:700 15px/1.2 var(--sans); text-align:center;   
}
.cta.go{
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo)); color:var(--gold-ink);
  box-shadow:0 2px 8px -1px rgba(14,8,4,.42), inset 0 1px 0 rgba(255,250,240,.2), 0 0 34px -8px rgba(232,201,136,.45);
}
.cta.ghost{background:var(--glass); color:var(--ink); border:1px solid var(--edge-soft)}
.cta:hover{transform:translateY(-1px)}

section{padding:8vh 0}
h2{font:700 26px/1.2 var(--sans); letter-spacing:-.2px; margin-bottom:10px; text-align:center}

.three{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:30px}
.card{
  background:var(--glass); border:1px solid var(--edge-soft); border-radius:14px;
  padding:16px 15px; box-shadow:inset 0 1px 0 rgba(255,250,240,.08); text-align:left;
}
.card h3{font:700 14px/1.3 var(--sans); margin-bottom:4px}
.card p{color:var(--dim); font-size:12.5px; line-height:1.45}

@media(max-width:820px){ .three{grid-template-columns:repeat(2,1fr)} }

.price{
  text-align:center; border:1px solid var(--edge-soft); background:var(--glass);
  border-radius:22px; padding:34px 26px; max-width:460px; margin:0 auto;
  box-shadow:inset 0 1px 0 rgba(255,250,240,.10);
}
.price .amt{font:700 46px/1 var(--sans); color:var(--gold); letter-spacing:-1px}
.price .per{color:var(--dimmer); font-size:13.5px; margin-top:8px}
.price ul{list-style:none; margin:22px 0 24px; text-align:left; display:inline-block}
.price li{color:var(--dim); font-size:14.5px; margin-bottom:9px; padding-left:22px; position:relative}
.price li::before{content:'✓'; position:absolute; left:0; color:var(--gold)}
.price li b{color:var(--ink); font-weight:600}


.tab{
  background:var(--glass); border:1px solid var(--edge-soft); color:var(--dim);
  border-radius:var(--r-pill); padding:7px 18px; font:700 13px var(--sans); cursor:pointer;
}
.tab:hover{color:var(--ink)}
.tab.on{background:var(--gold); border-color:var(--gold); color:var(--gold-ink)}
.tab small{display:block; font:500 11px var(--sans); opacity:.7; margin-top:2px}

.master{
  background:var(--glass); border:1px solid var(--edge-soft); border-radius:20px;
  box-shadow:inset 0 1px 0 rgba(255,250,240,.10); overflow:hidden;
}
.mtag{color:var(--dim); font:600 13px var(--sans)}

.calc{
  
  background:linear-gradient(180deg, rgba(36,30,36,.96), rgba(23,19,23,.97));
  border:1px solid var(--edge-soft); border-radius:18px; overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,250,240,.09), 0 20px 50px -30px rgba(0,0,0,.8);
}
.calc .head{
  display:flex; align-items:baseline; gap:10px; padding:11px 22px;
  border-bottom:1px solid var(--edge-soft); font-size:12.5px; color:var(--dimmer);
}
.calc .head b{font:700 13px var(--sans); color:var(--ink); letter-spacing:.2px}
.calc .body{padding:0 22px 16px}


.slotwrap{margin-top:20px; display:flex; align-items:center; gap:16px}
.slotrail{flex:1 1 auto; min-width:0; position:relative}
.slotsecs{flex:0 0 auto; font:700 clamp(26px,3.4vw,34px)/1 var(--sans); color:var(--gold);
  letter-spacing:-1.2px; white-space:nowrap; min-width:2.6em; text-align:right}
.slotsecs em{font-style:normal; font-size:.55em; font-weight:600; color:var(--dim); margin-left:1px}
input[type=range]{
  -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--gold) var(--pct,0%), rgba(255,245,232,.14) var(--pct,0%));
  outline:none; cursor:pointer; display:block;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:28px; height:28px; border-radius:50%; cursor:grab;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));
  border:3px solid #16121a; box-shadow:0 3px 10px -1px rgba(0,0,0,.85);
}
input[type=range]:active::-webkit-slider-thumb{cursor:grabbing; transform:scale(1.06)}
input[type=range]:focus-visible{box-shadow:0 0 0 3px rgba(232,201,136,.35)}
input[type=range]::-moz-range-thumb{
  width:24px; height:24px; border-radius:50%; border:3px solid #16121a; cursor:grab;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));
}
.ticks{position:relative; height:22px; margin-top:12px}
.tick{position:absolute; top:0; transform:translateX(-50%); white-space:nowrap; text-align:center}
.tick::before{
  content:''; position:absolute; top:-15px; left:50%; width:2px; height:7px; border-radius:1px;
  background:var(--edge); transform:translateX(-50%); transition:background .18s;
}
.tick .pc{font:700 11px var(--sans); color:var(--dimmer); transition:color .18s}
.tick .sec{display:block; font:500 10px var(--sans); color:var(--dimmer); opacity:.75; margin-top:1px}
.tick.hit::before{background:var(--gold)}
.tick.hit .pc{color:#9ecfa6}
@media (max-width:520px){
  .tick .sec{display:none}
  
  .slotwrap{flex-direction:column; align-items:stretch; gap:4px}
  .slotsecs{order:-1; text-align:right; font-size:30px}
  .slotrail{width:100%}
  .calc .head{flex-wrap:wrap}         
  .curwrap button{padding:11px 12px}  
}

.youget{margin-top:20px; border:1px solid var(--edge); border-radius:14px;
  background:rgba(255,245,232,.03); overflow:hidden}
.yghead{display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:13px 17px; border-bottom:1px solid var(--edge-soft)}
.ygt{font:700 11.5px var(--sans); letter-spacing:.17em; text-transform:uppercase; color:var(--dim); white-space:nowrap}
.ygp{font:700 clamp(24px,3vw,30px)/1 var(--sans); color:var(--gold); letter-spacing:-1px; white-space:nowrap}
.ygp s{color:var(--dimmer); font-size:.58em; font-weight:600; margin-right:.3em}

.youget ul{list-style:none; margin:0; padding:9px 16px 15px}
.youget li{display:flex; align-items:flex-start; gap:8px; padding:6px 0;
  font:500 14.5px/1.45 var(--sans)}
.youget li .mk{flex:0 0 11px; text-align:left; font-weight:700; line-height:1.45}
.youget li .tx{flex:1 1 auto; min-width:0}
.youget li.yg-on{color:var(--ink)}
.youget li.yg-on .mk{color:#9ecfa6}
.youget li.yg-on b{color:var(--gold); font-weight:700}
.youget li.yg-off{color:var(--dimmer)}
.youget li.yg-off .mk{color:var(--dimmer)}

.youget .qm{position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; padding:0; margin:0 0 0 6px; vertical-align:-1px;
  border-radius:50%; border:1px solid currentColor; background:none; color:inherit;
  font:700 10px var(--sans); opacity:.55; cursor:pointer; -webkit-tap-highlight-color:transparent}
.youget .qm:hover,.youget .qm:focus-visible{opacity:1; outline:none; border-color:var(--gold); color:var(--gold)}

.youget .qm::before{content:''; position:absolute; inset:-8px}
.youget .hlp{display:none; margin:5px 0 2px; font:400 12.5px/1.5 var(--sans); color:var(--dim)}
.youget li.helpon .hlp{display:block}
.youget li.helpon .qm{opacity:1; color:var(--gold); border-color:var(--gold)}
@media (max-width:520px){
  .youget li{font-size:13.5px; padding:7px 0}
  .youget li .mk{flex-basis:11px}
  .yghead{padding:12px 14px}
  .youget ul{padding:8px 14px 13px}
  .ygp{font-size:20px}                
  .ygt{font-size:10.5px; letter-spacing:.14em}
}
.taxnote{text-align:center; font-size:11.5px; color:var(--dimmer); margin-top:9px}
.ygp .ygvat{font-size:11px; font-weight:600; letter-spacing:0; color:var(--dimmer); margin-left:5px; white-space:nowrap}   

.kinds{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin-top:8px}
.kind{
  --tint:232,201,136;
  display:flex; align-items:flex-start; gap:14px; text-align:left;
  background:linear-gradient(135deg, rgba(var(--tint),.12), rgba(var(--tint),.04));
  border:1px solid rgba(var(--tint),.28); border-radius:18px; padding:20px 18px;
  box-shadow:inset 0 1px 0 rgba(255,250,240,.08);
}
.kind.story{--tint:230,179,111} .kind.business{--tint:227,155,145}
.kind.commercial{--tint:127,199,189} .kind.informative{--tint:167,201,130}
.kind h3{font:700 16px/1.2 var(--sans); margin-bottom:4px}
.kind p{color:var(--dim); font-size:13.5px; line-height:1.5}
footer{padding:6vh 0 8vh; text-align:center; color:var(--dimmer); font-size:13px;
  position:relative; z-index:1}
@media(max-width:640px){ section{padding:6vh 0} }



main{min-height:100vh; display:flex; flex-direction:column}
main > .screen{flex:1; min-height:0}
footer{padding:26px 0 30px}


h1{font-size:clamp(38px,5.6vw,60px); margin-bottom:20px}


.usecases{
  position:relative;
  width:100vw; margin-left:calc(50% - 50vw);
  min-height:100svh; padding:16px 0 24px; background:transparent;
  display:flex; flex-direction:column;
}

.usecases::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(96deg, rgba(11,9,11,.84) 0%, rgba(11,9,11,.76) 26%,
             rgba(11,9,11,.5) 46%, rgba(11,9,11,.22) 66%, rgba(11,9,11,.04) 100%);
}
@media(max-width:900px){
  
  .usecases::before{background:linear-gradient(180deg, rgba(11,9,11,.93) 0%,
    rgba(11,9,11,.8) 40%, rgba(11,9,11,.52) 100%)}
}

@media(min-width:901px){ .usecases{height:calc(100svh - 64px); min-height:0} }   
.uwrap{position:relative; z-index:1;
  width:min(1320px,94vw); margin:0 auto; flex:1; min-height:0; display:flex; flex-direction:column}
.usplit{flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(24px,3.4vw,58px); align-items:stretch}


.uleft{display:flex; flex-direction:column; justify-content:center; min-width:0}

.upitch{position:relative; min-height:120px}   
.uslide{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center;
  opacity:0; transform:translateX(20px); pointer-events:none;
  transition:opacity .26s ease, transform .26s cubic-bezier(.22,.9,.28,1)}
.uslide.on{opacity:1; transform:none; pointer-events:auto}

.uslide .usub{opacity:0; transform:translateY(7px); transition:opacity .2s ease, transform .2s ease}
.uslide.on .usub{opacity:1; transform:none;
  transition:opacity .3s ease .08s, transform .34s cubic-bezier(.22,.9,.28,1) .08s}

.uslide h1{font:300 clamp(28px,3.6vw,54px)/1.06 'Fraunces',var(--serif); font-optical-sizing:auto;
  color:var(--ink); letter-spacing:.004em; text-wrap:balance; margin:0 0 18px; max-width:none}
.uslide h1 .ln{display:block}
.usub{color:var(--dim); font-size:clamp(14px,1.15vw,16.5px); line-height:1.5; max-width:34ch; margin:0}
.ustart{align-self:flex-start; margin-top:26px}

.ulmob{display:none}
.ulmob:focus-visible{outline:2px solid var(--gold,#e6c27a); outline-offset:3px}

.uidea textarea{display:block; width:100%; box-sizing:border-box; resize:none; overflow:hidden;
  height:38px; padding:8px 18px; border-radius:19px; font:400 15px/20px var(--sans); color:var(--ink);
  background:#0a080b; border:1px solid rgba(255,243,228,.16); box-shadow:0 2px 8px -1px rgba(14,8,4,.42);
  transition:border-color .2s ease, box-shadow .2s ease}
.uidea textarea::placeholder{color:#8c8680}
.uidea textarea:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(232,201,136,.16)}
.uidea.open textarea{overflow:auto; border-radius:14px; min-height:58px}   
@media(min-width:901px){
  
  .uwrap{width:calc(100vw - 44px); max-width:1880px}
  .usplit{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .uslide h1{margin-bottom:20px}
  .ustart{margin-top:30px}
}


.ubar{display:none}
@media(max-width:900px){
  .usecases{padding:10px 0 30px; min-height:0}
  .uwrap{width:100%; padding:0 26px; box-sizing:border-box; z-index:2}   
  .bwrap{padding:0}                      
  .usplit{display:block; position:relative}
  main{padding-bottom:96px}   
  
  .usecases{--barH:108px}   
  .ulmob{display:block; position:relative; width:100%; aspect-ratio:16/9; margin:0 0 10px; padding:0; border:0; border-radius:14px; overflow:hidden;
    background:#0b090b url(/art/launch-film.jpg) center/cover no-repeat; cursor:pointer; color:#fff; -webkit-tap-highlight-color:transparent}
  .ulmob video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
  .ulmob .ulsound{position:absolute; right:8px; bottom:8px; padding:5px 10px; border-radius:999px; font:500 12px/1 var(--sans);
    background:rgba(11,9,11,.66); border:1px solid rgba(255,243,228,.4); backdrop-filter:blur(4px)}
  .ulmob .ulcapvh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  
  
  .upitch{min-height:96px}
  .uslide h1{font-size:clamp(27px,7.4vw,38px); max-width:none; margin-bottom:11px}
  .usub{font-size:14.5px; max-width:none}
  
  .ustart{display:flex; align-items:center; justify-content:center; gap:9px; min-height:52px; padding:0 22px; text-align:center}
  .ustart::before{content:''; position:absolute; inset:-14px -12px}   
  
  .usecases.heroOn .uidea{opacity:1; visibility:visible}
  .ubar{display:block; position:fixed; left:0; right:0; bottom:0; height:var(--barH); z-index:4;   
    opacity:0; visibility:hidden; transition:opacity .28s ease;
    background:linear-gradient(180deg, rgba(11,9,11,0) 0%, rgba(11,9,11,.72) 38%, rgba(11,9,11,.97) 100%)}
  .usecases.heroOn .ustart,.usecases.heroOn .ubar{opacity:1; visibility:visible}
}
@media(prefers-reduced-motion:reduce){
  .uslide{transition:none}
  .uslide .usub,.uslide.on .usub{opacity:1; transform:none; transition:none}
}

#modes{padding:58px 0 34px}
#modes h2{margin-bottom:9px}
@media(max-width:640px){ #modes{padding:40px 0 24px} }


.mfilm{position:relative; display:block; aspect-ratio:16/9; margin:0; padding:0; border-radius:10px; overflow:hidden;
  background:#000; border:1px solid var(--edge-soft); color:inherit; font:inherit; -webkit-appearance:none; appearance:none;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease}
button.mfilm{cursor:pointer}
button.mfilm:hover, button.mfilm:focus-visible{transform:translateY(-2px); border-color:rgba(232,201,136,.5);
  box-shadow:0 12px 30px -16px rgba(0,0,0,.85); outline:none}
.mfilm img, .mfilm video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.mfilm img{transition:opacity .3s ease}
.mfilm video{opacity:0; transition:opacity .3s ease}
.mfilm.playing video{opacity:1}
.mfilm.playing img{opacity:0}
.fplay{
  position:absolute; top:50%; left:50%; z-index:2; transform:translate(-50%,-50%);
  width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(12,9,12,.6); border:1px solid rgba(255,243,228,.28);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  transition:background .25s ease, border-color .25s ease, opacity .3s ease;
}
.fplay svg{width:10px; height:10px; fill:var(--ink); margin-left:2px; transition:fill .25s ease}
button.mfilm:hover .fplay{background:var(--gold); border-color:var(--gold)}
button.mfilm:hover .fplay svg{fill:var(--gold-ink)}
.mfilm.playing .fplay{opacity:0}


.fbox{
  position:fixed; inset:0; z-index:60; display:none;
  align-items:center; justify-content:center; padding:26px;
  background:rgba(8,6,8,.9); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.fbox.on{display:flex}
.fbox video{width:min(100%,1040px); max-height:82vh; border-radius:12px; background:#000;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.9)}
.fbox .fclose{
  position:absolute; top:18px; right:20px; width:40px; height:40px; border-radius:50%;
  background:var(--glass); border:1px solid var(--edge-soft); color:var(--ink);
  font:400 22px/1 var(--sans); cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.fbox .fclose:hover{border-color:var(--gold); color:var(--gold)}
.fboxname{position:absolute; left:0; right:0; bottom:22px; text-align:center;
  font:600 14px var(--sans); color:var(--dim)}
@media(prefers-reduced-motion:reduce){ .mfilm{transition:none} button.mfilm:hover, button.mfilm:focus-visible{transform:none} }


.band{padding:96px 0 100px; border-top:1px solid var(--edge-soft); text-align:center;
  position:relative; z-index:1; background:transparent}
.band h2{font:400 clamp(28px,3.6vw,40px)/1.15 var(--serif); color:var(--cream); margin-bottom:16px}


.buyrow{display:flex; align-items:center; justify-content:center; gap:14px;
  flex-wrap:wrap; margin-top:20px}   
.cta.buy{padding:13px 30px; font-size:15px}

main{min-height:100vh; display:flex; flex-direction:column}
main > .screen{flex:1; min-height:0; display:flex; flex-direction:column}
footer{padding:34px 0 40px; border-top:1px solid var(--edge-soft)}


@keyframes fmRise{ from{opacity:0; transform:translateY(15px)} to{opacity:1; transform:none} }
h1 .l1, h1 em{ animation:fmRise .68s cubic-bezier(.2,.72,.28,1) both }
h1 .l1{ display:inline-block; animation-delay:.05s }
h1 em{ display:inline-block; animation-delay:.32s }
@media(prefers-reduced-motion:reduce){
  h1 .l1, h1 em{ animation:none !important; opacity:1; transform:none;
    -webkit-text-fill-color:#fff; color:#fff; background:none }
}


h1, .band h2{text-wrap:balance}


.band{padding-left:0; padding-right:0}
.bwrap{max-width:880px; margin:0 auto; padding:0 26px}

@media(max-width:900px){ .bwrap{padding:0} }
.calc{max-width:720px; margin:0 auto}      



.curwrap{display:inline-flex;border:1px solid var(--edge-soft,rgba(255,243,228,.14));
  border-radius:var(--round,12px);overflow:hidden;margin-right:10px;flex:0 0 auto}
.curwrap button{appearance:none;background:none;border:0;cursor:pointer;
  font:600 12px/1 inherit;color:var(--dimmer,#8c8680);padding:5px 10px;transition:.15s}
.curwrap button:hover{color:var(--ink,#f4efe6)}
.curwrap button.on{background:var(--gold,#e8c988);color:#2b2008}


.install{position:fixed;right:24px;bottom:24px;z-index:50;width:min(380px,calc(100vw - 32px));box-sizing:border-box;
  display:grid;grid-template-columns:40px 1fr;column-gap:12px;row-gap:10px;align-items:start;padding:14px 14px 12px;color:var(--ink,#f4efe6);
  background:rgba(25,21,25,.97);border:1px solid rgba(255,243,228,.22);border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.45)}
.install[hidden]{display:none}
.install img{width:40px;height:40px;border-radius:10px}
.install .itext{min-width:0;text-align:left}
.install b{display:block;font-size:14.5px;margin:1px 0 3px}
.install .ip,.install .ii{display:block;font-size:12.5px;line-height:1.4;color:var(--dim,#a29b93)}
.install[data-mode=prompt] .ii,.install[data-mode=ios] .ip,.install[data-mode=ios] .igo{display:none}
.install .ibtns{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.install button{appearance:none;border-radius:var(--round,12px);padding:7px 15px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.install .igo{background:linear-gradient(180deg,#f7e3b0,#d9b46c);border:0;color:#2b2008}
.install .ilater{background:transparent;border:1px solid rgba(255,243,228,.25);color:var(--ink,#f4efe6)}
.install .li,.install[data-mode=ios] .lp{display:none}
.install[data-mode=ios] .li{display:inline}
@media (max-width:700px){.install{left:16px;right:16px;width:auto;bottom:calc(96px + env(safe-area-inset-bottom,0px))}}



.youget li .tx{text-align:left}
@media(max-width:640px){ .sky{animation:none} }   
@media(max-width:640px){
  body{font-size:15px; line-height:1.55}
  main{padding:0 16px 96px}   
  .uwrap{padding:0 16px}
  .usub{font-size:14px}
  .ustart{left:16px; right:16px; min-height:44px; bottom:12px; font-size:14.5px}   
  .uidea textarea{font-size:16px}   
  
  .band{padding:44px 0 48px}
  #modes{padding:34px 0 18px}
  .calc .head{padding:10px 14px}
  .calc .body{padding:0 14px 14px}
  .youget{margin-top:14px}
  .buyrow{margin-top:14px; gap:10px}
  .cta.buy{padding:11px 26px; font-size:14px}
  footer{padding:24px 0 30px; font-size:12.5px}
  footer a{white-space:nowrap}
}



.uask{margin-top:20px; border-radius:24px; border:1px solid rgba(232,201,136,.55); padding:18px 16px 14px;
  background:linear-gradient(180deg, rgba(232,201,136,.07), rgba(255,245,232,.02)); box-shadow:0 0 34px -12px rgba(232,201,136,.45)}
.uask .uidea{position:static; opacity:1; visibility:visible; margin:14px 0 0; width:auto; left:auto; right:auto; bottom:auto}
.uask .uidea textarea{height:52px; padding:15px 16px; border-radius:16px; font-size:16px; line-height:22px}   
.uask .ustart{position:relative; left:auto; right:auto; bottom:auto; display:flex; align-items:center; justify-content:center; gap:9px;
  width:100%; box-sizing:border-box; margin:14px 0 0; min-height:52px; opacity:1; visibility:visible}
.uask .ugo{display:flex; gap:10px; margin:12px 0 0}
.uask .ugo .cta{position:relative; flex:1 1 0; min-width:0; width:auto; margin:0; min-height:52px; padding:0 12px; display:flex; align-items:center;
  justify-content:center; flex-direction:column; gap:1px; white-space:nowrap; font-size:16px}
.uask .ugo .cta .ubt{display:flex; align-items:center; gap:7px; line-height:1.15}
.uask .ugo .cta .ubs{font:600 11px/1.15 var(--sans); opacity:.8; letter-spacing:.01em}   
.uask .ugo .cta::before{content:''; position:absolute; inset:-10px 0}   

.uask .ugo .ufun{background:linear-gradient(180deg, var(--pink-hi) 0%, var(--pink) 100%); color:var(--pink-ink); border:0;
  box-shadow:0 0 24px -8px color-mix(in srgb, var(--pink) 60%, transparent); text-decoration:none; font-weight:700; border-radius:999px}
.uask .ugo .ufun:hover,.uask .ugo .ufun:focus-visible{filter:brightness(1.06); outline:2px solid var(--pink-hi); outline-offset:2px}

.uask .uidea.want textarea::placeholder{color:var(--gold-hi)}
.uask .uidea.want textarea{border-color:var(--gold); animation:uwant .7s ease-out 1}
@keyframes uwant{ from{box-shadow:0 0 0 0 rgba(232,201,136,.6)} to{box-shadow:0 0 0 12px rgba(232,201,136,0)} }
@media(prefers-reduced-motion:reduce){ .uask .uidea.want textarea{animation:none} }
.uwant{position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap}
.uaskpin{display:block; height:1px; margin-bottom:-1px}   


@media(max-width:900px){
  .usecases{padding:0 0 26px}
  
  .ulmob{width:calc(100% + 52px); margin:0 -26px; aspect-ratio:16/9; border-radius:0}   
  .ulmob::after{content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(180deg, rgba(11,9,11,.3) 0%, rgba(11,9,11,0) 16%, rgba(11,9,11,.32) 44%, rgba(11,9,11,.86) 80%, #0b090b 100%)}
  
  .uhero{position:relative}
  .uover{position:absolute; left:0; right:0; bottom:44px; z-index:2; pointer-events:none}   
  .uover .uslide{justify-content:flex-end}
  .uover .uslide h1{margin-bottom:0; text-shadow:0 2px 18px rgba(0,0,0,.55)}
  .uover .usub{display:none}
  .uask{position:relative; margin-top:16px; border:0; border-radius:0; padding:0; background:none; box-shadow:none}
  .uask .uidea{margin:0}
  .uask .uidea textarea{height:76px; padding:13px 16px 13px 47px; border-radius:18px; font-size:16.5px; line-height:24px;
    border-color:rgba(232,201,136,.62); box-shadow:0 0 0 4px rgba(232,201,136,.08), 0 0 28px -8px rgba(232,201,136,.5)}
  .uask .uidea textarea::placeholder{color:#b3aca3}
  
  .usecases:not(.afloat) .uask .uidea.open textarea{min-height:76px}
  .ulmob .ulsound{z-index:2; bottom:auto; top:12px}
  .uleft{position:relative; top:auto; z-index:6; margin-top:-24px; padding:0; background:none}   
  .upitch{min-height:0}
  
  .usecases.afloat .uask .uidea{position:fixed; left:26px; right:26px; bottom:82px; z-index:9; margin:0}
  .usecases.afloat .uask .ugo{position:fixed; left:26px; right:26px; bottom:20px; z-index:9; margin:0}
  .usecases.afloat .uask .uidea textarea{height:38px; padding:8px 18px; border-radius:19px; line-height:20px}   
  .usecases.heroOn:not(.afloat) .ubar{opacity:0; visibility:hidden}
}
@media(max-width:640px){
  .ulmob{width:calc(100% + 32px); margin:0 -16px}
  .usecases.afloat .uask .uidea{left:16px; right:16px; bottom:60px}
  .usecases.afloat .uask .ugo{left:16px; right:16px; bottom:12px}
  .usecases.afloat .uask .ugo .cta{min-height:44px}
}


@media(min-width:901px){
  .usecases{height:auto; min-height:0; padding:30px 0 46px}
  
  .usecases::before{background:linear-gradient(96deg, rgba(11,9,11,.98) 0%, rgba(11,9,11,.96) 40%, rgba(11,9,11,.62) 58%, rgba(11,9,11,.2) 100%)}
  .usplit{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); column-gap:56px; row-gap:0; align-items:start;
    grid-template-areas:"pitch film" "ask ask"}
  .uleft,.uhero,.uover{display:contents}
  .upitch{grid-area:pitch; align-self:center}   
  .uask{grid-area:ask; margin-top:36px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; column-gap:16px; align-items:center;
    border-radius:999px; padding:16px 16px 16px 20px}
  .uask .uidea{grid-column:2; grid-row:1; margin:0}
  .uask .uidea textarea{height:56px; border-radius:999px; padding:16px 24px; font-size:18px; line-height:24px}
  .uask .uidea.open textarea{border-radius:22px}
  .uask .ugo{grid-column:3; grid-row:1; margin:0}
  .uask .ugo .cta{flex:none; min-height:56px; padding:0 24px; font-size:16.5px}
  .uaskpin{display:none}
}

@media (max-width:900px){ .cookieNote{bottom:calc(116px + env(safe-area-inset-bottom,0px))} }

.uafter{padding:12px 0 12px}
.uafter h2{font-size:19px; line-height:1.25; margin-bottom:2px}   
@media(min-width:901px){
  .uafter{padding:72px 0 80px}
  .uafter h2{font-size:clamp(28px,3.6vw,40px); margin-bottom:8px}
}

@media(max-width:900px){
  .usecases{padding-bottom:6px}
  .usecases::before{background:rgba(11,9,11,.95)}
  .uafter{border-top:0; padding:10px 0 28px; position:relative; isolation:isolate; background:none}
  .uafter::before{content:''; position:absolute; top:0; bottom:0; left:50%; width:100vw; transform:translateX(-50%); z-index:-1;
    pointer-events:none; background:linear-gradient(180deg, rgba(11,9,11,.95) 0%, rgba(11,9,11,.95) 78%, rgba(11,9,11,0) 100%)}   
  .uafter + .band{border-top:0}
}

.uslide.on h1{font-weight:400}
.uslide h1 .ln:last-child{background:linear-gradient(180deg, #f7e3b0 0%, #e8c988 55%, #c9a256 100%); -webkit-background-clip:text;
  background-clip:text; color:transparent; -webkit-text-fill-color:transparent; text-shadow:none; filter:drop-shadow(0 2px 10px rgba(0,0,0,.5))}

@media(max-width:900px){
  .uover{bottom:26px}
  .uleft{margin-top:-10px}
  .uask .ugo{margin-top:18px}
  .uafter{padding-top:40px}
  .uafter h2{font-size:16px; line-height:1.3}
}



.uask .uidea textarea,.uask .uidea.open textarea,.usecases.afloat .uask .uidea textarea{border-radius:var(--round,12px)}
.uask .uidea textarea,.uask .uidea textarea:focus{box-shadow:none}
.uask .ugo .cta,.uask .ugo .ufun{border-radius:var(--round,12px)}
@media(max-width:900px){
  .uask .uidea textarea{padding-left:16px}   
}
@media(min-width:901px){
  .uask{grid-template-columns:minmax(0,1fr) auto; column-gap:12px; border:0; border-radius:0; padding:0; background:none; box-shadow:none}
  .uask .uidea{grid-column:1}
  .uask .ugo{grid-column:2}
}

.ulmob .ulsound{display:grid; place-items:center; width:36px; height:36px; padding:0; box-sizing:border-box; border-radius:var(--round,12px);
  background:rgba(11,9,11,.58); border:1px solid rgba(255,243,228,.42); color:#fff}
.ulmob .ulsound svg{display:block; width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.ulmob .ulsound .snd1,.ulmob.loud .ulsound .snd0{display:none}
.ulmob.loud .ulsound .snd1{display:block}

.afstudios{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; margin:0 0 12px; box-sizing:border-box}   
.afstudio{display:flex; flex-direction:column; align-items:center; gap:4px; padding:14px 10px 12px; border:1px solid rgba(255,250,242,.26);
  border-radius:var(--round,12px); background:#0a080b; color:var(--cream,#f6efe2); text-decoration:none; text-align:center}
.afstudio:hover, .afstudio:focus-visible{border-color:var(--gold-lo,#d9b46c)}
.afstudio b{font:600 15px/1.2 var(--sans)}
.afstudio small{color:var(--dim,#a29b93); font-size:12.5px}
.afsico svg{width:30px; height:30px; fill:none; stroke:var(--gold,#e8c988); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.afsoon{opacity:.55; cursor:default}
.afsoon:hover{border-color:rgba(255,250,242,.26)}
@media(max-width:640px){
  .afstudios{gap:8px}
  .afstudio{padding:12px 6px 10px}
  .afstudio b{font-size:13.5px}
  .afstudio small{font-size:11.5px; line-height:1.3}
  .afsico svg{width:26px; height:26px}
}
@media(max-width:900px){
  .uafter{padding-top:24px}
}
@media(max-width:900px){
  .uafter{padding-top:18px}
}

@media(max-width:900px){
  .uafter{padding-top:12px}   
}

@media(max-width:900px){
  .uover{bottom:12px}
}

.cta{border-radius:var(--round,12px)}


.uidea .uratio{position:absolute; right:10px; bottom:10px; z-index:2; display:flex; gap:2px; padding:2px; box-sizing:border-box;
  border:1px solid var(--edge-soft, rgba(255,243,228,.11)); border-radius:var(--round,12px); background:rgba(255,245,232,.04)}
.uratio button{display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 9px; border:0; border-radius:calc(var(--round,12px) - 3px);
  background:none; color:var(--dim, #a29b93); font:600 12px/1 var(--sans); cursor:pointer; -webkit-tap-highlight-color:transparent}
.uratio button[aria-checked="true"]{background:rgba(232,201,136,.16); color:var(--gold-hi, #f7e3b0)}
.uratio button:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:1px}
.uratio svg{display:block; width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6}
.usecases.afloat .uask .uratio{display:none}   
@media(max-width:900px){
  .usecases:not(.afloat) .uask .uidea{position:relative}
  .usecases:not(.afloat) .uask .uidea textarea,
  .usecases:not(.afloat) .uask .uidea.open textarea{height:150px; min-height:150px; padding-bottom:48px}   
  .uask .ugo{margin-top:22px}
  .uafter{padding-top:34px}   
}
@media(min-width:901px){
  .uask{display:flex; flex-direction:column; gap:16px}
  .uask .uidea{position:relative; width:100%}
  .uask .uidea textarea,.uask .uidea.open textarea{height:120px; min-height:120px; padding:16px 20px 52px; border-radius:var(--round,12px)}
  .uask .ugo{display:flex; gap:12px; margin:0}
  .uask .ugo .cta{flex:1 1 0}
}
@media(min-width:901px){
  .uask .ugo{width:100%}   
  .uafter .bwrap{max-width:none; width:min(1180px, calc(100vw - 44px)); margin-left:50%; transform:translateX(-50%); padding:0}   
}

.umline{position:relative; margin:10px 0 0; font:300 11px/1.4 var(--sans); letter-spacing:.02em; color:var(--gold, #e8c988);
  pointer-events:auto; text-shadow:0 1px 8px rgba(0,0,0,.65)}
.umline b{font-weight:500; color:var(--gold-hi, #f7e3b0)}
.umi{position:relative; display:inline-grid; place-items:center; width:15px; height:15px; margin-left:7px; padding:0; vertical-align:-3px;
  border-radius:50%; border:1px solid currentColor; background:none; color:var(--gold, #e8c988); font:600 10px/1 var(--sans); cursor:pointer}
.umi::before{content:''; position:absolute; inset:-12px}   
.umi:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.uminfo{position:absolute; left:0; right:0; bottom:calc(100% + 8px); z-index:5; padding:10px 12px; border-radius:var(--round, 12px);
  background:#0a080b; border:1px solid rgba(232,201,136,.5); font:400 12.5px/1.45 var(--sans); letter-spacing:0; color:var(--ink, #f4efe6);
  text-shadow:none; box-shadow:0 12px 30px -10px rgba(0,0,0,.85)}
.uminfo[hidden]{display:none}
@media(min-width:901px){
  .usplit{grid-template-areas:"pitch film" "mline mline" "ask ask"}
  .umline{grid-area:mline; margin:26px 0 0; font-size:12.5px}
  .uask{margin-top:10px}
}

@media(max-width:900px){ main{padding-bottom:calc(var(--barH, 108px) + 48px)} }

#price h2{margin-bottom:12px}
#price .calc{display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"secs price" "rail rail" "buy buy" "list list" "note cur";
  align-items:center; column-gap:12px; row-gap:12px; max-width:560px; margin:0 auto; padding:14px 14px 12px; box-sizing:border-box;
  background:#0a080b; border:1px solid rgba(255,250,242,.26); border-radius:var(--round, 12px); box-shadow:none; overflow:visible}
#price .calc .head,#price .calc .body,#price .slotwrap,#price .youget,#price .yghead{display:contents}
#price .calc .head > span:not(.curwrap):not(#mtag){display:none}   
#price .slotsecs{grid-area:secs; order:0; text-align:left; font-size:30px; line-height:1}
#price .ygt{display:none}
#price .ygp{grid-area:price; justify-self:end; font-size:24px; line-height:1}
#price .slotrail{grid-area:rail; width:100%}
#price .ticks{margin-top:8px}
#price .buyrow{grid-area:buy; margin:0}
#price .buyrow .buy{display:flex; width:100%; justify-content:center; min-height:48px; box-sizing:border-box}
#price #yglist{grid-area:list; margin:0; padding:0; list-style:none; border-top:1px solid var(--edge-soft, rgba(255,243,228,.11)); padding-top:6px}
#price .youget li{padding:3px 0; font-size:13px; line-height:1.4; border:0}
#price .youget li.yg-off{display:none}
#price #mtag{grid-area:note; font-size:11px; line-height:1.4; color:var(--dimmer, #8c8680); text-align:left}
#price .curwrap{grid-area:cur; justify-self:end}
#price .taxnote{max-width:560px; margin:8px auto 0; font-size:11px; line-height:1.4}
@media(max-width:900px){
  #price h2{font-size:26px}
  #price .curwrap button{padding:8px 11px}
}

.mgallery{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; max-width:1180px; margin:0 auto; padding:0 16px; box-sizing:border-box}
.mgallery .mfilm{--mc:var(--gold, #e8c988); border:1.5px solid var(--mc); border-radius:var(--round, 12px)}
.mgallery .mc-film{--mc:var(--gold, #e8c988)}
.mgallery .mc-ad{--mc:var(--pink)}
.mgallery .mc-previz{--mc:var(--sky, #9bbcdc)}
.mgallery .mc-estate{--mc:var(--sage, #9ecfa6)}
.mgallery .mc-pdf{--mc:var(--plum, #c9a2c8)}
.mgallery .mc-business{--mc:var(--rose, #e39b91)}
.mgallery .mfilm::after{content:attr(data-mode); position:absolute; left:0; bottom:0; z-index:3; padding:2px 7px 1px 6px; background:var(--mc);
  color:#170f14; font:700 8.5px/1.3 var(--sans); letter-spacing:.07em; text-transform:uppercase; border-top-right-radius:7px; pointer-events:none}
.mgallery button.mfilm:hover,.mgallery button.mfilm:focus-visible{border-color:var(--mc); box-shadow:0 10px 26px -14px color-mix(in srgb, var(--mc) 70%, transparent)}
.mgallery .fplay{width:22px; height:22px}
.mgallery .fplay svg{width:9px; height:9px}
#modes h2{margin-bottom:14px}
@media(min-width:901px){
  .mgallery{grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:0 22px}
  .mgallery .mfilm::after{font-size:10px; padding:3px 9px 2px 8px; border-top-right-radius:9px}
  .mgallery .fplay{width:30px; height:30px}
}
@media(max-width:900px){ .mgallery{padding:0} }   
@media(max-width:900px){
  .uafter{padding-top:16px}
}

html.uwopen{overflow:hidden}

html.uwopen .cookieNote{display:none}
.overlay.uwrite{display:block; padding:0; background:rgba(8,6,9,0); transition:background .3s ease; overflow:hidden; z-index:80}
.overlay.uwrite.on{background:rgba(8,6,9,.74)}
.overlay.uwrite.closing{background:rgba(8,6,9,0); pointer-events:none}
.uwpanel{position:fixed; box-sizing:border-box; display:flex; flex-direction:column; gap:10px; padding:12px; border:1px solid rgba(232,201,136,.42);
  border-radius:var(--round,12px); background:#0a080b; box-shadow:0 30px 80px -20px rgba(0,0,0,.9); overflow:hidden;
  transition:top .34s cubic-bezier(.22,.8,.24,1), left .34s cubic-bezier(.22,.8,.24,1), width .34s cubic-bezier(.22,.8,.24,1), height .34s cubic-bezier(.22,.8,.24,1)}
.overlay.uwrite.settled .uwpanel{transition:none}   
.uwpanel > *{opacity:0; transform:translateY(6px); transition:opacity .22s ease .14s, transform .22s ease .14s}
.overlay.uwrite.on .uwpanel > *{opacity:1; transform:none}
.overlay.uwrite.closing .uwpanel > *{opacity:0; transform:none; transition:opacity .1s ease 0s}
.uwhead{display:flex; align-items:center; gap:8px; flex:none}
.uwtabs{flex:1; min-width:0; display:flex; gap:4px; padding:3px; box-sizing:border-box; border:1px solid rgba(255,243,228,.12); border-radius:var(--round,12px); background:rgba(255,245,232,.03)}
.uwtab{flex:1 1 0; min-width:0; display:inline-flex; align-items:center; justify-content:center; gap:6px; height:38px; padding:0 6px; border:0;
  border-radius:calc(var(--round,12px) - 3px); background:none; color:var(--dim,#a29b93); font:700 14px/1 var(--sans); white-space:nowrap; cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwtab.on[data-road="full"]{background:linear-gradient(180deg,#f7e3b0,#d9b46c); color:#2b2008}
.uwtab.on[data-road="fun"]{background:linear-gradient(180deg,var(--pink-hi),var(--pink)); color:var(--pink-ink)}
.uwtab:focus-visible{outline:2px solid var(--gold,#e8c988); outline-offset:2px}
.overlay .uwclose,.uwclose{position:static; flex:none; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid rgba(255,243,228,.14);
  border-radius:calc(var(--round,12px) - 3px); background:none; color:var(--dim,#a29b93); cursor:pointer}
.uwclose svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.uwkinds{flex:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px}
.uwkind{min-width:0; height:34px; padding:0 6px; border:1px solid rgba(255,243,228,.16); border-radius:calc(var(--round,12px) - 3px); background:rgba(255,245,232,.03);
  color:#cfc8bf; font:600 12.5px/1 var(--sans); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwkind.on{border-color:rgba(232,201,136,.6); background:rgba(232,201,136,.16); color:var(--gold-hi,#f7e3b0)}
.uwkind:focus-visible{outline:2px solid var(--gold,#e8c988); outline-offset:1px}
.uwpanel.isfun .uwkinds{display:none}   
.uwtext{flex:1 1 auto; min-height:96px; width:100%; box-sizing:border-box; margin:0; resize:none; padding:12px 14px; border:1px solid rgba(255,243,228,.16);
  border-radius:var(--round,12px); background:#060507; color:var(--ink,#f4efe6); caret-color:var(--gold,#e8c988); font:400 17px/1.5 var(--sans); outline:none; box-shadow:none}
.uwtext:focus{border-color:rgba(232,201,136,.55); box-shadow:none}
.uwtext::placeholder{color:#8c8680}
.uwpanel.want .uwtext{border-color:var(--gold,#e8c988)}
.uwpanel.want .uwtext::placeholder{color:var(--gold,#e8c988)}
.uwmagic{flex:none; display:flex; flex-direction:column; gap:8px; min-width:0}
.uwmagicbtn{align-self:flex-start; display:inline-flex; align-items:center; gap:9px; height:36px; padding:0 12px 0 8px; border:1px solid rgba(255,243,228,.16);
  border-radius:calc(var(--round,12px) - 3px); background:none; color:#cfc8bf; font:600 13.5px/1 var(--sans); cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwmagicbtn.on{border-color:rgba(201,162,200,.6); background:rgba(201,162,200,.1); color:#ecdcec}
.uwsw{position:relative; flex:none; width:30px; height:18px; border-radius:9px; background:rgba(255,243,228,.2); transition:background .2s}
.uwsw i{position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%; background:#f4efe6; transition:transform .2s}
.uwmagicbtn.on .uwsw{background:linear-gradient(90deg,#c9a2c8,var(--pink))}
.uwmagicbtn.on .uwsw i{transform:translateX(12px)}
.uwpills{display:flex; flex-wrap:wrap; gap:6px; max-height:104px; overflow-y:auto; overscroll-behavior:contain}
.uwpills[hidden]{display:none}
.uwpill{display:inline-flex; align-items:center; gap:5px; min-height:32px; padding:5px 11px; border:1px solid rgba(201,162,200,.45); border-radius:calc(var(--round,12px) - 3px);
  background:rgba(201,162,200,.08); color:#ecdcec; font:500 13px/1.3 var(--sans); text-align:left; cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwpill::before{content:'+'; color:#c9a2c8; font-weight:700}
.uwpill:active{background:rgba(201,162,200,.2)}
.uwnote{margin:0; color:var(--dim,#a29b93); font:500 12.5px/1.45 var(--sans)}
.uwnote a{color:var(--gold,#e8c988)}
.uwnote .spin{width:12px; height:12px; vertical-align:-1px}
.uwset{flex:none; display:flex; align-items:center; gap:12px; min-width:0}
.uwlab{flex:none; font:700 10px/1.2 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--gold,#e8c988)}
.uwratio{flex:none; display:flex; gap:2px; padding:2px; box-sizing:border-box; border:1px solid rgba(255,243,228,.11); border-radius:var(--round,12px); background:rgba(255,245,232,.04)}
.uwratio button{display:inline-flex; align-items:center; gap:5px; height:30px; padding:0 9px; border:0; border-radius:calc(var(--round,12px) - 3px); background:none; color:var(--dim,#a29b93);
  font:600 12px/1 var(--sans); cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwratio button.on{background:rgba(232,201,136,.16); color:var(--gold-hi,#f7e3b0)}
.uwratio svg{display:block; width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6}
.uwgo{flex:none; display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:52px; margin:0; padding:0 16px; border:0; border-radius:var(--round,12px);
  font:700 17px/1 var(--sans); cursor:pointer; -webkit-tap-highlight-color:transparent}
.uwgo.gold{background:linear-gradient(180deg,#f7e3b0,#d9b46c); color:#2b2008; box-shadow:0 12px 26px -14px rgba(232,201,136,.7)}
.uwgo.pink{background:linear-gradient(180deg,var(--pink-hi),var(--pink)); color:var(--pink-ink); box-shadow:0 12px 26px -14px color-mix(in srgb, var(--pink) 70%, transparent)}
.uwgo:active{transform:scale(.99); filter:brightness(.95)}
@media(min-width:901px){
  .uwpanel{padding:18px; gap:12px}
  .uwkinds{grid-template-columns:repeat(6,minmax(0,1fr))}
  .uwtext{font-size:18px}
}
@media(prefers-reduced-motion:reduce){ .uwpanel,.uwpanel > *,.overlay.uwrite{transition:none} }

.overlay .uwclose,.uwclose{order:-1; width:44px; height:44px; border:1px solid rgba(255,243,228,.2); background:rgba(255,245,232,.05); color:#a29b93}
.uwclose svg{width:22px; height:22px; stroke-width:2.2}
.uwmrow{display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0}
.uwmrow .uwmagicbtn{align-self:auto; min-width:0}

.uwownp{flex:1 1 auto; display:flex; align-items:center; justify-content:center; margin:0; padding:16px 18px; box-sizing:border-box; text-align:center; color:var(--dim,#a29b93); font:500 16px/1.5 var(--sans)}
.uwownp[hidden]{display:none}
.uwpanel.isown .uwtext,.uwpanel.isown .uwmagicbtn,.uwpanel.isown .uwpills{display:none}
.uwset{gap:10px}
.uwset .uwslide{flex:1 1 auto}
.uwbox{flex:none; display:flex; align-items:center; gap:2px; height:38px; padding:0 9px; box-sizing:border-box; border:1px solid rgba(255,243,228,.16);
  border-radius:calc(var(--round,12px) - 3px); background:#060507; cursor:text}
.uwbox:focus-within{border-color:var(--gold,#e8c988)}
.uwnum{width:38px; min-width:0; margin:0; padding:0; border:0; background:none; box-shadow:none; outline:none; color:var(--gold-hi,#f7e3b0);
  font:700 16px/1 var(--sans); text-align:center}
.uwnum::placeholder{color:#a29b93; font-weight:600; font-size:14px}
.uwbox span{color:#a29b93; font:600 13px/1 var(--sans)}
.uwnum:placeholder-shown + span{display:none}

.uwset input.uwslide{flex:1 1 auto; width:auto; min-width:0; margin:0 4px}   
.uwbox input.uwnum{flex:none; width:38px; min-width:0; height:auto; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none}

.uwmagicbtn.busy .uwsw::after{content:''; position:absolute; right:-14px; top:2px; width:10px; height:10px; box-sizing:border-box; border-radius:50%;
  border:2px solid #c9a2c8; border-top-color:transparent; animation:uwspin .8s linear infinite}
@keyframes uwspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){ .uwmagicbtn.busy .uwsw::after{animation:none} }

.usecases .uask .ugo{display:none}
.usecases .uask .uidea .uratio{display:none}
@media(max-width:900px){
  .usecases:not(.afloat) .uask .uidea textarea,.usecases:not(.afloat) .uask .uidea.open textarea{padding-bottom:15px}
  .usecases.afloat .uask .uidea{bottom:calc(14px + env(safe-area-inset-bottom, 0px))}
  .usecases{--barH:70px}
}
@media(min-width:901px){ .uask .uidea textarea,.uask .uidea.open textarea{padding-bottom:16px} }

.uask .utabs{display:flex; gap:4px; padding:0 10px; position:relative; z-index:2; margin:0 0 -1px}
.uask .utab{display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 14px; border:1px solid rgba(255,250,242,.14); border-bottom:0;
  border-radius:var(--round,12px) var(--round,12px) 0 0; background:rgba(255,245,232,.04); color:var(--dim,#a29b93); font:700 13.5px/1 var(--sans);
  cursor:pointer; -webkit-tap-highlight-color:transparent}
.uask .utab.on{height:38px; margin-top:-2px; background:#0a080b; border-color:rgba(232,201,136,.55); color:var(--gold-hi,#f7e3b0); box-shadow:inset 0 2px 0 var(--gold,#e8c988)}
.uask .utab.on[data-road="fun"]{border-color:color-mix(in srgb, var(--pink) 60%, transparent); color:var(--pink-hi); box-shadow:inset 0 2px 0 var(--pink)}
.uask .utab:focus-visible{outline:2px solid var(--gold,#e8c988); outline-offset:2px}
.uask .ubox{position:relative; border:1px solid rgba(232,201,136,.55); border-radius:var(--round,12px); background:#0a080b; overflow:hidden}
.uask.isfun .ubox{border-color:color-mix(in srgb, var(--pink) 60%, transparent)}
.usecases:not(.afloat) .uask .ubox .uidea textarea,.usecases:not(.afloat) .uask .ubox .uidea.open textarea{border:0; background:transparent; box-shadow:none; border-radius:0}
.uask .utools{display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:6px 8px 8px; border-top:1px solid rgba(255,250,242,.07)}
.uask .umagic{display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 9px 0 6px; border:1px solid rgba(255,243,228,.16); border-radius:calc(var(--round,12px) - 3px);
  background:none; color:#cfc8bf; font:600 12.5px/1 var(--sans); cursor:pointer; white-space:nowrap; -webkit-tap-highlight-color:transparent}
.uask .umagic.on{border-color:rgba(201,162,200,.6); background:rgba(201,162,200,.1); color:#ecdcec}
.uask .umagic .uwsw{width:26px; height:16px}
.uask .umagic .uwsw i{width:12px; height:12px}
.uask .umagic.on .uwsw{background:linear-gradient(90deg,#c9a2c8,var(--pink))}
.uask .umagic.on .uwsw i{transform:translateX(10px)}
.uask .ulen{position:relative; display:inline-flex; align-items:center; gap:5px; height:32px; padding:0 22px 0 9px; border:1px solid rgba(255,243,228,.16);
  border-radius:calc(var(--round,12px) - 3px); color:#cfc8bf; font:600 12.5px/1 var(--sans); cursor:pointer; white-space:nowrap;
  background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23a29b93' stroke-width='1.8' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E") no-repeat right 8px center}
.uask .ulen:focus-within{border-color:var(--gold,#e8c988)}
.uask .ulenv{color:var(--ink,#f4efe6); font-weight:700}
.uask .ulensel{position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; border:0; opacity:0; font-size:16px; cursor:pointer; -webkit-appearance:none; appearance:none}
.uask .utools .uratio{position:static; margin-left:auto}
.uask .utools .uratio button{height:26px; padding:0 8px}
@media(max-width:900px){
  .usecases:not(.afloat) .uask .ubox .uidea textarea,.usecases:not(.afloat) .uask .ubox .uidea.open textarea{height:104px; min-height:104px; padding-bottom:10px}
  .uask .utabs{padding:0 8px}
  .uafter{padding-top:12px; padding-bottom:0}
}
@media(min-width:901px){
  .uask .ubox .uidea textarea,.uask .ubox .uidea.open textarea{height:110px; min-height:110px}
}

.uwpanel{gap:7px; padding:9px}
.overlay .uwclose,.uwclose{width:34px; height:34px}
.uwclose svg{width:18px; height:18px}
.uwtabs{padding:2px; gap:3px}
.uwtab{height:30px; font-size:13px; gap:5px}
.uwkinds{display:flex; gap:5px; overflow-x:auto; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent)}
.uwkinds::-webkit-scrollbar{display:none}
.uwkind{flex:none; height:28px; padding:0 11px; font-size:12px}
.uwtext{padding:9px 11px; font-size:15px; line-height:1.45; min-height:80px}
@supports (-webkit-touch-callout: none){ .uwtext{font-size:16px} }
.uwmrow{gap:6px}
.uwmagicbtn{height:30px; padding:0 9px 0 6px; gap:7px; font-size:12.5px}
.uwsw{width:26px; height:16px}
.uwsw i{width:12px; height:12px}
.uwmagicbtn.on .uwsw i{transform:translateX(10px)}
.uwratio button{height:24px; padding:0 7px; font-size:11.5px}
.uwratio svg{width:13px; height:13px}
.uwpills{gap:5px; max-height:84px}
.uwpill{min-height:28px; padding:3px 9px; font-size:12.5px}
.uwset{gap:8px}
.uwlab{font-size:9px; letter-spacing:.18em}
.uwbox{height:30px; padding:0 7px}
.uwbox input.uwnum{width:32px; font-size:15px}
@supports (-webkit-touch-callout: none){ .uwbox input.uwnum{font-size:16px} }
.uwgo{min-height:44px; font-size:15px; gap:7px}

.uask .utab{height:30px; padding:0 12px; font-size:12.5px; gap:5px}
.uask .utab.on{height:32px}
.uask .utools{gap:5px; padding:5px 7px 7px}
.uask .umagic,.uask .ulen{height:28px; font-size:12px}
.uask .utools .uratio button{height:22px; padding:0 7px; font-size:11.5px}

.umline b{white-space:nowrap}

@media(max-width:900px){
  .usecases:not(.afloat) .uask .ubox .uidea textarea,.usecases:not(.afloat) .uask .ubox .uidea.open textarea{height:94px; min-height:94px; padding:12px 16px 10px; font-size:16px; line-height:24px}
  .uask .utabs{margin-top:14px}
  .uafter{padding-top:16px}
}
.umline{color:rgba(232,201,136,.82)}
.umline > span:first-child,.umline > .uml2{color:#a29b93}   
.umline b{font-weight:400; color:var(--gold, #e8c988)}

@media(max-width:900px){
  .uover{position:static; margin-top:14px}
  .uover .uslide h1{text-shadow:none}
  .uask{margin-top:0}
  .uask .utabs{margin-top:16px}
  .uafter{padding-top:16px}
}


@media(max-width:900px){
  .usecases.afloat .uask .uidea{top:65px; bottom:auto}
  .usecases.afloat .uask .uidea textarea,.usecases.afloat .uask .uidea.open textarea{height:40px; min-height:40px; padding:9px 16px; line-height:20px; font-size:16px;
    border:1px solid rgba(232,201,136,.55); background:#0a080b; box-shadow:0 10px 24px -12px rgba(0,0,0,.9)}   
  .ubar{top:57px; bottom:auto; height:58px; background:linear-gradient(180deg, rgba(11,9,11,.97) 0%, rgba(11,9,11,.94) 72%, rgba(11,9,11,0) 100%)}
  main{padding-bottom:24px}
}

@media(max-width:900px){
  .uover{position:relative; z-index:2; margin-top:-40px}
  .uover .uslide h1{text-shadow:0 2px 18px rgba(0,0,0,.55)}
  .umline{margin-top:6px}
  .usecases:not(.afloat) .uask .ubox .uidea textarea,.usecases:not(.afloat) .uask .ubox .uidea.open textarea{height:118px; min-height:118px}
}

@media(min-width:901px){
  .usecases{height:auto; min-height:0; padding:clamp(24px, calc((100svh - 718px) / 2), 120px) 0 0; display:block}   
  .usecases::before{inset:0 0 auto 0; height:calc(100svh - 78px);
    background:linear-gradient(90deg, rgba(11,9,11,.94) 0%, rgba(11,9,11,.74) 34%, rgba(11,9,11,.22) 62%, rgba(11,9,11,.08) 100%),
               linear-gradient(180deg, rgba(11,9,11,.15) 0%, rgba(11,9,11,0) 30%, rgba(11,9,11,.72) 74%, #0b090b 100%),
               url(/art/launch-film.jpg) center 28%/cover no-repeat}
  .usplit{display:grid; grid-template-columns:minmax(0,1fr); grid-template-areas:"pitch" "mline" "ask"; column-gap:0;
    width:min(1260px, calc(100vw - 96px)); max-width:none; margin:0 auto}
  .upitch{grid-area:pitch; align-self:start; max-width:720px}
  .uslide h1{font-size:clamp(44px,4.6vw,78px); line-height:1.04; margin-bottom:0}
  .uslide .usub{display:none}   
  .umline{grid-area:mline; max-width:640px; margin:18px 0 0; font-size:14.5px; line-height:1.55}
  .uask{grid-area:ask; display:block; margin:44px 0 0; padding:0; border:0; border-radius:0; background:none; box-shadow:none}
  .uask .utabs{padding:0 16px}
  .uask .utab{height:36px; padding:0 18px; font-size:14px}
  .uask .utab.on{height:38px}
  .uask .ubox{background:rgba(10,8,11,.86); backdrop-filter:blur(6px)}
  .uask .ubox .uidea textarea,.uask .ubox .uidea.open textarea{height:104px; min-height:104px; padding:16px 22px 10px; font-size:18px; line-height:26px; border-radius:0}
  .uask .utools{padding:8px 12px 10px}
  .uask .umagic,.uask .ulen{height:34px; font-size:13.5px}
  .uask .utools .uratio button{height:28px; padding:0 10px; font-size:12.5px}
  .uafter{padding:22px 0 56px}
  .uafter .bwrap{width:min(1260px, calc(100vw - 96px))}
}


#kinds{padding:44px 0 48px; text-align:left}
#kinds h2{font:400 22px/1.2 var(--serif); color:var(--cream); margin:0 0 16px; text-align:center}
#kinds .kinds{list-style:none; margin:0 auto; padding:0; display:grid; grid-template-columns:1fr; gap:12px 28px; max-width:980px}
@media(min-width:640px){ #kinds .kinds{grid-template-columns:1fr 1fr} }
@media(min-width:1000px){ #kinds .kinds{grid-template-columns:1fr 1fr 1fr} }
#kinds h3{margin:0; font:600 14px/1.3 var(--sans)}
#kinds h3 a{color:var(--gold); text-decoration:none}
#kinds h3 a:hover, #kinds h3 a:focus-visible{text-decoration:underline; text-underline-offset:3px}
#kinds p{margin:3px 0 0; font-size:13px; line-height:1.45; color:var(--dim)}
@media(max-width:900px){ #kinds{padding:34px 16px 38px} }


@media(min-width:901px){
  :root{--cw:min(1200px, calc(100vw - 96px)); --secgap:56px}
  .backdrop,.scrim{display:none}
  main{max-width:none; padding:0}
  .bwrap{width:var(--cw); max-width:none; margin:0 auto; padding:0}

  
  .usecases{width:100%; margin-left:0; padding:clamp(48px, calc((100svh - 700px) / 2), 112px) 0 0}
  
  .usecases::before{inset:0 0 0 auto; width:min(70%, 1100px); height:auto;
    background:
      linear-gradient(90deg, rgba(11,9,11,.8) 0%, rgba(11,9,11,.5) 18%, rgba(11,9,11,.22) 42%, rgba(11,9,11,.1) 72%, rgba(11,9,11,.36) 100%),
      linear-gradient(180deg, rgba(11,9,11,.5) 0%, rgba(11,9,11,0) 16%, rgba(11,9,11,0) 44%, rgba(11,9,11,.7) 76%),
      url(/art/launch-film.jpg) 50% 18%/cover no-repeat;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 26%), linear-gradient(180deg, #000 52%, transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg, transparent 0, #000 26%), linear-gradient(180deg, #000 52%, transparent 100%);
    mask-composite:intersect}
  .usplit{width:var(--cw)}
  .upitch{max-width:none; min-height:0}   
  .uslide h1{font-size:clamp(48px, 4.4vw, 66px); line-height:1.04}
  .umline{max-width:450px; margin-top:16px; font-size:13.5px; line-height:1.6}   
  .uask{margin-top:40px}
  .uask .utabs{padding:0 14px}
  .uask .ubox{background:#0a080b; backdrop-filter:none}
  .uask .ubox .uidea textarea,.uask .ubox .uidea.open textarea{height:102px; min-height:102px; padding:16px 22px 8px; font-size:17px; line-height:26px}   
  .uask .utools{padding:8px 12px 10px 14px}

  
  .band.uafter{padding:20px 0 0; border-top:0}
  .uafter .bwrap{width:var(--cw); margin:0 auto; transform:none}

  
  .band{padding:var(--secgap) 0 0; border-top:0; text-align:left}
  #modes,#price,#kinds{padding:var(--secgap) 0 0}
  #modes > .bwrap,#price > .bwrap,#kinds > .bwrap{border-top:1px solid var(--edge-soft); padding-top:40px}
  .band .bwrap > h2,#modes h2,#price h2,#kinds h2{font:400 32px/1.15 var(--serif); color:var(--cream); text-align:left; margin:0 0 24px; text-wrap:balance}

  
  .mgallery{width:var(--cw); max-width:none; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; padding:0}

  
  #price .calc{width:100%; max-width:none; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
    grid-template-areas:"secs price list" "rail rail list" "buy buy list" "note cur list";
    column-gap:0; row-gap:14px; padding:26px 0 24px 28px; align-items:center}
  #price .slotsecs{font-size:34px}
  #price .ygp{font-size:28px; padding-right:32px}
  #price .slotrail,#price .buyrow,#price #mtag{padding-right:32px}
  #price .ticks{height:32px}   
  #price .curwrap{margin-right:32px}
  #price #yglist{align-self:stretch; display:flex; flex-direction:column; justify-content:center; border-top:0; border-left:1px solid var(--edge-soft, rgba(255,243,228,.11));
    padding:26px 28px 24px 32px; margin:-26px 0 -24px}
  #price .youget li{font-size:14px; padding:5px 0}
  #price .taxnote{max-width:none; text-align:left; margin-top:12px}

  
  #kinds{padding-bottom:var(--secgap)}
  #kinds .kinds{max-width:none; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px 40px; align-items:start}
  #kinds h3{font-size:15px}
  #kinds p{font-size:13.5px; max-width:36em; text-wrap:pretty}   

  
  footer{width:var(--cw); margin:0 auto; padding:30px 0 40px; border-top:1px solid var(--edge-soft)}
}

@media(min-width:901px) and (max-width:1099px){
  #kinds .kinds{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(min-width:901px) and (max-width:1000px){
  #price .calc{grid-template-columns:minmax(0,1fr) auto minmax(0,1.3fr); padding-left:22px}
  #price .ygp{padding-right:24px}
  #price .slotrail,#price .buyrow,#price #mtag{padding-right:24px}
  #price .curwrap{margin-right:24px}
  #price #yglist{padding-left:24px; padding-right:20px}
  #price .youget li{font-size:13.5px}
}

@media(min-width:901px) and (max-height:740px){
  .usecases{padding-top:28px}
  .uask{margin-top:32px}
}

@media(min-width:1921px){
  .usecases::before{inset:0 max(0px, calc((100vw - var(--cw)) / 2 - 360px)) 0 auto;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 26%, #000 82%, transparent 100%), linear-gradient(180deg, #000 52%, transparent 100%);
    mask-image:linear-gradient(90deg, transparent 0, #000 26%, #000 82%, transparent 100%), linear-gradient(180deg, #000 52%, transparent 100%)}
}


.uroad{display:contents}   
.uroadbuy{display:none}   
.hks{display:none}   
.urs{display:none}   

@media(max-width:900px){
  html .umline .umpacks{display:none}
  html #uask .utabs{display:grid; grid-template-columns:auto auto auto; justify-content:center; align-items:center; column-gap:12px; row-gap:0}
  html #uask .uroad > .utab[data-road="fun"]{grid-row:2; grid-column:1}
  html #uask .uroad > .utog{grid-row:2; grid-column:2}
  html #uask .uroad > .utab[data-road="full"]{grid-row:2; grid-column:3}
  html #uask .uroad > .uroadbuy{display:inline-flex; grid-row:1; grid-column:1 / -1; justify-self:center; align-items:center; gap:5px; margin:8px 0 20px;   
    padding:9px 18px; border:0; border-radius:calc(var(--round, 12px) - 2px); background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo)); color:var(--gold-ink);
    font:700 14px/1.25 var(--sans); text-decoration:none; white-space:nowrap;
    box-shadow:0 2px 8px -1px rgba(14,8,4,.42), inset 0 1px 0 rgba(255,250,240,.2), 0 0 26px -8px rgba(232,201,136,.5)}
}
#price .slotsecs .slotcr{display:block; margin-top:6px; font:500 12px/1.2 var(--sans); letter-spacing:0; color:var(--dim)}
#price .tick .sec{display:block}
@media(max-width:900px){ #price .ticks{height:30px} }
@media(min-width:901px){ #price #yglist{box-sizing:border-box} }   


.umline .umpacks{display:table; margin:10px 0 0; padding:8px 16px; border-radius:calc(var(--round, 12px) - 2px); border:0;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo)); color:var(--gold-ink); font:700 13.5px/1.25 var(--sans); text-decoration:none; text-shadow:none;
  box-shadow:0 2px 8px -1px rgba(14,8,4,.42), inset 0 1px 0 rgba(255,250,240,.2), 0 0 26px -8px rgba(232,201,136,.5)}
.umline .umpacks:hover{filter:brightness(1.06)}
.umline .umpacks:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}

html.pricespage main > section:not(#price){display:none}
html.pricespage #price{padding-top:82px}

@media(min-width:901px){
  
  .usecases{min-height:calc(100svh - 78px); padding:28px 0 40px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center}
  .usecases::before{display:none}
  .usecases .upitch{display:none}
  .usecases > .uwrap{flex:0 0 auto; height:auto; min-height:0}
  .usecases .usplit{grid-template-areas:"ask" "mline"; grid-template-rows:auto auto; align-content:center; height:auto; width:min(1040px, calc(100vw - 96px))}
  .usecases .uask{grid-area:ask; margin:0}
  .usecases .umline{display:none}   
  .uwrap.ucpopon{z-index:3}
  @view-transition{ navigation:auto; }   
  .ucflow{view-transition-name:fmflow}

  .uask.ucomp{position:relative}
  .uask.ucomp .utools{display:none}
  
  :root{--fmblock:min(660px, calc(100svh - 180px))}
  .uask.ucomp .ubox{background:rgba(10,8,11,.96); display:grid; grid-template-columns:66px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto auto auto auto auto; height:var(--fmblock); min-height:440px}
  .uask.ucomp .ubox > *{grid-column:2; min-width:0}
  .uask.ucomp .ubox > .uidea,.uask.ucomp .ubox > .ucpanel{grid-row:1; min-height:0}
  .uask.ucomp .ubox > .uidea{display:flex; flex-direction:column}
  .uask.ucomp .ubox > .ucpanel{overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin}
  .uask.ucomp .ubox > .ucsay{grid-row:2}
  .uask.ucomp .ubox > .ucpills{grid-row:3}
  .uask.ucomp .ubox > .ucfunrow{grid-row:6; min-height:99px; box-sizing:border-box}   
  .uask.ucomp .ubox > .ucbar{grid-row:5}
  .uask.ucomp .ubox > .ucflow{grid-row:6}
  .uask.ucomp.isfun .ubox > .ucflow{display:none}   
  
  .ucstep.ready{border-color:var(--gold); background:linear-gradient(180deg, var(--gold-hi), var(--gold))}
  .ucstep.ready .ucsn,.ucstep.ready .ucsv{color:#1b1408; text-shadow:none}
  .ucstep.ready .ucn{background:rgba(27,20,8,.14); color:#1b1408}
  
  .ucfunrow{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:24px; align-items:center; padding:12px 26px; border-top:1px solid rgba(255,250,242,.08)}
  .ucfunrow[hidden]{display:none}
  .ucfc{display:flex; flex-direction:column; gap:8px; min-width:0}
  .ucfc .ucfaces .ucface{width:34px; height:34px; margin-left:-7px; font-size:11px}
  .ucfc .ucfaces .ucface:first-child{margin-left:0}
  .ucfcn{font:600 12.5px/1.3 var(--sans); color:var(--cream); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  
  .uask.ucomp .ubox > .ucrail{grid-column:1; grid-row:1 / 7; display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 0; border-right:1px solid rgba(255,250,242,.08); background:rgba(14,12,15,.6)}
  .ucri{display:flex; flex-direction:column; align-items:center; gap:4px; width:52px; margin:0; padding:7px 0 6px; box-sizing:border-box; border:1px solid transparent; border-radius:calc(var(--round) - 3px);
    background:none; color:#cfc8bf; font:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:border-color .2s, background-color .2s}
  .ucri[hidden]{display:none}
  .ucri svg{flex:none; width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
  .ucrl{display:block; max-width:50px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 9.5px/1.1 var(--sans); color:var(--dim); letter-spacing:.01em}
  .ucacsec .ucrl{max-width:64px}   
  .ucri:hover,.ucri[aria-expanded="true"]{border-color:rgba(232,201,136,.45); color:var(--gold-hi)}
  .ucri:focus-visible{outline:2px solid var(--gold); outline-offset:1px}
  
  .ucri.ucmagic svg{width:21px; height:21px}
  .ucri.ucmagic.on{border-color:rgba(232,201,136,.5); background:rgba(232,201,136,.1); color:var(--gold-hi)}
  .ucri.ucmagic.on svg{fill:rgba(247,227,176,.35)}
  .ucsw{position:relative; display:block; width:24px; height:13px; border-radius:7px; background:rgba(255,243,228,.2); transition:background .2s}
  .ucsw i{position:absolute; top:2px; left:2px; width:9px; height:9px; border-radius:50%; background:#f4efe6; transition:left .2s}
  .ucmagic.on .ucsw{background:var(--gold-lo)}
  .ucmagic.on .ucsw i{left:13px}
  .ucrsep{flex:none; width:28px; height:1px; margin:2px 0; background:rgba(255,243,228,.12)}
  #uask.ucomp .ubox .uidea textarea,#uask.ucomp .ubox .uidea.open textarea{flex:1 1 auto; height:100%; min-height:0; padding:20px 26px 10px; font-size:19px; line-height:28px; resize:none}
  .uask.ucomp.onsec .uidea{display:none}
  
  .uask.ucomp .ubox > .ucownp{grid-row:1; align-self:center; margin:0; padding:20px 26px; font:500 17px/1.5 var(--sans); color:var(--dim); cursor:pointer}
  .uask.ucomp .ubox > .ucownp[hidden],.uask.ucomp.ucown .ubox > .uidea,.uask.ucomp.ucown .ubox > .ucpills,.uask.ucomp.ucown .ubox > .ucbar{display:none}
  .ucownb{display:inline-flex; align-items:center; gap:6px; margin:0 0 0 6px; padding:0; border:0; background:none; color:var(--gold); font-family:var(--sans); font-size:inherit; font-weight:600; line-height:inherit; cursor:pointer}
  .ucownb:hover,.ucownb:focus-visible{color:var(--gold-hi); text-decoration:underline; text-underline-offset:3px; outline:none}
  html.ucfold .uask.ucomp .ubox > .ucownp{display:flex; align-items:center; min-height:100px; box-sizing:border-box; padding:10px 26px; font-size:15px}
  html.ucfold .uask.ucomp .ubox > .ucownp[hidden]{display:none}

  
  .ucpanel{padding:14px 22px 12px; box-sizing:border-box}
  .ucpanel[hidden]{display:none}
  .ucph{display:flex; align-items:center; gap:10px; margin:0 0 12px}
  .ucph b{display:inline-flex; align-items:center; gap:8px; font:700 15px/1.2 var(--sans); color:var(--cream)}
  .ucph b i{display:grid; place-items:center; width:20px; height:20px; border-radius:6px; background:rgba(232,201,136,.16); color:var(--gold-hi); font:700 11px/1 var(--sans); font-style:normal}
  .ucph > span{font:500 12.5px/1.3 var(--sans); color:var(--dim)}
  .ucback{display:grid; place-items:center; width:30px; height:30px; margin:0; padding:0; border:1px solid rgba(255,243,228,.16); border-radius:calc(var(--round) - 3px); background:none; color:var(--dim); cursor:pointer}
  .ucback svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
  .ucback:hover,.ucback:focus-visible{color:var(--gold); border-color:rgba(232,201,136,.5); outline:none}
  .ucpb{display:flex; flex-direction:column; gap:10px}
  .ucnote{margin:0; color:var(--dim); font:500 13px/1.45 var(--sans)}
  .ucnote.ucsmall{font-size:11.5px}
  .ucwhy{margin:0; font:500 12.5px/1.4 var(--sans); color:rgba(246,239,226,.8)}
  .ucwait{margin:0; padding:24px; text-align:center}
  .ucerr{margin:0; color:var(--dim); font:500 13px/1.4 var(--sans)}

  
  .ucbar{display:flex; align-items:center; gap:8px; padding:8px 12px 12px 14px}
  .ucri:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
  .ucfill{flex:1 1 auto}
  .ucgo svg{flex:none; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round}
  .ucgo{flex:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; margin:0; padding:0 22px; border:0; border-radius:var(--round); font:700 15.5px/1 var(--sans); cursor:pointer; -webkit-tap-highlight-color:transparent}
  .ucgo.gold{background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo)); color:var(--gold-ink); box-shadow:0 12px 26px -14px rgba(232,201,136,.7)}
  .ucgo.pink{background:linear-gradient(180deg,var(--pink-hi),var(--pink)); color:var(--pink-ink); box-shadow:0 12px 26px -14px color-mix(in srgb, var(--pink) 70%, transparent)}
  .ucgo:hover{filter:brightness(1.06)}
  .ucgo:active{transform:scale(.985)}
  .ucgo:focus-visible{outline:2px solid var(--gold-hi); outline-offset:3px}
  .ucgo.pink:focus-visible{outline-color:var(--pink-hi)}

  
  #uask.ucomp .ucsay{margin:0; padding:0 26px 10px; font:500 13px/1.45 var(--sans); color:var(--dim)}
  #uask.ucomp .ucsay[hidden]{display:none}
  #uask.ucomp .ucsay b{color:var(--gold-hi); font-weight:700}
  #uask.ucomp .ucsay a{color:var(--gold)}
  .ucsayw{color:rgba(246,239,226,.7)}
  #uask.ucomp .ucpills{display:flex; flex-wrap:wrap; gap:7px; padding:0 24px 12px}
  #uask.ucomp .ucpills[hidden],#uask.ucomp .ucpills:empty{display:none}
  .ucpill{display:inline-flex; align-items:center; gap:6px; min-height:30px; margin:0; padding:4px 12px 4px 9px; border:1px solid rgba(201,162,200,.45); border-radius:calc(var(--round) - 3px);
    background:rgba(201,162,200,.08); color:#ecdcec; font:500 13px/1.3 var(--sans); text-align:left; cursor:pointer; animation:ucin .35s ease-out both; animation-delay:calc(var(--i, 0) * 70ms)}
  .ucpill > span{color:#c9a2c8; font-weight:700}
  .ucpill:hover{background:rgba(201,162,200,.18)}
  .ucpill:focus-visible{outline:2px solid #c9a2c8; outline-offset:2px}
  .ucpills .ucnote .spin{width:12px; height:12px; vertical-align:-1px}

  
  .ucflow{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:8px; margin:0; padding:10px 12px 12px; border-top:1px solid rgba(255,250,242,.08); background:rgba(14,12,15,.6)}
  .ucstep{position:relative; display:flex; flex-direction:column; justify-content:space-between; gap:5px; min-width:0; height:76px; margin:0; padding:8px 8px 8px; box-sizing:border-box;
    border:1px solid rgba(255,243,228,.13); border-radius:var(--round); background:rgba(14,12,15,.92); color:var(--cream); text-align:left; font:inherit; overflow:hidden; cursor:pointer;
    -webkit-tap-highlight-color:transparent; transition:border-color .2s, transform .2s, background-color .2s}
  .ucstep:hover{border-color:rgba(232,201,136,.5)}
  .ucstep:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
  .ucstep.here{border-color:var(--gold); box-shadow:inset 0 2px 0 var(--gold)}
  .ucstep.opt{border-style:dashed}
  .ucstep.opt.here{border-style:solid}
  .ucsn{position:relative; z-index:1; display:flex; align-items:center; gap:5px; min-width:0; font:700 11px/1.15 var(--sans); color:var(--cream)}
  .ucn{flex:none; display:grid; place-items:center; width:17px; height:17px; border-radius:5px; background:rgba(255,243,228,.1); color:var(--dim); font:700 10px/1 var(--sans); font-style:normal}
  .ucstep.here .ucn{background:rgba(232,201,136,.2); color:var(--gold-hi)}
  .ucsn > span{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .ucsv{position:relative; z-index:1; display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 12px/1.25 var(--sans); color:rgba(246,239,226,.78)}
  .ucsv.q{font-style:italic; font-weight:500}
  .ucstep.done .ucsv{color:var(--cream)}
  .uceye{flex:none; display:grid; place-items:center; width:18px; height:18px; color:var(--gold); animation:ucpop .45s cubic-bezier(.2,1.6,.4,1) both}
  .uceye svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
  .ucstep.st-eye{border-color:rgba(232,201,136,.5)}
  .ucstep.st-grey{opacity:.45}
  .ucstep.st-grey:hover{opacity:.7}
  .uctick{flex:none; display:grid; place-items:center; width:18px; height:18px; color:var(--sage); animation:ucpop .45s cubic-bezier(.2,1.6,.4,1) both}
  .uctick svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
  .ucspin{flex:none; width:11px; height:11px; box-sizing:border-box; border-radius:50%; border:2px solid var(--gold); border-top-color:transparent; animation:uwspin .75s linear infinite}
  .ucstep .ucbg{position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:cover; opacity:.66; transition:opacity .3s}
  .ucstep.haspic::before{content:''; position:absolute; inset:0; z-index:0; background:linear-gradient(180deg, rgba(10,8,11,.55) 0%, rgba(10,8,11,.2) 45%, rgba(10,8,11,.85) 100%)}
  .ucstep.haspic .ucsn,.ucstep.haspic .ucsv{text-shadow:0 1px 6px rgba(0,0,0,.85)}
  .ucstep.haspic:hover .ucbg{opacity:.82}
  .ucfaces{position:relative; z-index:1; display:flex; align-items:center; padding-left:3px}
  .ucface{display:grid; place-items:center; flex:none; width:22px; height:22px; margin-left:-5px; box-sizing:border-box; border-radius:50%; border:2px solid #0f0c10;
    background:hsl(var(--h) 36% 30%); color:hsl(var(--h) 70% 88%); font:700 8.5px/1 var(--sans); animation:ucpop .5s cubic-bezier(.2,1.5,.4,1) both; animation-delay:calc(var(--i, 0) * 130ms)}
  .ucface:first-child{margin-left:0}
  .ucfaces + .ucsv{display:none}
  .ucstep.isbusy{border-color:rgba(232,201,136,.36)}
  .ucstep.isbusy::after{content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:linear-gradient(105deg, transparent 28%, rgba(232,201,136,.2) 50%, transparent 72%); background-size:260% 100%; animation:ucshim 1.25s linear infinite}
  .ucstep[data-step="script"].isbusy::after{animation-duration:1.6s; animation-delay:-.5s}
  .ucstep[data-step="music"].isbusy::after{animation-duration:1.05s; animation-delay:-.3s}
  .ucstep[data-step="assets"].isbusy::after{animation-duration:1.4s; animation-delay:-.9s}
  .ucstep[data-step="script"] .ucspin{animation-duration:1s}
  .ucstep[data-step="music"] .ucspin{animation-duration:.6s}
  .ucstep[data-step="assets"] .ucspin{animation-duration:.85s}
  .ucstep.ucflash{animation:uclift 1.6s ease-out}
  .ucstep.ucflash::after{content:''; position:absolute; inset:0; z-index:0; pointer-events:none; background:rgba(232,201,136,.3); animation:ucfade 1.6s ease-out forwards}

  
  .uccastl{display:flex; flex-wrap:wrap; gap:10px}
  .uccm{display:flex; align-items:center; gap:10px; min-width:0; max-width:300px; padding:6px 12px 6px 6px; border:1px solid rgba(255,243,228,.12); border-radius:var(--round); background:rgba(255,245,232,.04)}
  .uccm .ucface{width:34px; height:34px; margin:0; font-size:11px}
  .uccm span{display:flex; flex-direction:column; gap:2px; min-width:0}
  .uccm b{font:700 13px/1.2 var(--sans); color:var(--cream)}
  .uccm small{font:500 11.5px/1.3 var(--sans); color:var(--dim)}

  
  .ucopt{display:flex; flex-direction:column; align-items:flex-start; gap:3px; width:100%; margin:0; padding:9px 11px; box-sizing:border-box; border:1px solid transparent;
    border-radius:calc(var(--round) - 3px); background:none; color:var(--cream); text-align:left; font:inherit; cursor:pointer}
  .ucopt b{font:600 13.5px/1.25 var(--sans)}
  .ucopt small{font:500 11.5px/1.35 var(--sans); color:var(--dim)}
  .ucopt:hover{background:rgba(255,245,232,.06)}
  .ucopt.on{border-color:rgba(232,201,136,.45); background:rgba(232,201,136,.13); color:var(--gold-hi)}
  .ucopt:focus-visible{outline:2px solid var(--gold); outline-offset:1px}
  .ucpanel > .ucpb > .ucopt{max-width:520px}
  .uccols{display:grid; grid-template-columns:1fr 1fr; gap:14px}
  .uccols > div{display:flex; flex-direction:column; gap:3px; min-width:0}
  .uccols h4{margin:2px 0 6px 4px; font:700 10.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--dim)}
  .uccols.ucchips > div{flex-direction:row; flex-wrap:wrap; align-content:flex-start; gap:6px}
  .uccols.ucchips h4{flex:0 0 100%; margin-bottom:2px}
  .uccols.ucchips .ucopt{width:auto; padding:7px 12px; border-color:rgba(255,243,228,.12)}
  .uccols.ucchips .ucopt.on{border-color:rgba(232,201,136,.45)}
  .uctabs{display:flex; flex-wrap:wrap; gap:5px; margin:0 0 10px}
  .uctab{height:28px; margin:0; padding:0 11px; border:1px solid rgba(255,243,228,.13); border-radius:calc(var(--round) - 3px); background:none; color:var(--dim); font:600 12px/1 var(--sans); cursor:pointer}
  .uctab.on{border-color:rgba(232,201,136,.5); background:rgba(232,201,136,.12); color:var(--gold-hi)}
  .uctab:focus-visible{outline:2px solid var(--gold); outline-offset:1px}
  .uclooks{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px 8px}
  .uclook{display:flex; flex-direction:column; gap:5px; min-width:0; margin:0; padding:0; border:0; background:none; color:var(--cream); text-align:left; font:inherit; cursor:pointer}
  .uclook img,.uclook .ucnone{display:block; width:100%; aspect-ratio:16/9; object-fit:cover; box-sizing:border-box; border:2px solid transparent; border-radius:calc(var(--round) - 4px); transition:border-color .15s}
  .uclook .ucnone{display:grid; place-items:center; border:1px dashed rgba(255,243,228,.22); color:var(--dim); font:600 11.5px/1.2 var(--sans); text-align:center; padding:4px}
  .uclook > span:last-child{font:600 11.5px/1.25 var(--sans); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .uclook.uclater > span:last-child{color:var(--dim); font-weight:500; white-space:normal}
  .uclook:hover img{border-color:rgba(232,201,136,.5)}
  .uclook.on img{border-color:var(--gold)}
  .uclook.on .ucnone{border:2px solid var(--gold); color:var(--gold-hi)}
  .uclook.on > span:last-child{color:var(--gold-hi)}
  .uclook:focus-visible{outline:none}
  .uclook:focus-visible img,.uclook:focus-visible .ucnone{border-color:var(--gold-hi)}
  .ucdial{display:flex; align-items:center; gap:12px; max-width:520px; font-size:22px; line-height:1}
  #uask.ucomp input.ucdialr{flex:1 1 auto; width:auto; min-width:0; height:6px; margin:0; padding:0; border:0;
    background:linear-gradient(90deg, var(--pink) var(--pct, 50%), rgba(255,245,232,.2) var(--pct, 50%))}
  #uask.ucomp input.ucdialr::-webkit-slider-thumb{width:22px; height:22px; background:linear-gradient(180deg,var(--pink-hi),var(--pink))}
  #uask.ucomp input.ucdialr::-moz-range-thumb{width:18px; height:18px; background:linear-gradient(180deg,var(--pink-hi),var(--pink))}
  .ucdsay{margin:0; font:600 14px/1.3 var(--sans); color:var(--cream)}
  .uclen{display:flex; align-items:center; gap:12px; max-width:520px}
  .uclk{display:grid; place-items:center; color:var(--gold)}
  .uclk svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round}
  #uask.ucomp input.uclenr{flex:1 1 auto; width:auto; min-width:0; height:6px; margin:0; padding:0; border:0}
  #uask.ucomp input.uclenr::-webkit-slider-thumb{width:22px; height:22px}
  .ucsecs{flex:none; display:flex; align-items:center; gap:3px; height:36px; padding:0 10px; box-sizing:border-box; border:1px solid rgba(255,243,228,.16); border-radius:calc(var(--round) - 3px); background:#060507; cursor:text}
  .ucsecs:focus-within{border-color:var(--gold)}
  #uask.ucomp .ucsecs input{flex:none; width:34px; min-width:0; height:auto; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; outline:none; color:var(--gold-hi); font:700 15px/1 var(--sans); text-align:center}
  .ucsecs span{color:var(--dim); font:600 13px/1 var(--sans)}
  .ucsecs input:placeholder-shown + span{display:none}
  .ucshp{display:flex; gap:8px; max-width:520px}
  .ucopt.ucshape{flex-direction:row; align-items:center; gap:10px; width:auto; flex:1 1 0; border-color:rgba(255,243,228,.12)}
  .ucopt.ucshape svg{flex:none; width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6}
  .ucopt.ucshape.on{border-color:rgba(232,201,136,.5)}

  
  .ucpop{position:absolute; z-index:30; box-sizing:border-box; min-width:220px; max-width:100%; padding:12px; border:1px solid rgba(232,201,136,.42); border-radius:var(--round);
    background:#141117; box-shadow:0 26px 60px -18px rgba(0,0,0,.92); animation:ucopen .16s ease-out}
  .ucpop-kind{width:440px}
  .ucgrid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px}
  .ucpop-len{width:340px}
  .ucpop-len .uclen{max-width:none}
  .ucpop-len .ucnote{margin-top:8px}
  .ucpop-ratio{display:flex; flex-direction:column; gap:6px; width:230px}
  .ucpop-ratio .ucopt.ucshape{flex:none; width:100%}

  @keyframes ucin{from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none}}
  @keyframes ucpop{from{opacity:0; transform:scale(.55)} to{opacity:1; transform:none}}
  @keyframes ucshim{from{background-position:120% 0} to{background-position:-120% 0}}
  @keyframes uclift{0%{border-color:var(--gold-hi); transform:translateY(-3px)} 30%{transform:none} 100%{}}
  @keyframes ucfade{from{opacity:1} to{opacity:0}}
  @keyframes ucopen{from{opacity:0; transform:translateY(-4px)} to{opacity:1; transform:none}}
}

@media(min-width:901px) and (max-width:1099px){
  .uclooks{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ucmagic > span:last-child{font-size:12px}
}

@media(min-width:901px) and (max-height:760px){
  .usecases{padding:18px 0 24px}
}
@media(min-width:901px) and (prefers-reduced-motion:reduce){
  .ucstep.isbusy::after,.ucstep.ucflash,.ucstep.ucflash::after,.ucspin,.uctick,.ucface,.ucpill,.ucpop,.ucmagic.busy .uwsw i{animation:none}
}


#make{scroll-margin-top:84px}


.ucri.ucmagic svg{color:#ffd43b}
.ucri.ucmagic.on svg{color:#ffd43b; fill:rgba(255,212,59,.45); filter:drop-shadow(0 0 6px rgba(255,212,59,.55))}
#uask.ucomp .ucri.ucmagic svg{color:#ffd43b}
#uask.ucomp .ucri.ucmagic.on svg{color:#ffd43b; fill:rgba(255,212,59,.45); filter:drop-shadow(0 0 6px rgba(255,212,59,.55))}


html.ucfull main > .band, html.ucfull body > footer{display:none}

.ucshrink{position:absolute; top:2px; right:0; z-index:4; display:grid; place-items:center; width:36px; height:36px; margin:0; padding:0; box-sizing:border-box;
  border:1px solid rgba(255,243,228,.18); border-radius:var(--round,12px); background:rgba(14,12,15,.9); color:var(--dim,#a29b93); cursor:pointer}
.ucshrink svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.ucshrink:hover,.ucshrink:focus-visible{border-color:var(--gold,#e8c988); color:var(--gold-hi,#f7e3b0)}
html.ucfold .ucshrink{display:none}

html.ucfold .uask.ucomp .ubox{height:auto; min-height:0}
html.ucfold .uask.ucomp .ubox > .ucpanel{display:none}
html.ucfold #uask.ucomp .ubox .uidea textarea{flex:none; height:100px !important; min-height:0 !important; overflow-y:auto; cursor:text}
@media(min-width:901px){
  
  html.ucfold .usecases{min-height:calc(100svh - 64px); padding:clamp(24px, calc((100svh - 600px) / 2), 140px) 0 40px; display:block}
  html.ucfold .usecases::before{display:block}
  html.ucfold .usecases .usplit{grid-template-areas:"pitch" "mline" "ask"; width:min(1040px, calc(100vw - 96px))}
  html.ucfold .usecases .upitch{display:block; grid-area:pitch; align-self:start; max-width:720px}
  html.ucfold .usecases .umline{display:block; grid-area:mline; margin:18px 0 0; max-width:640px}
  html.ucfold .usecases .uask{grid-area:ask; margin-top:34px}
}


@media(min-width:901px) and (max-width:1099px){ .ucflow{grid-auto-flow:row; grid-template-columns:repeat(4,minmax(0,1fr))} }

@media(min-width:901px) and (max-width:1099px){ html.ucfold .ucflow{grid-auto-flow:column; grid-template-columns:none; grid-auto-columns:minmax(0,1fr)} }


#uask .utabs{display:flex; align-items:center; gap:10px; padding:0; margin-bottom:10px; position:relative; z-index:2}
#uask .utab{height:auto; margin:0; padding:4px 0; border:0; border-radius:0; background:none; box-shadow:none; color:var(--dim,#a29b93);
  font:600 14px/1.2 var(--sans); gap:6px; transition:color .2s ease}
#uask .utab:hover{color:#efe7dc}
#uask .utab.on{height:auto; margin:0; border:0; background:none; box-shadow:none; color:var(--gold-hi,#f7e3b0)}
#uask .utab.on[data-road="fun"]{color:var(--pink-hi)}
#uask .utog{position:relative; flex:none; width:40px; height:22px; margin:0; padding:0; box-sizing:border-box; border:1px solid rgba(232,201,136,.6);
  border-radius:11px; background:rgba(232,201,136,.16); cursor:pointer; -webkit-tap-highlight-color:transparent; transition:background .25s ease, border-color .25s ease}
#uask .utog i{position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:var(--gold,#e8c988); transform:translateX(18px); transition:transform .25s ease, background .25s ease}   
#uask.isfun .utog{border-color:color-mix(in srgb, var(--pink) 65%, transparent); background:color-mix(in srgb, var(--pink) 18%, transparent)}
#uask.isfun .utog i{transform:none; background:var(--pink)}   
#uask .ubox{border-radius:var(--round,12px)}

@media(max-width:640px){ #uask .utabs{gap:12px; justify-content:center} #uask .utab{font-size:16px} #uask .utog{width:52px; height:28px; border-radius:14px}
  #uask .utog i{top:4px; left:4px; width:18px; height:18px; transform:translateX(24px)} #uask.isfun .utog i{transform:none} }
@media(prefers-reduced-motion:reduce){ #uask .utog,#uask .utog i,#uask .utab{transition:none} }


#uask.ucomp .ubox > .ucshrink{top:10px; right:10px; width:32px; height:32px; border:0; border-radius:calc(var(--round,12px) - 4px); background:transparent; color:#8d867e}
#uask.ucomp .ubox > .ucshrink svg{width:16px; height:16px}
#uask.ucomp .ubox > .ucshrink:hover,#uask.ucomp .ubox > .ucshrink:focus-visible{background:rgba(255,245,232,.07); color:var(--gold-hi,#f7e3b0)}
@media(min-width:901px){
  
  html.ucon .backdrop,html.ucon .scrim{display:none}
  
  html.ucon .usecases{position:relative; isolation:isolate}
  html.ucon .usecases::before{display:block !important; content:''; position:absolute; inset:0; width:auto; height:auto; z-index:-1; pointer-events:none;
    background:
      linear-gradient(90deg, rgba(11,9,11,.72) 0%, rgba(11,9,11,.42) 34%, rgba(11,9,11,.2) 64%, rgba(11,9,11,.3) 100%),
      linear-gradient(180deg, rgba(11,9,11,.45) 0%, rgba(11,9,11,.12) 22%, rgba(11,9,11,.5) 62%, #0b090b 100%),
      url(/art/process.jpg) center 38%/cover no-repeat;
    -webkit-mask-image:none; mask-image:none}
  
  html.ucon .usecases::before{will-change:transform; transform:translate3d(0, calc(var(--ucpar, 0) * .45px), 0)}
  @supports (animation-timeline: scroll()){
    html.ucon .usecases::before{transform:none; animation:ucParallax linear both; animation-timeline:scroll(root block); animation-range:0px 1000px}
  }
  html.ucfold .usecases .usplit{grid-template-columns:minmax(0,1fr) auto; column-gap:48px; grid-template-areas:"pitch film" "mline mline" "ask ask"}
  html.ucfold .usecases .upitch{align-self:center}
  html.ucfold .usecases .umline{white-space:nowrap; max-width:none; font-size:13px; margin-top:12px}
  
  html.ucfold .usecases{padding-top:clamp(12px, calc((100svh - 800px) / 2), 72px)}
  html.ucfold .usecases .uask{margin-top:44px}   
  
  html.ucfold #uask.ucomp .uroad{position:absolute; left:2px; bottom:calc(100% + 10px); display:grid; grid-template-columns:auto auto auto auto; align-items:center; column-gap:14px; row-gap:3px}
  
  html.ucfold #uask.ucomp .uroad > .utab[data-road="fun"]{grid-column:1; grid-row:1}
  html.ucfold #uask.ucomp .uroad > .utog{grid-column:2; grid-row:1}
  html.ucfold #uask.ucomp .uroad > .utab[data-road="full"]{grid-column:3; grid-row:1}
  html.ucfold #uask.ucomp .uroad > .uroadbuy{grid-column:4; grid-row:1}
  html.ucfold #uask.ucomp .uroadbuy .hkl{display:none}   
  html.ucfold #uask.ucomp .uroadbuy .hks{display:inline}
  html.ucfold #uask.ucomp .uroad > .urs{display:block; grid-row:2; font:500 12px/1.3 var(--sans); color:var(--dimmer, #8c8680); white-space:nowrap; pointer-events:none}
  html.ucfold #uask.ucomp .uroad > .urs-fun{grid-column:1}
  html.ucfold #uask.ucomp .uroad > .urs-full{grid-column:3}
  html.ucfold #uask.ucomp.isfun .uroad > .urs-fun,html.ucfold #uask.ucomp:not(.isfun) .uroad > .urs-full{color:var(--dim, #a29b93)}   
  html.ucfold #uask.ucomp .uroad .utab{font-size:17px}
  html.ucfold #uask.ucomp .uroad .utog{width:56px; height:30px; border-radius:15px}
  html.ucfold #uask.ucomp .uroad .utog i{top:4px; left:4px; width:20px; height:20px; transform:translateX(26px)}
  html.ucfold #uask.ucomp.isfun .uroad .utog i{transform:none}
  
  html.ucfold .usecases .umline .umpacks{display:none}
  html.ucfold #uask.ucomp .uroadbuy{display:inline-flex; align-items:center; gap:5px; margin-left:4px; padding:7px 15px; border:0;   
    border-radius:calc(var(--round, 12px) - 2px); background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo)); color:var(--gold-ink);
    font:700 13.5px/1.25 var(--sans); text-decoration:none; white-space:nowrap;
    box-shadow:0 2px 8px -1px rgba(14,8,4,.42), inset 0 1px 0 rgba(255,250,240,.2), 0 0 26px -8px rgba(232,201,136,.5)}   
  html.ucfold #uask.ucomp .uroadbuy:hover{filter:brightness(1.06)}
  html.ucfold #uask.ucomp .uroadbuy:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
  html.ucfold .usecases .umline .uminfo{white-space:normal}

  
  html.ucmorph .ucflow{view-transition-name:none}
  html.ucmorph::view-transition-old(root){animation:ucfadeaway .26s ease both}
  html.ucmorph::view-transition-new(root){animation:none}
}
@keyframes ucfadeaway{to{opacity:0}}


#uask.ucomp .ucri.uclenb.uclocked{position:relative}
#uask.ucomp .ucri.uclenb.uclocked::after{content:""; position:absolute; top:4px; right:8px; width:9px; height:9px; border-radius:2px; background:var(--gold,#e8c988);
  -webkit-mask:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='10' width='16' height='12' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3' fill='none' stroke='%23000' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='10' width='16' height='12' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3' fill='none' stroke='%23000' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat}
.ucpop-len .ucunlock{margin-top:6px; border-color:rgba(232,201,136,.4); text-decoration:none; color:var(--gold-hi,#f7e3b0)}
@keyframes ucParallax{from{transform:translate3d(0,0,0)} to{transform:translate3d(0,450px,0)}}
@media (prefers-reduced-motion:reduce){ html.ucon .usecases::before{animation:none !important; transform:none !important} }


@media(min-width:901px){
  html.ucfold .usecases .usplit{grid-template-areas:"pitch film" "mline film" "ask ask"; column-gap:28px}
  html.ucfold .usecases .uhero > .ulmob{display:block; grid-area:film; position:relative; z-index:0; align-self:end; justify-self:end;
    width:clamp(360px, 38vw, 520px); height:auto; aspect-ratio:16/9; margin:0 0 -14px; padding:0; border:0; border-radius:0; overflow:hidden;
    background:#0b090b url(/art/launch-film.jpg) center/cover no-repeat; cursor:pointer;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 24%), linear-gradient(180deg, transparent 0, #000 16%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg, transparent 0, #000 24%), linear-gradient(180deg, transparent 0, #000 16%);
    mask-composite:intersect}
  html.ucfold .usecases .uhero > .ulmob::after{display:none}
  html.ucfold .usecases .uhero > .ulmob video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
  html.ucfold .usecases .uhero > .ulmob .ulsound{position:absolute; top:auto; right:12px; bottom:12px; z-index:2}
  html.ucfold .usecases .uhero > .ulmob .ulcapvh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  html.ucfold .usecases .uhero > .ulmob:focus-visible{outline:none}
  html.ucfold .usecases .uhero > .ulmob:focus-visible .ulsound{outline:2px solid var(--gold,#e8c988); outline-offset:2px}
  html.ucfold .usecases .uask{position:relative; z-index:1}
  html.ucfold .usecases .umline{font-size:12.5px; position:relative; z-index:1}   
  
  html.ucfold .usecases{min-height:0; padding-bottom:12px}
  html.ucon .band.uafter{padding-top:0}

  
  html.ucon .uafter .bwrap{width:min(1040px, calc(100vw - 96px))}
}


.ubarname{display:none}
@media(min-width:901px){
  #uask.ucomp .utabs{position:relative; height:42px; margin:0; padding:0 56px 0 14px; gap:10px; box-sizing:border-box; border:1px solid rgba(232,201,136,.55); border-bottom:0;
    border-radius:var(--round,12px) var(--round,12px) 0 0; background:#0d0b0e}
  #uask.ucomp.isfun .utabs{border-color:color-mix(in srgb, var(--pink) 60%, transparent)}
  #uask.ucomp .ubox{border-top-left-radius:0; border-top-right-radius:0; border-top-color:rgba(255,250,242,.08)}
  #uask.ucomp .ubarname{display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); margin:0; pointer-events:none; white-space:nowrap;
    font:400 20px/1 'Fraunces',var(--serif); letter-spacing:.01em; color:var(--gold-hi,#f7e3b0)}
  #uask.ucomp.isfun .ubarname{color:var(--pink-hi)}
  #uask.ucomp .utabs > .ucshrink{position:absolute; top:50%; right:8px; transform:translateY(-50%); width:32px; height:32px; border:0; border-radius:calc(var(--round,12px) - 4px);
    background:transparent; color:#8d867e}
  #uask.ucomp .utabs > .ucshrink svg{width:17px; height:17px}
  #uask.ucomp .utabs > .ucshrink:hover,#uask.ucomp .utabs > .ucshrink:focus-visible{background:rgba(255,245,232,.07); color:var(--gold-hi,#f7e3b0)}
}


@media(min-width:901px) and (max-height:760px){
  html.ucfold #uask.ucomp .ubox .uidea textarea{height:76px !important}
  html.ucfold .usecases .uask{margin-top:42px}   
  html.ucfold .usecases .uhero > .ulmob{margin-bottom:-10px; width:min(clamp(320px, 38vw, 520px), calc((100svh - 500px) * 1.7778))}   
}


a.ucsignup,a.uwsignup{border-color:rgba(232,201,136,.6) !important; background:rgba(232,201,136,.12) !important; color:var(--gold-hi,#f7e3b0) !important; font-weight:700; text-decoration:none; cursor:pointer}
a.ucsignup:hover,a.uwsignup:hover,a.ucsignup:focus-visible,a.uwsignup:focus-visible{background:rgba(232,201,136,.22) !important; border-color:var(--gold,#e8c988) !important}


@media(min-width:901px){
  html.ucfull{--fmblock:max(440px, calc(100svh - 72px - 42px))}
  html.ucfull .usecases{padding:0; min-height:0; justify-content:flex-start}
  html.ucfull .usecases > .uwrap{width:100%; max-width:none; margin:0; padding:0}
  html.ucfull .usecases .usplit{width:100%; max-width:none; margin:0 auto}
  html.ucfull #uask.ucomp .utabs{border:0; border-radius:0; border-bottom:1px solid rgba(255,250,242,.08)}
  html.ucfull #uask.ucomp .ubox{border:0; border-radius:0}
}


.ucrfoot{display:none}
@media(min-width:901px){
  #uask.ucomp .ucrfoot{display:flex; flex-direction:column; align-items:center; gap:2px; margin-top:auto; padding-top:8px; border-top:1px solid rgba(255,243,228,.08)}
  #uask.ucomp .ucrfoot .ucri[hidden]{display:none}
  #uask.ucomp .ucrfoot .ucacsec .ucrl,#uask.ucomp .ucrfoot .ucacuse .ucrl{color:var(--gold-hi,#f7e3b0)}
  html.ucfold #uask.ucomp .ucrfoot{display:none}
  #uask.ucomp .ucri.ucnew{display:none}
  html.ucfold #uask.ucomp .ucri.ucnew{display:flex}   
  
  html.ucfold #uask.ucomp:not(.isfun) .ubox > .ucrail{gap:0; padding-top:6px; padding-bottom:6px}
  html.ucfold #uask.ucomp:not(.isfun) .ucrail .ucri{padding-top:5px; padding-bottom:4px}
  #uask.ucomp .ubox > .ucbar[hidden]{display:none}   

  
  .uclibtabs{display:flex; gap:6px; margin:0 0 12px}
  .uclibtab{height:30px; margin:0; padding:0 12px; border:1px solid rgba(255,243,228,.13); border-radius:calc(var(--round,12px) - 3px); background:none; color:var(--dim,#a29b93); font:600 12px/1 var(--sans); cursor:pointer}
  .uclibtab small{margin-left:4px; font-weight:500; opacity:.7}
  .uclibtab.on{border-color:rgba(232,201,136,.5); background:rgba(232,201,136,.12); color:var(--gold-hi,#f7e3b0)}
  .uclibgrid{display:grid; grid-template-columns:repeat(auto-fill, minmax(132px, 1fr)); gap:10px}
  .uclibcard{display:flex; flex-direction:column; gap:3px; min-width:0; margin:0; padding:0 0 4px; border:0; background:none; text-align:left; cursor:pointer; color:var(--cream,#f4efe6)}
  .uclibimg{display:block; width:100%; aspect-ratio:1/1; border:1px solid rgba(255,243,228,.1); border-radius:calc(var(--round,12px) - 2px); background:#141117 center/cover no-repeat}
  .uclibcard.on .uclibimg,.uclibcard:hover .uclibimg{border-color:rgba(232,201,136,.6)}
  .uclibcard b{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 12px/1.3 var(--sans)}
  .uclibcard small,.uclibtrack small{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:400 11px/1.3 var(--sans); color:var(--dim,#a29b93)}
  .uclibview{display:flex; gap:16px; align-items:flex-start; margin:0 0 14px; padding:12px; border:1px solid rgba(255,243,228,.1); border-radius:var(--round,12px); background:rgba(255,245,232,.03)}
  .uclibbig{flex:0 0 min(40%, 320px); aspect-ratio:4/3; max-height:240px; border-radius:calc(var(--round,12px) - 2px); background:#141117 center/contain no-repeat}
  .uclibacts{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px}
  .uclibacts .uclibshut{margin-top:0}
  .uclibuse{height:30px; padding:0 12px; border:1px solid rgba(232,201,136,.55); border-radius:calc(var(--round,12px) - 3px); background:rgba(232,201,136,.12); color:var(--gold-hi,#f7e3b0); font:600 12px/1 var(--sans); cursor:pointer}
  .uclibwords{display:flex; flex-direction:column; gap:6px; min-width:0; font:400 13px/1.5 var(--sans); color:rgba(246,239,226,.85)}
  .uclibwords b{font:600 14px/1.3 var(--sans); color:var(--cream,#f4efe6)}
  .uclibwords small{font:400 11.5px/1.3 var(--sans); color:var(--dim,#a29b93)}
  .uclibshut{align-self:flex-start; margin-top:6px; height:30px; padding:0 12px; border:1px solid rgba(255,243,228,.16); border-radius:calc(var(--round,12px) - 3px); background:none; color:var(--cream,#f4efe6); font:600 12px/1 var(--sans); cursor:pointer}
  .uclibtracks{display:flex; flex-direction:column; gap:6px}
  .uclibtrack{display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid rgba(255,243,228,.1); border-radius:calc(var(--round,12px) - 2px)}
  .uclibtrack > span{display:flex; flex-direction:column; min-width:0}
  .uclibtrack b{font:600 12.5px/1.3 var(--sans); color:var(--cream,#f4efe6)}
  .uclibplay{flex:none; display:grid; place-items:center; width:32px; height:32px; margin:0; padding:0; border:1px solid rgba(232,201,136,.45); border-radius:calc(var(--round,12px) - 4px); background:none; color:var(--gold-hi,#f7e3b0); cursor:pointer}
  .uclibplay svg{width:14px; height:14px; fill:currentColor; stroke:none}
  .uclibplay.on{background:rgba(232,201,136,.16)}
}


@media(min-width:901px){
  #uask.ucomp .ubox .uidea textarea,#uask.ucomp .ubox .uidea.open textarea{font-size:15.5px; line-height:24px; padding:18px 22px 10px}
  #uask.ucomp .utab{font-size:13px}
  #uask.ucomp .ubarname{font-size:16px}
  .ucgo{height:38px; padding:0 18px; font-size:13.5px}
  .ucph b{font-size:13.5px}
  .ucdsay{font-size:13px}
  .uslide h1{font-size:clamp(40px, 3.8vw, 58px)}
}


@media(min-width:901px){
  html.ucfull #uask.ucomp .ubox .uidea textarea,html.ucfull #uask.ucomp .ubox .uidea.open textarea{
    
    padding:40px max(28px, min(20%, calc((100% - 720px) / 2))) 30px; font-size:clamp(13px, calc(7px + .47vw), 16px); line-height:1.72;   
    text-align:justify; text-justify:inter-word; hyphens:auto; -webkit-hyphens:auto;
    -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 30px), transparent 100%);
            mask-image:linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 30px), transparent 100%)}   
  html.ucfull #uask.ucomp .ubox > .ucpills{margin-top:4px}
  html.ucfull #uask.ucomp .ubox > .ucpills,html.ucfull #uask.ucomp .ubox > .ucsay{padding-left:max(28px, min(20%, calc((100% - 720px) / 2))); padding-right:max(28px, min(20%, calc((100% - 720px) / 2)))}
}


.ucink{display:none}
@media(min-width:901px){
  #uask.ucomp .uidea{position:relative}
  #uask.ucomp .uidea > .ucink{display:block; position:absolute; z-index:0; margin:0; overflow:hidden; white-space:pre-wrap; overflow-wrap:break-word; word-break:normal;
    pointer-events:none; color:var(--ink,#f4efe6); background:transparent; border-style:solid; border-color:transparent; scrollbar-gutter:stable}
  #uask.ucomp .uidea.inked textarea{position:relative; z-index:1; color:transparent; -webkit-text-fill-color:transparent; caret-color:var(--ink,#f4efe6); background:transparent; scrollbar-gutter:stable}
  #uask.ucomp .uidea.inked textarea::placeholder{color:rgba(246,239,226,.42); -webkit-text-fill-color:rgba(246,239,226,.42)}
  #uask.ucomp .uidea.inked textarea::selection{background:rgba(232,201,136,.3); -webkit-text-fill-color:transparent}
  .ucink .inkname,.ucink .inklabel{color:var(--gold,#e8c988)}
  .ucink .inkparen{color:rgba(246,239,226,.5)}
  .ucink .inksay{color:#fffaf2; -webkit-text-stroke:.5px currentColor}
}


html.ucfold #uask.ucomp .ubox > .ucbar,html.ucfold #uask.ucomp .ubox > .ucpills,html.ucfold #uask.ucomp .ubox > .ucsay{display:none !important}
html.ucfold #uask.ucomp .ubox .uidea textarea{height:158px !important}
@media(min-width:901px) and (max-height:760px){ html.ucfold #uask.ucomp .ubox .uidea textarea{height:124px !important} }   



@media(min-width:901px){
  html.ucfold .usecases .usplit{grid-template-areas:"htop film" "pitch film" "mline film" "hbot film" "ask ask"; grid-template-rows:minmax(0,1fr) auto auto minmax(0,1fr) auto}
}


.uwset .uwfunlen{flex:1 1 auto; font:400 12.5px/1.35 var(--sans); color:rgba(246,239,226,.62)}
.uwset .uwfunlen b{font-weight:700; color:var(--gold-hi,#f7e3b0); margin-right:4px}
.uwset .uwfunlen[hidden],.uwset input.uwslide[hidden],.uwset .uwbox[hidden]{display:none}


.ugsr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.ugal{display:block; min-width:0}
.ugplay{display:flex; align-items:center; gap:2px}
.ugarr{flex:none; width:30px; height:64px; display:grid; place-items:center; padding:0; border:0; background:none; color:var(--dim, #a29b93); cursor:pointer; border-radius:var(--round, 12px)}
.ugarr svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.ugarr:hover:not(:disabled){color:var(--ink, #f4efe6)}
.ugarr:disabled{opacity:.25; cursor:default}
.ugarr:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:-2px}
.ugscreen{position:relative; flex:1; min-width:0; aspect-ratio:16/9; border-radius:var(--round, 12px); overflow:hidden; background:#000; box-shadow:0 18px 40px -22px rgba(0,0,0,.9)}
.ugstill{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.ugstill[hidden]{display:none}
.ugscreen::after{content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(to bottom, rgba(8,6,8,.8) 0%, rgba(8,6,8,0) 42%, rgba(8,6,8,0) 62%, rgba(8,6,8,.7) 100%)}   
.ugscreen.ugchar{background:radial-gradient(circle at 50% 40%, #241d22, #0d0b0e 70%)}
.ugscreen.ugchar .ugstill{inset:auto; left:50%; top:42%; width:auto; height:62%; aspect-ratio:1/1; transform:translate(-50%,-50%); border-radius:50%; border:2px solid var(--gold, #e8c988); box-sizing:border-box}
.ugscreen.ugnostill{background:linear-gradient(140deg, #1d181c, #0d0b0e)}
.ugscreen.ugnostill::before{content:''; position:absolute; left:50%; top:40%; width:44px; height:44px; transform:translate(-50%,-50%); opacity:.55;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8c988' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M7 5v14M17 5v14M3 9.5h4M3 14.5h4M17 9.5h4M17 14.5h4'/%3E%3C/svg%3E") center/contain no-repeat}
.ugkick{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap}   
.ugplaybtn{position:absolute; left:50%; top:50%; z-index:2; width:56px; height:56px; margin:-28px 0 0 -28px; padding:0; border-radius:50%; border:1px solid rgba(247,227,176,.65);
  background:rgba(11,9,11,.55); color:var(--gold-hi, #f7e3b0); display:grid; place-items:center; cursor:pointer; -webkit-tap-highlight-color:transparent}
.ugplaybtn svg{width:22px; height:22px; fill:currentColor; margin-left:3px}
.ugplaybtn[hidden]{display:none}
.ugplaybtn:hover{background:rgba(11,9,11,.75)}
.ugplaybtn:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:3px}
.ugtext{position:absolute; left:12px; top:11px; right:12px; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:0}   
.ugtext > .ugtitle,.ugtext > .ugmeta{max-width:100%}
.ugtitle{font:400 17px/1.2 'Fraunces', ui-serif, Georgia, serif; color:var(--ink, #f4efe6); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ugmeta{font:500 11px/1.3 var(--sans); color:#d6cec4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ugscreen.ugempty::after{display:none}
.ugscreen.ugempty .ugtext{inset:0; right:0; align-items:center; justify-content:center; text-align:center; padding:0 24px}
.ugscreen.ugempty .ugtitle{white-space:normal; color:var(--dim, #a29b93); font-size:16px}
.ugacts{position:absolute; left:12px; right:12px; bottom:10px; z-index:3; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px}   
.ugacts:empty{display:none}
.ugepi{display:inline-block; margin:0 0 6px; padding:4px 8px; border-radius:var(--round, 12px); border:1px solid rgba(232,201,136,.5); background:rgba(11,9,11,.62);
  color:var(--gold-hi, #f7e3b0); font:700 10px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase}   
.ugepi[hidden]{display:none}
.ugscreen.playing .ugepi{display:none}
.ugcta{display:inline-flex; align-items:center; height:32px; padding:0 12px; box-sizing:border-box; border-radius:var(--round, 12px); border:1px solid rgba(255,243,228,.32);
  background:rgba(11,9,11,.5); color:var(--ink, #f4efe6); font:600 12px/1 var(--sans); text-decoration:none; white-space:nowrap; cursor:pointer}
.ugcta.main{border:0; background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font-weight:700}
.ugcta:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}
.ugscreen.playing::after,.ugscreen.playing .ugkick,.ugscreen.playing .ugplaybtn,.ugscreen.playing .ugtext,.ugscreen.playing .ugacts{display:none}
.ugvid{position:absolute; inset:0; z-index:3; width:100%; height:100%; background:#000; display:block}
.ugline{display:flex; align-items:center; gap:8px; margin:14px 0 0}
.uglib{flex:none; height:40px; padding:0 12px; box-sizing:border-box; display:inline-flex; align-items:center; gap:7px; border:1px solid var(--edge, rgba(255,243,228,.2));
  border-radius:var(--round, 12px); background:#141114; color:var(--ink, #f4efe6); font:600 13px/1 var(--sans); cursor:pointer}
.uglib svg,.ugtype svg,.ugsearch svg,.ustab svg,.uimggo svg,.ugcpuse svg,.ugcppic svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none}
.uglib:hover{border-color:rgba(232,201,136,.55)}
.ugtypes{display:flex; gap:6px; flex:none}
.ugtype{width:40px; height:40px; box-sizing:border-box; display:grid; place-items:center; padding:0; border-radius:var(--round, 12px); border:1px solid var(--edge, rgba(255,243,228,.2));
  background:#141114; color:var(--dimmer, #8c8680); cursor:pointer}
.ugtype[aria-pressed="true"]{border-color:var(--gold, #e8c988); background:rgba(232,201,136,.13); color:var(--gold-hi, #f7e3b0)}
.uglib:focus-visible,.ugtype:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugsearch{flex:1; min-width:0; height:40px; box-sizing:border-box; display:flex; align-items:center; gap:7px; padding:0 10px; position:relative; cursor:text;
  border:1px solid var(--edge, rgba(255,243,228,.2)); border-radius:var(--round, 12px); background:#141114; color:var(--dim, #a29b93)}
.ugsearch:focus-within{border-color:rgba(232,201,136,.6)}
.ugsearch input{flex:1; min-width:0; border:0; outline:0; background:none; color:var(--ink, #f4efe6); font:400 14px/1 var(--sans); padding:0; -webkit-appearance:none; appearance:none}
.ugsearch input::placeholder{color:var(--dimmer, #8c8680)}
.ugcast{display:flex; gap:14px; overflow-x:auto; margin:16px 0 0; padding:2px; scrollbar-width:none}
.ugcast::-webkit-scrollbar{display:none}
.ugface{flex:none; width:72px; height:72px; box-sizing:border-box; padding:2px; border-radius:50%; border:1.5px solid rgba(255,243,228,.22); background:none; cursor:pointer}
.ugface.fav{border-color:var(--gold, #e8c988)}
.ugface img{width:100%; height:100%; border-radius:50%; object-fit:cover; display:block}
.ugface:hover{border-color:var(--gold-hi, #f7e3b0)}
.ugface:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugcap{margin:8px 0 0; font:400 12.5px/18px var(--sans); color:var(--dim, #a29b93)}

.ustudio{display:flex; gap:0; align-items:stretch}   
.ustab{flex:1; display:flex; align-items:center; justify-content:center; gap:7px; height:38px; box-sizing:border-box; padding:0; cursor:pointer;
  border:1px solid rgba(255,243,228,.10); border-bottom:0; border-radius:var(--round, 12px) var(--round, 12px) 0 0; background:#0d0b0e; color:var(--dimmer, #8c8680); font:600 13.5px/1 var(--sans)}
.ustab[aria-selected="true"]{height:38px; border-color:rgba(255,243,228,.18); background:#0a080b; color:var(--ink, #f4efe6)}
.ustab:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:-2px}
.ustab[aria-selected="false"]{border-bottom:1px solid rgba(255,243,228,.10)}
.ustab + .ustab{margin-left:-1px}
.uimggo{display:flex; align-items:center; justify-content:center; gap:8px; width:calc(100% - 20px); height:44px; margin:0 10px 10px; box-sizing:border-box; border:0; cursor:pointer;
  border-radius:var(--round, 12px); background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:700 14px/1 var(--sans)}
.uimggo[hidden]{display:none}
html.ugimage #uask .uroad,html.ugimage #uask .utools{display:none !important}
@media(max-width:900px){ html.ugimage #uask .utabs{display:none} }   
html.ugimage #uask.ucomp .ubox > .ucfunrow,html.ugimage #uask.ucomp .ubox > .ucflow,html.ugimage #uask.ucomp .ubox > .ucbar{display:none !important}   
html .umline .umpacks{display:none !important}   


.ugcastpage{position:fixed; left:0; right:0; bottom:0; top:var(--stripe-h, 64px); z-index:55; overflow-y:auto; overscroll-behavior:contain; background:#0b090b; color:var(--ink, #f4efe6)}
html.ugcastopen body{overflow:hidden}
.ugcp{position:relative; max-width:760px; margin:0 auto; padding:0 0 44px}
.ugcpban{position:relative; height:230px; overflow:hidden; background:#000}
.ugcpban img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 30%; display:block}
.ugcpban::after{content:''; position:absolute; left:0; right:0; bottom:0; height:120px; background:linear-gradient(to top, #0b090b, rgba(11,9,11,0))}
.ugcpback,.ugcpfav{position:absolute; top:12px; z-index:2; width:40px; height:40px; padding:0; border:0; border-radius:var(--round, 12px); background:rgba(11,9,11,.62); color:var(--ink, #f4efe6); display:grid; place-items:center; cursor:pointer}
.ugcpback{left:12px}
.ugcpfav{right:12px}
.ugcpback svg,.ugcpfav svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.ugcpfav[aria-pressed="true"]{color:var(--gold, #e8c988)}
.ugcpfav[aria-pressed="true"] svg{fill:currentColor}
.ugcpback:focus-visible,.ugcpfav:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugcphead{position:relative; z-index:1; display:flex; align-items:flex-end; gap:14px; margin-top:-48px; padding:0 16px}
.ugcpface{flex:none; width:96px; height:96px; border-radius:50%; object-fit:cover; border:2px solid var(--gold, #e8c988); box-shadow:0 0 0 4px #0b090b; background:#141114}
.ugcpname{min-width:0; padding-bottom:4px}
.ugcpkick{margin:0; font:700 10.5px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--gold, #e8c988)}
.ugcpname h2{margin:4px 0 0; font:400 32px/1.05 'Fraunces', ui-serif, Georgia, serif; color:var(--ink, #f4efe6); overflow-wrap:anywhere}
.ugcpline{margin:12px 16px 0; font:500 12.5px/1.4 var(--sans); color:#d6cec4}
.ugcpline b{font-weight:700; color:var(--ink, #f4efe6)}
.ugcpabout{margin:4px 16px 0; font:400 12.5px/1.5 var(--sans); color:var(--dim, #a29b93)}
.ugcpacts{display:flex; flex-wrap:wrap; gap:8px; margin:16px 16px 0}
.ugcpuse{flex:1.3 1 180px; height:46px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:var(--round, 12px); cursor:pointer;
  background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:700 14px/1 var(--sans)}
.ugcppic{flex:1 1 140px; height:46px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; text-decoration:none;
  border:1px solid rgba(255,243,228,.24); border-radius:var(--round, 12px); background:none; color:var(--ink, #f4efe6); font:600 13.5px/1 var(--sans)}
.ugcpuse:focus-visible,.ugcppic:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}
.ugcpstrip{display:flex; gap:8px; overflow-x:auto; margin:18px 0 0; padding:0 16px; scrollbar-width:none}
.ugcpstrip::-webkit-scrollbar{display:none}
.ugcpstrip img{flex:none; width:150px; height:84px; object-fit:cover; border-radius:10px; border:1px solid rgba(255,243,228,.12); background:#141114}
.ugcpfilms{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; margin:20px 16px 0}
.ugcpfilm{display:block; min-width:0; padding:0; border:0; background:none; color:var(--ink, #f4efe6); text-align:left; cursor:pointer}
.ugcpthumb{position:relative; display:block; aspect-ratio:16/9; border-radius:var(--round, 12px); overflow:hidden; background:#141114}
.ugcpthumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.ugcpnost{position:absolute; inset:0; display:grid; place-items:center; color:rgba(232,201,136,.55)}
.ugcpnost svg{width:36px; height:36px; fill:none; stroke:currentColor; stroke-width:1.4}
.ugcpplay{position:absolute; left:50%; top:50%; width:40px; height:40px; margin:-20px 0 0 -20px; border-radius:50%; border:1px solid rgba(247,227,176,.6); background:rgba(11,9,11,.55); color:var(--gold-hi, #f7e3b0); display:grid; place-items:center}
.ugcpplay svg{width:16px; height:16px; margin-left:2px}
.ugcpfilm b{display:block; margin-top:7px; font:600 12.5px/1.3 var(--sans)}
.ugcpfilm small{display:block; margin-top:2px; font:400 11px/1.3 var(--sans); color:var(--dim, #a29b93)}
.ugcpfilm:focus-visible .ugcpthumb{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugcpmates{display:flex; flex-wrap:wrap; gap:18px; margin:22px 16px 0}
.ugcpmate{display:flex; align-items:center; gap:9px; padding:0; border:0; background:none; color:var(--ink, #f4efe6); font:600 13px/1 var(--sans); cursor:pointer}
.ugcpmate img{width:48px; height:48px; border-radius:50%; object-fit:cover; border:1.5px solid rgba(255,243,228,.22)}
.ugcpcap{margin:8px 16px 0; font:400 12px/1.4 var(--sans); color:var(--dim, #a29b93)}
@media(prefers-reduced-motion:reduce){ .ugcastpage{scroll-behavior:auto} }


.ughead{display:none}   

html.ugin #modes,html.ugin #kinds,html.ugin .ulmob,html.ugin .ugstart{display:none !important}

html.ugin:not(.pricespage):not(.ugprice) #price{display:none !important}

#uask .uroadbuy{display:none !important}

.ugway{display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin:16px 0 0}
.ughi{margin:0; font:400 clamp(30px, 3.2vw, 46px)/1.08 'Fraunces', ui-serif, Georgia, serif; color:var(--ink, #f4efe6)}
.ughi[hidden]{display:none}
.ugdo{display:flex; flex-wrap:wrap; gap:8px}
.ugdoit{display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 14px 0 12px; box-sizing:border-box; border:1px solid rgba(255,243,228,.22); border-radius:var(--round, 12px); background:rgba(20,17,20,.72); color:var(--ink, #f4efe6); font:600 13.5px/1 var(--sans); text-decoration:none; white-space:nowrap}
.ugdoit svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none}

.ugdoit b{font-weight:600}
.ugdoit em{font-style:normal; font-weight:400; color:var(--dim); margin-left:.35em}
html:not(.ugin) .ugdo{display:grid; grid-template-columns:repeat(2, auto); width:100%; max-width:600px}
html:not(.ugin) .ugdoit{min-width:0}
html:not(.ugin) .ugdoit > span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
html.ugin .ugdoit em{display:none}
.ugdoit:hover{border-color:rgba(232,201,136,.55); color:var(--gold-hi, #f7e3b0)}
.ugdoit:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugstart{display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin:0}
.ugsignin{display:inline-flex; align-items:center; height:40px; padding:0 18px; box-sizing:border-box; border-radius:var(--round, 12px); background:linear-gradient(180deg, var(--gold-hi, #f7e3b0), var(--gold, #e8c988)); color:var(--gold-ink, #2b2008); font:700 14.5px/1 var(--sans); text-decoration:none; white-space:nowrap}
.ugsignin:hover{filter:brightness(1.05)}
.ugsignin:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}

.ugfrom{display:block; height:40px; padding:0 14px; box-sizing:border-box; border:1px solid rgba(255,243,228,.22); border-radius:var(--round, 12px); background:rgba(20,17,20,.72);
  font:500 13px/38px var(--sans); color:var(--dim, #a29b93); text-align:center; white-space:nowrap}   
.ugfrom #umFrom{color:var(--gold-hi, #f7e3b0); font-weight:600}

.ugopens{display:flex; align-items:center; gap:10px; margin:0 0 8px; padding:6px 6px 6px 6px; border:1px solid rgba(232,201,136,.45); border-radius:var(--round, 12px); background:rgba(20,17,20,.72);
  font:500 12.5px/1.3 var(--sans); color:var(--dim, #a29b93)}
.ugopic{flex:none; width:64px; height:36px; object-fit:cover; border-radius:var(--round, 12px); background:#000}
.ugopens.tall .ugopic{width:28px; height:50px}
.ugoline{flex:1; min-width:0}
.ugoline b{color:var(--gold-hi, #f7e3b0); font-weight:600}
.ugox{flex:none; width:30px; height:30px; padding:0; border:0; border-radius:var(--round, 12px); background:transparent; color:var(--ink, #f4efe6); font:400 19px/1 var(--sans); cursor:pointer}
.ugox:hover{background:rgba(255,243,228,.08)}
.ugox:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:1px}
.ugfrom a{color:var(--gold, #e8c988); text-decoration:underline; text-underline-offset:3px}
@media(min-width:901px){
  
  html.ucfold:not(.ugin) .usecases .usplit{grid-template-areas:"htop film" "pitch film" "mline film" "way film" "hbot film" "ask ask"; grid-template-rows:minmax(0,1fr) auto auto auto minmax(0,1fr) auto}
  html.ucfold .usecases .ugway{grid-area:way; align-self:start}
  html.ugin.ucfold .usecases .ugway{grid-area:pitch; align-self:end; margin:0 0 14px}
}   

html:not(.ugin) #ugal{display:none !important}
html.ugin footer .ugfoottag,html.ugin footer .ugfootin{display:none !important}
html.ugin footer{padding:8px 0 10px; border-top:0; font-size:11.5px}
html.ugin footer > span{margin-top:0 !important}
html.ugin .usecases .upitch{position:absolute !important; width:1px !important; height:1px !important; margin:0 !important; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap}
html.ugin .usecases .umline{margin-top:0}   

.ugstrip{display:flex; flex:none; min-width:0; gap:14px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; padding:2px}
.ugstrip::-webkit-scrollbar{display:none}
.ugtile{position:relative; flex:0 0 calc((100% - 56px) / 5); min-width:0; scroll-snap-align:start}
.ugtilebtn{display:block; width:100%; padding:0; border:0; background:none; color:var(--ink, #f4efe6); text-align:left; cursor:pointer}
.ugtilepic{position:relative; display:block; aspect-ratio:16/9; border-radius:var(--round, 12px); overflow:hidden; background:#141114; box-shadow:0 12px 26px -20px rgba(0,0,0,.9)}
.ugtilepic img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease}
.ugtilebtn:hover .ugtilepic img{transform:scale(1.04)}
.ugtilebtn:focus-visible{outline:none}
.ugtilebtn:focus-visible .ugtilepic{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugtilecap{position:absolute; left:0; right:0; bottom:0; z-index:2; display:flex; flex-direction:column; gap:1px; padding:20px 10px 8px; background:linear-gradient(to top, rgba(8,6,8,.86), rgba(8,6,8,0)); pointer-events:none}
.ugtilename{display:block; font:400 14.5px/1.2 'Fraunces', ui-serif, Georgia, serif; color:var(--ink, #f4efe6); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ugtilemeta{display:block; font:500 10.5px/1.3 var(--sans); color:#d6cec4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ugtileplay{position:absolute; left:50%; top:50%; z-index:1; width:38px; height:38px; margin:-19px 0 0 -19px; box-sizing:border-box; border-radius:50%; border:1px solid rgba(247,227,176,.65); background:rgba(11,9,11,.5); color:var(--gold-hi, #f7e3b0); display:grid; place-items:center}
.ugtileplay svg{width:15px; height:15px; margin-left:2px}
.ugtile.ugchar .ugtilepic{background:radial-gradient(circle at 50% 50%, #241d22, #0d0b0e 70%)}   
.ugtile.ugchar .ugtilepic img{inset:auto; left:50%; top:50%; width:auto; height:76%; aspect-ratio:1 / 1; transform:translate(-50%, -50%); border-radius:50%; border:2px solid var(--gold, #e8c988); box-sizing:border-box}
.ugtile.ugchar .ugtilebtn:hover .ugtilepic img{transform:translate(-50%, -50%) scale(1.04)}
.ugtile.ugnostill .ugtilepic{background:linear-gradient(140deg, #1d181c, #0d0b0e)}
.ugtileacts{position:absolute; top:8px; right:8px; z-index:2; display:flex; gap:6px; opacity:0; transition:opacity .2s}
.ugtileacts .ugcta{height:28px; padding:0 10px; font-size:11.5px}
.ugtile:hover .ugtileacts,.ugtile:focus-within .ugtileacts{opacity:1}
.ugtileep{position:absolute; top:8px; left:8px; z-index:2; padding:3px 7px; border-radius:var(--round, 12px); border:1px solid rgba(232,201,136,.5); background:rgba(11,9,11,.62);
  color:var(--gold-hi, #f7e3b0); font:700 9.5px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase}   
.ugstripsay{flex:1; margin:0; padding:40px 0; text-align:center; font:400 15px/1.4 var(--sans); color:var(--dim, #a29b93)}
.ugtile.on .ugtilepic{outline:2px solid var(--gold, #e8c988); outline-offset:2px}   
.ugtileplay{left:auto; top:8px; right:8px; width:26px; height:26px; margin:0}   
.ugtileplay svg{width:11px; height:11px; margin-left:1px}
@media(max-width:900px){
  html.ugin .usecases .usplit{display:flex; flex-direction:column; gap:10px}
  html.ugin .usecases .usplit > .ugal{order:-1}   
  .ugal{display:flex; flex-direction:column; margin:0 -10px 18px}
  .ugal > .ugplay{display:contents}
  .ugal .ugscreen{order:1; flex:none; margin:0 10px}
  .ugal .ugarr{display:none}   
  .ugal .ugstrip{order:3; margin:14px 0 0; padding:2px 10px; scroll-padding:0 10px}
  .ugtile{flex-basis:calc((100% - 34px) / 2.4)}
  .ugtilename{font-size:13px}
  html:not(.ugimage) #uask .uroad > .uroadbuy{margin:2px 0 10px}   
  .ugtileacts{display:none}   
  .ugal > .ugline{order:4; margin:12px 10px 0; justify-content:flex-end}
  .ugal > .ugcast,.ugal > .ugcap{display:none}
  html.ugin .usecases .uover{position:static; margin:0 0 4px}
  html.ugin .ugal{margin-bottom:0}
  html.ugin .usecases .usplit > .uleft{margin-top:0}   
  html.ugin .usecases:not(.afloat) #uask .uidea textarea{height:84px !important; min-height:0 !important}
  html.ugin footer{padding:4px 0 6px; font-size:11px}
  html.ugin footer a{margin:0 5px !important}
  html.ugin .usecases .umline{display:none}   
  html.ugin .ugway{margin-top:2px; gap:8px}
  html.ugin .ughi{font-size:24px}
  .ugdo{gap:6px; flex-wrap:nowrap}   
  .ugdoit{height:34px; padding:0 9px 0 8px; gap:5px; font-size:12.5px}
  .ugdoit svg{width:15px; height:15px}
  
  .uover .ugway{pointer-events:auto}
  
  html:not(.ugin) .ugdo{grid-template-columns:repeat(2, minmax(0, 1fr)); max-width:600px}
  html:not(.ugin) .ugdoit{height:auto; min-height:34px; padding:6px 9px 6px 8px; font-size:12px; line-height:1.25}
  html:not(.ugin) .ugdoit > span{white-space:normal; overflow:visible; text-overflow:clip}
  .ugstart{gap:8px; width:100%; max-width:600px}
  .ugsignin{flex:none; padding:0 12px; font-size:13px}
  .ugfrom{flex:1 1 auto; padding:0 8px; font-size:12px}
  html.ugin .usecases .uover .uslide h1{font-size:clamp(28px, 8vw, 36px); margin:0; text-shadow:none}
  .ugsearch input{font-size:16px}   
  html:not(.ugimage) #uask .utabs{margin:0; padding:12px 10px 4px; border:1px solid rgba(232,201,136,.55); border-bottom:0; border-radius:0; background:#0a080b}
  html:not(.ugimage) #uask.isfun .utabs{border-color:color-mix(in srgb, var(--pink) 60%, transparent)}
  html:not(.ugimage) #uask .ubox{border-top:0; border-top-left-radius:0; border-top-right-radius:0}
}
@media(min-width:901px){
  .ugarr{width:40px; height:80px}
  .ugarr svg{width:26px; height:26px}
  .ugplaybtn{width:74px; height:74px; margin:-37px 0 0 -37px}
  .ugplaybtn svg{width:28px; height:28px}
  .ugtext{left:20px; top:18px; right:20px}
  .ugacts{left:18px; right:18px; bottom:16px}
  .ugtitle{font-size:24px}
  .ugmeta{font-size:12.5px}
  .ugcta{height:34px; padding:0 14px; font-size:13px}
  html.ugin.ucfold .usecases .usplit{width:min(1040px, calc(100vw - 96px)); max-width:none; grid-template-columns:minmax(0,1fr) auto; column-gap:28px; row-gap:0;
    grid-template-areas:"htop film" "pitch film" "mline film" "hbot film" "line film" "strip strip" "ask ask"; grid-template-rows:minmax(0,1fr) auto auto minmax(0,1fr) auto auto auto}   
  html.ugin.ucfold .usecases .ugal,html.ugin.ucfold .usecases .ugal > .ugplay{display:contents}
  html.ugin.ucfold .usecases .ugscreen{grid-area:film; align-self:start; flex:none; width:min(clamp(300px, 36vw, 500px), calc((100svh - 600px) * 1.7778)); min-width:280px}   
  html.ugin.ucfold .usecases{padding-top:16px; padding-bottom:8px}
  html.ugin.ucfold .usecases #uask.ucomp .ubox .uidea textarea{height:clamp(88px, 11svh, 150px) !important}
  html.ugin.ucfold #uask.ucomp .ubox > .ucrail{gap:0; padding-top:5px; padding-bottom:5px}   
  html.ugin.ucfold #uask.ucomp .ucrail .ucri{gap:2px; padding-top:3px; padding-bottom:2px}
  html.ugin.ucfold #uask.ucomp .ucrail .ucri svg{width:17px; height:17px}
  html.ugin.ucfold .usecases .ugstrip{grid-area:strip; margin-top:16px}
  html.ugin.ucfold .usecases .ugarr{grid-area:strip; align-self:center; z-index:3; margin-top:16px}
  html.ugin.ucfold .usecases .ugprev{justify-self:start; margin-left:-46px}
  html.ugin.ucfold .usecases .ugnext{justify-self:end; margin-right:-46px}
  html.ugin.ucfold .usecases .ugal > .ugline{grid-area:line; align-self:end; justify-content:flex-start; gap:6px; margin:12px 0 0}
  html.ugin.ucfold .usecases .ugal > .ugline .uglib{height:30px; padding:0 10px; gap:6px; font-size:12.5px}
  html.ugin.ucfold .usecases .ugal > .ugline .ugtypes{gap:5px}
  html.ugin.ucfold .usecases .ugal > .ugline .ugtype{width:30px; height:30px}
  html.ugin.ucfold .usecases .ugal > .ugline .ugsearch{height:30px; flex:0 1 240px; padding:0 9px; gap:6px}
  html.ugin.ucfold .usecases .ugal > .ugline .ugsearch input{font-size:12.5px}
  html.ugin.ucfold .usecases .ugal > .ugline svg{width:15px; height:15px}
  html.ugin.ucfold .usecases .ugal > .ugcast,html.ugin.ucfold .usecases .ugal > .ugcap{display:none}
  html.ugin.ucfold .usecases .uask{grid-area:ask; width:auto}
}
@media(min-width:901px) and (max-width:1399px){ .ugtile{flex-basis:calc((100% - 42px) / 4)} html.ugin .ugtile{flex-basis:calc((100% - 56px) / 5)} }   
html #uask .uroad > .urs{display:none !important}   

@media(min-width:901px){
  html.ucfold .usecases .uask{margin-top:16px}   
  html.ucfold .usecases #uask.ucomp .uroad{position:static; display:flex; align-items:center; gap:10px; margin:0 0 0 14px}
  html.ucfold .usecases #uask.ucomp .uroad .utab{font-size:14px}
  html.ucfold .usecases #uask.ucomp .uroad .utog{width:40px; height:22px; border-radius:11px}
  html.ucfold .usecases #uask.ucomp .uroad .utog i{top:3px; left:3px; width:14px; height:14px; transform:translateX(18px)}
  html.ucfold .usecases #uask.ucomp.isfun .uroad .utog i{transform:none}
  html.ucfold .usecases #uask .ubarname{display:none}
}

.ugline{position:relative}
@media(max-width:480px){
  .ugsearch{flex:0 1 auto; min-width:42px}
  .ugsearch:not(:focus-within) input::placeholder{color:transparent}
  .ugsearch:focus-within{position:absolute; left:0; right:0; top:0; z-index:3; background:#141114}
}
@media(min-width:901px){ html.ucfold .usecases #uask.ucomp .ubox .uidea textarea{height:clamp(120px, 18svh, 220px) !important} }   

@media(min-width:901px){ html.ucfull .usecases .ugal{display:none} }

.ugal > .ugcast,.ugal > .ugcap{display:none}

.uimgtools{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 0}
.uimgtools[hidden]{display:none}
.upick{position:relative; display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 10px; box-sizing:border-box; border:1px solid var(--edge, rgba(255,243,228,.2));
  border-radius:var(--round, 12px); background:#141114; color:var(--ink, #f4efe6); font:600 12.5px/1 var(--sans); cursor:pointer}
.upick:hover{border-color:rgba(232,201,136,.55)}
.upick:focus-within{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.upico{display:grid; place-items:center}
.upico svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.upsel{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; font-size:16px}
.upics{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 0}
.upics[hidden]{display:none}
.upic{display:inline-flex; align-items:center; gap:6px; padding:3px 4px 3px 3px; border:1px solid var(--edge, rgba(255,243,228,.2)); border-radius:var(--round, 12px); background:#141114}
.upic img{width:34px; height:34px; border-radius:9px; object-fit:cover; display:block}
.upname{width:110px; min-width:0; border:0; outline:0; background:none; color:var(--ink, #f4efe6); font:400 12.5px/1.2 var(--sans); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
b.upname{font-weight:500}
.upx{border:0; background:none; color:var(--dim, #a29b93); font:400 16px/1 var(--sans); cursor:pointer; padding:0 4px}
.upx:hover{color:var(--ink, #f4efe6)}
.uppill{display:inline-flex; align-items:center; gap:5px; height:32px; padding:0 11px; border:1px solid var(--edge, rgba(255,243,228,.2)); border-radius:var(--round, 12px); background:#141114; color:var(--ink, #f4efe6); font:600 12.5px/1 var(--sans); cursor:pointer}
@media(min-width:901px){
  
  #uask.ucomp .ucrail > .ucimg{display:none}
  html.ugimage #uask.ucomp .ucrail > .ucimg{display:flex}
  html.ugimage #uask.ucomp .ucrail > .ucmagic,html.ugimage #uask.ucomp .ucrail > .ucrsep,html.ugimage #uask.ucomp .ucrail > .uckind,html.ugimage #uask.ucomp .ucrail > .uclenb,
  html.ugimage #uask.ucomp .ucrail > .ucratb,html.ugimage #uask.ucomp .ucrail > .ucpic,html.ugimage #uask.ucomp .ucrail > .ucnew{display:none !important}
  html.ugimage #uask.ucomp .ubox > .uimgtools{display:none !important}
  #uask.ucomp .ubox > .upics{grid-row:4; margin:0 26px 10px}
  html.ugimage #uask.ucomp .ubox > .uimggo{grid-row:6; justify-self:end; width:auto; height:40px; margin:4px 16px 14px; padding:0 18px}
  .ucpop-imgsize{display:flex; flex-direction:column; gap:6px; width:250px}
  .ucpop-imgshape{display:flex; flex-direction:column; gap:6px; width:190px}
  .ucpop-imgshape .ucopt.ucshape{flex:none; width:100%}
}

html.ugimage #uask .utabs{display:none}


.ugcpnext{flex:1.3 1 200px; height:46px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:var(--round, 12px); cursor:pointer;
  background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:700 14px/1 var(--sans)}
.ugcpnext svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none}
.ugcpnext:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}
.ugcpacts .ugcpnext ~ .ugcpuse{background:none; border:1px solid rgba(255,243,228,.24); color:var(--ink, #f4efe6); font-weight:600; box-sizing:border-box}
.ugcpep{position:absolute; top:8px; left:8px; z-index:2; height:22px; padding:0 8px; border-radius:7px; background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:800 10.5px/22px var(--sans); letter-spacing:.08em}
.ugcpnexttile .ugcpthumb{background:none; border:1.5px dashed rgba(232,201,136,.55); box-sizing:border-box}
.ugcpnexttile .ugcpep{background:none; border:1px solid rgba(232,201,136,.7); color:var(--gold-hi, #f7e3b0); line-height:20px}
.ugeppage{z-index:56}
.ugep{padding:20px 16px 0}
.ugephead{display:flex; align-items:center; gap:12px}
.ugephead .ugcpback{position:static; flex:none; background:#141114}
.ugephead h2{margin:3px 0 0; font:400 28px/1.1 'Fraunces', ui-serif, Georgia, serif; color:var(--ink, #f4efe6)}
.ugeplead{margin:12px 0 0; font:400 13px/1.5 var(--sans); color:var(--dim, #a29b93)}
.ugepcards{display:flex; flex-direction:column; gap:8px; margin-top:16px}
.ugepcard{padding:12px 14px; border:1px solid rgba(255,243,228,.14); border-radius:var(--round, 12px); background:#141114}
.ugepcard.on{border:1.5px solid var(--gold, #e8c988); background:rgba(232,201,136,.06)}
.ugepcard.ugepown{background:none; border-style:dashed}
.ugeppick{display:flex; align-items:center; gap:9px; width:100%; padding:0; border:0; background:none; color:var(--ink, #f4efe6); text-align:left; cursor:pointer}
.ugeppick b{font:400 17px/1.25 'Fraunces', ui-serif, Georgia, serif}
.ugeppick:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:3px; border-radius:6px}
.ugepdot{flex:none; width:14px; height:14px; border-radius:50%; box-sizing:border-box; border:1.5px solid rgba(255,243,228,.35)}
.ugepcard.on .ugepdot{border:4px solid var(--gold, #e8c988); background:#0b090b}
.ugepidea{margin:6px 0 0 23px; font:400 13px/1.5 var(--sans); color:#d6cec4}
.ugepfollows{margin:6px 0 0 23px; font:400 11.5px/1.4 var(--sans); color:#cdb27a}
.ugepedit textarea{display:block; width:100%; margin-top:8px; box-sizing:border-box; resize:vertical; padding:9px 11px; outline:0;
  border:1px solid rgba(255,243,228,.16); border-radius:10px; background:#0d0b0e; color:var(--ink, #f4efe6); font:400 14px/1.55 var(--sans)}
.ugepedit textarea:focus{border-color:rgba(232,201,136,.6)}
.ugepedit textarea[aria-invalid="true"]{border-color:var(--rose, #e39b91)}
.ugepkepts{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; margin-top:18px}
.ugepkept{display:flex; flex-direction:column; gap:5px; min-height:58px; padding:9px 11px; box-sizing:border-box; border:1px solid rgba(255,243,228,.14); border-radius:var(--round, 12px); background:#141114}
.ugepkept small{font:600 10.5px/1 var(--sans); color:var(--dim, #a29b93); letter-spacing:.02em}
.ugepkept span{display:flex; flex-wrap:wrap; gap:3px; font:600 13px/1.3 var(--sans); color:var(--ink, #f4efe6)}
.ugepkept img{width:22px; height:22px; border-radius:50%; object-fit:cover}
.ugepfoot{position:sticky; bottom:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:10px; margin:18px -16px 0; padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background:#0d0b0e; border-top:1px solid rgba(255,243,228,.12)}
.ugeproad{display:flex; gap:4px; padding:3px; border-radius:var(--round, 12px); background:#141114; border:1px solid rgba(255,243,228,.14)}
.ugeprd{height:34px; padding:0 12px; border:0; border-radius:9px; background:none; color:var(--dimmer, #8c8680); font:600 12.5px/1 var(--sans); cursor:pointer}
.ugeprd.on{background:rgba(232,201,136,.16); color:var(--gold-hi, #f7e3b0)}
.ugeprd.on.fun{background:color-mix(in srgb, var(--pink) 16%, transparent); color:var(--pink-hi)}
.ugeprd:focus-visible,.ugepmake:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}
.ugepmake{flex:none; height:44px; padding:0 18px; border:0; border-radius:var(--round, 12px); background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:700 14px/1 var(--sans); cursor:pointer}
.ugepmake.fun{background:var(--pink); color:var(--pink-ink)}

.ugepmake:disabled{opacity:.45; cursor:default}
.ugscbar{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:20px}
.ugscbarep{margin-top:22px}
.ugsck{margin:0; font:700 10.5px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--dim, #a29b93)}
.ugscn{margin:0; font:500 11.5px/1.3 var(--sans); color:var(--dim, #a29b93)}
.ugscrows{display:flex; flex-direction:column; gap:8px; margin-top:8px}
.ugscrow{display:flex; align-items:center; gap:12px; min-height:68px; padding:8px 0 8px 10px; box-sizing:border-box; border:1px solid rgba(255,243,228,.14); border-radius:var(--round, 12px); background:#141114}
.ugscface{flex:none; width:50px; height:50px; box-sizing:border-box; border-radius:50%; object-fit:cover; border:1.5px solid rgba(255,243,228,.22); background:#0d0b0e}
.ugscnew{display:grid; place-items:center; border:1.5px dashed rgba(232,201,136,.6); color:#cdb27a}
.ugscnew svg,.ugscplus svg{width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ugsctext{flex:1; min-width:0}
.ugsctext b{display:block; font:600 14px/1.25 var(--sans); color:var(--ink, #f4efe6); overflow-wrap:anywhere}
.ugsctext small{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top:2px; font:400 12px/1.4 var(--sans); color:#d6cec4}
.ugsctext em{display:block; margin-top:3px; font:400 11px/1.35 var(--sans); font-style:normal; color:#cdb27a}
.ugscx{flex:none; width:44px; height:44px; display:grid; place-items:center; padding:0; border:0; background:none; color:var(--dim, #a29b93); cursor:pointer; border-radius:var(--round, 12px)}
.ugscx svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round}
.ugscx:hover{color:var(--ink, #f4efe6)}
.ugscx:focus-visible,.ugscadd:focus-visible,.ugsadd:focus-visible,.ugscideas:focus-visible,.ugscundo:focus-visible{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugscadds{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; margin-top:8px}
.ugscadd{height:46px; display:inline-flex; align-items:center; justify-content:center; gap:7px; box-sizing:border-box; padding:0 8px; border:1.5px dashed rgba(232,201,136,.55); border-radius:var(--round, 12px); background:none; color:var(--gold-hi, #f7e3b0); font:600 13px/1.2 var(--sans); cursor:pointer}
.ugscadd svg{width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.ugsfaces{display:flex; flex-wrap:wrap; gap:14px 8px; margin-top:12px}
.ugsface{position:relative; width:66px; display:flex; flex-direction:column; align-items:center; gap:6px; padding:0; border:0; background:none; color:var(--ink, #f4efe6); font:600 11.5px/1.2 var(--sans); text-align:center}
.ugsface .ugscface{width:56px; height:56px}
.ugsface > span:not(.ugscface){max-width:100%; overflow-wrap:anywhere}
.ugsface .ugscx{position:absolute; top:-14px; right:-12px; color:var(--ink, #f4efe6)}
.ugsface .ugscx svg{box-sizing:content-box; width:11px; height:11px; padding:5px; border-radius:50%; background:#2a2529; border:1px solid rgba(255,243,228,.22); stroke-width:2.4}
.ugsadd{cursor:pointer; color:var(--gold-hi, #f7e3b0)}
.ugscplus{display:grid; place-items:center; border:1.5px dashed rgba(232,201,136,.6); color:var(--gold-hi, #f7e3b0); background:none}
.ugscsaid{display:flex; flex-direction:column; gap:8px; margin-top:12px; padding:10px 12px; border:1px solid rgba(255,243,228,.10); border-radius:var(--round, 12px); background:#141114}
.ugscsaid p{margin:0; font:400 12.5px/1.45 var(--sans); color:#d6cec4}
.ugscsaidb{display:flex; flex-wrap:wrap; gap:8px}
.ugscsaidb:empty{display:none}
.ugscerr{color:var(--rose, #e39b91); background:none; border-color:rgba(227,155,145,.35)}
p.ugscerr{margin:12px 0 0; padding:10px 12px; border:1px solid rgba(227,155,145,.35); border-radius:var(--round, 12px); font:400 12.5px/1.45 var(--sans)}
.ugscideas,.ugscundo{height:36px; padding:0 12px; border:1px solid rgba(232,201,136,.55); border-radius:var(--round, 12px); background:none; color:var(--gold-hi, #f7e3b0); font:600 12.5px/1 var(--sans); cursor:pointer}
.ugscundo{border-color:rgba(255,243,228,.18); color:var(--ink, #f4efe6)}
.ugscx:disabled,.ugsadd:disabled,.ugscundo:disabled{opacity:.45; cursor:default}
.ugnsname{flex:1; min-width:0}
.ugnstitle{display:block; width:100%; box-sizing:border-box; margin-top:2px; padding:2px 0 4px; border:0; border-bottom:1px dashed rgba(232,201,136,.45); border-radius:0; background:none; color:var(--ink, #f4efe6); font:400 26px/1.2 'Fraunces', ui-serif, Georgia, serif; outline:0}
.ugnstitle::placeholder{color:var(--dimmer, #8c8680)}
.ugnstitle:focus{border-bottom-color:var(--gold, #e8c988)}
.ugsheet{position:fixed; inset:0; z-index:60; display:flex; align-items:flex-end; justify-content:center; background:rgba(5,4,5,.72)}
.ugshbox{width:100%; max-width:560px; max-height:min(86vh, 720px); display:flex; flex-direction:column; box-sizing:border-box; border:1px solid rgba(255,243,228,.14); border-bottom:0; border-radius:var(--round, 12px) var(--round, 12px) 0 0; background:#0d0b0e; color:var(--ink, #f4efe6)}
.ugshhead{display:flex; align-items:center; justify-content:space-between; padding:10px 6px 0 16px}
.ugshhead h2{margin:0; font:400 21px/1.2 'Fraunces', ui-serif, Georgia, serif}
.ugshx{width:44px; height:44px; display:grid; place-items:center; padding:0; border:0; background:none; color:var(--dim, #a29b93); cursor:pointer; border-radius:var(--round, 12px)}
.ugshx svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round}
.ugshtabs{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; margin:6px 16px 0; padding:4px; border:1px solid rgba(255,243,228,.10); border-radius:var(--round, 12px); background:#141114}
.ugshtabs button{height:38px; padding:0 6px; border:0; border-radius:calc(var(--round, 12px) - 3px); background:none; color:var(--dim, #a29b93); font:600 13px/1.1 var(--sans); cursor:pointer}
.ugshtabs button[aria-selected="true"]{background:#2a2529; color:var(--ink, #f4efe6)}

.ugscbarw{margin-top:16px}
.ugscadds.ugscadds3{grid-template-columns:repeat(3, minmax(0, 1fr))}   
.ugscadds.ugscadds3 .ugscadd{flex-direction:column; gap:4px; height:auto; min-height:58px; padding:7px 4px; font-size:12px}   
.ugshkind{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; padding:4px; border:1px solid rgba(255,243,228,.10); border-radius:var(--round, 12px); background:#141114}
.ugshk{height:36px; padding:0 6px; border:0; border-radius:calc(var(--round, 12px) - 3px); background:none; color:var(--dim, #a29b93); font:600 13px/1.1 var(--sans); cursor:pointer}
.ugshk.on{background:#2a2529; color:var(--ink, #f4efe6)}
.ugshbody{flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:12px; padding:12px 16px 4px}
.ugshq{display:flex; align-items:center; gap:8px; height:44px; padding:0 12px; box-sizing:border-box; border:1px solid rgba(255,243,228,.16); border-radius:var(--round, 12px); background:#0b090b; color:var(--dim, #a29b93)}
.ugshq svg{width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round}
.ugshq input{flex:1; min-width:0; border:0; background:none; color:var(--ink, #f4efe6); font:400 16px/1.3 var(--sans); outline:0}
.ugshgrid{display:grid; grid-template-columns:repeat(auto-fill, minmax(76px, 1fr)); gap:12px 8px}
.ugshface{position:relative; display:flex; flex-direction:column; align-items:center; gap:6px; padding:0; border:0; background:none; color:var(--ink, #f4efe6); cursor:pointer}
.ugshface img{width:62px; height:62px; box-sizing:border-box; border-radius:50%; object-fit:cover; border:1.5px solid rgba(255,243,228,.22)}
.ugshface.on img{border:2.5px solid var(--gold, #e8c988)}
.ugshface.on::after{content:'✓'; position:absolute; top:0; right:calc(50% - 34px); width:20px; height:20px; border-radius:50%; background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:800 12px/20px var(--sans); text-align:center}
.ugshface b{font:600 11.5px/1.2 var(--sans); text-align:center; overflow-wrap:anywhere}
.ugshface small{font:400 10.5px/1.2 var(--sans); color:var(--dim, #a29b93)}
.ugshface:disabled{cursor:default}
.ugshface:disabled img{opacity:.45; border-color:rgba(255,243,228,.14)}
.ugshface:focus-visible img{outline:2px solid var(--gold, #e8c988); outline-offset:2px}
.ugshnote{margin:0; font:400 12px/1.5 var(--sans); color:var(--dim, #a29b93)}
.ugshdrawn{display:flex; align-items:flex-start; gap:9px}
.ugshdrawn .ugscface{width:30px; height:30px}
.ugshdrawn .ugscface svg{width:16px; height:16px}
.ugshfield{display:flex; flex-direction:column; gap:6px}
.ugshfield span{font:600 12px/1.2 var(--sans); color:#d6cec4}
.ugshfield input,.ugshfield textarea{box-sizing:border-box; padding:10px 12px; border:1px solid rgba(255,243,228,.16); border-radius:var(--round, 12px); background:#0b090b; color:var(--ink, #f4efe6); font:400 16px/1.45 var(--sans); outline:0; resize:none}
.ugshfield input{height:44px}
.ugshfield input:focus,.ugshfield textarea:focus{border-color:rgba(232,201,136,.6)}
.ugshfoot{display:flex; flex-direction:column; gap:8px; padding:12px 16px calc(16px + env(safe-area-inset-bottom, 0px)); border-top:1px solid rgba(255,243,228,.10)}
.ugshgo{width:100%; height:46px; border:0; border-radius:var(--round, 12px); background:var(--gold, #e8c988); color:var(--gold-ink, #2b2008); font:700 14px/1 var(--sans); cursor:pointer}
.ugshgo:disabled{background:#2a2529; color:var(--dimmer, #8c8680); cursor:default}
.ugshgo:focus-visible,.ugshtabs button:focus-visible,.ugshx:focus-visible{outline:2px solid var(--gold-hi, #f7e3b0); outline-offset:2px}
.ugcpseries svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none}
.ugcpsercast .ugcpmate{cursor:default}
.ugcpsface{width:48px; height:48px; box-sizing:border-box; border-radius:50%; object-fit:cover; border:1.5px solid rgba(255,243,228,.22)}
.ugcpsercast .ugscnew{width:48px; height:48px}
@media(min-width:901px){ .ugsheet{align-items:center} .ugshbox{border-bottom:1px solid rgba(255,243,228,.14); border-radius:var(--round, 12px)} }
@media(min-width:901px){ .ugep{padding-top:28px} .ugepfoot{border-radius:0 0 var(--round, 12px) var(--round, 12px)} }


.ugcalls{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px}
.ugcall{display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 2px 0 4px; border:1px solid rgba(232,201,136,.35); border-radius:var(--round, 12px); background:rgba(232,201,136,.10); color:#f7e3b0; font:600 13px/1 var(--sans, sans-serif)}
.ugcallpic{width:22px; height:22px; border-radius:var(--round, 12px); object-fit:cover}
.ugcallx{width:26px; height:26px; padding:0; border:0; border-radius:var(--round, 12px); background:none; color:#a29b93; font-size:16px; line-height:1; cursor:pointer}
.ugcallx:hover, .ugcallx:focus-visible{color:#f7e3b0}
.ugat{position:relative; z-index:5; display:flex; flex-direction:column; gap:2px; margin:6px 0 0; padding:6px; border:1px solid rgba(255,243,228,.2); border-radius:var(--round, 12px); background:#1c181c; box-shadow:0 12px 30px -10px rgba(14,8,4,.8)}
.ugatitem{display:flex; align-items:center; gap:10px; min-height:44px; padding:4px 8px; border:0; border-radius:var(--round, 12px); background:none; color:#f4efe6; font:500 14px/1.2 var(--sans, sans-serif); text-align:left; cursor:pointer}
.ugatitem.on, .ugatitem:hover{background:rgba(232,201,136,.12)}
.ugatpic{width:34px; height:34px; border-radius:var(--round, 12px); object-fit:cover}
.ugatitem b{font-weight:600}
.ugatitem small{margin-left:auto; color:#a29b93; font-size:12px}
.ugatnone{margin:0; padding:8px; color:#a29b93; font-size:13px}