@import url("/supporting-shell.css");

* { box-sizing: border-box; }
body { min-width: 20rem; min-height: 100%; margin: 0; color: var(--color-bone); background: var(--color-ink); font-family: inherit; font-size: 1rem; line-height: 1.55; }
.site-shell[data-supporting-page] { background: radial-gradient(circle at 82% 18%, var(--color-field-primary), transparent 35%), var(--color-ink); }
.site-shell[data-supporting-page] .particle-canvas { opacity: .16; }
.site-shell[data-supporting-page] .grain { opacity: .05; }
.site-shell[data-supporting-page] .supporting-view { overscroll-behavior-x: auto; }
h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; letter-spacing: 0; line-height: 1.02; }
.lede { max-width: 64ch; margin: 0; color: var(--color-muted); font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.7; }
.supporting-content { width: min(100%, 26rem); }
.partner-loading { display: flex; align-items: center; gap: var(--space-md); }
.partner-loading__mark { width: .7rem; height: 1rem; border: 1px solid var(--color-ember); transform-origin: left center; animation: partner-opening 480ms cubic-bezier(.25, 1, .5, 1) infinite alternate; }
@keyframes partner-opening { to { opacity: .55; transform: perspective(2rem) rotateY(-60deg); } }
.supporting-view form { width: 100%; margin-top: var(--space-2xl); }
.supporting-view label { display: block; margin-bottom: 0; color: var(--color-muted); font-size: .75rem; }
.controls { display: grid; gap: var(--space-sm); }
.controls .input-action-group { border: 1px solid var(--color-line); }
.controls[data-rejected] { animation: partner-rejected 280ms ease-in-out; }
@keyframes partner-rejected { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-.4rem); } 75% { transform: translateX(.4rem); } }
.supporting-view input, .supporting-view button { min-height: var(--cta-height); border-radius: 0; font: inherit; }
.supporting-view input { width: 100%; min-width: 0; padding: 0 var(--space-md); border: 1px solid var(--color-line); background: var(--color-panel); color: var(--color-bone); }
.controls .input-action-group input { border: 0; }
.controls label:not(:first-child) { margin-top: var(--space-md); }
.controls button { margin: 0; padding: 0 var(--space-lg); border: 0; border-left: 1px solid var(--color-line); background: transparent; color: var(--color-ember); cursor: pointer; }
.controls button:hover, .controls button:focus-visible { background: var(--color-ember); color: var(--color-ink); }
.notice { color: var(--color-ember); font-size: .8rem; }
.welcome { display: grid; gap: var(--space-lg); }
.welcome h2 { color: var(--color-ember); }
.welcome .lede { max-width: 37ch; }
.collaborator-identity { margin: var(--space-md) 0 0; color: var(--color-muted); font-size: .75rem; overflow-wrap: anywhere; }
.text-button { margin-top: var(--space-2xl); padding-inline: 0; border: 0; background: transparent; color: var(--color-muted); cursor: pointer; }
.text-button:hover, .text-button:focus-visible { color: var(--color-ember); }
@media (prefers-reduced-motion: reduce) { .controls[data-rejected], .partner-loading__mark { animation: none; } }
@media (max-width: 48rem) { .controls { grid-template-columns: 1fr; } }