/* SOMA UI, an independent project in the existing V4. */
.soma-ui-page{--soma-blue:#9bbfff}
.soma-board{position:relative;width:84.8%;max-width:1900px;aspect-ratio:390/1794;margin:0 auto;background:#fff url('/assets/soma-ui/pattern.png') repeat;background-size:95px 96.5px;border-radius:clamp(12px,1.8vw,30px);overflow:hidden;container-type:inline-size;isolation:isolate}
.soma-board-intro{position:absolute;inset:2.45% 0 auto;text-align:center;color:#111}
.soma-board-intro>img{display:block;width:11.5%;height:auto;margin:0 auto 5.8%}
.soma-board-intro h2{font-size:4.25cqw;letter-spacing:-.04em;line-height:1.12;font-weight:800;color:var(--soma-blue);margin:0}
.soma-board-intro p{font-size:1.9cqw;line-height:1.5;font-weight:400;margin:3% 0 0}
.soma-chapter{position:absolute;left:6.15%;top:8.25%;display:flex;align-items:center;gap:1.5cqw;color:#111;z-index:0}
.soma-chapter>span{font-size:10.7cqw;line-height:1;font-weight:800;letter-spacing:-.055em;color:#cbdfff}
.soma-chapter h3{font-size:2.35cqw;line-height:1;margin:0;font-weight:400;letter-spacing:-.04em}
.soma-piece{position:absolute;margin:0;line-height:0;z-index:1}
.soma-piece img,.soma-piece svg{display:block;width:100%;height:auto}
.soma-note,.soma-arrow{z-index:3;pointer-events:none}
.soma-motion .soma-screen{opacity:0;transform:translateY(40px) scale(.985);transition:opacity .85s ease,transform 1.1s cubic-bezier(.2,.75,.2,1);will-change:auto}
.soma-motion .soma-screen.is-visible{opacity:1;transform:none}
.soma-motion .soma-note{opacity:0;clip-path:inset(0 100% 0 0);transition:clip-path .8s cubic-bezier(.25,.6,.35,1),opacity .35s ease}
.soma-motion .soma-note.is-visible{opacity:1;clip-path:inset(0)}
.soma-motion .soma-arrow .soma-ink-mask{transform-box:fill-box;transform-origin:top;transform:scaleY(0);transition:transform .8s cubic-bezier(.35,.1,.4,1)}
.soma-motion .soma-arrow.is-visible .soma-ink-mask{transform:scaleY(1)}
.soma-motion .soma-board-intro,.soma-motion .soma-chapter{opacity:0;transform:translateY(20px);transition:opacity .8s,transform 1s cubic-bezier(.2,.75,.2,1)}
.soma-motion .soma-board-intro.is-visible,.soma-motion .soma-chapter.is-visible{opacity:1;transform:none}
@media(max-width:600px){.soma-board{width:94%;border-radius:12px}.soma-ui-page .case-statement{text-align:center}.soma-board-intro p{font-size:2.5cqw}.soma-chapter h3{font-size:2.8cqw}}
@media(prefers-reduced-motion:reduce){.soma-motion .soma-piece,.soma-motion .soma-board-intro,.soma-motion .soma-chapter{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}.soma-motion .soma-arrow .soma-ink-mask{transform:none!important;transition:none!important}}

.soma-chapter>span{position:relative;top:-12px}
.soma-ui-page .case-statement br{display:initial}
/* Chapter 02 is independent from the homepage; the app overlaps its patterned panel. */
.soma-continuation{width:84.8%;max-width:1900px;margin:clamp(60px,7vw,140px) auto 0;container-type:inline-size}
.soma-continuation>.soma-board{width:100%;max-width:none}
.soma-product-board{aspect-ratio:237/995}
.soma-product-board .soma-product-chapter{left:auto;right:7%;top:2.15%;gap:1.6cqw}
.soma-product-chapter h2{font-size:2.35cqw;line-height:1;letter-spacing:-.04em;font-weight:400;margin:0}
.soma-product-chapter>span{top:0}
.soma-app-board{background:#a8c7ff;aspect-ratio:237/828;margin-top:-12.65823cqw;border-radius:min(100px,5.275cqw);z-index:2}
.soma-app-intro{position:absolute;top:3.3%;left:0;width:100%;text-align:center}
.soma-app-intro>img{width:17%;height:auto;margin:0 auto}
.soma-app-intro h2{margin:8% 0 0;color:white;font-size:4.25cqw;letter-spacing:-.035em;line-height:1.2;font-weight:700}
.soma-app-intro p{font-size:1.9cqw;line-height:1.4;margin:2.5% 0 0;color:#17232b}
.soma-app-screen figcaption{font-size:clamp(10px,1.4cqw,22px);line-height:1.3;color:#17232b;text-align:center;margin-top:1.1cqw;font-weight:400}
.soma-app-board .soma-piece svg{height:100%}
.soma-bracket-title{background:#a8c7ff;box-shadow:0 0 0 1.3cqw #a8c7ff;z-index:5}
.soma-link{z-index:0}
.soma-app-board .soma-note{z-index:4}
.soma-app-board .soma-bracket-title{z-index:5}
.soma-motion .soma-app-intro{opacity:0;transform:translateY(20px);transition:opacity .8s,transform 1s cubic-bezier(.2,.75,.2,1)}
.soma-motion .soma-app-intro.is-visible{opacity:1;transform:none}
@media(max-width:600px){.soma-continuation{width:94%;margin-top:48px}.soma-app-intro p{font-size:2.5cqw}.soma-product-chapter h2{font-size:2.8cqw}}
@media(prefers-reduced-motion:reduce){.soma-motion .soma-app-intro{opacity:1;transform:none;transition:none}}

.soma-app-board{border-bottom-left-radius:40px;border-bottom-right-radius:40px}

/* Retina handwriting: slightly enlarged from the 1 / 1.5 baseline for legibility. */
.soma-note{scale:1;transform-origin:center center}

/* Mobile: enlarge handwriting independently of the scaled presentation. */
@media(max-width:600px){
  .soma-note{scale:1.35}
  .soma-note-edge{transform-origin:right center}
}

/* Larger desktop labels retain the original board composition. */
@media(min-width:601px){.soma-board-intro p,.soma-app-intro p{font-size:2.3cqw}.soma-app-screen figcaption{font-size:clamp(14px,1.7cqw,26px)}}
.soma-reveal-anchor{position:absolute;width:1px;height:1px;pointer-events:none;visibility:hidden}