.playground-shell{width:min(1120px,100% - 2rem);margin:0 auto;padding:clamp(3rem,7vw,6rem) 0}.playground-panel{border:1px solid var(--line);background:#fff;border-radius:1.25rem;width:min(560px,100%);margin:5vh auto;padding:clamp(1.5rem,4vw,2.5rem);box-shadow:0 1.5rem 4rem #0e121a17}.playground-panel[hidden],[data-playground-content][hidden]{display:none}.playground-panel h1{margin:.3rem 0 .7rem}.playground-panel p{color:var(--muted)}.playground-panel-actions{flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1rem;display:flex}.playground-heading{justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem;display:flex}.playground-heading h1{margin:.25rem 0 .65rem}.playground-heading p{max-width:48rem;color:var(--muted);margin:0;font-size:1.08rem}.ai-tools-heading-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:1rem;display:flex}.account-text-button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-weight:700}.account-text-button:hover{color:var(--ink);text-decoration:underline}.ai-tools-nav{flex-wrap:wrap;gap:.65rem;margin:0 0 1.25rem;display:flex}.ai-tools-nav a{color:var(--ink);border:1px solid #d7d9de;border-radius:999px;align-items:center;gap:.45rem;padding:.6rem .8rem;font-weight:800;text-decoration:none;display:inline-flex}.ai-tools-nav a:hover{background:#f7f9fd;border-color:#8aa8df}.ai-tools-nav span{color:#285aa8;background:#eaf0fb;border-radius:999px;place-items:center;width:1.35rem;height:1.35rem;font-size:.72rem;display:inline-grid}.account-section{border:1px solid var(--line);background:#fff;border-radius:1.1rem;margin-top:1.25rem;padding:clamp(1.35rem,3vw,2rem);scroll-margin-top:1rem}.account-section-heading{justify-content:space-between;align-items:center;gap:1rem;display:flex}.account-section h2{margin:.25rem 0 0}.account-section-intro{max-width:54rem;color:var(--muted);margin:.65rem 0 1.25rem}.active-router-note{color:#334b73;background:#f1f5fc;border-radius:.7rem;margin-bottom:1rem;padding:.7rem .85rem;font-weight:700}.connection-test-note{color:var(--muted);margin:-.25rem 0 1rem;font-size:.9rem}.playground-link.is-disabled{opacity:.48;pointer-events:none}.connection-list{gap:1rem;display:grid}.connection-card{background:#faf9f5;border:1px solid #d7d9de;border-radius:.9rem;grid-template-columns:minmax(0,1fr) auto;gap:1.25rem;padding:1.25rem;transition:border-color .2s,box-shadow .2s;display:grid}.connection-card[data-active]{border-color:#2f6fe4;box-shadow:0 0 0 2px #2f6fe41a}.connection-main{align-items:start;gap:1rem;display:flex}.connection-logo{background:var(--ink);color:#fff;border-radius:.75rem;flex:0 0 3rem;place-items:center;width:3rem;height:3rem;font-weight:800;display:grid}.connection-logo-hf{color:#171717;background:#f1b928}.connection-logo-cf{background:#f48120}.connection-logo-merge{background:#6d4aff}.connection-title-line{flex-wrap:wrap;align-items:center;gap:.65rem;display:flex}.connection-title-line h3{margin:0}.connection-main p{color:var(--muted);margin:.35rem 0 0}.connection-main .connection-usage{color:#425476;font-size:.9rem}.connection-state{color:#71510a;background:#f6e7b8;border-radius:999px;padding:.35rem .65rem;font-size:.78rem;font-weight:750;display:inline-flex}.connection-state[data-connected]{color:#465466;background:#e9edf2}.connection-state[data-active-state],.connection-active-indicator{color:#21603a;background:#dff2e6}.connection-state[data-needs-attention]{color:#8a341f;background:#f8e1d6}.connection-actions{flex-direction:column;align-items:flex-end;gap:.7rem;display:flex}.connection-actions [hidden],.playground-result-activation [hidden]{display:none}.connection-active-indicator{border-radius:.7rem;align-items:center;gap:.35rem;padding:.55rem .8rem;font-weight:800;display:inline-flex}.connection-actions a{color:var(--clarity);font-weight:700}.connection-advanced,.connection-learning{border-top:1px solid var(--line);grid-column:1/-1;padding-top:1rem}.connection-advanced summary,.connection-learning summary{color:var(--clarity);cursor:pointer;font-weight:750}.connection-advanced form{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:.75rem;margin-top:1rem;display:grid}.connection-advanced label{color:var(--ink);gap:.4rem;font-weight:700;display:grid}.connection-advanced input{box-sizing:border-box;width:100%;min-height:3rem;color:var(--ink);font:inherit;background:#fff;border:1px solid #cfd2d8;border-radius:.7rem;padding:.65rem .8rem}.connection-advanced p,.connection-learning p,.connection-message{color:var(--muted);margin:.65rem 0 0;font-size:.9rem}.connection-safety-note{color:var(--ink);background:#fff8e6;border:1px solid #ead59a;border-radius:.75rem;margin-top:1rem;padding:.9rem 1rem}.connection-safety-note strong{margin-bottom:.35rem;display:block}.connection-safety-note ul{color:var(--muted);margin:0;padding-left:1.15rem}.connection-safety-note li+li{margin-top:.3rem}.connection-learning a{color:var(--clarity);margin-top:.65rem;font-weight:700;display:inline-block}.connection-learning-links{flex-wrap:wrap;gap:1rem;display:flex}.connection-message:empty{display:none}.connection-facts{flex-wrap:wrap;gap:.55rem;margin-top:1rem;display:flex}.connection-facts span{color:#334b73;background:#f1f5fc;border-radius:999px;padding:.4rem .65rem;font-size:.78rem;font-weight:700}.playground-section-heading{padding:clamp(2.5rem,6vw,4.5rem) 0 1rem;scroll-margin-top:1rem}.playground-section-heading h2{margin:.2rem 0 .5rem;font-size:clamp(2rem,5vw,3.3rem)}.playground-section-heading p:last-child{max-width:54rem;color:var(--muted);margin:0}.playground-workspace,.playground-summary,.playground-learning{border:1px solid var(--line);background:#fff;border-radius:1.1rem;padding:clamp(1.25rem,3vw,2rem)}.playground-cost-note{color:#334b73;background:#f1f5fc;border-radius:.8rem;flex-wrap:wrap;align-items:baseline;gap:.45rem;margin-bottom:1.3rem;padding:.8rem 1rem;display:flex}.playground-prompt-block{gap:.55rem;display:grid}.playground-label-line{justify-content:space-between;gap:1rem;font-weight:800;display:flex}.playground-label-line span{color:var(--muted);font-size:.88rem;font-weight:700}.playground-prompt-block textarea{box-sizing:border-box;resize:vertical;width:100%;min-height:8rem;color:var(--ink);font:inherit;background:#fff;border:1px solid #bfc4cd;border-radius:.85rem;padding:.9rem 1rem;font-size:1.05rem;line-height:1.55}.playground-prompt-block textarea:focus{border-color:#2f6fe4;outline:3px solid #2f6fe42e}.playground-help{color:var(--muted);margin:0;font-size:.9rem}.playground-example{background:#f7f9fd;border:1px solid #d8dfeb;border-radius:.75rem;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem .9rem;display:flex}.playground-example p{color:#34435b;max-width:48rem;margin:.2rem 0 0;font-size:.9rem;line-height:1.45}.playground-example-button{color:#1d57ba;font:inherit;cursor:pointer;background:#fff;border:1px solid #2f6fe4;border-radius:.55rem;flex:none;padding:.55rem .75rem;font-size:.85rem;font-weight:800}.playground-example-button:hover{background:#edf3ff}.playground-router-picker{border:0;margin:1.5rem 0 0;padding:0}.playground-router-picker legend{margin-bottom:.7rem;font-weight:800}.playground-router-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;display:grid}.playground-router-grid label{cursor:not-allowed;opacity:.56;background:#f8f7f3;border:1px solid #d7d9de;border-radius:.8rem;align-items:center;gap:.7rem;min-height:4rem;padding:.7rem .8rem;display:flex}.playground-router-grid label[data-connected]{cursor:pointer;opacity:1}.playground-router-grid label[data-active]{border-color:#2f6fe4;box-shadow:0 0 0 2px #2f6fe41a}.playground-router-grid input{accent-color:#2f6fe4;width:1.05rem;height:1.05rem}.playground-router-grid span{gap:.1rem;display:grid}.playground-router-grid small{color:var(--muted)}.playground-actions{flex-wrap:wrap;gap:.75rem;margin-top:1.25rem;display:flex}.playground-actions .button:disabled{cursor:not-allowed;opacity:.48}.playground-status{min-height:1.4rem;color:var(--muted);margin:.8rem 0 0;font-weight:700}.playground-status[data-tone=error]{color:#9b321f}.playground-status[data-tone=success]{color:#21603a}.playground-summary{background:#f8fafc;margin-top:1rem;overflow:hidden}.playground-summary[hidden]{display:none}.playground-summary-heading{justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem;display:flex}.playground-summary-heading h2{margin:0}.playground-summary-heading p{max-width:42rem;color:var(--muted);margin:0;font-size:.9rem}.playground-summary-warning{color:#69480b;background:#fff8e8;border:1px solid #e4b34c;border-left:.3rem solid #c98516;border-radius:.75rem;flex-wrap:wrap;gap:.25rem .45rem;margin:0 0 1rem;padding:.9rem 1rem;display:flex}.playground-summary-warning strong{color:#4f3505}.playground-table-wrap{background:#fff;border:1px solid #d9dee7;border-radius:.8rem;overflow-x:auto}.playground-comparison-table{border-collapse:collapse;text-align:left;width:100%;min-width:700px}.playground-comparison-table th,.playground-comparison-table td{vertical-align:top;border-bottom:1px solid #e2e5ea;padding:.85rem 1rem}.playground-comparison-table thead th{color:var(--ink);background:#eef2f8}.playground-comparison-table tbody tr:last-child th,.playground-comparison-table tbody tr:last-child td{border-bottom:0}.playground-comparison-table tbody th{background:#fafbfc;width:24%}.playground-comparison-table tbody tr.playground-table-section th{width:auto;color:var(--ink);background:#e9eef7;border-top:1px solid #cbd5e1;border-bottom:1px solid #cbd5e1;padding:.7rem 1rem}.playground-section-label{letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;display:block}.playground-section-help{color:var(--muted);letter-spacing:normal;text-transform:none;margin-top:.2rem;font-size:.76rem;font-weight:600;display:block}.playground-metric-label{font-size:.92rem;display:block}.playground-metric-help{color:var(--muted);margin-top:.18rem;font-size:.72rem;font-weight:600;line-height:1.35;display:block}.playground-router-column{gap:.2rem;min-width:13rem;display:grid}.playground-router-column small{color:var(--muted);overflow-wrap:anywhere;font-weight:600}.playground-router-column a{color:inherit;text-underline-offset:.16em;text-decoration-color:#94a8cc}.playground-router-identity{align-items:center;gap:.55rem;display:flex}.playground-brand-mark{color:#fff;letter-spacing:-.02em;background:#141820;border-radius:.45rem;flex:none;place-items:center;width:1.8rem;height:1.8rem;font-size:.65rem;font-weight:900;display:inline-grid}.playground-table-value{overflow-wrap:anywhere;flex-wrap:wrap;align-items:center;gap:.45rem;font-weight:750;display:flex}.playground-comparison-table td.is-winner{background:#f1faf4;box-shadow:inset 3px 0 #2f8f55}.playground-comparison-table td.is-loser{background:#fff7f5;box-shadow:inset 3px 0 #c75a43}.playground-marker{white-space:nowrap;border-radius:999px;align-items:center;padding:.22rem .45rem;font-size:.69rem;font-weight:850;display:inline-flex}.playground-marker.is-winner{color:#21603a;background:#dff2e6}.playground-marker.is-loser{color:#8a341f;background:#f7dfd9}.playground-unavailable{color:var(--muted);font-weight:650}.playground-summary-note{color:var(--muted);margin:.85rem 0 0;font-size:.86rem}.playground-results{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem;display:grid}.playground-result{background:#fff;border:1px solid #d7d9de;border-radius:1rem;min-width:0;padding:1.25rem}.playground-result.is-preferred{border-color:#2f8f55;box-shadow:0 0 0 3px #2f8f551f}.playground-result.is-error{background:#fffaf8;border-color:#e1b5a8}.playground-result-heading{justify-content:space-between;align-items:start;gap:1rem;display:flex}.playground-result-heading h2{overflow-wrap:anywhere;margin:.15rem 0 0;font-size:1.3rem}.playground-result-model{color:var(--muted);overflow-wrap:anywhere;margin:.25rem 0 0;font-size:.82rem;font-weight:700}.playground-result-state{border-radius:999px;flex:none;padding:.3rem .55rem;font-size:.75rem;font-weight:800}.playground-result-state.is-success{color:#21603a;background:#dff2e6}.playground-result-state.is-error{color:#8a341f;background:#f8e1d6}.playground-answer{min-height:5rem;color:var(--ink);white-space:pre-wrap;margin:1rem 0;font-size:1.02rem;line-height:1.6}.playground-result-error{color:#8a341f;margin:1rem 0 .4rem;font-weight:750}.playground-result-help{color:var(--muted);margin:.5rem 0;font-size:.85rem}.playground-detail{background:#f5f3ed;border-radius:.65rem;min-width:0;padding:.65rem .7rem}.playground-detail dt{color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-size:.72rem;font-weight:800}.playground-detail dd{overflow-wrap:anywhere;color:var(--ink);margin:.22rem 0 0;font-weight:750}.playground-result-details{border-top:1px solid var(--line);margin-top:.9rem;padding-top:.8rem}.playground-result-details summary{color:var(--clarity);cursor:pointer;font-weight:750}.playground-detail-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:.75rem 0 0;display:grid}.playground-preference{color:var(--clarity);cursor:pointer;align-items:center;gap:.45rem;margin-top:.9rem;font-weight:800;display:flex}.playground-preference input{accent-color:#2f6fe4}.playground-result-activation{justify-content:flex-end;align-items:center;margin-top:.9rem;display:flex}.playground-resources{border:1px solid var(--line);background:#fff;border-radius:1.1rem;margin-top:1rem;padding:clamp(1.25rem,3vw,2rem)}.playground-resources-heading{justify-content:space-between;align-items:end;gap:2rem;display:flex}.playground-resources-heading h2{margin:.2rem 0 0}.playground-resources-heading>p{max-width:25rem;color:var(--muted);margin:0;font-size:.9rem}.playground-resource-groups{grid-template-columns:1.25fr 1fr;gap:2rem;margin-top:1.35rem;display:grid}.playground-resource-groups h3{margin:0 0 .65rem;font-size:.95rem}.playground-resource-links{gap:.55rem;display:grid}.playground-resource-links>a{color:var(--ink);border:1px solid #dfe3e9;border-radius:.7rem;align-items:center;gap:.75rem;padding:.7rem .8rem;text-decoration:none;display:flex}.playground-resource-links>a:hover{background:#f7f9fd;border-color:#8aa8df}.playground-resource-links>a>span:last-child{gap:.08rem;display:grid}.playground-resource-links small{color:var(--muted)}.playground-resource-mark{color:#285aa8;background:#eaf0fb;border-radius:.55rem;flex:none;place-items:center;width:2rem;height:2rem;font-size:.68rem;font-weight:900;display:inline-grid}.playground-official-models{border-top:1px solid var(--line);margin-top:1rem;padding-top:.9rem}.playground-official-models summary{color:var(--clarity);cursor:pointer;font-weight:800}.playground-official-models>div{flex-wrap:wrap;gap:.55rem;margin-top:.75rem;display:flex}.playground-official-models a{color:var(--ink);border:1px solid #dfe3e9;border-radius:999px;align-items:center;gap:.4rem;padding:.45rem .6rem;font-size:.85rem;font-weight:750;text-decoration:none;display:inline-flex}.playground-official-models a span{color:#fff;background:#141820;border-radius:999px;place-items:center;min-width:1.35rem;height:1.35rem;padding:0 .18rem;font-size:.57rem;font-weight:900;display:inline-grid}.playground-learning{background:#fff9e8;margin-top:1rem}.playground-learning h2{margin:.2rem 0 .45rem}.playground-learning p:last-child{max-width:58rem;color:var(--muted);margin:0}@media (width<=820px){.playground-heading,.account-section-heading{flex-direction:column;align-items:flex-start}.ai-tools-heading-actions{justify-content:flex-start}.connection-card{grid-template-columns:1fr}.connection-actions{align-items:stretch}.connection-advanced,.connection-learning{grid-column:1}.connection-advanced form,.playground-router-grid,.playground-results,.playground-resource-groups{grid-template-columns:1fr}}@media (width<=520px){.playground-example,.playground-summary-heading,.playground-resources-heading{flex-direction:column;align-items:flex-start}.playground-actions .button,.playground-example-button{width:100%}.playground-detail-list{grid-template-columns:1fr}}
