.cs-play{grid-template-columns:minmax(0,1fr) minmax(360px,440px);align-items:start;gap:40px;margin-top:40px;display:grid}.cs-play-main{grid-template-columns:minmax(0,1fr);gap:32px;min-width:0;display:grid}.cs-play-examples h2{color:var(--ink-2);font-size:15px;font-weight:600;font-stretch:92%}.cs-play-example-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px;display:grid}.cs-play-example-list button{text-align:left;background:var(--card);border-radius:var(--r-card);box-shadow:inset 0 0 0 1px var(--rule);transition:box-shadow var(--d-quick);align-content:start;gap:1px;padding:12px 16px 13px;display:grid}.cs-play-example-list button:hover{box-shadow:inset 0 0 0 1.5px var(--ink-3)}.cs-play-example-list button[aria-pressed=true]{box-shadow:inset 0 0 0 1.5px var(--ink)}.cs-play-example-kind{font-family:var(--font-mono);color:var(--ink-3);font-size:12px;font-stretch:80%}.cs-play-example-name{color:var(--ink);font-size:17px;font-weight:700;font-stretch:104%;line-height:1.25}.cs-play-example-by{color:var(--ink-3);font-size:14px}.cs-play-tabs{scrollbar-width:none;overflow-x:auto}.cs-play-card{background:var(--card);border-radius:0 var(--r-card) var(--r-card) var(--r-card);padding:28px 32px 32px}.cs-play-form{gap:4px;display:grid}.cs-play-form .cs-fill-line input{font-size:18px}.cs-play-form .cs-fill-line input[aria-invalid=true]{border-bottom-color:var(--red-ink)}.cs-play-cost{color:var(--ink-3);margin-top:10px;font-size:15px}.cs-play-option{grid-template-columns:72px minmax(0,360px);justify-content:start;align-items:center;gap:6px 14px;margin-top:16px;display:grid}.cs-play-option label{color:var(--ink-2);font-size:15px;font-weight:600;font-stretch:90%}.cs-play-option p{color:var(--ink-3);grid-column:2;font-size:14px;line-height:1.5}.cs-play-option-wide{grid-template-columns:72px minmax(0,1fr);justify-content:stretch;align-items:start}.cs-play-option-wide label{padding-top:10px}.cs-play-option select,.cs-play-option input,.cs-play-option textarea{background:var(--card);width:100%;min-height:44px;color:var(--ink);border:1.5px solid var(--ink-3);border-radius:var(--r-control);padding:8px 12px;font-size:16px}.cs-play-option textarea{min-height:180px;font-family:var(--font-mono);resize:vertical;font-size:13px;font-stretch:85%;line-height:1.6}.cs-play-option :is(select,input,textarea):focus-visible{outline:2px solid var(--action);outline-offset:1px;border-color:var(--action)}.cs-play-option :is(input,textarea)[aria-invalid=true]{border-color:var(--red-ink)}.cs-play-mode{border:0;min-width:0;margin:16px 0 0;padding:0}.cs-play-mode legend{float:left;width:72px;color:var(--ink-2);margin-right:14px;padding-top:9px;font-size:15px;font-weight:600;font-stretch:90%}.cs-play-segments{flex-wrap:wrap;gap:6px;display:flex}.cs-play-segments label{display:flex;position:relative}.cs-play-segments input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.cs-play-segments span{border-radius:var(--r-control);min-height:40px;box-shadow:inset 0 0 0 1.5px var(--rule);color:var(--ink-2);transition:box-shadow var(--d-quick),background var(--d-quick);align-items:center;padding:0 14px;font-size:15px;font-weight:600;display:flex}.cs-play-segments label:hover span{box-shadow:inset 0 0 0 1.5px var(--ink-3)}.cs-play-segments input:checked+span{background:var(--ground);box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink)}.cs-play-segments input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}.cs-play-mode>.cs-play-option{clear:both}.cs-play-status:not(:empty){margin-top:20px}.cs-play-running{border-top:var(--head-rule);padding:16px 0 4px}.cs-play-running p:first-of-type{align-items:baseline;gap:10px;font-weight:600;display:flex}.cs-play-bar{background:linear-gradient(90deg, var(--action) 0 30%, transparent 30%) 0 0 / 200% 100% no-repeat;height:2px;margin:-17px 0 16px;animation:1.4s linear infinite cs-play-bar;display:block}@keyframes cs-play-bar{0%{background-position:150% 0}to{background-position:-50% 0}}.cs-play-alert{border-top:var(--head-rule);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 20px;padding:16px 0 4px;display:flex}.cs-play-alert .cs-command-error{max-width:60ch;margin:0}.cs-play-result{border-top:var(--head-rule);transition:opacity var(--d-state);margin-top:28px;padding-top:20px}.cs-play-result-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;margin-bottom:16px;display:flex}.cs-play-example-note{color:var(--ink-3);font-size:14px}.cs-play-exports{flex-wrap:wrap;align-items:center;gap:4px;margin-left:auto;display:flex}.cs-play-exports>span{color:var(--ink-3);margin:0 4px 0 10px;font-size:14px}.cs-play-exports button{border-radius:var(--r-control);min-height:34px;box-shadow:inset 0 0 0 1px var(--rule);color:var(--ink-2);transition:background var(--d-quick);align-items:center;gap:6px;padding:0 10px;font-size:14px;font-weight:600;display:inline-flex}.cs-play-exports button:hover{background:var(--ground);color:var(--ink)}.cs-play-post{border-bottom:var(--head-rule);gap:6px;padding-bottom:18px;display:grid}.cs-play-post-meta{flex-wrap:wrap;gap:6px;display:flex}.cs-tag-quiet{background:var(--ground-2)}.cs-play-post h2{letter-spacing:-.01em;font-size:21px;font-weight:700;font-stretch:106%;line-height:1.25}.cs-play-post h2 a{text-decoration:none}@media (hover:hover){.cs-play-post h2 a:hover{text-decoration:underline;text-decoration-thickness:1.5px}}.cs-play-post-by{color:var(--ink-2);font-size:15px}.cs-play-post-by a{text-decoration:underline;-webkit-text-decoration-color:var(--rule-blue);text-decoration-color:var(--rule-blue);font-weight:600;text-decoration-thickness:2px}.cs-play-post-by a:hover{color:var(--action);-webkit-text-decoration-color:var(--action);text-decoration-color:var(--action)}.cs-play-post-by .cs-data{font-size:12.5px}.cs-play-note{color:var(--ink-3);margin-top:16px;font-size:14px;line-height:1.5}.cs-play-warning{border-left:3px solid var(--yellow);background:var(--ground);color:var(--ink-2);margin-top:8px;padding:8px 12px;font-size:14.5px}.cs-play-empty{color:var(--ink-3);font-size:15px}.cs-play-idle{border-top:var(--head-rule);margin-top:28px;padding:28px 0 4px}.cs-play-time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-3);white-space:nowrap;font-size:12px;font-stretch:80%;text-decoration:none}.cs-play-time:hover{color:var(--action);text-decoration:underline}.cs-play-section{margin-top:24px}.cs-play-section h3{align-items:baseline;gap:12px;margin-bottom:10px;padding-left:66px;font-size:17px;font-weight:700;line-height:1.3;display:flex}.cs-play-more{margin:20px 0 0 66px}.cs-play-section>p,.cs-play-screen li{max-width:84ch;color:var(--ink);grid-template-columns:52px minmax(0,1fr);gap:14px;margin-top:12px;font-size:16.5px;line-height:1.7;display:grid}.cs-play-section>p .cs-play-time,.cs-play-screen .cs-play-time,.cs-play-screen .cs-data{text-align:right;padding-top:.45em}.cs-play-screen{margin:0;padding:0;list-style:none}.cs-play-fields dl{margin-top:4px}.cs-play-field{border-bottom:1px solid var(--rule);grid-template-columns:minmax(140px,190px) minmax(0,1fr);gap:6px 24px;padding:16px 0;display:grid}.cs-play-field dt{color:var(--ink);font-size:15px;font-weight:600}.cs-play-field dd{min-width:0;margin:0}.cs-play-field dd>ul{gap:14px;margin:0;padding:0;list-style:none;display:grid}.cs-play-value{color:var(--ink);font-size:16px;line-height:1.55}.cs-play-value-more{color:var(--ink-3);margin-top:2px;font-size:14.5px;line-height:1.5}.cs-play-value-more span+span:before{content:" · "}.cs-play-quotes{gap:6px;margin:8px 0 0;padding:0;list-style:none;display:grid}.cs-play-quote{border-left:2px solid var(--red);color:var(--ink-2);padding-left:12px;font-size:14.5px;line-height:1.5}.cs-play-quote q{quotes:"“" "”"}.cs-play-quote .cs-play-time{color:var(--red-ink)}.cs-play-quote .cs-data{color:var(--ink-3)}.cs-play-posts ol{margin:8px 0 0;padding:0;list-style:none}.cs-play-posts li{border-bottom:1px solid var(--rule);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 20px;padding:14px 0;display:grid}.cs-play-posts li>div{gap:2px;min-width:0;display:grid}.cs-play-posts li a{overflow-wrap:anywhere;font-size:16px;font-weight:600;line-height:1.4;text-decoration:none}.cs-play-posts li a:hover{color:var(--action);text-decoration:underline}.cs-play-get{min-height:40px;padding-inline:14px;font-size:15px}.cs-play-code{grid-template-columns:minmax(0,1fr);gap:12px;min-width:0;display:grid;position:sticky;top:84px}.cs-play-code h2{font-size:21px;font-weight:700;font-stretch:106%;line-height:1.25}.cs-play-code>p{color:var(--ink-2);font-size:15px;line-height:1.5}.cs-play-code>p code{font-size:.85em}.cs-play-code .cs-code pre{max-height:min(56vh,520px)}.cs-play-code-next{color:var(--ink-3);flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:4px;font-size:15px;display:flex}@media (max-width:1099px){.cs-play{grid-template-columns:minmax(0,1fr)}.cs-play-code{position:static}}@media (max-width:767px){.cs-play{gap:32px;margin-top:28px}.cs-play-example-list{grid-template-columns:minmax(0,1fr);gap:8px}.cs-play-example-list button{grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:0 12px;padding:10px 14px 11px}.cs-play-example-name{font-size:16px}.cs-play-example-kind{grid-area:1/2}.cs-play-example-by{grid-column:1}.cs-play-card{border-radius:0 0 var(--r-card) var(--r-card);padding:20px 18px 24px}.cs-play-option,.cs-play-option-wide{grid-template-columns:minmax(0,1fr)}.cs-play-option-wide label{padding-top:0}.cs-play-option p{grid-column:1}.cs-play-mode legend{float:none;padding:0 0 8px}.cs-play-section h3{padding-left:0}.cs-play-more{margin-left:0}.cs-play-section>p,.cs-play-screen li{grid-template-columns:minmax(0,1fr);gap:0}.cs-play-section>p .cs-play-time,.cs-play-screen .cs-play-time,.cs-play-screen .cs-data{text-align:left;padding-top:0}.cs-play-field{grid-template-columns:minmax(0,1fr)}.cs-play-posts li{align-items:start;gap:8px 12px}.cs-play-posts .cs-play-get{white-space:normal;max-width:96px;min-height:44px;padding-inline:12px;font-size:14px;line-height:1.15}.cs-play-exports{margin-left:0}.cs-play-exports button{min-height:44px}}@media (max-width:519px){.cs-play-tabs .cs-glyph{display:none}.cs-play-tabs .cs-folder-tab{padding-inline:14px}.cs-play-tabs .cs-folder-tab[aria-selected=true]{padding-inline:16px}}@media (prefers-reduced-motion:reduce){.cs-play-bar{background:var(--action);opacity:.5;animation:none}}
