@font-face{font-family:Fraunces;src:url('/fonts/fraunces-opsz.woff2') format('woff2');font-display:swap}
@font-face{font-family:Instrument;src:url('/fonts/instrument-serif-italic.woff2') format('woff2');font-style:italic;font-display:swap}
@font-face{font-family:Courier;src:url('/fonts/courier-prime.woff2') format('woff2');font-display:swap}
:root{color-scheme:light;--plaster:#f3eee4;--ink:#292820;--sage:#52654b;--line:#d6cebe}
*{box-sizing:border-box}body{margin:0;background:var(--plaster);color:var(--ink);font-family:Fraunces,Georgia,serif}main{max-width:64rem;margin:auto;padding:clamp(1.25rem,4vw,3rem)}header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;border-bottom:1px solid var(--line);padding-bottom:1rem}.wordmark{font-size:1.5rem}.caption,footer,label,button,#status,#error,#recording{font-family:Courier,monospace}.caption{font-size:.8rem}h1{font-size:clamp(3rem,8vw,5.5rem);font-weight:400;letter-spacing:-.04em;line-height:1.05;margin:3rem 0 1rem}.intro{font-family:Instrument,Georgia,serif;font-style:italic;font-size:1.65rem;margin-bottom:2rem}form{max-width:28rem;display:grid;gap:.7rem}input{font:1.25rem Fraunces,Georgia,serif;border:1px solid var(--line);border-radius:.4rem;background:#fcfaf6;padding:.8rem;width:100%}button{font-size:1rem;min-height:3rem;padding:.8rem 1.2rem;background:var(--sage);color:#fff;border:1px solid var(--sage);border-radius:.4rem;cursor:pointer}button:disabled{opacity:.55;cursor:wait}button:focus-visible,input:focus-visible{outline:3px solid #a28145;outline-offset:3px}.quiet{color:var(--ink);background:transparent;border-color:var(--line);margin-top:1rem}#error{color:#863d31}#recording{border:1px solid #b98c43;background:#f8e5bc;padding:1rem;margin:1.5rem 0}#tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1rem;margin:1.5rem 0}.tile{background:#e7e1d4;border:1px solid var(--line);border-radius:.6rem;overflow:hidden}.tile p{padding:.6rem 1rem;margin:0}.tile video{width:100%;max-height:26rem;display:block;object-fit:cover;background:#292820}.tile audio{display:none}#controls{display:flex;gap:.7rem;flex-wrap:wrap}footer{font-size:.8rem;color:#655f52;margin-top:4rem;line-height:1.5}[hidden]{display:none!important}@media(max-width:32rem){header{align-items:flex-start;flex-direction:column;gap:.4rem}h1{margin-top:2rem}#controls button{flex:1}}
