body:has(.playground-page)>.grain,body:has(.playground-page)>.vignette{display:none}body:has(.playground-page){background:var(--bg)}.playground-page{--pg-1:4px;--pg-2:8px;--pg-4:16px;--pg-6:24px;--pg-8:32px;--pg-12:48px;--pg-16:64px;height:100dvh;min-height:0;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:16px;font-weight:400;line-height:1.5;letter-spacing:-.01em}.playground-footer-inner{width:min(1280px,calc(100vw - 40px));height:100%;margin:0 auto}.playground-main{display:flex;flex-direction:column}.pg-stage,.playground-main{min-height:0;overflow:hidden}.pg-stage{position:relative;flex:1}.pg-stage-content{position:relative;z-index:3;width:min(1180px,calc(100vw - 80px));margin:0 auto;padding-top:clamp(28px,7vh,84px);display:flex;flex-direction:column;gap:var(--pg-4);pointer-events:none}.pg-stage-content :is(form,a,button,textarea,input){pointer-events:auto}.pg-eyebrow{display:flex;align-items:baseline;gap:8px;color:var(--accent-hover);font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase}.pg-eyebrow i{color:var(--text-faint,#5d5768);font-style:normal}.pg-stage-content .playground-view--prompt{width:100%;padding:0;margin:0;animation:none}.pg-stage-content .playground-title{font-size:clamp(30px,4.4vw,60px);line-height:1.03;letter-spacing:-.03em;margin-bottom:var(--pg-4);text-wrap:balance}@media (max-width:899px){.pg-stage-content{width:calc(100vw - 40px);padding-top:var(--pg-6)}}.playground-view{width:min(960px,calc(100vw - 40px));margin:0 auto;animation:playground-view-in .16s var(--ease-out) both}@keyframes playground-view-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes playground-view-in-reduced{0%{opacity:0}to{opacity:1}}.playground-view--prompt{padding-top:var(--pg-8);padding-bottom:var(--pg-6)}.playground-view--scenarios{width:min(920px,calc(100vw - 40px));padding-block:var(--pg-16)}.playground-title{color:var(--text);font-size:clamp(36px,4vw,52px);font-weight:500;line-height:1.08;letter-spacing:-.03em;text-wrap:balance}.playground-composer{margin-top:var(--pg-8)}.playground-composer-frame{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border:1px solid var(--border);border-radius:8px;background:var(--bg-code);transition:border-color .14s var(--ease-out)}.playground-composer-frame:focus-within{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}.playground-composer textarea{width:100%;min-height:64px;max-height:96px;padding:var(--pg-4) var(--pg-6);overflow-y:auto;resize:none;border:0;outline:0;background:transparent;color:var(--text);font:inherit;font-size:16px;font-weight:400;line-height:1.5;letter-spacing:-.01em}.playground-composer textarea::placeholder{color:var(--text-muted);opacity:1}.playground-composer textarea:disabled{color:var(--text-muted)}.playground-composer button{min-width:168px;min-height:48px;margin:var(--pg-2);padding:var(--pg-4) var(--pg-6);border-radius:8px;background:var(--accent);color:var(--accent-ink);font-size:16px;font-weight:500;line-height:1.5;letter-spacing:-.01em;transition:background-color .14s var(--ease-out)}.playground-composer button:hover:not(:disabled){background:var(--accent-hover)}.playground-composer button:disabled{cursor:not-allowed;background:var(--border);color:var(--text-dim)}.playground-support-row{margin-top:var(--pg-4);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--pg-8);color:var(--text-muted);font-size:14px;line-height:1.45;letter-spacing:0}.playground-support-row p{max-width:640px}.playground-support-row a{min-height:44px;display:inline-flex;align-items:flex-start;flex:none;color:var(--text);font-weight:500;transition:color .14s var(--ease-out)}.playground-support-row a:hover{color:var(--accent-hover)}.playground-error{margin-top:var(--pg-4);color:var(--text);font-size:14px;line-height:1.45;letter-spacing:0}.playground-eyebrow{margin-bottom:var(--pg-4);color:var(--accent);font-size:12px;font-weight:500;line-height:1;letter-spacing:.16em}.playground-intro{margin-top:var(--pg-4);color:var(--text-muted);font-size:16px;line-height:1.5}.playground-scenario-list{min-width:0;margin-top:var(--pg-8);border:0;border-top:1px solid var(--hairline-mid)}.playground-scenario{position:relative;min-height:72px;display:grid;grid-template-columns:24px minmax(280px,.9fr) 1.1fr 24px;align-items:center;gap:var(--pg-4);padding:var(--pg-4) var(--pg-6);border-bottom:1px solid var(--hairline-mid);cursor:pointer}.playground-scenario:has(input:checked){background:var(--accent-08);box-shadow:inset 2px 0 0 var(--accent)}.playground-scenario input{width:16px;height:16px;margin:0;accent-color:var(--accent)}.playground-scenario-title{color:var(--text);font-size:16px;font-weight:500;line-height:1.5}.playground-scenario-description{color:var(--text-muted);font-size:14px;line-height:1.45;letter-spacing:0}.playground-scenario-arrow{color:var(--text-dim);font-size:14px;text-align:right}.playground-scenario-actions{margin-top:var(--pg-6);display:flex;align-items:center;justify-content:space-between;gap:var(--pg-6)}.playground-scenario-actions button{min-width:220px;min-height:48px;padding:var(--pg-4) var(--pg-6);border-radius:8px;background:var(--accent);color:var(--accent-ink);font-size:16px;font-weight:500;line-height:1.5;letter-spacing:-.01em;transition:background-color .14s var(--ease-out)}.playground-scenario-actions button:hover:not(:disabled){background:var(--accent-hover)}.playground-scenario-actions button:disabled{cursor:not-allowed;background:var(--border);color:var(--text-dim)}.playground-scenario-actions a{min-height:44px;display:inline-flex;align-items:center;color:var(--text-muted);font-size:14px;font-weight:500;line-height:1.45;letter-spacing:0;transition:color .14s var(--ease-out)}.playground-scenario-actions a:hover{color:var(--text)}.playground-footer{min-height:48px;border-top:1px solid var(--hairline-mid);color:var(--text-muted);font-size:14px;line-height:1.45;letter-spacing:0}.playground-footer-inner{display:flex;align-items:center}.playground-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width:1023px){.playground-view{width:min(720px,calc(100vw - 64px))}.playground-view--scenarios{width:calc(100vw - 64px)}}@media (max-width:767px){.playground-page{grid-template-rows:auto minmax(0,1fr) auto}.playground-footer-inner,.playground-view,.playground-view--scenarios{width:calc(100vw - 40px)}.playground-view{gap:var(--pg-4)}.playground-view--prompt,.playground-view--scenarios{padding-block:var(--pg-16)}.playground-composer-frame{grid-template-columns:1fr}.playground-composer textarea{min-height:64px;padding:var(--pg-4)}.playground-composer button{width:calc(100% - 16px);min-height:48px}.playground-support-row{flex-direction:column;gap:var(--pg-4)}.playground-scenario{grid-template-columns:24px 1fr 24px;align-items:start;min-height:72px;padding:var(--pg-4)}.playground-scenario-description,.playground-scenario-title{grid-column:2}.playground-scenario-description{margin-top:calc(var(--pg-2) * -1)}.playground-scenario-arrow{grid-column:3;grid-row:1/span 2;align-self:center}.playground-scenario-actions{align-items:stretch;flex-direction:column;gap:var(--pg-4)}.playground-scenario-actions button{width:100%}}@media (max-width:479px){.playground-page{grid-template-rows:auto minmax(0,1fr) auto}.playground-scenario{padding-inline:var(--pg-2)}}@media (prefers-reduced-motion:reduce){.playground-page *,.playground-page :after,.playground-page :before{scroll-behavior:auto!important;transition-duration:.1ms!important;animation-duration:.1ms!important;animation-iteration-count:1!important}.playground-view{animation-name:playground-view-in-reduced}}