:root{--color-primary:#1a4a7a;--color-primary-hover:#12335a;--color-accent:#c0392b;--color-background:#fff;--color-surface:#f5f7fa;--color-border:#d0d7e3;--color-text:#1c1c1e;--color-text-muted:#5a6272;--color-link:#1a4a7a;--color-link-hover:#c0392b;--font-body:system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;--font-heading:system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, monospace;--line-height-body:1.65;--line-height-heading:1.2;--content-max-width:72ch;--page-max-width:90rem;--spacing-base:1rem;--tag-color:var(--color-surface);--tag-background:var(--color-link);--color-aside:#d0e3d7;--color-aside-border:var(--color-text-muted)}*,:before,:after{box-sizing:border-box}body{margin:0;background:var(--color-background);color:var(--color-text);font-family:var(--font-body);font-size:1.0625rem;line-height:var(--line-height-body)}img,picture,svg{display:block;max-width:100%}.skip-nav{position:absolute;top:-100%;left:0;padding:.5rem 1rem;background:var(--color-primary);color:#fff;font-weight:700;text-decoration:none;z-index:1000;border-radius:0 0 4px;transition:top .1s}.skip-nav:focus{top:0;outline:3px solid var(--color-accent);outline-offset:2px}.page-wrapper{max-width:var(--page-max-width);margin:0 auto;padding:0 var(--spacing-base)}.site-header{background:var(--color-primary);color:#fff;padding:0}.site-header .page-wrapper{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.75rem}.site-title{margin:0;font-size:1.2rem;font-weight:700;line-height:1}.site-title a{color:#fff;text-decoration:none}.site-title a:hover,.site-title a:focus{text-decoration:underline}.site-nav{display:flex;gap:1.25rem;list-style:none;margin:0;padding:0}.site-nav a{color:#ffffffe0;text-decoration:none;font-size:.95rem}.site-nav a:hover,.site-nav a:focus{color:#fff;text-decoration:underline}main{padding-block:2.5rem}.content-wrapper{max-width:var(--content-max-width)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:var(--line-height-heading);margin-block:1.5em .5em;color:var(--color-text)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}h4{font-size:1.1rem}p{margin-block:0 1em;max-width:var(--content-max-width)}a{color:var(--color-link);text-decoration:underline;text-underline-offset:2px}a:hover,a:focus{color:var(--color-link-hover)}a:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:2px}code,kbd,samp{font-family:var(--font-mono);font-size:.88em;background:var(--color-surface);padding:.1em .3em;border-radius:3px}pre{background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;padding:1rem;overflow-x:auto}pre code{background:0 0;padding:0}blockquote{border-left:4px solid var(--color-border);margin-inline:0;padding-inline-start:1.25rem;color:var(--color-text-muted)}ul,ol{padding-inline-start:1.5rem;max-width:var(--content-max-width)}dt{font-style:italic}.blurb{font-size:.9rem}aside.exercise-content{border:1px solid var(--color-aside-border);border-radius:8px;padding:1.25rem;background:var(--color-aside);display:flex;flex-direction:column;gap:.5rem;max-width:var(--content-max-width)}aside.exercise-content p:first-child:before{content:"💡";margin-inline-end:.75rem}aside.exercise-content p{margin-block:0}aside.exercises-section{background:var(--color-surface)}.selfie{display:flex;flex-direction:row;align-items:flex-start;overflow:hidden}.selfie img{flex:none;margin-inline-end:1rem;width:min(calc(var(--content-max-width) / 3), 40vw);height:auto}@media (width<=480px){.selfie{flex-direction:column}.selfie img{width:50%;margin-inline-end:0;margin-block-end:1rem}}.sequence-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--color-border);font-size:.9rem}.seq-prev{margin-right:auto}.seq-next{margin-left:auto;text-align:right}.seq-empty{display:block}.site-footer{border-top:1px solid var(--color-border);padding-block:1.5rem;color:var(--color-text-muted);font-size:.9rem}.entry-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;font-size:.9rem;color:var(--color-text-muted);list-style:none;padding:0}.entry-meta strong{color:var(--color-text)}.entry-meta li{display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap}.work-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));gap:1.25rem;margin-top:1.5rem}.work-hero{display:flex;gap:1.5rem;align-items:flex-start}.work-hero__screenshot{flex:none;max-width:160px;margin:0}.work-hero__screenshot img{display:block;width:100%;height:auto;border-radius:4px}.work-hero__meta{flex:auto;min-width:0;& h1{margin-top:.5rem}}@media (width<=600px){.work-hero{flex-direction:column}.work-hero__screenshot{max-width:100%}}.work-body{border-top:1px solid var(--color-border);padding-block:1.5rem;margin-block:1.5rem}.work-card{border:1px solid var(--color-border);border-radius:8px;padding:1.25rem;background:var(--color-surface);display:flex;flex-direction:column;gap:.5rem}.work-card h2,.work-card h3{margin:0;font-size:1.1rem}.work-card h2 a,.work-card h3 a{color:var(--color-link);text-decoration:none}.work-card h2 a:hover,.work-card h3 a:hover{text-decoration:underline;color:var(--color-link-hover)}.work-card .card-meta{font-size:.85rem;color:var(--color-text-muted)}.work-card .tag-list{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;padding:0;margin:0}.work-card .tag-list .tag{background:var(--color-primary);color:#fff;font-size:.65rem;padding:.15em .5em;border-radius:3px}.work-card p{margin-block:0}.link-section{margin-top:2rem}.link-section h2{font-size:1.25rem;border-bottom:1px solid var(--color-border);padding-bottom:.25rem;margin-bottom:.75rem}.link-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:.6rem}.link-list-item{display:grid;grid-template-columns:auto 1fr;gap:0 .5rem;align-items:baseline}.link-list-item .link-label{font-weight:600}.link-list-item .link-desc{color:var(--color-text-muted);font-size:.9rem}.link-list-item .link-desc:before{content:"— "}.play-section{margin-top:2rem}.play-toggle{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;background:var(--color-primary);color:#fff;border:none;border-radius:5px;font-size:1rem;font-family:var(--font-body);cursor:pointer;text-decoration:none}.play-toggle:hover,.play-toggle:focus{background:var(--color-primary-hover);outline:2px solid var(--color-accent);outline-offset:2px}.index-group{margin-top:2.5rem}.index-group-key{font-size:1.2rem;border-bottom:2px solid var(--color-border);padding-bottom:.3rem;margin-bottom:1rem;text-transform:capitalize}.browse-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:1rem;margin-top:1.5rem}.browse-card{border:1px solid var(--color-border);border-radius:8px;padding:1.25rem;text-align:center;background:var(--color-surface);text-decoration:none;color:var(--color-link);font-weight:600;display:block}.browse-card:hover,.browse-card:focus{background:var(--color-primary);color:#fff;text-decoration:none}.exercise-card{border:1px solid var(--color-border);border-radius:8px;max-width:var(--content-max-width);padding:1.25rem;background:var(--color-surface);& h3{margin-block-start:0;margin-block-end:.5em;font-style:italic}}ul.tag-list{display:inline-flex;padding-inline-start:.1rem}ul.tag-list li.tag{background-color:var(--tag-background);border-radius:8px;color:var(--tag-color);display:inline-block;font-size:.8rem;font-weight:700;padding:0 1rem;text-align:center;margin:0 .1rem}.exercises-section{margin-top:2.5rem;padding-top:1.5rem;border-top:2px solid var(--color-border)}.exercises-section h2{margin-top:0}.exercise-item{margin-bottom:1.25rem}.exercise-item h3{margin-bottom:.25rem;font-size:1.05rem}@media (width<=600px){.site-header .page-wrapper{flex-direction:column;align-items:flex-start}h1{font-size:1.5rem}h2{font-size:1.25rem}}