@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=DM+Sans:wght@400;500;600&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-deep:#08090c;--bg-surface:#0f1115;--bg-raised:#161920;--bg-hover:#1c2029;--border:#1e222a;--border-subtle:#14171e;--text-primary:#e2e5eb;--text-secondary:#7a8194;--text-muted:#4a5168;--accent-blue:#5b8af5;--accent-green:#45d4a8;--accent-amber:#e5a635;--accent-rose:#e85d75;--model-1:#5b8af5;--model-2:#45d4a8;--model-3:#e5a635;--model-4:#e85d75;--font-mono:"JetBrains Mono", "SF Mono", "Fira Code", monospace;--font-sans:"DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;--radius:6px;--radius-lg:10px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}.app{max-width:1440px;margin:0 auto;padding:0 24px 48px}.app__header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:20px;padding:20px 0;display:flex}.app__header h1{font-family:var(--font-mono);letter-spacing:-.01em;color:var(--text-primary);align-items:center;gap:10px;font-size:15px;font-weight:600;display:flex}.app__header h1:before{content:"";background:var(--accent-green);width:8px;height:8px;box-shadow:0 0 8px var(--accent-green);border-radius:50%;display:inline-block}.app__controls{align-items:center;gap:10px;display:flex}select{font-family:var(--font-mono);background:var(--bg-raised);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' stroke='%237a8194' fill='none' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;min-width:220px;padding:8px 32px 8px 12px;font-size:12px;font-weight:500;transition:border-color .15s,background .15s}select:hover{border-color:var(--text-muted);background-color:var(--bg-hover)}select:focus{border-color:var(--accent-blue);outline:none;box-shadow:0 0 0 2px #5b8af526}select:disabled{opacity:.4;cursor:not-allowed}.btn{font-family:var(--font-mono);letter-spacing:.02em;border-radius:var(--radius);cursor:pointer;text-transform:uppercase;border:none;padding:8px 18px;font-size:12px;font-weight:600;transition:all .15s}.btn:disabled{opacity:.3;cursor:not-allowed}.btn-run{background:var(--accent-blue);color:#fff}.btn-run:hover:not(:disabled){background:#6e99f7;box-shadow:0 2px 12px #5b8af54d}.btn-stop{color:var(--accent-rose);border:1px solid var(--accent-rose);background:0 0}.btn-stop:hover{background:#e85d751a}.btn-sm{padding:4px 10px;font-size:10px}.app__config{margin-bottom:16px}.api-key-field{align-items:center;gap:12px;display:flex}.api-key-field__label{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);white-space:nowrap;font-size:11px;font-weight:600}.api-key-field__input{font-family:var(--font-mono);background:var(--bg-raised);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);width:100%;max-width:400px;padding:8px 12px;font-size:12px;transition:border-color .15s}.api-key-field__input::placeholder{color:var(--text-muted)}.api-key-field__input:focus{border-color:var(--accent-blue);outline:none;box-shadow:0 0 0 2px #5b8af526}.app__sysprompt{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-surface);margin-bottom:16px;overflow:hidden}.app__sysprompt summary{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:12px 16px;font-size:11px;font-weight:600;list-style:none;transition:color .15s;display:flex}.app__sysprompt summary:before{content:"▸";font-size:10px;transition:transform .2s;display:inline-block}.app__sysprompt[open] summary:before{transform:rotate(90deg)}.app__sysprompt summary:hover{color:var(--text-primary)}.app__sysprompt summary::-webkit-details-marker{display:none}.app__sysprompt .input-editor{border-color:var(--border-subtle);width:calc(100% - 32px);margin:0 16px 12px}.app__sysprompt .btn-reset{margin:0 16px 12px}.badge{font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;background:var(--bg-raised);color:var(--text-muted);border:1px solid var(--border);border-radius:4px;padding:2px 7px;font-size:9px;font-weight:600}.badge--active{color:var(--accent-blue);background:#5b8af51f;border-color:#5b8af540}.app__input-section{margin-bottom:20px}.input-editor__label{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:8px;font-size:11px;font-weight:600;display:block}.input-editor{font-family:var(--font-mono);color:var(--text-secondary);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);resize:vertical;width:100%;min-height:120px;padding:14px 16px;font-size:11px;line-height:1.7;transition:border-color .15s}.input-editor:focus{border-color:var(--accent-blue);color:var(--text-primary);outline:none;box-shadow:0 0 0 2px #5b8af51a}.btn-reset{color:var(--text-muted);border:1px solid var(--border);background:0 0;margin-top:8px}.btn-reset:hover{color:var(--text-secondary);border-color:var(--text-muted)}.app__grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (width<=840px){.app__grid{grid-template-columns:1fr}}.model-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;min-height:200px;transition:border-color .2s;display:flex;overflow:hidden}.app__grid .model-card:first-child{--card-accent:var(--model-1)}.app__grid .model-card:nth-child(2){--card-accent:var(--model-2)}.app__grid .model-card:nth-child(3){--card-accent:var(--model-3)}.app__grid .model-card:nth-child(4){--card-accent:var(--model-4)}.model-card__header{border-bottom:1px solid var(--border-subtle);background:var(--bg-raised);align-items:center;gap:10px;padding:12px 16px;display:flex}.model-card__name{font-family:var(--font-mono);color:var(--card-accent,var(--accent-blue));letter-spacing:-.01em;padding-left:14px;font-size:13px;font-weight:700;position:relative}.model-card__name:before{content:"";background:var(--card-accent,var(--accent-blue));border-radius:50%;width:6px;height:6px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.model-card__meta{gap:12px;margin-left:auto;display:flex}.model-card__timing{font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-deep);letter-spacing:.02em;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:500}.model-card__body{flex:1;max-height:500px;padding:16px;overflow-y:auto}.model-card--streaming{border-color:var(--card-accent,var(--accent-blue));box-shadow:0 0 20px -8px var(--card-accent,var(--accent-blue))}.model-card--streaming .model-card__name:before{animation:1.2s ease-in-out infinite pulse-dot}.model-card--done{border-color:var(--border)}.model-card--error{border-color:var(--accent-rose)}.model-card__error{font-family:var(--font-mono);color:var(--accent-rose);border-radius:var(--radius);background:#e85d7514;border:1px solid #e85d7533;padding:12px;font-size:12px;line-height:1.5}.model-card__placeholder{font-family:var(--font-mono);color:var(--text-muted);text-align:center;letter-spacing:.02em;justify-content:center;align-items:center;height:100%;min-height:120px;font-size:12px;display:flex}.model-card__output{color:var(--text-primary);font-size:13px;line-height:1.7}.model-card__output p{margin-bottom:10px}.model-card__output strong{color:#fff;font-weight:600}.model-card__output ul,.model-card__output ol{margin-bottom:10px;padding-left:18px}.model-card__output li{color:var(--text-secondary);margin-bottom:6px}.model-card__output li::marker{color:var(--card-accent,var(--text-muted))}.model-card__output h1,.model-card__output h2,.model-card__output h3{font-family:var(--font-sans);color:#fff;margin:16px 0 8px}.model-card__output h1{font-size:16px}.model-card__output h2{font-size:14px}.model-card__output h3{font-size:13px}.model-card__output code{font-family:var(--font-mono);background:var(--bg-deep);color:var(--accent-amber);border-radius:3px;padding:2px 6px;font-size:11px}.model-card__output pre{background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;padding:12px;overflow-x:auto}.model-card__output pre code{background:0 0;padding:0}.model-card__output blockquote{border-left:3px solid var(--card-accent,var(--text-muted));color:var(--text-secondary);margin:10px 0;padding-left:14px}.cursor{background:var(--card-accent,var(--accent-blue));vertical-align:text-bottom;width:7px;height:16px;margin-left:2px;animation:.8s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes pulse-dot{0%,to{opacity:1;box-shadow:0 0 0 0 var(--card-accent,var(--accent-blue))}50%{opacity:.6;box-shadow:0 0 6px 2px var(--card-accent,var(--accent-blue))}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.run-controls{align-items:center;display:flex}