/* The compact identity is independent of the sail's page assembly. */
.codavela-brand{display:block;position:relative;width:100%;color:#f1e7d0;line-height:0;isolation:isolate}
.codavela-brand-svg{display:block;width:100%;height:auto;overflow:visible;pointer-events:none}
.codavela-brand .brand-fallback{display:block;font:500 28px/1 Arial,sans-serif;letter-spacing:-1px}
html[data-brand-boot=pending] .brand-fallback{visibility:hidden}
.wordmark .codavela-brand{width:218px;flex:none;margin:-14px 0 -13px -12px}
.wordmark{gap:0}
.paper .codavela-brand{color:#183c3c}
@media(max-width:700px){.wordmark .codavela-brand{width:184px;margin:-11px 0 -10px -10px}}
@media(max-width:370px){.wordmark .codavela-brand{width:163px}.header-tools{gap:10px}}
@media(prefers-reduced-motion:reduce){.codavela-brand-svg{filter:none}}

.mini-mark .codavela-brand{width:28px;height:28px}.mini-mark .codavela-brand-svg{width:100%;height:100%}

/* A generous corner signature, instead of a miniature navigation icon. */
body[data-world] header{min-height:148px;padding-top:8px;padding-bottom:8px}
body[data-world] .wordmark .codavela-brand{width:410px;margin:0 0 0 -24px}
body[data-world] .hero{padding-top:192px}
body[data-world] .hero-copy{margin-top:38px}
.portfolio-link{display:flex;width:max-content;max-width:100%;align-items:center;gap:30px;margin:24px 0 0 7vw;padding:0 0 10px;border-bottom:1px solid #eed4b080;font-size:12px;letter-spacing:.02em}
.portfolio-link b{font-size:24px;font-weight:400;transition:transform .3s}
.portfolio-link:hover b{transform:translate(4px,-4px)}
@media(min-width:701px) and (max-height:800px){body[data-world] header{min-height:128px}body[data-world] .wordmark .codavela-brand{width:360px}body[data-world] .hero{padding-top:160px;min-height:850px}body[data-world] .hero-copy{margin-top:25px}body[data-world] .hero-copy h1{font-size:6.7vw}.portfolio-link{margin-top:18px}}
@media(max-width:700px){
body[data-world] header{height:155px;min-height:0;align-items:flex-start;padding:3px 6%}
body[data-world] .wordmark .codavela-brand{width:min(320px,90vw);margin:0 0 0 -18px}
body[data-world] .header-tools{position:absolute;right:7%;top:107px}
body[data-world] .hero{padding-top:185px;min-height:max(970px,100svh)}
body[data-world] .hero-copy{margin-top:38px}
.portfolio-link{margin:22px 0 0;font-size:11px}
body:not(.compact) .composer{position:absolute;top:max(740px,calc(100svh - 230px));bottom:auto}
}

/* More room for the source geometry; the word remains balanced beside it. */
body[data-world] header{min-height:208px;padding-top:6px;padding-bottom:6px}
body[data-world] .wordmark .codavela-brand{width:520px;margin-left:-20px}
body[data-world] .hero{padding-top:247px}
@media(min-width:701px) and (max-height:800px){body[data-world] header{min-height:180px}body[data-world] .wordmark .codavela-brand{width:450px}body[data-world] .hero{padding-top:210px;min-height:930px}}
@media(max-width:700px){body[data-world] header{height:180px;min-height:0;padding-top:0}body[data-world] .wordmark .codavela-brand{width:min(350px,95vw);margin-left:-20px}body[data-world] .header-tools{top:135px}body[data-world] .hero{padding-top:211px;min-height:max(1000px,100svh)}body:not(.compact) .composer{top:max(775px,calc(100svh - 230px))}}

/* Keep the larger identity and the idea input in separate spaces. */
@media(min-width:701px){body[data-world] .hero{min-height:max(1060px,100svh)}body:not(.compact) .composer{position:absolute;top:max(840px,calc(100svh - 220px));bottom:auto}}
@media(min-width:701px) and (max-height:800px){body[data-world] .hero{min-height:930px}body:not(.compact) .composer{top:710px}}