/* Notavue, warm arc identity. UI only: never styles engraved SVG note content. */
@font-face{
  font-family:"Notavue Sans";font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/nunito-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root{
  --brand-apricot:#e8b09c;--brand-ink:#252426;--brand-paper:#fff8f3;
  --brand-surface:#fffdfb;--brand-tint:#f9e8de;--brand-line:#dfd1c7;
  --brand-muted:#6e6059;--brand-focus:#83513d;
  --ink:var(--brand-ink);--muted:var(--brand-muted);--paper:var(--brand-paper);
  --card:var(--brand-surface);--accent:var(--brand-ink);--accent-soft:var(--brand-tint);
  --line:var(--brand-line);--ui-body-size:1rem;--ui-font-floor:1rem;
}
html{background:var(--brand-paper);color-scheme:light}
body,body.product{background:var(--brand-paper);color:var(--brand-ink);font-family:"Notavue Sans",-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;font-size:1rem;line-height:1.7}
button,input,select,textarea{font-family:inherit}
h1,h2,h3,h4{font-family:inherit;font-weight:600;color:var(--brand-ink)}
a{color:var(--brand-ink);text-underline-offset:.2em}
a:hover{text-decoration-color:var(--brand-focus)}
button,.button{border-color:#aa9487;background:var(--brand-surface);color:var(--brand-ink);border-radius:14px}
button:hover,.button:hover{background:var(--brand-tint);border-color:var(--brand-focus)}
button.primary,.button.primary,.site-header .site-auth .nav-signup{background:var(--brand-ink);border-color:var(--brand-ink);color:var(--brand-paper)}
button.primary:hover,.button.primary:hover,.site-header .site-auth .nav-signup:hover{background:#43352f;border-color:#43352f;color:var(--brand-paper)}
.account-page .primary,.score-editor button.primary{background:var(--brand-ink);border-color:var(--brand-ink);color:var(--brand-paper)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--brand-focus);outline-offset:3px}
input:not([type=radio]):not([type=checkbox]):not([type=range]),select,textarea{border-color:#a28b7f;background:#fffdfb;color:var(--brand-ink)}
input[type=checkbox],input[type=radio],input[type=range],progress{accent-color:var(--brand-ink)}
.choice input:focus-visible+span,.sr-only:focus-visible+.dropzone{outline-color:var(--brand-focus)}
::selection{background:var(--brand-apricot);color:var(--brand-ink)}

/* One lockup, with the approved dot-free mark, on every shared header. */
.site-header,.product .site-header{background:#fff8f3f5;border-bottom:1px solid var(--brand-line);backdrop-filter:blur(18px)}
.site-header .site-nav-wrap{min-height:76px}
.site-header .site-brand,.footer-brand{font-family:"Notavue Sans",sans-serif;font-weight:500;letter-spacing:-.055em;color:var(--brand-ink);line-height:1.1}
.site-header .site-brand{display:inline-flex;align-items:center;gap:10px;font-size:30px;min-height:44px;white-space:nowrap}
.site-header .site-brand img{display:block;width:32px;height:32px;flex:none;border-radius:8px}
.site-header .site-menu a,.site-header .site-auth a,.site-header .site-auth button{color:var(--brand-ink)}
.site-header .site-menu .nav-cta{color:var(--brand-paper)}
.site-header .site-auth button{border-color:#aa9487}
.site-header .site-menu a[aria-current=page]:not(.nav-cta){text-decoration:underline;text-decoration-color:var(--brand-focus);text-underline-offset:.35em}
.site-header .menu-toggle{border-color:#aa9487;background:transparent}
.site-header .menu-toggle span{background:var(--brand-ink)}
.site-header .language-switch{background:#eddfd5}
.site-header .language-switch button{color:#63544c;background:transparent}
.site-header .language-switch button[aria-pressed=true]{background:var(--brand-surface);color:var(--brand-ink);box-shadow:0 1px 5px #43352f12}
.site-header a:focus-visible,.site-header button:focus-visible{outline-color:var(--brand-focus)}
.site-session-error{background:#f9e8de;color:#643f2f}
.site-footer{border-color:var(--brand-line);color:var(--brand-muted)}
.site-footer .footer-brand{display:inline-flex;align-items:center;gap:10px;font-size:28px}
.site-footer .footer-brand img{display:block;width:28px;height:28px}
.site-footer>span,.site-footer nav a,.site-footer>p{color:var(--brand-muted)}

/* The warm color has room to breathe; the gesture never crosses body copy. */
.landing-page .marketing-main{max-width:none;padding:0}
.landing-page .marketing-main>section:not(.hero){max-width:1200px;margin-inline:auto;padding-inline:40px}
.landing-page .hero{position:relative;isolation:isolate;overflow:hidden;background:var(--brand-apricot);padding:76px 40px 64px;border-bottom:1px solid #25242618}
.landing-page .hero-copy{max-width:1120px;margin-inline:auto;text-align:left;position:relative;z-index:1}
.landing-page .hero-copy>.eyebrow{font-size:.875rem!important;font-weight:600;letter-spacing:.06em;color:var(--brand-ink)!important;margin-bottom:24px}
.landing-page .hero-copy h1,html[lang=en] .landing-page .hero h1{font-weight:500;font-size:clamp(42px,5.4vw,68px);line-height:1.17;letter-spacing:-.055em;margin-bottom:26px;max-width:12em;text-wrap:balance}
html[lang=en] .landing-page .hero h1{font-size:clamp(48px,6.3vw,82px);line-height:1.06;max-width:12ch}
.landing-page .hero-description{max-width:570px;margin:0 0 24px!important;color:#4e3c33!important;line-height:1.8!important;text-wrap:pretty}
.landing-page .hero-actions{justify-content:flex-start;gap:16px;margin-top:0}
.landing-page .hero-price{color:#4e3c33;margin:18px 0 0}
.landing-page .hero-origin{display:inline-flex;margin:16px 0 0;max-width:570px;justify-content:flex-start;color:#4e3c33;text-align:left}
.landing-page .brand-gesture{position:absolute;z-index:0;right:-5%;top:130px;width:47%;height:400px;opacity:.72;pointer-events:none}
.landing-page .hero>.hero-film{position:relative;z-index:1;max-width:1040px;margin:52px auto 0;border:1px solid #25242625;background:var(--brand-paper);box-shadow:0 18px 60px #5b352512}
.landing-page .hero .film-hero-caption{background:var(--brand-paper)}
.landing-page .hero .film-duration{color:var(--brand-muted)}
.landing-page .audience-card,.landing-page .how-steps article{background:#f8eee7;border-color:var(--brand-line)}
.landing-page .audience-description,.landing-page .audience-label{color:var(--brand-muted)}
.landing-page .creator-path{background:var(--brand-ink)}
.landing-page .creator-path h3{color:var(--brand-paper)}
.landing-page .creator-path p{color:#f0dfd5}
.landing-page .closing-cta{position:relative;isolation:isolate;background:#f6e4d9;border-radius:28px;margin-block:52px;padding-block:64px}
.landing-page .closing-cta::before{content:"";display:block;width:min(420px,85%);height:74px;margin:0 auto 26px;background:url('/assets/brand-pattern.svg') center/contain no-repeat;opacity:.55}

/* Work surfaces are quiet. Meaningful error, recording and playback reds stay. */
.card,.panel,.account-card,.plan-card,.auth-panel,.checkout-card,.guide-section,.learn-card{background:var(--brand-surface);border-color:var(--brand-line)}
.pricing-page .price-card{background:var(--brand-surface);border-color:var(--brand-line)}
.pricing-page .price-card.featured{background:var(--brand-tint);border-color:var(--brand-ink)}
.pricing-page .featured-label{background:var(--brand-ink);color:var(--brand-paper)}
.auth-panel{padding:34px;border:1px solid var(--brand-line);border-radius:24px;box-shadow:0 12px 40px #4a302408}
.auth-page .auth-main{padding-top:32px}
.auth-panel input,.auth-google{border-color:#a28b7f}
.auth-divider{color:var(--brand-muted)}
.auth-divider::before,.auth-divider::after{background:var(--brand-line)}
.auth-note,.auth-back{color:var(--brand-muted)}
.account-page .account-sidebar nav a[aria-current=page],.account-page .account-tabs a[aria-current=page],.account-page .account-tabs button[aria-selected=true]{background:var(--brand-tint);color:var(--brand-ink)}
.account-avatar,.account-person>span,.workspace-avatar{background:var(--brand-tint);color:var(--brand-ink);border-color:var(--brand-line)}
.account-score-cover{background:#f5e5d9}
.source-tabs{background:#efdfd4}
.source-tabs button[aria-pressed=true]{background:var(--brand-surface);color:var(--brand-ink)}
.choice input:checked+span{background:var(--brand-tint);border-color:var(--brand-ink);color:var(--brand-ink)}
.kind-choices label:has(:checked),.cloud-kind label:has(input:checked){background:var(--brand-tint);border-color:var(--brand-ink)}
.dropzone{background:#fffaf6;border-color:#a28b7f}
.dropzone:hover,.dropzone.dragging{background:var(--brand-tint);border-color:var(--brand-focus)}
.empty{background:#fffaf6;border-color:#bca89b}
.waiting-lesson{background:var(--brand-ink);color:var(--brand-paper)}
.preview-player,.preview-controls,.practice-toolbar,.score-editor-toolbar,.editor-toolbar{border-color:var(--brand-line);background:var(--brand-paper)}
.preview-score,.preview-score-page,.score-page,.score-sheet,#editor-score{background:#fff}
.score-page-number{color:#6e6059}

@media(max-width:1320px){.site-header .site-menu{background:var(--brand-paper);border-color:var(--brand-line);box-shadow:0 16px 32px #4a302412}}
@media(max-width:800px){
  .landing-page .hero{padding:48px 24px 40px}
  .landing-page .hero-copy h1,html[lang=en] .landing-page .hero h1{font-size:clamp(38px,7.5vw,58px);max-width:100%}
  .landing-page .hero-description{max-width:600px}
  .landing-page .brand-gesture{position:relative;right:auto;top:auto;width:100%;height:110px;margin:20px auto -8px;opacity:.65}
  .landing-page .hero>.hero-film{margin-top:28px}
  .landing-page .marketing-main>section:not(.hero){padding-inline:24px}
  .landing-page .closing-cta{border-radius:0}
}
@media(max-width:600px){
  .site-header .site-nav-wrap{min-height:64px;padding:8px 12px;gap:8px;flex-wrap:nowrap}
  .site-header .site-brand{font-size:24px;gap:7px}
  .site-header .site-brand img{width:27px;height:27px}
  .site-header .site-auth a,.site-header .site-auth button{font-size:.875rem!important;padding:8px 6px}
  .site-header .site-menu{right:12px}
  .landing-page .hero{padding:38px 22px 32px}
  .landing-page .hero-copy>.eyebrow{margin-bottom:20px}
  .landing-page .hero-copy h1{font-size:clamp(34px,8.9vw,48px);line-height:1.25}
  html[lang=en] .landing-page .hero h1{font-size:clamp(40px,10vw,54px);line-height:1.1}
  .landing-page .hero-actions .button{width:auto;max-width:100%;white-space:normal;text-align:center}
  .landing-page .hero>.hero-film{margin-inline:0;border-radius:16px}
  .landing-page .marketing-main>section:not(.hero){padding-inline:22px}
  .auth-panel{padding:25px 20px;border-radius:20px}
  .auth-main{padding-inline:18px}
}
@media(max-width:380px){
  .site-header .site-nav-wrap{padding:8px;gap:5px}
  .site-header .site-brand{font-size:21px;gap:5px}
  .site-header .site-brand img{width:24px;height:24px}
  .site-header .site-auth{gap:0}
  .site-header .site-auth a,.site-header .site-auth button{font-size:13px!important;padding:8px 4px}
}
@media print{
  html,body,body.product{background:#fff}
  .brand-gesture,.site-header,.site-footer{display:none!important}
}

/* Compact reading rhythm: notation and immutable score SVG are excluded. */
body,body.product{line-height:1.55}
.product main :is(p,li,dd,dt){line-height:1.55}
.product main p{margin-block:.65em}
.product :is(.account-content,.cloud-main,.checkout-main,.service-guide,.learn-main,.score-editor) h1{font-size:clamp(28px,3.2vw,38px);line-height:1.2;margin-block:0 14px}
.product :is(.account-content,.cloud-main,.checkout-main,.service-guide,.learn-main,.score-editor) h2{font-size:22px;line-height:1.3}
.product :is(.account-content,.cloud-main,.checkout-main,.service-guide,.learn-main,.score-editor) h3{font-size:18px;line-height:1.35}
.product .service-guide,.product .learn-main{padding-top:40px}
.product .service-guide>header,.product .learn-main>header{margin-bottom:30px}
.product .service-guide>header p,.product .learn-main>header p{max-width:65ch}
.product .service-guide>section{margin-block:32px;padding-block:28px}
.product .learn-card{padding:24px}
.product .learn-card h2{font-size:21px;margin-block:8px 12px}
.account-page .account-layout{padding-top:32px;gap:32px}
.account-page .account-heading{margin-bottom:24px;gap:20px}
.account-page .account-sidebar nav a{padding-block:12px;min-height:44px}
.account-page .account-card{padding:24px}
.account-page .account-card p{margin-block:10px}
.account-page .account-stat strong{font-size:36px;line-height:1.2}
.account-page .account-section-title{margin-top:30px}
.account-page .account-empty{padding:32px 24px}
.product .cloud-heading h1{font-size:34px;line-height:1.2}
.product .checkout-panel h2{font-size:24px}
.product .edit-heading h1{font-size:32px}
.product .pricing-intro{padding:44px 0 12px;text-align:left}
.product .pricing-intro h1{font-size:38px;line-height:1.2;margin:0 0 14px;letter-spacing:-.035em}
.product .pricing-intro p{max-width:64ch;margin:0 0 18px}
.product .pricing-grid{gap:18px;margin:24px 0 22px;align-items:stretch}
.product .price-card{padding:26px 24px;border-radius:18px}
.product .price-card .eyebrow{margin:0 0 8px;line-height:1.3}
.product .price-card h2{font-size:22px;line-height:1.3;margin:0 0 10px}
.product .price-card .plan-description{min-height:0;margin:0 0 18px}
.product .price{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px;margin-block:8px}
.product .price>span{font-size:44px;line-height:1.15;letter-spacing:-.04em}
.product .price :is(small,em){font-size:14px!important}
.product .price-card .feature-list{padding-top:14px;margin:18px 0 14px}
.product .price-card .feature-list li{line-height:1.5;margin-block:8px;padding-left:22px}
.product .price-card .plan-footnote{margin:14px 0 0}
.product .featured-label{top:-13px;font-size:14px!important;padding:4px 12px}
.product .quote-section{gap:36px;padding-block:32px;margin-block:28px}
.product .quote-section h2,.product .pricing-faq h2{font-size:24px;line-height:1.3}
.product .plan-fit input{padding:10px 12px;min-height:44px;margin:6px 0 14px}
.product .quote-result{padding:24px}
.product .pricing-faq{padding:32px 0 44px;gap:40px}
.product .pricing-faq details{padding-block:16px}
.product .pricing-faq summary{line-height:1.4;min-height:44px;align-content:center}
.product .pricing-faq details p{margin:10px 0 0}
/* Keep the approved spacious headline, with a tighter functional description. */
.landing-page .hero-copy>.hero-promise{letter-spacing:.015em;line-height:1.5;max-width:40em}
.landing-page .hero-description{line-height:1.6!important;margin-bottom:22px!important}
.landing-page .hero-note{color:#4e3c33;margin:14px 0 0;font-size:.875rem!important;max-width:42em}
.landing-page .notavue-promises,.landing-page .audience-section,.landing-page .founder-section,.landing-page .how-section,.landing-page .answer-section{padding-block:64px}
.landing-page :is(.notavue-promises,.audience-intro,.how-section,.answer-section,.closing-cta,.learn-home-link) h2{font-size:32px;line-height:1.25}
.landing-page .audience-intro{margin-bottom:26px}
.landing-page .audience-card{padding:26px}
.landing-page .story-person{margin-bottom:18px}
.landing-page .story-person h3{font-size:18px}
.landing-page .audience-voice{font-size:21px;line-height:1.4;margin-bottom:12px}
.landing-page .audience-description,.landing-page .creator-path p{font-size:1rem;line-height:1.55}
.landing-page .how-steps h3{font-size:20px}
.landing-page .section-intro{margin-bottom:32px}
.landing-page .answer-list details{padding-block:18px}
.landing-page .creator-path .button{margin-top:18px;border-color:#d4b9aa;background:var(--brand-paper);color:var(--brand-ink)}
.landing-page .creator-path h3{margin-top:14px;font-size:26px}
/* One motion control pauses the silent video and decorative staff together. */
.hero-video-stage{background:var(--brand-paper);aspect-ratio:16/9;overflow:hidden}
#hero-film{display:block;width:100%;height:100%;object-fit:contain}
.hero-media-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hero-media-actions button{min-height:44px;padding:8px 12px;font-size:.875rem!important;line-height:1.3}
.hero-media-actions .watch-film-link{color:var(--brand-ink);font-weight:600;padding-inline:8px}
.film-hero-caption .film-journey{flex-wrap:wrap}
/* The same handmade paths move independently; media failures cannot stop them. */
.gesture-lines{display:block;width:100%;height:100%;overflow:visible;animation:notavue-staff-breath 5.4s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:center}
.gesture-lines path{transform-box:fill-box;transform-origin:center;animation:notavue-line-wave 3.6s ease-in-out infinite alternate;animation-play-state:paused}
.gesture-lines path:nth-child(2){animation-delay:-.7s;animation-duration:4.1s}
.gesture-lines path:nth-child(3){animation-delay:-1.6s;animation-duration:3.9s}
.gesture-lines path:nth-child(4){animation-delay:-2.2s;animation-duration:4.5s}
.gesture-lines path:nth-child(5){animation-delay:-2.9s;animation-duration:4.3s}
.landing-page .closing-cta::before{animation:notavue-staff-breath 6s ease-in-out infinite alternate;animation-play-state:paused}
body[data-brand-motion=playing] :is(.gesture-lines,.gesture-lines path),body[data-brand-motion=playing] .closing-cta::before{animation-play-state:running}
@keyframes notavue-staff-breath{from{transform:translate3d(-16px,-8px,0) rotate(-2deg)}to{transform:translate3d(16px,10px,0) rotate(2deg)}}
@keyframes notavue-line-wave{from{transform:translateY(-14px) rotate(-.7deg)}to{transform:translateY(14px) rotate(.7deg)}}
/* Marketplace is a public introduction. It has no product catalog or checkout. */
.coming-badge{display:inline-flex;align-items:center;padding:4px 10px;border:1px solid #aa7964;border-radius:30px;background:#f9e8de;color:#583c2f;font-size:14px;line-height:1.4;font-weight:600}
.marketplace-main{max-width:1120px;padding:48px 32px 64px;margin:auto}
.marketplace-intro{position:relative;isolation:isolate;overflow:hidden;background:var(--brand-tint);border:1px solid var(--brand-line);border-radius:24px;padding:44px}
.marketplace-intro>.eyebrow{margin:18px 0 12px;color:var(--brand-ink)!important}
.marketplace-intro h1{font-size:clamp(32px,4vw,48px);line-height:1.2;letter-spacing:-.045em;margin:0 0 20px;max-width:16em}
.marketplace-intro>p:not(.eyebrow){max-width:560px;position:relative;z-index:1}
.marketplace-intro>.button{margin:14px 0 0;position:relative;z-index:1}
.marketplace-intro .marketplace-status{font-size:14px!important;margin-top:16px}
.marketplace-gesture{position:absolute;z-index:-1;right:-90px;bottom:55px;width:42%;height:190px;opacity:.45;pointer-events:none}
.marketplace-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:42px 0}
.marketplace-features article{min-width:0}
.marketplace-step{color:var(--brand-focus);font-size:14px;font-variant-numeric:tabular-nums}
.marketplace-features h2{font-size:21px;line-height:1.35;margin:12px 0}
.marketplace-next{border-top:1px solid var(--brand-line);padding-top:28px;max-width:750px}
.marketplace-next h2{font-size:24px;line-height:1.3;margin:0 0 12px}
.marketplace-next .button{margin-top:12px}
.account-marketplace{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--brand-line);background:var(--brand-tint);border-radius:18px;padding:24px;margin-top:32px}
.account-marketplace h2{margin:12px 0 8px}
.account-marketplace p{margin:0}
.account-marketplace>.button{flex-shrink:0}
/* Another nav item needs room before switching to the phone menu. */
@media(min-width:1321px){.site-header .site-nav-wrap{gap:16px}.site-header .site-menu{gap:16px}.site-header .site-auth a,.site-header .site-auth button{padding-inline:10px}}
@media(max-width:1250px) and (min-width:1101px){
 .site-header .site-auth{margin-left:auto}
 .site-header .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;gap:6px}
 .site-header .menu-toggle span{display:block;width:20px;height:2px}
 .site-header .site-menu{display:none;position:absolute;right:24px;left:auto;top:100%;margin:0;width:min(360px,calc(100% - 32px));max-height:calc(100dvh - 80px);overflow:auto;flex-direction:column;align-items:stretch;gap:4px;padding:16px;background:var(--brand-paper);border:1px solid var(--brand-line);border-radius:0 0 16px 16px;box-shadow:0 16px 32px #4a302412}
 .site-header .site-menu.is-open{display:flex}
 .site-header .site-menu a{padding:10px 12px}
}
@media(max-width:800px){
 .product .pricing-intro{padding-top:30px}
 .product .pricing-intro h1{font-size:30px}
 .product .pricing-grid{margin-top:20px}
 .product .price-card{padding:24px}
 .product .price>span{font-size:40px}
 .product .quote-section,.product .pricing-faq{gap:24px}
 .landing-page :is(.notavue-promises,.audience-section,.founder-section,.how-section,.answer-section){padding-block:42px}
 .landing-page :is(.notavue-promises,.audience-intro,.how-section,.answer-section,.closing-cta,.learn-home-link) h2{font-size:27px}
 .landing-page .story-person h3{font-size:17px}
 .landing-page .audience-voice{font-size:20px}
 .landing-page .audience-card{padding:22px}
 .landing-page .film-hero-caption{padding:12px 14px;align-items:start}
 .hero-media-actions{gap:4px}
 .marketplace-main{padding:28px 22px 44px}
 .marketplace-intro{padding:28px 24px}
 .marketplace-features{grid-template-columns:1fr;gap:24px;padding:30px 0}
 .marketplace-features h2{font-size:21px}
 .marketplace-gesture{width:65%;opacity:.2}
 .account-marketplace{align-items:start;flex-direction:column}
 .account-page .account-layout{gap:20px;padding-top:20px}
}
@media print{.hero-media-actions,.marketplace-gesture{display:none!important}}

@media(min-width:801px){.product .price-card .plan-description{min-height:3.1em}}
@media(max-width:800px){.product .price-card .plan-description{min-height:0}}

.marketplace-earn{font-weight:600;color:var(--brand-ink)!important}.marketplace-flow{padding:24px 0;border-top:1px solid var(--brand-line)}.marketplace-flow ol{padding-left:24px}.marketplace-flow li{margin:12px 0}.marketplace-flow a{display:inline-block;min-height:44px;padding:10px 0}
@media(max-width:700px){.landing-page .brand-gesture{height:140px;margin-top:10px}.landing-page .brand-gesture .gesture-lines{height:100px}.marketplace-gesture{bottom:80px}}


/* A full-width reading sequence: never nest three narrow cards in a half-column. */
.landing-page .how-section{display:block;position:relative;isolation:isolate;overflow:hidden;padding-block:64px}
.landing-page .how-section>.section-intro{text-align:left;max-width:760px;margin:0 0 36px}
.landing-page .how-section>.section-intro h2{font-size:32px;line-height:1.25;letter-spacing:-.035em;margin:0}
.landing-page .how-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;list-style:none;padding:0;margin:0}
.landing-page .how-step{display:block;min-width:0;margin:0;padding:24px 0 0;border-top:1px solid var(--brand-line);background:none;border-radius:0}
.landing-page .how-step>div{min-width:0}
.landing-page .how-step .step-number{display:block;font-family:inherit;font-size:14px;font-weight:600;line-height:1.4;letter-spacing:.09em;color:var(--brand-focus);margin:0 0 20px;font-variant-numeric:tabular-nums}
.landing-page .how-step h3{font-size:20px;font-weight:600;line-height:1.35;letter-spacing:-.025em;margin:0 0 10px}
.landing-page .how-step p{font-size:16px;line-height:1.6;margin:0!important;max-width:34ch;color:var(--brand-muted)}
.landing-page .how-actions{margin-top:28px;text-align:left;justify-content:flex-start}
.landing-page .how-actions>.button{min-height:44px}

/* The original handmade paths travel across the entire section, then return. */
.landing-page .hero .brand-gesture,.marketplace-intro .marketplace-gesture{
  position:absolute;left:-100%;right:auto;top:5%;bottom:auto;width:300%;height:88%;margin:0;
  opacity:.22;pointer-events:none;animation:notavue-section-flow 32s ease-in-out -8s infinite alternate;animation-play-state:paused;
}
.marketplace-intro .marketplace-gesture{top:0;height:100%;opacity:.13;animation-delay:-13s}
.landing-page .hero .brand-gesture .gesture-lines,.marketplace-intro .marketplace-gesture .gesture-lines{width:100%;height:100%;animation:none;transform:none}
.landing-page .hero .gesture-lines path,.marketplace-intro .gesture-lines path{animation:none;transform:none}
.landing-page .closing-cta{overflow:hidden;isolation:isolate}
.landing-page .closing-cta::before,.landing-page .how-section::before{
  content:"";position:absolute;z-index:0;left:-100%;top:0;width:300%;height:100%;margin:0;
  background:url('/assets/brand-pattern.svg') center/100% 100% no-repeat;opacity:.14;pointer-events:none;
  animation:notavue-section-flow 32s ease-in-out -5s infinite alternate;animation-play-state:paused;
}
.landing-page .how-section::before{opacity:.065;animation-delay:-11s}
.landing-page .how-section>*,.landing-page .closing-cta>*{position:relative;z-index:1}
body[data-brand-motion=playing] .hero .brand-gesture,body[data-brand-motion=playing] .marketplace-gesture,
body[data-brand-motion=playing] .closing-cta::before,body[data-brand-motion=playing] .how-section::before{animation-play-state:running}
@keyframes notavue-section-flow{from{transform:translate3d(-20%,0,0)}to{transform:translate3d(20%,0,0)}}
@media(max-width:900px){
  .landing-page .how-section{padding-block:48px}
  .landing-page .how-section>.section-intro{margin-bottom:28px}
  .landing-page .how-section>.section-intro h2{font-size:28px}
  .landing-page .how-steps{grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid var(--brand-line)}
  .landing-page .how-step{display:grid;grid-template-columns:32px minmax(0,1fr);gap:20px;padding:24px 0;border-top:0;border-bottom:1px solid var(--brand-line)}
  .landing-page .how-step .step-number{padding-top:4px;margin:0}
  .landing-page .how-step p{max-width:60ch}
  .landing-page .how-actions{margin-top:24px}
}
@media(max-width:500px){
  .landing-page .how-step{gap:16px}
  .landing-page .how-step h3{font-size:19px}
  .landing-page .hero .brand-gesture{opacity:.16}
}
@media(prefers-reduced-motion:reduce){
  .landing-page .hero .brand-gesture,.marketplace-intro .marketplace-gesture,
  .landing-page .how-section::before,.landing-page .closing-cta::before{animation:none!important;transform:none!important}
}
@media print{.landing-page .how-section::before,.landing-page .closing-cta::before{display:none}}

/* Creator introduction: benefits, preparation and the forthcoming sale are distinct. */
.seller-page .seller-promise{font-size:16px;line-height:1.65;max-width:620px!important}.seller-benefits,.seller-steps{padding-block:36px;border-bottom:1px solid var(--brand-line)}.seller-page h2{font-size:26px;line-height:1.3;margin:0 0 22px;letter-spacing:-.025em}.seller-benefit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 40px}.seller-page h3{font-size:19px;line-height:1.4;margin:0 0 10px}.seller-page p{font-size:16px;line-height:1.65}.seller-benefit-grid p{margin:0;max-width:34em}.seller-steps ol{list-style:none;padding:0;counter-reset:step;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.seller-steps li{counter-increment:step;min-width:0}.seller-steps li:before{content:'0' counter(step);display:block;font-size:30px;font-weight:600;color:#845c47;margin-bottom:12px}.seller-status{display:inline-block;font-size:14px;border:1px solid var(--brand-line);padding:4px 9px;border-radius:20px;margin-bottom:14px}.seller-share{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:36px 0}.seller-share-number{font-size:72px!important;letter-spacing:-.06em;line-height:1!important;margin:0 0 12px!important;font-weight:700}.seller-share a,.seller-reading a{display:inline-flex;align-items:center;min-height:44px}.seller-page .seller-faq{max-width:none;padding:28px 0 36px}.seller-page .seller-faq details{padding:0;border-bottom:1px solid var(--brand-line)}.seller-page .seller-faq summary{padding:18px 0;min-height:44px;font-size:16px;font-weight:600;cursor:pointer}.seller-page .seller-faq details p{max-width:760px;padding-bottom:14px;margin:0}.seller-page .seller-reading{margin:12px 0 0}.seller-page .marketplace-next{max-width:none}.seller-page .marketplace-next h2{font-size:26px}.seller-page .marketplace-status{max-width:620px!important}
@media(max-width:700px){.seller-benefit-grid,.seller-steps ol,.seller-share{grid-template-columns:1fr;gap:24px}.seller-benefits,.seller-steps{padding-block:28px}.seller-page h2,.seller-page .marketplace-next h2{font-size:24px}.seller-share{padding-block:28px}.seller-share-number{font-size:60px!important}.seller-page .marketplace-intro{padding:24px 22px}}

.hand-review{padding:16px 20px;margin:16px 0 24px;border:1px solid var(--brand-line);border-radius:14px;background:var(--brand-tint,#f5e8e1)}
.hand-review strong{font-size:16px;line-height:1.4}.hand-review p{font-size:14px;line-height:1.5;margin:8px 0 0}