:root{color-scheme:dark;--bg:var(--theme-bg);--panel:var(--theme-panel);--panel-deep:var(--theme-deep);--line:var(--theme-line);--text:var(--theme-text);--muted:#a1b2ce;--subtle:#8095b7;--accent:var(--theme-strong);--accent-bright:#b7d8ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:radial-gradient(ellipse at 85% 0%,color-mix(in srgb,var(--theme-line) 22%,transparent),transparent 48%),var(--bg);font-size:14px;-webkit-font-smoothing:antialiased}button,select,input{font:inherit}a{color:var(--accent)}button{cursor:pointer}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button,select,input{color:var(--text);background:var(--theme-control);border:1px solid var(--theme-border);border-radius:8px;min-height:44px;padding:11px 16px}button{transition:background .18s,border-color .18s,box-shadow .18s}button:hover{background:var(--theme-line);border-color:#6488ba;box-shadow:0 0 0 3px #89b8ff09}select{padding-right:12px}input{width:76px;padding:10px}header{max-width:1440px;height:88px;margin:auto;padding:0 60px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid color-mix(in srgb,var(--theme-line) 50%,transparent)}.brand{font-size:12px;font-weight:650;letter-spacing:1.4px;text-decoration:none;color:var(--text);display:flex;align-items:center;gap:13px}.brandmark{font-size:24px;line-height:1;color:var(--accent);padding:9px;border:1px solid #46669480;border-radius:11px;background:color-mix(in srgb,var(--theme-line) 38%,transparent)}.header-right{display:flex;align-items:center;gap:28px}.projects-link{font-size:12px;text-decoration:none;color:var(--muted);padding:10px 0}.projects-link:hover{color:var(--accent-bright)}.local{font:10px ui-monospace,monospace;letter-spacing:1px;color:var(--subtle)}.local i,.prediction-footer i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#8bc0ff;margin-right:9px;box-shadow:0 0 9px #8bc0ff60}main{max-width:1300px;margin:auto;padding:0 48px}.intro{display:flex;align-items:center;justify-content:space-between;gap:30px;margin:50px 0 36px}.eyebrow{font:10px ui-monospace,monospace;letter-spacing:1.7px;color:#92b3df}h1{font-size:clamp(30px,3.5vw,44px);font-weight:550;line-height:1.2;letter-spacing:-1.4px;margin:17px 0 14px}p{color:var(--muted);line-height:1.8}.intro p{font-size:14px;margin:0;max-width:520px}.model-summary{display:flex;flex-direction:column;gap:11px;flex-shrink:0;text-align:right;font:11px ui-monospace,monospace;color:#b3c7e4;padding:19px 23px;background:color-mix(in srgb,var(--theme-control) 18%,transparent);border:1px solid color-mix(in srgb,var(--theme-border) 40%,transparent);border-radius:12px}#accuracy{color:var(--accent-bright)}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel{background:linear-gradient(145deg,color-mix(in srgb,var(--theme-control) 44%,transparent),transparent 60%),var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 32px color-mix(in srgb,var(--theme-bg) 13%,transparent)}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:28px 32px}h2{font-size:16px;font-weight:600;letter-spacing:-.2px;margin:0}h2>span{color:#7e9cc7;font:11px ui-monospace,monospace;margin-right:14px}.tag{font:10px ui-monospace,monospace;letter-spacing:.5px;border:1px solid var(--theme-border);padding:8px 10px;border-radius:6px;color:#bdd3ef;background:color-mix(in srgb,var(--theme-control) 38%,transparent)}.draw-wrap{position:relative;margin:0 32px;aspect-ratio:1;background:var(--theme-bg);border:1px solid var(--theme-active);border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 24px #0008}#draw{width:100%;height:100%;object-fit:contain;touch-action:none;cursor:crosshair;border-radius:12px}#draw.paused{cursor:default;opacity:.75}#hint{position:absolute;pointer-events:none;display:flex;align-items:center;flex-direction:column;font-size:20px;font-weight:450;color:#8a9dbb;gap:14px;padding:24px;text-align:center}#hint span{font-size:12px;color:#6f83a4}.corner{position:absolute;width:17px;height:17px;pointer-events:none}.tl{top:17px;left:17px;border-top:1px solid #496991;border-left:1px solid #496991}.br{right:17px;bottom:17px;border-bottom:1px solid #496991;border-right:1px solid #496991}.draw-actions{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 32px}.draw-actions button{font-size:12px}.brush{display:flex;gap:8px;color:var(--accent);font-size:16px;white-space:nowrap}.brush span{font-size:10px;color:var(--subtle);align-self:center}.sample-label{font:10px ui-monospace,monospace;letter-spacing:1.2px;color:var(--subtle);padding:6px 32px 15px}.samples{display:grid;grid-template-columns:repeat(10,1fr);gap:7px;padding:0 32px 28px}.samples button{font:16px ui-monospace,monospace;padding:0;background:var(--theme-control);border-color:var(--theme-active);min-height:44px}.samples button:hover{color:var(--accent-bright);background:var(--theme-line)}.input-footer{display:flex;align-items:center;gap:17px;padding:23px 32px;border-top:1px solid var(--line);background:var(--theme-deep)}.input-footer canvas{width:46px;height:46px;image-rendering:pixelated;border:1px solid var(--theme-border);border-radius:5px}.input-footer strong{font-size:12px;font-weight:550;display:block;margin-bottom:9px}.input-footer span{font:10px ui-monospace,monospace;color:var(--subtle)}.input-footer .arrow{font-size:24px;margin-left:auto;color:var(--accent)}.result{display:flex;align-items:center;gap:29px;padding:12px 36px 36px}#digit{font-size:132px;line-height:1.1;font-weight:350;color:var(--theme-accent);min-width:90px;letter-spacing:-7px;text-shadow:0 0 40px #4a89de20}.result .eyebrow{font-size:10px;letter-spacing:1.2px}.result strong{display:block;font-size:20px;font-weight:500;line-height:1.5;margin-top:12px}.result p{font-size:12px;max-width:245px;margin:11px 0 0}.distribution-heading{display:flex;justify-content:space-between;gap:16px;margin:0 32px 18px;font:10px ui-monospace,monospace;letter-spacing:.65px;color:var(--subtle)}#bars{padding:0 32px 14px}.prob{display:flex;align-items:center;gap:16px;height:33px;color:#8ca2c3;font:12px ui-monospace,monospace}.prob>span{width:12px;text-align:center}.track{height:7px;background:var(--theme-control);flex:1;border-radius:5px;overflow:hidden}.track>div{background:var(--theme-border);width:0;height:100%;border-radius:5px;transition:width .1s}.prob output{width:58px;text-align:right;font-size:11px}.prob.winner{color:#bcdcff}.prob.winner .track>div{background:linear-gradient(90deg,#79a8ef,#b5d7ff)}.prediction-footer{border-top:1px solid var(--line);margin-top:23px;padding:25px 32px;display:flex;justify-content:space-between;gap:14px;font:10px ui-monospace,monospace;color:#91a9ce;background:var(--theme-deep)}.network{margin-top:26px}.network .sub{margin:12px 0 0 30px;font-size:12px}.network button{font-size:12px;padding:12px 18px}.network-meta{display:flex;gap:22px;align-items:center;flex-wrap:wrap;padding:0 32px}.network-meta>.tag{letter-spacing:0;font-size:10px;padding:10px 13px}.network-meta>span:last-child{font-size:11px;color:var(--muted)}.connection-controls{display:flex;align-items:center;flex-wrap:wrap;gap:20px 30px;margin:26px 32px 18px;padding:21px 22px;background:var(--theme-deep);border:1px solid var(--theme-active);border-radius:12px}.connection-controls label{display:flex;align-items:center;gap:13px;color:#bbcee8;font-size:12px}.connection-controls select{font-size:11px;min-height:44px;max-width:260px}.connection-strength input{padding:0;accent-color:var(--accent);width:112px;min-height:44px;touch-action:pan-y}.connection-strength output{font:11px ui-monospace,monospace;min-width:35px}.connection-controls>span{font:11px ui-monospace,monospace;color:#a6c5ed;margin-left:auto}.connection-key{display:flex;flex-wrap:wrap;gap:13px 24px;padding:0 32px;color:#a8bbd8;font:10px/1.9 ui-monospace,monospace}.connection-key b{font-size:14px}.connection-key>span:last-child{flex:1;min-width:220px;color:#91a7c6}.negative{color:#ed95ac}.positive{color:#92c4ff}.network-scroll{overflow-x:auto;margin:32px 20px 0;scrollbar-color:#466a98 var(--theme-deep);scrollbar-width:thin}.layer-labels{min-width:1500px;display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font:10px ui-monospace,monospace;color:#a6bddd;letter-spacing:.2px}.layer-labels strong{display:block;font:18px ui-monospace,monospace;margin:14px 0 9px;color:#ddeaff}.layer-labels small{font:10px ui-monospace,monospace;color:#879fbe}.network-scroll:after{content:"Scroll horizontally to inspect all layers →";display:block;color:#91a9cd;font:10px ui-monospace,monospace;padding:12px 13px 22px;position:sticky;left:0;width:320px}.legend{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:8px 32px 28px;font-size:10px;color:#9db2d1;line-height:1.7}.legend>span:first-child{display:flex;align-items:center;gap:9px;white-space:nowrap}.gradient{display:inline-block;background:linear-gradient(90deg,var(--theme-control),#9eceff);width:65px;height:7px;border-radius:5px}.legend b{font-weight:400}.inspector{display:grid;grid-template-columns:1fr 1fr;gap:36px;padding:30px 32px;border-top:1px solid var(--line);background:var(--theme-deep)}.selectors{display:flex;align-items:center;gap:16px;margin-top:21px}.selectors label,.weight-value{display:flex;align-items:center;gap:11px;color:#a6bddd;font-size:11px}.selectors select{max-width:190px}.inspector p{font:11px/1.95 ui-monospace,monospace;color:#b1c5e2;margin:20px 0 0;overflow-wrap:anywhere}.weight-heading{display:flex;justify-content:space-between;gap:20px;color:#9fb7d9;font-size:10px;margin-bottom:19px;line-height:1.8}.weights canvas{display:block;width:100%;height:auto;object-fit:contain;object-position:left}.weight-value{margin-top:20px;flex-wrap:wrap;row-gap:13px}.weight-value output{font:11px/1.8 ui-monospace,monospace;color:#c5dcfc}.technical{margin:30px 0;background:var(--theme-panel);border:1px solid var(--line);border-radius:14px;padding:24px 32px}.technical summary{cursor:pointer;min-height:28px;color:#c6d8f2;font-size:13px;line-height:28px}.technical-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px;margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}.technical h3{font-size:13px;font-weight:550;color:#d8e6fc;margin:0 0 13px}.technical p{font:11px/1.95 ui-monospace,monospace;margin:0;color:#aabedb}.technical p+p{margin-top:15px}.technical a{text-underline-offset:4px}footer{padding:29px 0 40px;margin-top:36px;border-top:1px solid color-mix(in srgb,var(--theme-line) 56%,transparent);display:flex;justify-content:space-between;gap:20px;color:#94a9c9;font-size:11px}footer>span:last-child{font:9px ui-monospace,monospace;letter-spacing:.5px}@media(min-width:1000px){.drawing .draw-wrap{width:calc(100% - 64px);max-width:350px;margin-left:auto;margin-right:auto}.prediction{display:flex;flex-direction:column}.prediction #bars{flex:1}}@media(max-width:900px){header{padding:0 32px}main{padding:0 28px}.model-summary{font-size:10px;padding:16px}.panel-heading{padding:25px}.draw-wrap{margin:0 25px}.draw-actions{padding:20px 25px}.brush{font-size:12px}.brush span{font-size:9px}.samples{padding-left:25px;padding-right:25px;gap:4px}.result{padding:12px 26px 30px;gap:20px}#digit{font-size:112px}.result strong{font-size:17px}.result p{font-size:11px}}@media(max-width:700px){header{height:76px;padding:0 20px}.brand{font-size:10px;letter-spacing:.8px;gap:9px}.brandmark{font-size:21px;padding:7px}.header-right{gap:18px}.projects-link{font-size:11px}.local{display:none}main{padding:0 18px}.intro{margin:35px 0 28px;align-items:flex-start;flex-direction:column;gap:22px}h1{font-size:32px;letter-spacing:-.8px;margin:13px 0}.intro p{font-size:13px;line-height:1.85}.model-summary{padding:16px 19px;gap:11px;text-align:left;font-size:10px;width:100%}.workspace{grid-template-columns:1fr;gap:20px}.panel{border-radius:13px}.panel-heading{padding:25px 23px}.draw-wrap{margin:0 23px}.draw-actions{padding:20px 23px}.sample-label{padding:8px 23px 15px}.samples{padding:0 23px 25px;gap:5px}.samples button{font-size:14px;min-height:40px}.input-footer{padding:23px;gap:14px}.input-footer strong{font-size:11px}.input-footer span{font-size:9px}.result{padding:4px 25px 28px;gap:23px}#digit{font-size:116px}.result strong{font-size:18px}.result p{font-size:11px}.distribution-heading{margin:0 23px 15px;font-size:9px}#bars{padding:0 23px 14px}.prob{height:34px}.prediction-footer{padding:23px;margin-top:18px}.network{margin-top:23px}.network .panel-heading{align-items:flex-start;gap:12px}.network h2{font-size:15px}.network .sub{font-size:11px;margin:12px 0 0}.network button{max-width:135px;padding:11px 12px;font-size:10px}.network-meta{padding:0 23px;gap:14px}.network-meta>.tag{font-size:9px;padding:9px 10px;line-height:1.7}.network-meta>span:last-child{font-size:10px;line-height:1.8}.connection-controls{margin:23px 23px 18px;gap:15px;padding:17px}.connection-controls label{flex-wrap:wrap;gap:10px;font-size:11px}.connection-controls select{max-width:100%;font-size:10px}.connection-controls>span{margin-left:0;font-size:10px}.connection-key{padding:0 23px;gap:12px 17px;font-size:9px}.connection-key>span:last-child{flex-basis:100%;min-width:0}.network-scroll{margin:28px 8px 0}.legend{padding:8px 23px 25px;flex-direction:column;align-items:flex-start;gap:14px;font-size:9px}.inspector{grid-template-columns:1fr;padding:28px 23px;gap:28px}.selectors{gap:13px;flex-wrap:wrap}.selectors select{font-size:11px;max-width:166px}.selectors label,.inspector p{font-size:10px}.weight-heading{font-size:9px;gap:15px}.weight-value{gap:9px;font-size:10px}.weight-value output{font-size:10px}.technical{padding:22px 23px;margin-top:25px}.technical-grid{grid-template-columns:1fr;gap:26px}.technical p{font-size:10px}footer{flex-direction:column;gap:16px;padding:26px 3px 32px;margin-top:28px;line-height:1.7}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}