:root{color-scheme:light;--bg: #eef2fc;--bg-deep: #e2e8fb;--bg-soft: #f6f4ff;--panel: #ffffff;--panel-strong: #ffffff;--text: #23264a;--muted: #5c6291;--muted-2: #9298bd;--accent: #7c6ff0;--accent-2: #38bdf8;--accent-bright: #9d8bff;--accent-soft: rgba(124, 111, 240, .14);--danger: #ef5a72;--ok: #2fb787;--border: rgba(124, 111, 240, .22);--glass: rgba(255, 255, 255, .55);--glass-strong: rgba(255, 255, 255, .74);font-family:SFMono-Regular,Cascadia Code,Liberation Mono,Menlo,monospace;background:var(--bg);color:var(--text)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 12% 8%,rgba(56,189,248,.22),transparent 38rem),radial-gradient(circle at 88% 6%,rgba(124,111,240,.22),transparent 38rem),linear-gradient(165deg,#dceafe,#ece7fb 48%,#f6f4ff)}button,input,select,textarea{font:inherit}button{border:1px solid var(--border);background:var(--glass);color:var(--text);border-radius:.6rem;padding:.68rem .84rem;cursor:pointer;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:border-color .14s ease,color .14s ease,transform .14s ease,background .14s ease}button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{cursor:not-allowed;color:var(--muted-2);background:#ffffff59}button.primary{color:#fff;background:linear-gradient(135deg,var(--accent-2),var(--accent));border-color:transparent;font-weight:800}button.primary:hover:not(:disabled){color:#fff;filter:brightness(1.08)}.app-shell{width:min(1280px,calc(100vw - 2rem));margin:0 auto;padding:2rem 0 4rem}.hero{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem}h1,h2,p{margin:0}.hero__brand{display:flex;align-items:center;gap:.75rem}.hero__logo{height:clamp(2.2rem,4vw,3.5rem);width:auto;flex-shrink:0}h1{background:linear-gradient(120deg,var(--accent-2),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(2rem,4vw,4rem);line-height:.95;letter-spacing:-.08em;font-weight:800}.status{display:flex;align-items:center;gap:.55rem;color:var(--muted);border:1px solid var(--border);background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:999px;padding:.55rem .8rem;max-width:min(38rem,50vw);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status__dot{width:.58rem;height:.58rem;border-radius:50%;background:var(--muted-2);box-shadow:0 0 0 0 transparent;flex:0 0 auto}.status--loading .status__dot,.status--generating .status__dot{background:var(--accent);box-shadow:0 0 18px var(--accent)}.status--ready .status__dot{background:var(--ok)}.status--error .status__dot{background:var(--danger)}.command-bar{display:grid;grid-template-columns:1fr;gap:.75rem;margin-bottom:1.4rem}.transport-strip,.overlay-toggles{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem}.transport-readout{display:flex;flex-wrap:wrap;gap:.75rem;color:var(--muted);font-size:.82rem;margin-left:.3rem}.transport-readout span{white-space:nowrap}.overlay-toggle{display:grid;grid-template-columns:auto auto;gap:.45rem;align-items:baseline;color:var(--muted);background:transparent;border-color:transparent;padding:.42rem .5rem}.overlay-toggle span{color:var(--text)}.overlay-toggle small{color:var(--muted-2);max-width:9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.overlay-toggle--on{background:var(--accent-soft);border-color:#7c6ff052}.overlay-toggle--on span{color:var(--accent)}.settings-drawer{border-top:1px solid var(--border);padding-top:.5rem}.settings-drawer summary{width:fit-content;color:var(--muted);cursor:pointer;padding:.35rem 0;-webkit-user-select:none;user-select:none}.settings-drawer summary:hover{color:var(--accent)}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(18rem,1fr));gap:.7rem 1rem;padding-top:.6rem}.control-row{display:grid;grid-template-columns:7.5rem 1fr 4rem;align-items:center;gap:.75rem}.control-row--text{grid-template-columns:7.5rem 1fr}.control-row>span{color:var(--muted)}.model-selector{display:grid;gap:.55rem}.control-row output{color:var(--accent);text-align:right;font-variant-numeric:tabular-nums}input[type=range]{accent-color:var(--accent);width:100%}input:not([type=range]),select,textarea{width:100%;color:var(--text);background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:.75rem;outline:none}input:not([type=range]),select{padding:.55rem .7rem}select{cursor:pointer}textarea{resize:vertical;min-height:11rem;padding:1rem;line-height:1.55}textarea:focus,input:focus,select:focus{border-color:var(--accent)}.typing-stage{width:min(100%,1120px);margin:0 auto}.typing-metrics{display:flex;justify-content:center;flex-wrap:wrap;gap:.8rem;margin-bottom:.65rem;color:var(--muted-2);font-size:.78rem}.typing-surface{position:relative;min-height:clamp(19rem,48vh,36rem);padding:clamp(1.25rem,3vw,2.25rem) .4rem;color:var(--muted);font-size:clamp(1.65rem,3.4vw,3.15rem);line-height:1.42;letter-spacing:-.06em;white-space:pre-wrap;overflow-wrap:anywhere;outline:none}.typing-surface:before,.typing-surface:after{content:"";position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(124,111,240,.35),transparent);opacity:.5}.typing-surface:before{top:0}.typing-surface:after{bottom:0}.prompt-editor{display:inline;min-width:1ch;outline:none;color:color-mix(in srgb,var(--text) 60%,var(--muted));caret-color:var(--accent)}.prompt-editor:focus{color:var(--text)}.prompt-editor[contenteditable=false]{cursor:default}.prompt-editor[data-empty=true]:before{content:attr(data-placeholder);color:var(--muted-2)}.prompt-generation-separator:before{content:""}.generated-run{display:inline}.generated-token,.generated-token-text{--attention-strength: 0;position:relative;color:color-mix(in srgb,var(--accent) 74%,var(--text));background:transparent;border:0;border-radius:.25rem;padding:0 .03em;font-size:inherit;line-height:inherit;letter-spacing:inherit;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:inset 0 calc(-.08em - (var(--attention-strength) * .1em)) 0 rgba(124,111,240,calc(.16 + var(--attention-strength) * .42))}.generated-token{display:inline;cursor:pointer;vertical-align:baseline}.generated-token:hover,.generated-token--active,.generated-token-text--active{color:var(--accent-bright);background:#7c6ff01f;box-shadow:inset 0 -.16em #7c6ff080,0 0 0 1px #7c6ff03d}.generated-token__index{display:inline-block;color:var(--muted-2);font-size:.34em;line-height:1;margin-right:.2em;vertical-align:super;letter-spacing:0}.generated-token__index:before{content:attr(data-index)}.generated-token__text{white-space:pre-wrap}.generated-token-text{display:inline}.inline-empty{color:var(--muted-2);text-align:center;padding:1rem 0}.inline-visualizations{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;align-items:stretch;margin-top:1rem}.inline-card{min-height:5.25rem;border:1px solid var(--border);border-radius:.9rem;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:.82rem;overflow:hidden}.inline-card--muted{display:grid;gap:.35rem;align-content:center;color:var(--muted-2);line-height:1.45}.inline-card--warning{border-style:dashed}.inline-card--warning strong{color:var(--muted)}.inline-card__heading{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.65rem;color:var(--muted-2);font-size:.76rem}.inline-card__heading strong{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}.inline-card__caption{color:var(--muted-2);font-size:.72rem;line-height:1.35;margin:-.35rem 0 .55rem}.prediction-pills{display:flex;flex-wrap:wrap;gap:.45rem}.prediction-pill{display:inline-flex;gap:.42rem;align-items:baseline;border-radius:999px;background:var(--glass-strong);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(124,111,240,.2);padding:.34rem .5rem}.prediction-pill__token{color:var(--text);white-space:pre-wrap}.prediction-pill__prob{color:var(--accent);font-size:.78rem;font-variant-numeric:tabular-nums}.attention-links{display:grid;gap:.38rem}.attention-link{display:grid;grid-template-columns:minmax(2.5rem,auto) 1fr;gap:.5rem;align-items:center;min-width:0}.attention-link__token{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attention-link__bar{display:block;height:.28rem;border-radius:999px;background:linear-gradient(90deg,var(--accent),transparent)}.kv-similarity-link__bar{background:linear-gradient(90deg,var(--accent-2),transparent)}.layer-readout{display:grid;grid-template-rows:auto 1fr}.mini-layer-stack{display:flex;align-items:end;gap:.22rem;min-height:3.1rem}.mini-layer{display:flex;align-items:end;width:100%;min-width:.42rem;height:3.1rem;border-radius:999px;background:#7c6ff014;overflow:hidden}.mini-layer__bar{display:block;width:100%;min-height:.2rem;border-radius:inherit;background:linear-gradient(180deg,var(--accent-2),var(--accent))}.mini-layer--selected{box-shadow:0 0 0 1px #7c6ff0a6,0 0 14px #7c6ff038}.prompt-box,.controls-card,.transport-card,.output-panel,.viz-panel{border:1px solid var(--border);background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:1rem;box-shadow:0 1rem 3rem #6366f11f}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem;margin-bottom:1rem}.panel-heading>span,.panel-heading p{color:var(--muted)}.panel-heading h2{color:var(--text);font-size:1rem;letter-spacing:-.04em;margin-bottom:.25rem}.panel-heading p{font-size:.78rem;line-height:1.45}.badge{color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:.28rem .48rem;font-size:.68rem;white-space:nowrap}.badge--ok{color:var(--accent);border-color:#7c6ff059;background:var(--accent-soft)}.panel__empty{color:var(--muted-2);line-height:1.5}.panel__caption{color:var(--muted);font-size:.8rem;margin-bottom:.6rem}.token-stream{display:flex;flex-wrap:wrap;gap:.45rem;align-content:start}.token-chip{display:inline-grid;grid-template-columns:auto auto;gap:.35rem;align-items:center;padding:.45rem .55rem;background:var(--glass)}.token-chip--active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.token-chip__index{color:var(--muted-2);font-size:.68rem}.token-chip__text{white-space:pre}.prediction-list{display:grid;gap:.8rem}.prediction-row{display:grid;gap:.35rem}.prediction-row__meta{display:grid;grid-template-columns:2.4rem 1fr 5.5rem;gap:.6rem;align-items:baseline}.prediction-row__rank,.prediction-row__prob{color:var(--muted);font-variant-numeric:tabular-nums}.prediction-row__token{color:var(--text);white-space:pre;overflow:hidden;text-overflow:ellipsis}.prediction-row__prob{text-align:right}.prediction-row__track{height:.42rem;border-radius:999px;background:#7c6ff01a;overflow:hidden}.prediction-row__bar{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent-2),var(--accent))}.unavailable{display:grid;gap:.45rem;padding:1rem;border:1px dashed var(--border);border-radius:.8rem;background:#7c6ff00a}.unavailable__label{color:var(--muted)}.unavailable__reason{color:var(--muted-2);line-height:1.5}.heatmap-wrap{overflow:hidden}.heatmap{display:grid;gap:2px;max-width:100%;aspect-ratio:1 / 1;padding:.35rem;border:1px solid var(--border);border-radius:.8rem;background:var(--glass)}.heatmap__cell{min-width:0;min-height:0;border-radius:2px;background:var(--accent)}.heatmap__cell--kv{background:var(--accent-2)}.heatmap-labels{display:grid;grid-template-columns:repeat(auto-fit,minmax(2rem,1fr));gap:.25rem;margin-top:.6rem;color:var(--muted-2);font-size:.68rem}.heatmap-labels span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-stack{display:flex;align-items:end;gap:.45rem;min-height:14rem;padding:1rem .5rem 0;border-bottom:1px solid var(--border)}.layer-block{position:relative;display:grid;align-items:end;justify-items:center;width:100%;min-width:1.4rem;height:13rem}.layer-block__bar{width:100%;min-height:.35rem;border-radius:.45rem .45rem 0 0;background:linear-gradient(180deg,var(--accent-2),var(--accent));box-shadow:0 0 16px #7c6ff038}.layer-block__label{position:absolute;bottom:-1.4rem;color:var(--muted-2);font-size:.7rem}@media(max-width:900px){.hero{align-items:flex-start;flex-direction:column}.status{max-width:100%}.settings-grid,.inline-visualizations{grid-template-columns:1fr}}@media(max-width:620px){.app-shell{width:min(100vw - 1rem,1280px);padding-top:1rem}.control-row,.control-row--text{grid-template-columns:1fr}.control-row output{text-align:left}.typing-surface{font-size:clamp(1.35rem,8vw,2.15rem);min-height:17rem}}