@font-face{font-family:"IBM Plex Sans";font-weight:400;font-display:swap;src:url('/static/61f0c841c98c47485338/playground_fonts/sans-400.ttf')}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-display:swap;src:url('/static/61f0c841c98c47485338/playground_fonts/sans-600.ttf')}
@font-face{font-family:"IBM Plex Sans";font-weight:700;font-display:swap;src:url('/static/61f0c841c98c47485338/playground_fonts/sans-700.ttf')}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-display:swap;src:url('/static/61f0c841c98c47485338/playground_fonts/mono-400.ttf')}
@font-face{font-family:"IBM Plex Mono";font-weight:600;font-display:swap;src:url('/static/61f0c841c98c47485338/playground_fonts/mono-600.ttf')}
:root{
  color-scheme:light;--paper:#F5F4F0;--surface:#ECEAE3;--window:#FFFFFF;--ink:#141414;
  --ink-muted:#5A5A55;--hairline:#D9D6CD;--shu:#C8361C;--shu-text:#B02F18;
  --shu-highlight:#F3C2B4;--signal-rgb:200,54,28;
  --font-text:"IBM Plex Sans",-apple-system,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  background:var(--surface);color:var(--ink);font-family:var(--font-text);font-synthesis:none;
}
:root[data-theme="dark"]{color-scheme:dark;--paper:#141414;--surface:#1E1E1C;--window:#1A1A18;--ink:#F5F4F0;--ink-muted:#A8A59D;--hairline:#3A3936;--shu-text:#E5674F;--shu-highlight:#5A2418}
*{box-sizing:border-box}
body{margin:14px;min-height:calc(100vh - 28px);background:var(--paper);-webkit-font-smoothing:antialiased}
.site-frame{position:fixed;inset:14px;border:2px solid var(--ink);pointer-events:none;z-index:20;box-shadow:0 0 0 100vmax var(--surface)}
.menubar{position:sticky;top:14px;z-index:15;display:flex;align-items:center;gap:12px;height:43px;margin:0 2px;padding:7px 13px;background:repeating-linear-gradient(var(--ink) 0 1px,var(--window) 1px 4px) content-box,var(--window);border-bottom:2px solid var(--ink);font:12px var(--font-mono)}
.menubar>*{background:var(--window);padding-inline:9px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:600;white-space:nowrap}
.brand svg{width:23px;height:23px;overflow:visible}
.menubar-title{position:absolute;left:50%;transform:translateX(-50%);font-weight:600;white-space:nowrap}
.theme-switch{display:flex;gap:4px;margin-left:auto}
.theme-switch button{background:var(--window);border:1.5px solid var(--ink);border-radius:4px;padding:2px 8px;font:600 11px var(--font-mono)}
.theme-switch button[aria-pressed="true"]{background:var(--ink);color:var(--window)}
main{max-width:1040px;margin:auto;padding:24px 32px 22px}
header{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--hairline)}
.eyebrow,.section-label{font:11px var(--font-mono);letter-spacing:.075em;color:var(--ink-muted)}
h1{display:flex;align-items:baseline;gap:11px;font-size:54px;line-height:1;letter-spacing:-3px;font-weight:600;margin:8px 0 10px}
.title-square{width:12px;height:12px;background:var(--shu);align-self:flex-start;margin-top:10px}
.workspace-name{font:400 14px var(--font-mono);letter-spacing:-.25px;color:var(--ink-muted);margin-left:8px}
header p{font-size:17px;color:var(--ink-muted);margin:0;line-height:1.6}
header p mark{background:var(--shu-highlight);color:var(--ink);padding:0 3px}
.header-right{display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:13px;max-width:390px}
.local{display:flex;align-items:center;gap:8px;font:11px var(--font-mono);color:var(--ink)}
.local i{width:7px;height:7px;background:var(--shu);display:inline-block}
a{color:var(--shu-text);font-size:12px;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:4px}
small,.hint,.privacy,footer{font-size:11px;color:var(--ink-muted);line-height:1.7}
#checkpoint{font:10px/1.8 var(--font-mono)}
.layout{display:block}
.panel{border:2px solid var(--ink);border-radius:5px;background:var(--window);min-width:0}
.window-bar{height:32px;display:flex;align-items:center;gap:10px;padding:6px 9px;border-bottom:2px solid var(--ink);background:repeating-linear-gradient(var(--ink) 0 1px,var(--window) 1px 4px) content-box,var(--window)}
.window-bar>*{background:var(--window)}
.window-square{width:12px;height:12px;border:1.5px solid var(--ink);box-shadow:0 0 0 4px var(--window);flex:none}
.window-bar .section-label{color:var(--ink);padding:0 10px;font-weight:600;margin:auto;letter-spacing:.04em}
.window-end{font:14px/1 var(--font-mono);padding-left:4px}.panel-body{padding:22px}
button,input,select,textarea{font:inherit}button{cursor:pointer;color:var(--ink);border-radius:3px;transition:background .15s,color .15s}
button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible{outline:2px solid var(--shu);outline-offset:3px}
label{display:block;font:600 11px var(--font-mono);margin:19px 0 8px}label small{font:400 10px var(--font-mono);margin-left:5px}
textarea,input:not([type=range]):not([type=file]),select{width:100%;background:var(--paper);border:1px solid var(--hairline);border-radius:3px;padding:10px 11px;color:var(--ink);font-size:13px;line-height:1.65}
textarea{resize:vertical}#query{font-family:var(--font-mono);font-size:12px}
textarea::placeholder,input::placeholder{color:var(--ink-muted);opacity:.75}input:focus,textarea:focus,select:focus{outline:2px solid var(--shu);outline-offset:2px}
.drop{border:1px dashed var(--ink-muted);padding:16px 10px;text-align:center;background:var(--paper);cursor:pointer;border-radius:3px}
.drop:hover{border-color:var(--shu);background:var(--surface)}.drop strong{display:block;font-size:11px;font-weight:600}
.drop span{display:block;font:10px/1.7 var(--font-mono);color:var(--ink-muted);margin:8px 0;overflow-wrap:anywhere}
.drop input{max-width:100%;font:10px var(--font-mono);color:var(--ink-muted)}
input::file-selector-button{background:var(--window);color:var(--ink);border:1px solid var(--hairline);border-radius:2px;padding:5px 7px;cursor:pointer}
#limits{font-size:10px}.primary{width:100%;display:flex;align-items:center;justify-content:space-between;background:var(--shu);color:#FFF;border:1px solid var(--shu);padding:12px 13px;margin-top:20px;font:600 11px var(--font-mono)}
.primary:hover{background:#A92D17;border-color:#A92D17}.primary span{font-size:20px;font-weight:400}
.example{display:block;background:none;border:0;border-bottom:1px solid var(--hairline);border-radius:0;margin:14px auto 0;padding:2px 0;color:var(--ink-muted);font:10px var(--font-mono)}
.example:hover{color:var(--shu-text);border-color:var(--shu)}.privacy{border-top:1px solid var(--hairline);margin:22px 0 0;padding-top:15px;font-size:10px}
.output-heading{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:20px 0 16px;border-bottom:1px solid var(--hairline)}
.output-heading .section-label{font-size:9px;letter-spacing:.04em}#status{font:10px/1.6 var(--font-mono);color:var(--ink-muted);text-align:right}
#empty{text-align:center;padding:20px 15px}.selection-icon{width:200px;margin:0 auto 27px;color:var(--ink)}.selection-icon svg{width:100%;height:auto;display:block}
#empty .eyebrow{font-size:10px;color:var(--shu-text)}h2{font-size:27px;font-weight:600;letter-spacing:-.8px;line-height:1.2}
#empty h2{font-size:clamp(28px,3vw,42px);margin:18px 0;letter-spacing:-1.2px;line-height:1.15}#empty h2 span{color:var(--ink-muted);font-weight:400}
#empty p{font-size:14px;line-height:1.9;color:var(--ink-muted)}.legend{display:flex;align-items:center;justify-content:center;gap:8px;margin:36px 0 13px;font:10px var(--font-mono);color:var(--ink-muted)}
.legend i,.legend b{display:inline-block;width:12px;height:12px;background:rgba(var(--signal-rgb),.12);border:1px solid var(--hairline)}.legend b{background:var(--shu);border-color:var(--shu);margin-left:12px}#empty>small{font-size:10px}
#result-query{font:600 19px/1.5 var(--font-mono);letter-spacing:-.5px;margin:25px 0 18px;overflow-wrap:anywhere}#result-query::before{content:"> ";color:var(--shu-text)}
.stats{display:flex;flex-wrap:wrap;gap:7px}.stat{font:9px/1.6 var(--font-mono);color:var(--ink-muted);border:1px solid var(--hairline);border-radius:2px;padding:6px 8px;background:var(--paper)}
.threshold{padding:15px;background:var(--paper);border:1px solid var(--hairline);border-radius:3px;margin:22px 0}.threshold label{display:flex;justify-content:space-between;margin:0 0 9px;font-size:11px}.threshold strong{color:var(--shu-text)}.threshold input{width:100%;accent-color:var(--shu)}.threshold small{display:block;font-size:10px;margin-top:7px}
#video-pooling{padding:0 0 12px;border-bottom:1px solid var(--hairline)}
.document{white-space:pre-wrap;overflow-wrap:anywhere;font:400 13px/1.65 var(--font-text);background:var(--paper);border:1px solid var(--hairline);border-radius:3px;padding:18px;min-height:260px;max-height:460px;overflow:auto}mark{color:inherit;padding:2px 0;border-radius:1px}.document mark{padding:0}
.image-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}.image-pair figure{margin:0;min-width:0}.image-pair img,.image-pair canvas{width:100%;height:auto;max-height:480px;object-fit:contain;border:1px solid var(--hairline);border-radius:2px;background:var(--paper)}.image-pair figcaption{font:10px/1.7 var(--font-mono);color:var(--ink-muted);margin-top:8px}
audio{width:100%;margin:12px 0}video{display:block;max-width:100%;max-height:430px;margin:auto;background:#141414;border-radius:3px}
.timeline{display:block;width:100%;height:125px;cursor:crosshair;background:var(--paper);border:1px solid var(--hairline);border-radius:3px;margin:16px 0}
.frames{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.frame{padding:0;border:1px solid var(--hairline);background:var(--paper);overflow:hidden}.frame:hover{border-color:var(--shu)}.frame img{width:100%;height:90px;object-fit:contain;background:var(--surface);display:block}.frame span{display:block;padding:7px;font:9px var(--font-mono)}
.selection-title{font:600 11px var(--font-mono);color:var(--ink);margin:24px 0 11px}.intervals{display:flex;gap:8px;flex-wrap:wrap}.interval{border:1px solid var(--shu);background:var(--shu-highlight);padding:8px 11px;color:var(--shu-text);font:10px var(--font-mono)}.interval:hover{background:var(--shu);color:#FFF}
.secondary{background:var(--window);border:1px solid var(--ink);padding:10px 13px;font:10px var(--font-mono)}.secondary:hover{background:var(--ink);color:var(--window)}
.selected-text{font-size:13px;line-height:1.9;background:var(--paper);border:1px solid var(--hairline);border-left:3px solid var(--shu);border-radius:2px;padding:12px 15px;white-space:pre-wrap;overflow-wrap:anywhere}
#error{background:var(--shu-highlight);color:var(--ink);border:1px solid var(--shu);border-radius:3px;padding:14px;font-size:13px;line-height:1.7;margin:20px 0;white-space:pre-wrap}#reauth{display:inline-block;margin:0 0 18px;font:11px var(--font-mono);border-bottom:1px solid var(--shu)}.busy{color:var(--shu-text)!important}
footer{font:9px/1.9 var(--font-mono);text-align:center;margin-top:30px;padding-top:16px;border-top:1px solid var(--hairline)}[hidden]{display:none!important}
.media-area{border:1px solid var(--hairline);border-radius:3px;background:var(--paper);overflow:hidden}
#text{display:block;border:0;border-radius:0;min-height:260px;max-height:460px;resize:vertical;padding:18px}
.upload-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;border-top:1px solid var(--hairline)}
.upload-button{margin:0;padding:7px 10px;border:1px solid var(--hairline);background:var(--window);cursor:pointer;font:11px var(--font-mono)}
.upload-button:focus-within{outline:2px solid var(--shu);outline-offset:2px}.upload-button input{position:absolute;opacity:0;width:1px;height:1px}
.upload-toolbar .example{margin:0 0 0 auto}.upload-toolbar .hint{overflow-wrap:anywhere;flex:1;min-width:100px}
.query-bar{display:flex;gap:8px;align-items:center;margin:0 0 18px}.query-bar #query{flex:1;min-width:0;font-size:13px;padding:12px}
.query-bar .primary{width:auto;margin:0;white-space:nowrap;padding:14px 16px}.query-bar .secondary{padding:14px 12px}
.workspace-status{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;font:10px var(--font-mono);color:var(--ink-muted)}
.workspace-status .example{margin:0}.result-details,.input-details{margin-top:14px;border-top:1px solid var(--hairline);padding-top:12px}
summary{cursor:pointer;font:11px var(--font-mono);color:var(--ink-muted)}.result-details .stats{margin-top:12px}
.input-details .privacy{margin:8px 0 0;padding:0;border:0}.media-image{display:block;max-width:100%;max-height:360px;object-fit:contain;margin:auto}
#content .document{border:0;border-radius:0;max-height:460px}#content video{max-height:300px}#content audio{display:block;width:calc(100% - 32px);margin:20px 16px}
#content .timeline{width:calc(100% - 24px);height:100px;margin:12px}.frame-gallery{padding:0 12px 12px}.frame-gallery .frames{margin-top:12px}
#content .timeline-placeholder{display:flex;align-items:center;justify-content:center;cursor:default;font:10px var(--font-mono);color:var(--ink-muted)}
#rich-text{height:260px;min-height:260px;max-height:460px;overflow:auto;resize:vertical;padding:18px;font:400 13px/1.65 var(--font-text);outline-offset:-2px}
.rich-document{white-space:pre-wrap;overflow-wrap:anywhere}.rich-document p,.rich-document blockquote{margin:0 0 .8em}.rich-document blockquote{border-left:2px solid var(--hairline);padding-left:12px}
.rich-document h1,.rich-document h2,.rich-document h3,.rich-document h4,.rich-document h5,.rich-document h6{display:block;font-family:var(--font-text);line-height:1.4;letter-spacing:normal;margin:.8em 0 .4em}.rich-document h1{font-size:20px}.rich-document h2{font-size:18px}.rich-document h3{font-size:16px}
.rich-document ul,.rich-document ol{margin:.5em 0;padding-left:24px}.rich-document li{margin:.2em 0}.rich-document pre,.rich-document code{font-family:var(--font-mono);font-size:12px}.rich-document pre{white-space:pre-wrap;margin:.8em 0}
.rich-document table{border-collapse:collapse;margin:12px 0;min-width:100%;white-space:normal}.rich-document th,.rich-document td{border:1px solid var(--hairline);padding:7px 10px;vertical-align:top;text-align:left}.rich-document th{background:var(--surface);font-weight:600}.rich-document caption{text-align:left;font-weight:600;margin-bottom:6px}.rich-document a{font:inherit}
@media(max-width:1100px){main{padding:32px 24px 22px}.panel-body{padding:18px}.frames{grid-template-columns:repeat(3,1fr)}.image-pair{grid-template-columns:1fr}.menubar-title{font-size:11px}}
@media(max-width:780px){body{margin:8px}.site-frame{inset:8px}.menubar{top:8px}.menubar-title{display:none}main{padding:28px 16px 18px}header{align-items:flex-start;flex-direction:column;gap:20px;margin-bottom:22px;padding-bottom:25px}.header-right{align-items:flex-start;text-align:left;gap:9px}h1{font-size:72px;letter-spacing:-4px}.workspace-name{font-size:12px}.title-square{margin-top:12px;width:12px;height:12px}.image-pair{grid-template-columns:1fr 1fr}.output-heading{align-items:flex-start}.theme-switch button{font-size:10px;padding:3px 7px}.menubar{padding-inline:8px}.menubar>*{padding-inline:5px}.brand{font-size:11px}}
@media(max-width:420px){.image-pair{grid-template-columns:1fr}.frames{grid-template-columns:repeat(2,minmax(0,1fr))}.panel-body{padding:15px}.output-heading .section-label{max-width:95px}.workspace-name{font-size:11px;margin-left:0}main{padding-inline:12px}}
@media(max-width:780px){h1{font-size:44px;letter-spacing:-2px}.title-square{margin-top:8px}main{padding-top:18px}header{gap:12px;padding-bottom:16px;margin-bottom:16px}.header-right{gap:4px}.query-bar{gap:6px}.query-bar .primary,.query-bar .secondary{padding:14px 9px}}
@media(max-width:420px){.query-bar{flex-wrap:wrap}.query-bar #query{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.sample-browser{margin:0 0 26px}.sample-heading{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;margin-bottom:14px}.sample-heading h2{font-size:18px;margin:0}.sample-grid{display:flex;flex-wrap:wrap;gap:8px}.sample-card{min-width:0;text-align:left;border:1px solid var(--hairline);background:var(--window);color:var(--ink);padding:7px 12px;border-radius:999px;cursor:pointer;font:12px/1.5 var(--font-text);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.sample-card:hover{border-color:var(--shu)}.sample-card[aria-pressed=true]{border-color:var(--shu);box-shadow:inset 0 0 0 1px var(--shu);background:rgba(var(--signal-rgb),.035)}.sample-kind{display:block;font:9px var(--font-mono);text-transform:uppercase;letter-spacing:1px;color:var(--shu-text);margin-bottom:8px}.sample-title{display:block;font:12px/1.5 var(--font-text)}.sample-caption{display:flex;justify-content:space-between;gap:18px;margin-top:12px;line-height:1.6}.sample-caption a{white-space:nowrap;font:11px var(--font-mono);color:var(--shu-text)}.suggested-queries{display:flex;gap:7px;flex-wrap:wrap;padding:14px 14px 0}.query-suggestion{font:11px/1.6 var(--font-text);text-align:left;color:var(--ink-muted);background:var(--paper);border:1px solid var(--hairline);border-radius:3px;padding:6px 10px;cursor:pointer}.query-suggestion:hover{border-color:var(--shu);color:var(--shu-text)}#text[readonly]{cursor:text}button:focus-visible,a:focus-visible{outline:2px solid var(--shu);outline-offset:3px}@media(max-width:750px){.sample-heading{gap:8px}.sample-caption{flex-wrap:wrap}}

.workspace-panel>.panel-body{padding:0}.workspace-panel .media-area{border:0;border-radius:0;background:transparent}.workspace-panel #text{border:0;border-radius:0}

.sample-modality{display:inline;color:var(--shu-text);font:600 11px var(--font-mono);margin-right:8px}

.workspace-status strong{color:var(--shu-text);font-weight:600}