:root{--ink:#535d48;--muted:#76796e;--paper:#faf8f2;--line:#dddccf;--pink:#ebd5d0;font-family:Arial,sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}header,footer{max-width:1260px;margin:auto;padding:26px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{text-decoration:none;letter-spacing:.2em;font-size:13px}nav{display:flex;gap:24px;font-size:13px}main{max-width:1260px;margin:30px auto 70px;padding:0 32px}.intro{max-width:850px;margin:50px 0 38px}.eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}h1,h2,h3{font-family:Georgia,serif;font-weight:400}h1{font-size:clamp(40px,5vw,66px);line-height:1.05;margin:20px 0}h2{font-size:28px;margin:0 0 22px}p,li{line-height:1.7}p{color:var(--muted)}.studio{display:grid;grid-template-columns:360px minmax(0,1fr);gap:28px;align-items:start}.panel{border:1px solid var(--line);border-radius:16px;padding:26px;background:#fffdf8}label{display:block;font-size:12px;margin-bottom:8px}.field{margin:0 0 20px}input,select,textarea,button{font:inherit}input:not([type=checkbox]),select,textarea{width:100%;border:1px solid var(--line);border-radius:7px;padding:12px;background:transparent;color:var(--ink);min-width:0}input[type=color]{height:46px;padding:5px}textarea{font:12px/1.6 monospace;resize:vertical}.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.check{display:flex;align-items:center;gap:9px;margin-bottom:15px}.check label{margin:0}.check input{accent-color:var(--ink);width:17px;height:17px}button,.button{border:0;background:var(--ink);color:white;border-radius:7px;padding:13px 17px;cursor:pointer;text-decoration:none;font-size:13px;display:inline-block}button.secondary{background:#f0eee5;color:var(--ink)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b38c80;outline-offset:3px}.previewbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.badge{font-size:10px;letter-spacing:.1em;border:1px solid var(--line);border-radius:20px;padding:7px 10px}.stage{margin:22px 0 28px;border-radius:12px;overflow:hidden;background-color:#f3e4df;background-image:linear-gradient(45deg,#ffffff26 25%,transparent 25%),linear-gradient(-45deg,#ffffff26 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ffffff26 75%),linear-gradient(-45deg,transparent 75%,#ffffff26 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}iframe{width:100%;height:340px;border:0;display:block;background:transparent}.note{font-size:12px;line-height:1.65}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.outputs{margin-top:24px;border-top:1px solid var(--line);padding-top:24px}.outputs .field{margin-bottom:14px}.status{min-height:24px;font-size:13px}#status{color:#994d3b}.fine{font-size:11px;color:var(--muted)}footer{border-top:1px solid var(--line);font-size:12px;flex-wrap:wrap}.prose{max-width:780px}.prose h2{margin-top:34px}.prose h1{font-size:48px}.callout{border-left:3px solid #c7aaa0;padding:12px 18px;background:#f4eee7}.steps{padding-left:22px}.steps li{margin-bottom:12px}@media(max-width:850px){.studio{grid-template-columns:1fr}.intro{margin-top:28px}.panel{padding:22px}header,footer{padding:22px}main{padding:0 22px}nav{gap:15px}h1{font-size:44px}}@media(max-width:400px){header{align-items:flex-start;flex-direction:column}.row{grid-template-columns:1fr}.previewbar{align-items:flex-start;flex-direction:column}}