.ai-playground .ail-header{height:76px}.ai-playground .ail-header nav a{font-size:13px}.ai-playground .ail-header nav a[aria-current]{color:var(--optical-paper)}.ai-playground .ail-intro{align-items:center;gap:24px;padding:26px 0}.ai-playground .ail-intro>div{max-width:none}.ai-playground .ail-intro h1{font-size:32px;line-height:1.2}.ai-playground .ail-intro h1 span{color:var(--opt-bright)}.ai-playground .ail-intro p{margin:6px 0 0;font-size:14px}.ai-playground .ail-agent-button{flex-shrink:0;min-height:44px;font-size:13px}.ai-playground .ail-workspace-top{gap:16px;height:auto;min-height:56px;padding:6px 24px}.ai-playground .ail-workspace-top>div{gap:10px;font-size:13px}.ai-playground .ail-workspace-top small{font-size:12px}.ai-playground .ail-workspace-top button{min-height:44px;font-size:13px}.ai-playground .ail-workbench{grid-template-columns:248px minmax(0,1fr)}.ai-playground .ail-sidebar{padding:20px 14px 0}.ai-playground .ail-search{min-height:44px}.ai-playground .ail-search input{font:inherit;height:44px;font-size:14px}.ai-playground .ail-search button{flex-shrink:0;width:36px;height:44px}.ai-playground .ail-group-filter{margin:8px 4px;font-size:12px}.ai-playground .ail-group-filter select{max-width:155px;min-height:44px}.ai-playground .ail-component-list{max-height:580px}.ai-playground .ail-component-list h2{padding-block:18px 8px;font-size:12px}.ai-playground .ail-component-list h2 small{font-size:11px}.ai-playground .ail-component-list button{min-height:44px;padding:10px;font-size:14px;line-height:1.4}.ai-playground .ail-directory-count{font-size:12px}.ai-playground .ail-specimen-head{gap:16px;padding:22px 28px 18px}.ai-playground .ail-specimen-head>div:first-child{min-width:0;display:block}.ai-playground .ail-specimen-head h2{overflow-wrap:anywhere;font-size:25px}.ai-playground .ail-specimen-head .ail-specimen-category{margin-top:4px;font-size:12px;display:block}.ai-playground .ail-specimen-actions{flex-shrink:0;gap:4px}.ai-playground .ail-specimen-actions :is(button,a){justify-content:center;align-items:center;gap:7px;width:auto;min-width:44px;height:44px;padding:0 10px;font-size:12px;display:flex}.ai-playground .ail-specimen-actions [aria-pressed=true]{background:var(--opt-wash);color:var(--opt-accent)}.ai-playground .ail-source-toolbar{border-bottom:1px solid var(--opt-line);justify-content:space-between;align-items:center;gap:12px;padding:0 28px;display:flex}.ai-playground .ail-tabs{border:0;height:48px;padding:0}.ai-playground .ail-tabs button{height:48px;padding-inline:12px;font-size:13px}.ai-playground .ail-source-download{min-width:44px;min-height:44px;color:var(--opt-muted);justify-content:center;align-items:center;gap:8px;font-size:12px;display:flex}.ai-playground .ail-source-download:hover{color:var(--opt-accent)}.ai-playground .ail-stage{min-height:410px;padding:32px;overflow:clip}.ai-playground .ail-stage[hidden]{display:none}.ai-playground .ail-stage.is-code{height:470px;padding:0}.ai-playground .ail-stage pre{height:calc(100% - 65px);padding:24px;font-size:13px}.ai-playground .ail-code-bar{min-height:65px;padding:10px 24px;font-size:12px}.ai-playground .ail-code-bar button{min-height:44px;padding-inline:14px;font-size:12px}.ai-playground .ail-load-error{align-content:center;justify-items:start;gap:12px;max-width:420px;padding:32px;display:grid}.ai-playground .ail-load-error h3{font-size:20px}.ai-playground .ail-load-error button{min-height:44px;color:inherit;background:0 0;border:1px solid;border-radius:8px;align-items:center;gap:8px;padding:10px 16px;display:flex}.ai-playground .ail-play-hint{padding:14px 28px;font-size:13px}.ai-playground .ail-play-hint small{display:none}.ai-playground .ail-detail{gap:28px;padding:24px 28px}.ai-playground .ail-detail h3{margin-bottom:8px;font-size:12px}.ai-playground .ail-detail p{font-size:13px;line-height:1.65}.ai-playground .ail-component-bottom{flex-wrap:wrap;gap:16px;padding:12px 28px}.ai-playground .ail-component-bottom code{overflow-wrap:anywhere;font-size:12px}.ai-playground .ail-component-bottom button{min-height:44px;font-size:12px}.ai-playground .ail-principles{padding-block:60px}@media (max-width:1050px){.ai-playground .ail-workbench{grid-template-columns:222px minmax(0,1fr)}.ai-playground .ail-specimen-actions span{display:none}.ai-playground .ail-stage{padding:28px}}@media (max-width:740px){.ai-playground{padding-inline:16px}.ai-playground .ail-header{gap:4px;height:auto;min-height:108px;padding-block:16px 0}.ai-playground .ail-header nav{justify-content:space-between;gap:8px;width:100%}.ai-playground .ail-header nav a{font-size:12px}.ai-playground .ail-intro{align-items:flex-start;gap:18px;padding-block:24px}.ai-playground .ail-intro h1{font-size:28px}.ai-playground .ail-intro p{max-width:31ch;font-size:14px}.ai-playground .ail-agent-button{max-width:none;font-size:13px}.ai-playground .ail-workspace-top{padding-inline:16px}.ai-playground .ail-workspace-top small{display:none}.ai-playground .ail-workbench{grid-template-columns:minmax(0,1fr)}.ai-playground .ail-sidebar{grid-template-columns:minmax(0,1fr);padding:8px 12px}.ai-playground .ail-mobile-browse{min-height:44px;font-size:14px!important}.ai-playground .ail-group-filter{margin:0}.ai-playground .ail-group-filter select{max-width:none}.ai-playground .ail-component-list{max-height:310px}.ai-playground .ail-specimen-head{align-items:center;padding:20px 16px 14px}.ai-playground .ail-specimen-head h2{font-size:22px}.ai-playground .ail-specimen-actions{gap:0}.ai-playground .ail-specimen-actions :is(button,a){padding:0}.ai-playground .ail-source-toolbar{gap:4px;padding-inline:12px}.ai-playground .ail-tabs button{padding-inline:10px}.ai-playground .ail-source-download span{display:none}.ai-playground .ail-stage{min-height:390px;padding:24px 16px}.ai-playground .ail-code-bar{align-items:center;padding-inline:16px}.ai-playground .ail-code-bar>span{max-width:18ch}.ai-playground .ail-play-hint{padding:14px 16px}.ai-playground .ail-detail{grid-template-columns:minmax(0,1fr);gap:20px;padding:20px 16px}.ai-playground .ail-component-bottom{padding:12px 16px}.ai-playground .ail-intro>.ail-agent-button{display:none}.ai-playground .ail-specimen-head{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;display:grid}.ai-playground .ail-specimen-head>div:first-child{display:contents}.ai-playground .ail-specimen-head h2{grid-column:1/-1}.ai-playground .ail-specimen-head .ail-specimen-category{margin:0}}
