.tut-page{background:var(--bg-page)}.tut-wrap{max-width:52rem;margin:0 auto;padding:2.5rem 1.5rem 4rem;display:grid;gap:1.6rem;min-width:0}.tut-backlink{justify-self:start;display:inline-flex;align-items:center;gap:.45rem;margin-bottom:-.4rem;font:500 .8rem/1 var(--font-mono);letter-spacing:.02em;color:var(--oat-400);text-decoration:none;transition:color var(--dur-fast)}.tut-backlink:hover{color:var(--brand-blue)}.tut-backlink .arw{transition:transform var(--dur-md) var(--ease-arrow)}.tut-backlink:hover .arw{transform:translate(-3px)}.tut-hero{display:grid;gap:.85rem}.tut-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font:500 .72rem/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--oat-400)}.tut-meta .dot{opacity:.5}.tut-eyebrow{font:500 .74rem/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--brand-blue)}.tut-hero h1{font-size:clamp(2.1rem,4.6vw,3.1rem);line-height:1.04;letter-spacing:-.02em}.tut-hero h1 .flourish{font-family:var(--font-serif);font-style:italic;font-weight:300}.tut-subrow{display:flex;align-items:flex-start;justify-content:space-between;gap:1.2rem;flex-wrap:wrap}.tut-subtitle{font-size:1.15rem;line-height:1.5;color:var(--text-muted);max-width:34em;flex:1 1 60%;min-width:min(100%,20rem)}.tut-docbar{display:flex;align-items:center;gap:.7rem;flex:none;margin-top:.15rem}button.tut-docbtn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:var(--radius-pill);cursor:pointer;white-space:nowrap;font:600 .82rem/1 var(--font-sans);letter-spacing:-.01em;color:var(--oat-500);background:var(--white);border:1.5px solid var(--oat-300);box-shadow:var(--shadow-card);transition:border-color var(--dur-md) var(--ease-machine),color var(--dur-md) var(--ease-machine),transform var(--dur-md) var(--ease-machine),background var(--dur-md) var(--ease-machine)}button.tut-docbtn:hover{border-color:var(--brand-blue);color:var(--brand-blue);transform:translateY(-1px)}.tut-docbtn svg{width:16px;height:16px;flex:none}.tut-docbtn .ic-done{display:none}button.tut-docbtn.is-copied{background:var(--matcha-300);border-color:var(--matcha-300);color:var(--white)}.tut-docbtn.is-copied .ic-copy{display:none}.tut-docbtn.is-copied .ic-done{display:inline-flex}.tut-dochint{display:none;font-size:.78rem;color:var(--oat-400);max-width:15rem;line-height:1.4}@media(min-width:1100px){.tut-dochint{display:block}}.tut-body{display:grid;gap:1.15rem;min-width:0}.tut-body>*{min-width:0}.tut-body h2{font-size:1.7rem;margin:1.4rem 0 .1rem;letter-spacing:-.02em;scroll-margin-top:5rem}.tut-body h2 .flourish{font-family:var(--font-serif);font-style:italic;font-weight:300}.tut-body h3{font-size:1.2rem;margin:.8rem 0 -.2rem}.tut-body p{font-size:1.04rem;line-height:1.68;color:var(--oat-500)}.tut-body ul,.tut-body ol.tut-plain{margin:.1rem 0 .3rem;padding-left:1.25rem;display:grid;gap:.45rem}.tut-body li{font-size:1.02rem;line-height:1.6;color:var(--oat-500)}.tut-body ul li::marker{color:var(--brand-blue)}.tut-body b,.tut-body strong{font-weight:600;color:var(--oat-500)}.tut-body a:not(.btn):not(.tut-btn){color:var(--brand-blue);text-decoration:underline;text-underline-offset:2px;font-weight:500}.tut-body code:not(pre code){font-family:var(--font-mono);font-size:.88em;background:var(--oat-200);border:1px solid var(--oat-300);border-radius:6px;padding:.05em .4em;color:var(--grey-800)}.tut-lead{font-size:1.18rem!important;line-height:1.55!important;color:var(--text-muted)!important}.tut-steps{list-style:none;margin:.4rem 0;padding:0;display:grid;gap:.9rem}.tut-step{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;padding:1.15rem 1.3rem;border-radius:var(--radius-lg);background:var(--white);box-shadow:var(--elev-card)}.tut-step-n{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:50%;flex:none;font:700 1rem/1 var(--font-sans);color:var(--white);background:var(--brand-blue)}.tut-step-body{display:grid;gap:.4rem;min-width:0}.tut-step-body h4{font-size:1.08rem;font-weight:600;letter-spacing:-.01em}.tut-step-body p{font-size:.98rem;line-height:1.6;color:var(--oat-500);margin:0}.tut-step-body p+p{margin-top:.4rem}.tut-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7em 1.2em;border-radius:var(--radius-btn);font:500 1rem/1 var(--font-sans);text-decoration:none;white-space:nowrap;border:1px solid transparent;cursor:pointer;transition:background var(--dur-md) var(--ease-machine),transform var(--dur-md) var(--ease-machine),color var(--dur-md) var(--ease-machine)}.tut-btn .arw{transition:transform var(--dur-md) var(--ease-arrow)}.tut-btn:hover .arw{transform:translate(3px)}.tut-btn-ink{background:var(--ink);color:var(--white)}.tut-btn-ink:hover{background:var(--grey-800)}.tut-btn-blue{background:var(--brand-blue);color:var(--white)}.tut-btn-blue:hover{background:var(--blueberry-300)}.tut-btn-ghost{background:var(--white);color:var(--oat-500);box-shadow:inset 0 0 0 1px var(--oat-300)}.tut-btn-ghost:hover{color:var(--brand-blue);box-shadow:inset 0 0 0 1px var(--brand-blue)}.tut-btnrow{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:.2rem 0}.tut-video{margin:.6rem 0;display:grid;gap:.6rem}.tut-video-label{font:600 .68rem/1 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--brand-blue)}.tut-video-frame{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:#0c0d10;box-shadow:var(--shadow-float),var(--ring)}.tut-video-frame iframe,.tut-video-frame video{position:absolute;inset:0;width:100%;height:100%;border:0}.tut-video-frame video{background:#0c0d10;object-fit:contain}.fig{margin:.6rem 0;display:grid;gap:.6rem}.fig-wide{width:min(60rem,calc(100vw - 3rem));margin-left:calc(50% - (min(60rem,calc(100vw - 3rem))/2))}.fig-frame{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--white);box-shadow:var(--shadow-float),var(--ring)}.fig-frame img{display:block;width:100%;height:auto}.fig-chrome{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;background:#f7f8f9;border-bottom:1px solid #e6e8ec}.fig-chrome i{width:.6rem;height:.6rem;border-radius:50%;background:#d6d9df;flex:none}.fig-chrome .fig-url{margin-left:.5rem;font:400 .72rem/1 var(--font-mono);color:#8b909b;display:inline-flex;align-items:center;gap:.35rem}.fig-chrome .fig-src{margin-left:auto;font:500 .62rem/1 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:#a4a9b3}.fig-ph{position:relative;aspect-ratio:16/10;display:grid;place-content:center;justify-items:center;gap:.5rem;padding:1.5rem;text-align:center;background:repeating-linear-gradient(45deg,var(--oat-100),var(--oat-100) 14px,var(--oat-200) 14px,var(--oat-200) 28px)}.fig-ph-ic{font-size:1.7rem;opacity:.8}.fig-ph-name{font:600 .78rem/1 var(--font-mono);color:var(--brand-blue)}.fig-ph-alt{font-size:.82rem;color:var(--text-muted);max-width:34ch;line-height:1.45}.fig-note{position:absolute;z-index:3;display:flex;align-items:center;gap:.3rem;transform:translate(-50%,-50%);pointer-events:none;font:600 .8rem/1.15 var(--font-sans)}.fig-note[data-dir=up],.fig-note[data-dir=down]{flex-direction:column;text-align:center}.fig-arrow{color:#e0212f;font-size:1.5rem;line-height:.7;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));font-weight:700}.fig-label{background:#e0212f;color:#fff;padding:.32rem .6rem;border-radius:.55rem;box-shadow:0 4px 12px -4px #e0212f99;max-width:16rem}.fig-cap{font-size:.85rem;line-height:1.5;color:var(--text-muted);font-style:italic}.tut-callout{display:grid;grid-template-columns:auto 1fr;gap:.8rem;padding:1rem 1.15rem;border-radius:var(--radius-md);font-size:.98rem;line-height:1.6;color:var(--oat-500);background:var(--white);box-shadow:var(--elev-card);border-left:4px solid var(--brand-blue)}.tut-callout .ic{font-size:1.15rem;line-height:1.4}.tut-callout b{font-weight:600}.tut-callout.tip{background:var(--blueberry-100);border-left-color:var(--brand-blue)}.tut-callout.note{border-left-color:var(--oat-400)}.tut-callout.warn{background:var(--tangerine-100);border-left-color:var(--tangerine-300)}.tut-callout.cost{background:var(--lime-100);border-left-color:var(--lime-400)}.tut-copybox{display:grid;gap:.5rem;margin:.5rem 0}.tut-copybox-head{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.tut-copybox-label{font:600 .68rem/1 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--oat-400)}.tut-agent{display:grid;gap:.7rem;padding:1.2rem 1.35rem;border-radius:var(--radius-lg);background:linear-gradient(140deg,#1b1a18,#26241f 78%);color:#ece8df;box-shadow:var(--shadow-float)}.tut-agent .badge{justify-self:start;display:inline-flex;align-items:center;gap:.4rem;padding:.28rem .7rem;border-radius:var(--radius-pill);font:600 .68rem/1 var(--font-mono);letter-spacing:.04em;color:#22201c;background:var(--lemon-300)}.tut-agent h4{color:#fff;font-size:1.05rem}.tut-agent p{color:#cfc9bd;font-size:.94rem;line-height:1.55;margin:0}.tut-agent .tut-copybox-label{color:#a49d8d}.tut-pre{margin:0;padding:.85rem 1rem;border-radius:var(--radius-btn);overflow-x:auto;font:400 .82rem/1.6 var(--font-mono);color:#e9e4d8;background:#131210;border:1px solid #38332b;white-space:pre-wrap;word-break:break-word}.tut-copy{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .8rem;border-radius:var(--radius-pill);cursor:pointer;font:600 .72rem/1 var(--font-sans);color:var(--oat-500);background:var(--white);border:1.5px solid var(--oat-300);transition:border-color var(--dur-md),transform var(--dur-md),background var(--dur-md),color var(--dur-md)}.tut-copy:hover{border-color:var(--brand-blue);transform:translateY(-1px)}.tut-agent .tut-copy{color:#f3efe6;background:#ffffff0f;border-color:#fff6}.tut-agent .tut-copy:hover{background:#ffffff29;border-color:#fff}.tut-copy svg{width:14px;height:14px}.tut-copy .ic-done{display:none}.tut-copy.is-copied{background:var(--matcha-300);border-color:var(--matcha-300);color:#fff}.tut-copy.is-copied .ic-copy{display:none}.tut-copy.is-copied .ic-done{display:inline-flex}.tut-table-wrap{overflow-x:auto;border-radius:var(--radius-lg);box-shadow:var(--ring);background:var(--white);margin:.4rem 0}.tut-table{width:100%;border-collapse:collapse;min-width:34rem;font-size:.95rem}.tut-table th,.tut-table td{text-align:left;padding:.85rem 1.1rem;vertical-align:top;line-height:1.5;border-bottom:1px solid var(--oat-300)}.tut-table thead th{font-size:.78rem;letter-spacing:.03em;text-transform:uppercase;color:var(--text-muted);background:var(--oat-100)}.tut-table tbody tr:last-child td{border-bottom:none}.tut-table td:last-child{white-space:nowrap;font-size:1.02rem;color:var(--lime-600,var(--ink))}.tut-muted{color:var(--text-muted);font-size:.85em}.tut-takeaways{padding:1.15rem 1.4rem;border-radius:var(--radius-lg);background:var(--blueberry-100);box-shadow:var(--ring)}.tut-takeaways h4{font-size:.95rem;margin-bottom:.5rem;color:var(--blueberry-500)}.tut-takeaways ul{margin:0;padding-left:1.2rem;display:grid;gap:.4rem}.tut-takeaways li{font-size:.96rem;line-height:1.55;color:var(--blueberry-500)}.tut-outro{margin-top:1rem;background:var(--oat-500);color:var(--oat-100);border-radius:var(--radius-xl);padding:2rem;display:grid;gap:.8rem;justify-items:start}.tut-outro h2{color:var(--white);font-size:1.6rem}.tut-outro h2 .flourish{font-family:var(--font-serif);font-style:italic;font-weight:300;color:var(--lemon-200)}.tut-outro p{color:var(--grey-400);font-size:1rem;margin:0;max-width:40em}.tut-rail{margin-top:1rem;display:grid;gap:.8rem;padding-top:1.5rem;border-top:1px solid var(--oat-300)}.tut-rail-top{display:flex;align-items:center;justify-content:space-between;gap:.8rem}.tut-rail-course{font:600 .82rem/1 var(--font-sans);color:var(--brand-blue);text-decoration:none}.tut-rail-progress{font:500 .74rem/1 var(--font-mono);color:var(--oat-400)}.tut-rail-nav{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.tut-rail-slot{display:grid;gap:.25rem;padding:.9rem 1.05rem;border-radius:var(--radius-md);background:var(--white);box-shadow:var(--elev-card);text-decoration:none;transition:transform var(--dur-md) var(--ease-machine),box-shadow var(--dur-md) var(--ease-machine)}a.tut-rail-slot:hover{transform:translateY(-2px);box-shadow:var(--shadow-float),var(--ring)}.tut-rail-next{text-align:right}.tut-rail-empty{background:transparent;box-shadow:none}.tut-rail-kicker{font:600 .68rem/1 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--brand-blue)}.tut-rail-title{font-size:1rem;font-weight:600;color:var(--oat-500);line-height:1.25}@media(max-width:560px){.tut-rail-nav{grid-template-columns:1fr}.tut-rail-next{text-align:left}.fig-wide{width:auto;margin-left:0}}.pl-page{background:var(--bg-page)}.pl-head{max-width:52rem;margin:0 auto;padding:3rem 1.5rem 1.5rem;display:grid;gap:1rem}.pl-eyebrow{font:500 .74rem/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--brand-blue);display:inline-flex;align-items:center;gap:.5rem}.pl-head h1{font-size:clamp(2.4rem,5.5vw,3.6rem);line-height:1.02;letter-spacing:-.02em}.pl-head h1 .flourish{font-family:var(--font-serif);font-style:italic;font-weight:300}.pl-blurb{font-size:1.2rem;line-height:1.5;color:var(--text-muted);max-width:40em}.pl-audience{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .9rem;border-radius:var(--radius-pill);background:var(--white);box-shadow:var(--ring);font-size:.9rem;color:var(--text);justify-self:start}.pl-body{max-width:52rem;margin:0 auto;padding:1rem 1.5rem 4rem;display:grid;gap:2rem}.pl-section{display:grid;gap:.9rem}.pl-section-h{display:flex;align-items:baseline;gap:.6rem;font:600 .78rem/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--oat-400)}.pl-section-h .rule{flex:1;height:1px;background:var(--oat-300)}.pl-chapters{display:grid;gap:.8rem}a.pl-card{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:1.1rem 1.3rem;border-radius:var(--radius-lg);background:var(--white);box-shadow:var(--elev-card);text-decoration:none;color:inherit;transition:transform var(--dur-md) var(--ease-machine),box-shadow var(--dur-md) var(--ease-machine)}a.pl-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-float),var(--ring)}.pl-card-glyph{width:3rem;height:3rem;border-radius:var(--radius-md);display:grid;place-items:center;font-size:1.4rem;flex:none;background:var(--t100);box-shadow:inset 0 0 0 1px var(--t200);color:var(--t500)}.pl-card-num{font:500 .68rem/1 var(--font-mono);color:var(--oat-400);margin-bottom:.3rem;letter-spacing:.05em}.pl-card-title{font-size:1.12rem;font-weight:600;letter-spacing:-.01em;line-height:1.2}.pl-card-blurb{font-size:.92rem;color:var(--text-muted);line-height:1.5;margin-top:.25rem;max-width:44em}.pl-card-go{display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;flex:none;background:var(--oat-100);color:var(--oat-400);font-size:1.1rem;transition:background var(--dur-md),color var(--dur-md),transform var(--dur-md) var(--ease-arrow)}a.pl-card:hover .pl-card-go{background:var(--brand-blue);color:var(--white);transform:translate(3px)}.pl-card-time{font:500 .7rem/1 var(--font-mono);color:var(--oat-400);margin-top:.4rem}@media(max-width:560px){a.pl-card{grid-template-columns:auto 1fr}.pl-card-go{display:none}}.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:var(--gap)}a.blog-tile{display:grid;gap:1rem;padding:2rem 2rem 1.6rem;border-radius:var(--radius-xl);background:var(--t100);box-shadow:var(--shadow-card),inset 0 0 0 1px var(--t200);text-decoration:none;color:var(--t500);transition:transform var(--dur-md) var(--ease-machine),box-shadow var(--dur-md) var(--ease-machine)}a.blog-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-float),inset 0 0 0 1px var(--t200)}.blog-tile-eyebrow{font:500 .72rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--t400)}.blog-tile h3{font-size:1.6rem;color:var(--t500);line-height:1.1}.blog-tile p{font-size:1rem;line-height:1.5;color:var(--t400)}.blog-tile-meta{display:flex;align-items:center;gap:.5rem;margin-top:auto;font:500 .8rem/1 var(--font-mono);color:var(--t400)}.blog-tile-go{margin-left:auto;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--white);color:var(--t500);font-size:1.2rem;transition:transform var(--dur-md) var(--ease-arrow)}a.blog-tile:hover .blog-tile-go{transform:translate(4px)}
