.tut{background:var(--page);color:var(--body)}.tut-list{padding-bottom:var(--sec-y)}.tut-head-body{gap:var(--s-3);max-width:var(--w-read);margin-top:var(--s-2);display:grid}.tut-head-body p{margin:0}.tut-rail-search{position:relative}.tut-rail-search .ui-input{padding-left:38px}.tut-rail-search>svg{width:16px;height:16px;color:var(--faint);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.tut-detail-head{padding-top:var(--s-5);padding-bottom:var(--s-5);gap:var(--s-3);border-bottom:1px solid var(--line);display:grid}.tut-detail-head .ui-h1{max-width:var(--w-read)}.tut-detail-line{font:600 var(--t-meta) var(--sans);letter-spacing:.04em;color:var(--accent-ink);justify-self:start}.tut-detail-line:hover{text-underline-offset:3px;text-decoration:underline}.tut-detail-done{max-width:var(--w-read);font:500 var(--t-body) var(--sans);color:var(--accent-ink);margin:0}.tut-detail-result{max-width:var(--w-read);margin:0}.tut-detail-result img{border-radius:var(--r-lg);border:1px solid var(--line)}.tut-detail-cols{gap:var(--s-8);padding-top:var(--s-6);padding-bottom:var(--s-7);grid-template-columns:minmax(0,1fr) 320px;align-items:start;display:grid}.tut-detail-main{max-width:var(--w-read);gap:var(--s-7);min-width:0;display:grid}.tut-detail-main section{gap:var(--s-4);scroll-margin-top:84px;display:grid}.tut-detail-main section>.ui-h2{margin:0}.tut-aside{gap:var(--s-4);display:grid;position:sticky;top:76px}.tut-aside .ui-card{padding:var(--s-4)}.tut-aside .ui-eyebrow{margin-bottom:var(--s-2)}.tut-step-nav-inline{padding:var(--s-4);display:none}.tut-step-nav-inline>summary{cursor:pointer;color:var(--ink);font:600 var(--t-small) var(--sans)}.tut-step-nav-inline nav{margin-top:var(--s-3)}.tut-video{aspect-ratio:16/9;border-radius:var(--r-lg);background:var(--chip);position:relative;overflow:hidden}.tut-video iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.tut-prep{gap:var(--s-3);grid-template-columns:repeat(auto-fill,minmax(200px,1fr));display:grid}.tut-prep .ui-card{padding:var(--s-3) var(--s-4);gap:var(--s-2);display:grid}.tut-prep-top{justify-content:space-between;align-items:center;display:flex}.tut-prep-top span:first-child{font:600 var(--t-meta) var(--mono);color:var(--muted)}.tut-prep-name{font:600 var(--t-small) var(--sans);color:var(--ink)}.tut-prep-note{font:400 var(--t-meta) var(--sans);color:var(--muted)}.tut-steps{gap:var(--s-6);display:grid}.tut-step{gap:var(--s-4);grid-template-columns:36px minmax(0,1fr);scroll-margin-top:84px;display:grid}.tut-step-no{background:var(--panel);width:36px;height:36px;color:var(--panel-ink);font:600 var(--t-meta) var(--mono);border-radius:50%;place-items:center;line-height:1;display:grid}.tut-step-body{gap:var(--s-3);min-width:0;display:grid}.tut-step-body .ui-h3{margin-top:6px}.tut-step-body p{font:400 var(--t-body) var(--sans);color:var(--body);margin:0}.tut-step-body figure{gap:var(--s-2);margin:0;display:grid}.tut-step-body figure img{border-radius:var(--r-md);border:1px solid var(--line)}.tut-step-body figcaption{font:400 var(--t-meta) var(--sans);color:var(--muted)}.tut-loose{gap:var(--s-3);display:grid}.tut-hint{font:400 var(--t-small) var(--sans);color:var(--muted);margin:0}.tut-hint .ui-kbd{color:var(--accent-ink)}.tut-faq{gap:var(--s-2);display:grid}.tut-faq details{border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}.tut-faq summary{cursor:pointer;justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);font:600 var(--t-small) var(--sans);color:var(--ink);list-style:none;display:flex}.tut-faq summary::-webkit-details-marker{display:none}.tut-faq summary svg{width:18px;height:18px;color:var(--muted);flex:none;transition:transform .16s}.tut-faq details[open] summary svg{transform:rotate(180deg)}.tut-faq details>p{padding:0 var(--s-4) var(--s-4);font:400 var(--t-body) var(--sans);color:var(--body);margin:0}.tut-dl{align-items:center;gap:var(--s-3);padding:var(--s-4);flex-wrap:wrap;display:flex}.tut-dl-info{flex:240px;gap:4px;display:grid}.tut-dl-pills{gap:var(--s-2);flex-wrap:wrap;display:flex}.tut-dl-pills .ui-btn svg{width:14px;height:14px}.tut-prevnext{gap:var(--s-3);grid-template-columns:1fr 1fr;display:grid}.tut-prevnext .ui-card{padding:var(--s-3) var(--s-4);gap:4px;display:grid}.tut-prevnext .ui-card.next{text-align:right}.tut-prevnext strong{font:600 var(--t-small) var(--sans);color:var(--ink)}@media (max-width:960px){.tut-detail-cols{gap:var(--s-6);grid-template-columns:1fr}.tut-aside{position:static}.tut-aside .ui-card.toc{display:none}.tut-step-nav-inline{display:block}}@media (max-width:720px){.tut-prevnext{grid-template-columns:1fr}.tut-prevnext .ui-card.next{text-align:left}}.tut-plib{min-width:0}.tut-plib-rail{align-content:start;gap:var(--s-4);min-width:0;display:grid}.tut-plib-tools{gap:var(--s-2);display:grid}.tut-plib-tools .tut-rail-search{width:100%}.tut-plib-tools .ui-small{margin:0}.tut-plib-workspace{align-items:start;gap:var(--s-6);grid-template-columns:minmax(300px,.82fr) minmax(420px,1.18fr);display:grid}.tut-plib-list{gap:var(--s-2);min-width:0;margin:0;padding:0;list-style:none;display:grid}.tut-plib-item{gap:var(--s-2);min-width:0;padding:var(--s-4);border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);transition:border-color .14s,background .14s,box-shadow .14s;display:grid}.tut-plib-item.is-selected{border-color:var(--accent-line);background:var(--accent-tint);box-shadow:inset 3px 0 0 var(--accent)}.tut-plib-head{justify-content:space-between;align-items:center;gap:var(--s-3);display:flex}.tut-plib-label{font:600 17px/1.5 var(--sans);color:var(--ink)}.tut-plib-meta{gap:var(--s-1) var(--s-2);font:400 var(--t-meta) var(--sans);color:var(--muted);flex-wrap:wrap;margin:0;display:flex}.tut-plib-meta a{color:var(--accent-ink);text-decoration:underline;-webkit-text-decoration-color:var(--accent-line);text-decoration-color:var(--accent-line);text-underline-offset:3px}.tut-plib-meta a:hover{text-decoration-color:currentColor}.tut-plib-preview{font:400 var(--t-small) var(--sans);color:var(--body-2);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.tut-plib-preview-pane{top:var(--site-sticky-offset);height:calc(100dvh - var(--site-sticky-offset) - var(--s-4));min-width:0;padding:var(--s-5);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);position:sticky;overflow:hidden}.tut-plib-preview-content{gap:var(--s-4);grid-template-rows:auto minmax(0,1fr) auto;height:100%;min-height:0;animation:.15s ease-out tut-plib-preview-in;display:grid}.tut-plib-preview-head{gap:var(--s-1);display:grid}.tut-plib-preview-head p{margin:0}.tut-plib-preview-scroll{align-content:start;gap:var(--s-4);overscroll-behavior:contain;scrollbar-gutter:stable;min-height:0;display:grid;overflow-y:auto}.tut-plib-context{gap:var(--s-3) var(--s-4);padding:var(--s-4);border-radius:var(--r-md);background:var(--chip);grid-template-columns:repeat(2,minmax(0,1fr));margin:0;display:grid}.tut-plib-context>div{align-content:start;gap:var(--s-1);min-width:0;display:grid}.tut-plib-context dt{color:var(--muted);font:600 var(--t-meta) var(--sans)}.tut-plib-context dd{color:var(--body);font:400 var(--t-small) var(--sans);overflow-wrap:anywhere;margin:0}.tut-plib-preview-pane .tut-plib-prompt-frame .ui-prompt{overflow:visible}.tut-plib-preview-pane .tut-plib-prompt-frame .ui-prompt>header{z-index:1;border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--panel);position:sticky;top:0}.tut-plib-source{gap:var(--s-1);padding-top:var(--s-1);font:400 var(--t-meta) var(--sans);color:var(--muted);margin:0;display:grid}.tut-plib-source a{color:var(--accent-ink);text-decoration:underline;-webkit-text-decoration-color:var(--accent-line);text-decoration-color:var(--accent-line);text-underline-offset:3px;justify-self:start;font-weight:600}.tut-plib-source a:hover{text-decoration-color:currentColor}.tut-plib-inline-preview{display:none}.tut-plib-empty{color:var(--muted);margin:0}@keyframes tut-plib-preview-in{0%{opacity:.68;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.tut-plib-preview-content{animation:none}}@media (max-width:960px){.tut-plib-workspace{grid-template-columns:1fr}.tut-plib-preview-pane{display:none}.tut-plib-inline-preview{gap:var(--s-3);padding-top:var(--s-2);display:grid}.tut-plib-context{grid-template-columns:1fr}}