/* Character art is the exhibit, not a thumbnail beside a photograph. */
.ascii-output.colorized{font-weight:700}
.preview-panel[data-paper=false] .ascii-frame{background:#07120f}
.style-gallery{display:grid;grid-template-columns:1fr 1fr;gap:50px 32px;margin-top:36px}
.style-piece{min-width:0}.style-art{position:relative;aspect-ratio:1;background:#07120f;overflow:hidden;border-radius:7px}
.style-art canvas{width:100%;height:100%;display:block;object-fit:contain}
.art-label{position:absolute;left:22px;bottom:18px;color:#a5b9b0;font:9px var(--font-mono);letter-spacing:.12em;background:#07120fcc;padding:7px 9px}
.style-copy{padding:24px 0 0}.style-index{font:10px var(--font-mono);letter-spacing:.1em;color:var(--accent)}
.style-copy h3{font-size:clamp(27px,3.3vw,43px);line-height:1.06;letter-spacing:-.05em;margin:13px 0 16px;max-width:20ch}
.style-copy p{font-size:14px;max-width:38ch;line-height:1.7}.style-copy .case-action{display:inline-block;margin-top:22px;font-size:13px;float:none}
.style-feature{grid-column:1/-1;display:grid;grid-template-columns:1.5fr 1fr;background:#07120f;border-radius:8px;overflow:hidden;color:#f1f7ed}
.style-feature .style-art{border-radius:0}.style-feature .style-copy{padding:56px 38px;display:flex;flex-direction:column;justify-content:center}
.style-feature .style-index{color:#65d5e9}.style-feature h3{font-size:clamp(36px,4.5vw,66px);max-width:12ch;letter-spacing:-.06em}
.style-feature p{color:#a7b9b1}.style-feature .case-action{color:#f0f7eb;border-color:#72b7be;align-self:flex-start;font-size:14px;padding:12px 0}
.style-source{margin-top:35px;border-top:1px solid #ffffff20;padding-top:18px}.style-source summary{color:#a7b9b1;font-size:11px;font-weight:400}.style-source img{width:180px;max-width:100%;height:auto;margin-top:18px;border-radius:4px}.style-source p{font-size:10px;max-width:28ch;margin-top:8px}
.everyday-examples{margin-top:60px;border-top:1px solid var(--line);padding-top:24px}.everyday-examples>summary{font-size:13px;color:var(--muted)}.everyday-examples .use-case-panels{margin-top:32px}
.hero-proof{max-width:500px}.hero-compare{border-radius:7px;box-shadow:0 20px 60px #072c3912}
@media(max-width:767px){.style-gallery{grid-template-columns:1fr;gap:36px}.style-feature{grid-template-columns:1fr}.style-feature .style-copy{padding:28px 24px}.style-feature h3{font-size:45px}.style-art{border-radius:5px}.style-source{margin-top:24px}.style-copy h3{font-size:32px}.art-label{font-size:8px;left:12px;bottom:12px}.style-feature .style-art{aspect-ratio:1}.style-source img{width:140px}}