:root{--paper: #faf7f0;--paper-card: #f5f0e6;--paper-sunk: #efe9db;--grid: rgba(96, 108, 128, .1);--grid-strong: rgba(96, 108, 128, .16);--ink: #2a2a28;--ink-soft: #6d6a60;--ink-faint: #9a968a;--rule: #ddd5c5;--red: #d6452c;--red-ink: #b5391f;--red-wash: rgba(214, 69, 44, .1);--red-line: rgba(214, 69, 44, .35);--moss: #4a6b52;--moss-wash: rgba(74, 107, 82, .12);--font-body: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Songti SC", "Noto Serif CJK SC", serif;--font-hand: "Bradley Hand", "Segoe Print", "Comic Sans MS", var(--font-body);--font-mono: "SF Mono", "JetBrains Mono", "Fira Code", Menlo, Consolas, monospace;--maxw: 860px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.7;background-color:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--red-ink);text-decoration-color:var(--red-line);text-underline-offset:2px}a:hover{text-decoration-color:var(--red)}:focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:2px}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(16px,4vw,40px);background:color-mix(in srgb,var(--paper) 88%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}.wordmark{display:inline-flex;align-items:baseline;gap:8px;font-weight:700;font-size:19px;color:var(--ink);text-decoration:none;letter-spacing:.01em}.wordmark .mark{font-family:var(--font-mono);color:var(--red-ink);font-size:15px;letter-spacing:-.04em}.wordmark .sub{font-size:12.5px;color:var(--ink-faint);font-weight:400}.topnav{display:flex;align-items:center;gap:18px;font-size:14.5px}.topnav a{color:var(--ink-soft);text-decoration:none}.topnav a:hover,.topnav a.active{color:var(--red-ink)}.topbar-left{display:flex;align-items:center;gap:14px}.nav-toggle{background:transparent;border:1px solid var(--rule);border-radius:5px;width:30px;height:30px;cursor:pointer;color:var(--ink-soft);font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.nav-toggle:hover{border-color:var(--red-line);color:var(--red-ink)}.body{display:flex;align-items:flex-start}.sidebar{position:sticky;top:55px;align-self:flex-start;flex-shrink:0;width:236px;max-height:calc(100vh - 55px);overflow-y:auto;padding:22px 10px 48px 20px;border-right:1px solid var(--rule)}.content{flex:1;min-width:0}.side-home{display:block;font-family:var(--font-mono);font-size:12.5px;color:var(--ink-soft);text-decoration:none;padding:6px 10px;border-radius:5px;margin-bottom:14px}.side-home:hover{color:var(--red-ink)}.side-home.is-active{background:var(--red-wash);color:var(--red-ink)}.side-cat{margin-bottom:18px}.side-cat-name{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-faint);letter-spacing:.04em;margin:0 0 6px 10px}.side-cat ul{list-style:none;margin:0;padding:0}.side-link{display:block;padding:5px 10px;border-radius:5px;font-size:14.5px;text-decoration:none;color:var(--ink);line-height:1.35}.side-link.is-live:hover{background:#2a2a280a;color:var(--red-ink)}.side-link.is-active{background:var(--red-wash);color:var(--red-ink);font-weight:600}.side-link.is-planned{color:var(--ink-faint);cursor:default}.nav-scrim{display:none}@media (max-width: 960px){.sidebar{position:fixed;top:53px;left:0;bottom:0;width:262px;z-index:30;background:var(--paper);max-height:none;box-shadow:3px 0 20px #0000001f}.nav-scrim{display:block;position:fixed;top:53px;right:0;bottom:0;left:0;background:#0000002e;z-index:25}}.wrap{max-width:var(--maxw);margin:0 auto;padding:clamp(20px,4vw,44px) clamp(16px,4vw,40px) 80px}.hero{margin:12px 0 40px}.hero h1{font-size:clamp(30px,6vw,44px);line-height:1.15;margin:0 0 14px;letter-spacing:-.01em}.hero h1 .accent{position:relative;color:var(--red-ink);white-space:nowrap}.hand-underline{display:inline;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10' viewBox='0 0 120 10'%3E%3Cpath d='M2 6 Q30 1 60 5 T118 4' fill='none' stroke='%23d6452c' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left bottom;background-size:100% 8px;padding-bottom:6px}.hero .lede{font-size:18px;color:var(--ink-soft);max-width:46em;margin:0}.hero .lede .hand{font-family:var(--font-hand);color:var(--red-ink);font-style:italic}.cat{margin-top:44px}.cat-head{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}.cat-head h2{font-size:20px;margin:0;letter-spacing:.01em}.cat-head .count{font-family:var(--font-mono);font-size:12.5px;color:var(--ink-faint)}.cat-blurb{color:var(--ink-soft);font-size:14.5px;margin:0 0 18px}.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}.card{display:flex;flex-direction:column;gap:8px;padding:18px 18px 16px;border-radius:4px;background:var(--paper-card);border:1px solid var(--rule);text-decoration:none;color:inherit;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;position:relative}.card.is-live:hover{transform:translateY(-2px);border-color:var(--red-line);box-shadow:3px 4px 0 var(--red-wash)}.card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.card-meta{display:inline-flex;align-items:center;gap:8px;min-width:0}.card-num{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);letter-spacing:.04em;overflow:hidden;text-overflow:ellipsis}.chip-level{font-size:10.5px;padding:1px 6px;border-radius:999px;white-space:nowrap;font-family:var(--font-mono);letter-spacing:.02em}.chip-level.lv-basic{color:var(--moss);background:var(--moss-wash)}.chip-level.lv-adv{color:var(--ink-soft);background:#2a2a280f}.card h3{font-size:18px;margin:0;line-height:1.3}.card .hook{font-size:14px;color:var(--ink-soft);margin:0;line-height:1.55}.badge{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;padding:2px 7px;border-radius:999px;text-transform:uppercase}.badge.live{color:var(--red-ink);background:var(--red-wash)}.badge.todo{color:var(--ink-faint);background:transparent;border:1px dashed var(--ink-faint)}.card.is-planned{background:transparent;border-style:dashed;border-color:#cfc7b6;cursor:default}.card.is-planned h3{color:var(--ink-soft)}.card.is-planned .todo-note{font-family:var(--font-hand);font-style:italic;color:var(--ink-faint);font-size:14px;margin-top:auto}.crumb{font-family:var(--font-mono);font-size:12.5px;color:var(--ink-faint);margin-bottom:10px}.crumb a{color:var(--ink-soft);text-decoration:none}.crumb a:hover{color:var(--red-ink)}.masthead{margin-bottom:24px;padding-bottom:20px;border-bottom:1.5px solid var(--rule)}.masthead h1{font-size:clamp(26px,5vw,34px);margin:0 0 8px;letter-spacing:-.01em}.masthead .hook{font-family:var(--font-hand);font-style:italic;color:var(--red-ink);font-size:17px;margin:0}.lede{font-size:17.5px;color:var(--ink-soft);margin:18px 0 0}.page h2{font-size:21px;margin:40px 0 10px}.page p{margin:14px 0}.page strong{color:var(--ink)}.k{font-family:var(--font-mono);background:var(--red-wash);color:var(--red-ink);padding:1px 5px;border-radius:3px;font-size:.92em}.landing{margin:40px 0 8px;padding:18px 20px;background:var(--moss-wash);border-left:3px solid var(--moss);border-radius:0 4px 4px 0}.landing .tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss)}.landing p{margin:6px 0 0;font-size:15.5px}.lab{margin:28px 0;padding:20px;border-radius:6px;background:var(--paper-card);border:1px solid var(--rule)}.lab-panels{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.lab-panel{flex:1 1 300px;min-width:260px}.lab-panel h4{margin:0 0 8px;font-size:13px;font-family:var(--font-mono);color:var(--ink-soft);font-weight:600;letter-spacing:.02em;text-align:center}.lab svg{width:100%;height:auto;max-width:100%;display:block;touch-action:none;overflow:hidden}.controls{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:20px;padding-top:18px;border-top:1px dashed var(--rule)}.control{display:flex;flex-direction:column;gap:4px;min-width:150px}.control label{font-size:12.5px;color:var(--ink-soft);font-family:var(--font-mono);display:flex;justify-content:space-between;gap:10px}.control label b{color:var(--red-ink);font-weight:600}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:3px;background:var(--rule);outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:17px;height:17px;border-radius:50%;background:var(--red);border:2px solid var(--paper);cursor:grab;box-shadow:0 1px 3px #0003}input[type=range]::-webkit-slider-thumb:active{cursor:grabbing}input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--red);border:2px solid var(--paper);cursor:grab}.seg{display:inline-flex;border:1px solid var(--rule);border-radius:5px;overflow:hidden}.seg button{font-family:var(--font-body);font-size:13.5px;padding:5px 12px;background:transparent;border:none;color:var(--ink-soft);cursor:pointer;border-right:1px solid var(--rule)}.seg button:last-child{border-right:none}.seg button.on{background:var(--red-wash);color:var(--red-ink);font-weight:600}.player{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:20px;padding-top:18px;border-top:1px dashed var(--rule)}.btn{font-family:var(--font-body);font-size:13.5px;line-height:1.5;padding:5px 12px;border-radius:5px;border:1px solid var(--rule);background:transparent;color:var(--ink-soft);cursor:pointer}.btn:hover:not(:disabled){border-color:var(--red-line);color:var(--red-ink)}.btn:disabled{opacity:.38;cursor:default}.btn.primary{background:var(--red-wash);border-color:var(--red-line);color:var(--red-ink);font-weight:600;min-width:60px}.player .scrub{flex:1 1 120px;min-width:90px}.frame-count{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);white-space:nowrap}.step-note{margin-top:16px;padding:9px 13px;border-radius:5px;background:var(--paper-sunk);font-family:var(--font-mono);font-size:13px;line-height:1.6;color:var(--ink);min-height:1.6em}.step-note em{font-style:normal;color:var(--red-ink);font-weight:600}.step-note .done{color:var(--moss);font-weight:600}.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:14px;font-size:12.5px;color:var(--ink-soft)}.legend span{display:inline-flex;align-items:center;gap:6px}.legend i{width:11px;height:11px;border-radius:2px;display:inline-block;flex-shrink:0}.readout{display:flex;flex-wrap:wrap;gap:18px 28px;margin-top:18px;font-family:var(--font-mono);font-size:13px}.readout .item{display:flex;flex-direction:column}.readout .item .lbl{color:var(--ink-faint);font-size:11px}.readout .item .val{color:var(--red-ink);font-size:17px}.matrix-box{font-family:var(--font-mono);font-size:13.5px;color:var(--ink);background:var(--paper-sunk);padding:10px 14px;border-radius:5px;display:inline-block;line-height:1.5}.page-foot{margin-top:40px;padding-top:18px;border-top:1px solid var(--rule);font-family:var(--font-mono);font-size:12.5px;color:var(--ink-faint)}.site-footer{max-width:var(--maxw);margin:0 auto;padding:30px clamp(16px,4vw,40px);border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px;color:var(--ink-faint)}.site-footer a{color:var(--ink-soft);text-decoration:none}.page-loading{padding:60px;text-align:center;color:var(--ink-faint);font-family:var(--font-mono)}@media (max-width: 560px){body{font-size:16px}.grid{grid-template-columns:1fr}}
