/* Experimental backgrounds only apply inside the comparison preview. */
html[data-background-test] body{isolation:isolate}
html[data-background-test="simple"]{--ink:#203a30!important;--muted:#454d42!important;--rust:#793722!important}
html[data-background-test="simple"] body{
 background:radial-gradient(ellipse at 95% 5%,#dfae8159,transparent 55%),radial-gradient(ellipse at 0 65%,#bbc9af55,transparent 60%),linear-gradient(145deg,#f1e8da,#e5dfd1);
 background-attachment:fixed;
}
html[data-background-test="cyberpunk"]{
 --paper:#0b1020!important;--ink:#e7f8f4!important;--muted:#bdcbd7!important;--rust:#f7a0ee!important;--line:#3a5261!important;--sand:#121b30!important;--quote:#141d34!important;
}
html[data-background-test="cyberpunk"] body{
 background:radial-gradient(ellipse at 0 18%,#e837af26,transparent 48%),radial-gradient(ellipse at 100% 60%,#00d8ee22,transparent 48%),#0b1020;
 background-attachment:fixed;
}
html[data-background-test="cyberpunk"] body::before{
 content:"";position:fixed;inset:45% -40% -40%;z-index:-1;pointer-events:none;
 background:repeating-linear-gradient(0deg,transparent 0 79px,#53f0ff30 80px 81px),repeating-linear-gradient(90deg,transparent 0 79px,#53f0ff30 80px 81px);
 transform:perspective(550px) rotateX(55deg);transform-origin:center top;mask-image:linear-gradient(transparent,#000 40%);
}
html[data-background-test="cyberpunk"] .hero h1 em{text-shadow:0 0 32px #f65be54d}
html[data-background-test="cyberpunk"] .header{box-shadow:0 1px 22px #00d8ee12}
html[data-background-test="stars"]{
 --paper:#091525!important;--ink:#e9f0e6!important;--muted:#bdccda!important;--rust:#e9ae82!important;--line:#345069!important;--sand:#112238!important;--quote:#13243b!important;
}
html[data-background-test="stars"] body{
 background:radial-gradient(ellipse at 90% 20%,#4864932e,transparent 55%),radial-gradient(ellipse at 0 70%,#307e7726,transparent 55%),#091525;
 background-attachment:fixed;
}
html[data-background-test="stars"] body::before,html[data-background-test="stars"] body::after{
 content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-repeat:repeat;
}
html[data-background-test="stars"] body::before{
 background-image:radial-gradient(1px 1px at 12px 28px,#e9f0e69c 99%,transparent),radial-gradient(1px 1px at 114px 176px,#e9f0e67d 99%,transparent),radial-gradient(1.5px 1.5px at 257px 83px,#e9f0e6ae 99%,transparent),radial-gradient(1px 1px at 363px 324px,#e9f0e669 99%,transparent),radial-gradient(1px 1px at 190px 361px,#e9f0e669 99%,transparent),radial-gradient(1px 1px at 397px 129px,#e9f0e6ae 99%,transparent);
 background-size:421px 397px;
}
html[data-background-test="stars"] body::after{
 background-image:radial-gradient(2px 2px at 60px 96px,#f5ead2d9 75%,transparent),radial-gradient(1.5px 1.5px at 285px 233px,#d0e7ffcc 75%,transparent),radial-gradient(1.5px 1.5px at 449px 42px,#fff2dfb3 75%,transparent),radial-gradient(1px 1px at 166px 407px,#d0e7ffcc 75%,transparent);
 background-size:503px 461px;animation:background-star-twinkle 5s ease-in-out infinite alternate;
}
@keyframes background-star-twinkle{from{opacity:.25}to{opacity:.95}}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .contact{background:var(--sand);color:var(--ink);border-top:1px solid var(--line)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .contact :is(.eyebrow,.contact-description,.contact-small,.field>span,.form-hint,.form-status){color:var(--ink)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .field :is(input,textarea,select){color:var(--ink);border-color:var(--line);background:#ffffff08}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .field :is(input,textarea)::placeholder{color:var(--muted)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .contact .button{background:var(--ink);color:var(--paper);border-color:var(--ink)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .contact .button:hover{background:var(--rust);border-color:var(--rust)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .menu-toggle{color:var(--ink)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .button:hover{background:var(--rust);color:var(--paper)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .play{color:var(--paper)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .image-caption span:not(.editable-text){color:#ece6da}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) .skip{color:var(--paper)}
html:is([data-background-test="cyberpunk"],[data-background-test="stars"]) ::selection{background:var(--rust);color:var(--paper)}
@media(prefers-reduced-motion:reduce){html[data-background-test="stars"] body::after{animation:none;opacity:.7}}