:root{--ink:#14263d;--muted:#52657a;--line:#d7e0ea;--paper:#fff;--bg:#edf2f8;--a:#147c99;--b:#ae550e;--accent:#1262ca;--soft:#eaf2ff;--success:#176747;--danger:#ac303b;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-size:16px;line-height:1.6}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{touch-action:manipulation}button{cursor:pointer;border:1px solid transparent;background:var(--accent);color:#fff;font-weight:650;padding:.65rem 1rem;border-radius:.55rem;min-height:44px}button:hover{filter:brightness(.94)}button:disabled{opacity:.48;cursor:default}button.secondary{color:var(--ink);background:#fff;border-color:var(--line)}button.quiet{color:var(--accent);background:transparent;padding:.4rem .65rem}button.danger{color:var(--danger);background:#fff;border-color:#e1b6bd}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid #c07800;outline-offset:3px}a{color:#115bbb;text-underline-offset:3px}p{margin:.6rem 0 1rem}h1,h2,h3{line-height:1.18;letter-spacing:-.025em}h1{font-size:clamp(1.7rem,3.8vw,2.4rem);margin:.2rem 0 .4rem}h2{font-size:clamp(1.5rem,3vw,2rem);margin:.4rem 0 .8rem}h3{font-size:1.1rem;margin:.3rem 0 .7rem}small,.small{font-size:.875rem}.muted{color:var(--muted)}.shell{max-width:1400px;margin:auto;padding:0 28px}.masthead{padding:30px 0 25px;display:flex;align-items:center;justify-content:space-between;gap:20px}.masthead p{margin:0}.eyebrow{font-size:.875rem;font-weight:750;letter-spacing:.055em;text-transform:uppercase;color:var(--muted)}.brand{display:flex;align-items:center;gap:20px}.brand-icon{display:grid;place-items:center;background:var(--ink);color:#6be1ee;font-size:1.5rem;padding:16px;border-radius:13px;white-space:nowrap}.site-link{font-size:.875rem}.main-nav{display:flex;gap:6px;background:var(--ink);padding:7px;border-radius:12px;margin-bottom:25px}.main-nav button{flex:1;background:transparent;border-radius:7px;color:#e0eafa;white-space:nowrap}.main-nav button[aria-current]{background:#fff;color:var(--ink)}.main-nav span{opacity:.7;margin-right:8px;font-size:.875rem}.main-nav small{margin-left:8px}.section-top{display:flex;justify-content:space-between;align-items:start;gap:20px;margin:0 0 20px}.section-top p{max-width:780px}.pill{display:inline-block;background:#dce9fb;color:#184f96;padding:4px 10px;border-radius:30px;font-size:.875rem;font-weight:650;white-space:nowrap}.lesson-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:25px}.step-list{display:grid;align-content:start;gap:7px}.step-list button{color:var(--muted);background:transparent;text-align:left;border:1px solid var(--line);font-weight:550}.step-list button.active{background:var(--ink);border-color:var(--ink);color:white}.step-list button small{display:block;font-weight:400;opacity:.85}.card{background:var(--paper);padding:24px;border:1px solid var(--line);border-radius:12px;min-width:0}.theory-card{max-width:960px}.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.idea{background:var(--soft);border-left:4px solid var(--accent);padding:15px 18px;margin:18px 0}.definition{display:flex;gap:14px;margin:20px 0;align-items:center;padding:15px;background:var(--bg);border-radius:8px}.definition .token{font-size:2rem;font-weight:750;color:var(--a)}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:#edf2f7;padding:.13rem .3rem;border-radius:4px;white-space:normal;overflow-wrap:anywhere}.mini-example{border:1px solid var(--line);border-radius:10px;padding:18px;margin:20px 0}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.question{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.choices{display:grid;gap:8px;margin:12px 0}.choice{display:flex;align-items:start;gap:12px;border:1px solid var(--line);padding:12px;border-radius:8px;background:#f8faff;cursor:pointer;font-weight:400}.choice input{width:19px;height:19px;margin:3px 0 0;flex-shrink:0}.feedback{padding:12px 16px;background:var(--soft);border-left:4px solid var(--accent);margin-top:12px;overflow-wrap:anywhere}.feedback.good{background:#e9f5ee;border-color:var(--success)}.feedback.bad{background:#fff0ed;border-color:var(--danger)}.feedback:empty{display:none}.demo-list{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.demo-list button{background:#fff;color:var(--ink);border-color:var(--line);font-weight:550}.demo-list button.active{color:white;background:var(--ink);border-color:var(--ink)}.demo-story{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px;margin-bottom:18px}.demo-story p:last-child{margin-bottom:0}.prediction{background:#f4f8ff;border:1px solid #c6d8ef;padding:20px;border-radius:12px}.prediction h3{margin:0 0 12px}.lab-layout{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:18px}.plot-card{padding:20px}.plot-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.875rem;color:var(--muted);margin:8px 0 12px}.a{color:var(--a);font-weight:700}.b{color:var(--b);font-weight:700}.canvas-wrap{position:relative;width:100%;max-width:700px;margin:auto}canvas{display:block;width:100%;height:auto;aspect-ratio:1/1;touch-action:pan-y}.plot-note{color:var(--muted);font-size:.875rem;margin:0 0 12px}.control-stack{display:grid;align-content:start;gap:14px}.control-stack .card{padding:20px}label.field{display:grid;gap:6px;font-weight:600;font-size:.875rem}input[type=number],select{width:100%;min-width:0;background:#fff;color:var(--ink);border:1px solid #afbecd;border-radius:6px;padding:8px 10px;min-height:44px}input[type=range]{width:100%;accent-color:var(--accent)}.range-line{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.875rem;font-weight:650}.range-line output{padding:2px 8px;background:var(--soft);border-radius:4px}.control-help{font-size:.875rem;color:var(--muted);margin:.5rem 0 0}.check{display:flex;gap:9px;align-items:center;font-size:.875rem;margin:10px 0}.check input{width:18px;height:18px;margin:0}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.metric{padding:16px;background:#fff;border:1px solid var(--line);border-radius:10px;min-width:0}.metric strong{font-size:1.8rem;display:block;line-height:1.3}.metric span{font-size:.875rem;color:var(--muted)}.metric .detail{font-size:.875rem;color:var(--muted)}.diagnostic{background:#fff5e3;border:1px solid #eed4a1;border-radius:8px;padding:12px 16px;margin:12px 0;font-size:.875rem}.results-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:.875rem}th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted);font-weight:600}.matrix th,.matrix td{text-align:center}.matrix td{font-size:1.2rem;font-weight:700}.matrix td.hit{background:#e5f4ed}.matrix td.miss{background:#fff0ed}.mini-bars{display:grid;gap:12px;margin-top:16px}.bar-label{display:flex;justify-content:space-between;gap:10px;font-size:.875rem}.bar{height:9px;border-radius:5px;background:#e3eaf2;overflow:hidden}.bar span{display:block;height:100%;background:var(--a)}.bar.b-bar span{background:var(--b)}.data-panel{margin-top:18px}.data-panel summary{cursor:pointer;font-weight:650}.data-panel .table-wrap{max-height:325px;margin-top:14px}.data-panel button{min-height:34px;padding:4px 8px;font-size:.875rem}.row-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.row-form .wide{grid-column:1/-1}.probe{background:#eaf6fa;padding:12px;border-radius:8px;margin:10px 0;font-size:.875rem}.task-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:20px}.task-list{display:grid;gap:6px;align-content:start}.task-list button{text-align:left;background:transparent;color:var(--ink);border:1px solid var(--line);font-weight:550}.task-list button.active{background:var(--ink);color:white}.task-list .status{font-size:.8rem;display:block;color:var(--muted)}.task-list button.active .status{color:#cddcec}.task-card{margin-bottom:18px}.task-card .question{border-top:0;margin-top:0;padding-top:0}.task-card input[type=number]{max-width:220px}.task-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.task-title h2{margin:0 0 12px}.progress{height:7px;background:#d9e3ef;border-radius:5px;overflow:hidden;margin-top:10px}.progress span{display:block;height:100%;background:var(--accent)}.training-empty{background:#eff3f9;border:1px dashed #a6b7c9;padding:14px;border-radius:8px}.probe-marker{color:var(--ink)}.split-flow{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.split-flow>div{flex:1;min-width:180px;padding:18px;border:1px solid var(--line);border-radius:8px}.split-flow strong{display:block}.solution{background:#fff6e5;padding:14px;margin-top:14px;border-radius:8px}.final-result{margin-top:15px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;left:15px;top:-100px;background:white;padding:10px;z-index:10}.skip:focus{top:10px}footer{font-size:.875rem;color:var(--muted);padding:28px 0 40px}footer summary{cursor:pointer;font-weight:650}[hidden]{display:none!important}
@media(max-width:1050px){.lab-layout{grid-template-columns:minmax(0,1fr) 280px}.lesson-layout,.task-layout{grid-template-columns:190px minmax(0,1fr)}.metrics{gap:7px}.metric{padding:12px}.metric strong{font-size:1.5rem}.main-nav button{padding:.65rem .6rem}.main-nav span{margin-right:3px}}
@media(max-width:780px){.shell{padding:0 16px}.masthead{padding:20px 0}.brand-icon{display:none}.site-link{display:none}.main-nav{flex-wrap:wrap;gap:4px}.main-nav button{flex:1 1 43%;white-space:normal}.lesson-layout,.task-layout,.lab-layout,.demo-story{grid-template-columns:1fr}.step-list,.task-list{display:flex;overflow:auto;padding-bottom:5px}.step-list button,.task-list button{min-width:155px}.card{padding:18px}.control-stack{grid-template-columns:1fr 1fr}.control-stack .card{padding:16px}.control-stack .card:last-child{grid-column:1/-1}.results-grid{grid-template-columns:1fr}.section-top{display:block}.metrics{grid-template-columns:1fr 1fr}.metric:last-child{grid-column:1/-1}.two{grid-template-columns:1fr}.plot-card{padding:12px}.task-title{display:block}}
@media(max-width:420px){.shell{padding:0 10px}.main-nav small{margin-left:2px}.control-stack{grid-template-columns:1fr}.metric strong{font-size:1.45rem}.legend{gap:8px}.card{padding:15px}.brand{gap:10px}.row-form{gap:8px}.plot-title{align-items:start}.plot-title h3{font-size:1rem}.plot-title .pill{white-space:normal;text-align:right}.section-top h2{font-size:1.55rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* The classifier's shared visual language, extended for visible text generation. */
textarea{font:inherit;line-height:1.65;border:1px solid #afbecd;border-radius:7px;width:100%;resize:vertical;min-height:160px;padding:12px;color:var(--ink);background:#fff}textarea:focus-visible{outline:3px solid #c07800;outline-offset:3px}.language-layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:18px}.language-controls{display:grid;gap:14px;align-content:start}.language-controls .card{padding:19px}.language-main{min-width:0;display:grid;gap:18px;align-content:start}.field input[type=text]{min-width:0;width:100%;font:inherit;border:1px solid #afbecd;border-radius:6px;padding:10px;min-height:44px}.token-example,.flow-example{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.token-example span,.flow-example span{font-family:ui-monospace,monospace;background:#e4ebf4;padding:8px 12px;border-radius:6px;border:1px solid var(--line);font-weight:600}.flow-example .context-token{background:#d9eef5;color:#156179}.flow-example .next-token{background:#ffe8d0;color:#8c4813}.big-number{font-size:1.45rem}.output-text{font-size:1.25rem;line-height:1.9;min-height:110px;overflow-wrap:anywhere;padding:18px;border-radius:8px;background:#f0f5fb;margin:12px 0}.output-text mark{background:#bde8f4;color:var(--ink);padding:3px;border-radius:4px}.output-text .new-token{color:#95500c;font-weight:750}.pipeline{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:15px 0}.pipeline>div{border:1px solid var(--line);border-radius:8px;padding:12px;min-width:0}.pipeline small{display:block;color:var(--muted);margin-bottom:5px}.pipeline strong{font-size:1rem;overflow-wrap:anywhere}.pipeline .context-stage{background:#e8f6fb}.pipeline .selection-stage{background:#fff3e5}.candidate-table td.word{font-weight:750;color:#146880}.candidate-table td{white-space:normal}.candidate-table button{padding:5px 9px;font-size:.875rem;min-height:38px;white-space:nowrap}.candidate-bar{height:5px;background:#e1eaf4;border-radius:4px;margin-top:5px;min-width:60px}.candidate-bar span{display:block;background:var(--accent);height:100%;border-radius:4px}.training-stats{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}.training-stats span{background:#eef3f8;font-size:.875rem;padding:3px 8px;border-radius:20px}.status-note{font-size:.875rem;color:var(--muted)}.evidence-item{padding:7px 10px;border-left:3px solid #89bdce;margin:5px 0;background:#f4f8fc;font-size:.875rem}.evidence-item code{background:transparent}.evidence-item b{color:#a55611}.trace-details{margin-top:18px}.trace-details summary,.model-table summary{cursor:pointer;font-weight:650}.model-table{margin-top:18px}.model-table .table-wrap{max-height:380px}.trace-table{max-height:300px}.context-query{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:12px 0}.context-query label{flex:1;min-width:140px}.notice-line{padding:10px 14px;background:#eaf2ff;border-radius:7px;margin:10px 0;font-size:.875rem}.training-highlight{background:#fff6e6;border-left:4px solid #bd760d}.lab-hint{background:#e8f3fa;padding:12px;border-radius:8px;font-size:.875rem;margin-top:12px}.no-model{padding:20px;border:1px dashed #aab9cb;border-radius:8px;background:#f6f9fc}.training-stats strong{color:var(--ink)}.source-note{font-size:.875rem;color:var(--muted)}
@media(max-width:1100px){.language-layout{grid-template-columns:270px minmax(0,1fr)}.task-layout .language-layout{grid-template-columns:1fr}.task-layout .language-controls{grid-template-columns:1fr 1fr}.task-layout .language-controls>section:last-child{grid-column:1/-1}.pipeline{grid-template-columns:1fr 1fr}.pipeline>div:last-child{grid-column:1/-1}}
@media(max-width:780px){.language-layout{grid-template-columns:1fr}.language-controls,.task-layout .language-controls{grid-template-columns:1fr 1fr}.language-controls>section:last-child{grid-column:1/-1}.language-main .card{padding:16px}.candidate-table th,.candidate-table td{padding:8px 6px}.output-text{font-size:1.1rem}}
@media(max-width:420px){.language-controls,.task-layout .language-controls{grid-template-columns:1fr}.pipeline{grid-template-columns:1fr}.pipeline>div:last-child{grid-column:auto}.candidate-table{min-width:400px}.main-nav small{margin-left:2px}.output-text{padding:12px}.language-controls .card{padding:15px}}
