.guide-page .page-shell{width:min(100% - 28px,1120px)}
.guide-main{display:grid;grid-template-columns:minmax(0,760px) 250px;gap:34px;align-items:start;margin:34px auto 54px}
.guide-article{padding:clamp(25px,5vw,52px);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-raised);box-shadow:var(--shadow-2)}
.guide-hero{margin-bottom:30px;padding-bottom:25px;border-bottom:1px solid var(--color-border)}
.guide-hero h1{margin:8px 0 14px;font-size:clamp(2.35rem,5vw,4rem)}
.guide-lede{color:var(--color-muted);font-family:var(--font-display);font-size:1.2rem;line-height:1.65}
.guide-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.guide-meta span{padding:6px 10px;border:1px solid var(--color-border);border-radius:999px;background:var(--color-wash);color:var(--color-moss);font-size:.7rem;font-weight:750}
.byline{display:flex;align-items:center;gap:12px;margin-top:20px;color:var(--color-muted);font-size:.78rem}.byline-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--color-moss);border-radius:50%;background:var(--color-celadon);color:var(--color-text);font-family:var(--font-display);font-size:1.2rem}
.guide-article h2{margin:42px 0 13px;font-size:clamp(1.65rem,3vw,2.15rem)}.guide-article h3{margin:27px 0 9px;font-size:1.15rem}.guide-article p,.guide-article li{color:var(--color-muted);line-height:1.8}.guide-article li+li{margin-top:7px}.guide-article a{font-weight:700}
.guide-callout{margin:26px 0;padding:19px 21px;border-left:3px solid var(--color-clay);border-radius:0 14px 14px 0;background:var(--color-wash)}.guide-callout strong{display:block;margin-bottom:5px;color:var(--color-text)}
.guide-steps{counter-reset:guide-step;list-style:none;padding:0}.guide-steps li{position:relative;counter-increment:guide-step;padding:14px 16px 14px 52px;border:1px solid var(--color-border);border-radius:13px;background:var(--color-surface)}.guide-steps li::before{content:counter(guide-step);position:absolute;top:13px;left:14px;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--color-celadon);color:var(--color-text);font-weight:800}
.sudoku-example{margin:30px auto}.sudoku-diagram{display:grid;grid-template-columns:repeat(9,1fr);width:min(100%,470px);aspect-ratio:1;margin:0 auto;border:2px solid var(--color-text);background:var(--color-board)}.diagram-cell{position:relative;display:grid;place-items:center;min-width:0;border-right:1px solid var(--color-grid);border-bottom:1px solid var(--color-grid);color:var(--color-text);font-weight:700;font-size:clamp(.76rem,2.5vw,1.1rem)}.diagram-cell:nth-child(3n){border-right:2px solid var(--color-text)}.diagram-cell:nth-child(9n){border-right:0}.diagram-cell:nth-child(n+19):nth-child(-n+27),.diagram-cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid var(--color-text)}.diagram-cell:nth-child(n+73){border-bottom:0}.diagram-cell.focus{background:var(--color-celadon);box-shadow:inset 0 0 0 2px var(--color-action)}.diagram-cell.eliminate{background:var(--color-error-bg);color:var(--color-error);text-decoration:line-through}.diagram-cell.link{background:color-mix(in srgb,var(--color-clay) 20%,var(--color-board));box-shadow:inset 0 0 0 2px var(--color-clay)}.diagram-cell.peer{background:var(--color-wash)}.diagram-candidates{position:absolute;inset:3px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);color:var(--color-moss);font-size:clamp(.42rem,1.4vw,.65rem);font-weight:650}.diagram-candidates span{display:grid;place-items:center}.sudoku-example figcaption{max-width:620px;margin:13px auto 0;color:var(--color-muted);font-size:.82rem;line-height:1.6;text-align:center}.diagram-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:9px;color:var(--color-muted);font-size:.72rem}.legend-dot{display:inline-block;width:11px;height:11px;margin-right:4px;border-radius:3px;vertical-align:-1px}.legend-dot.focus{background:var(--color-celadon)}.legend-dot.link{background:var(--color-clay)}.legend-dot.eliminate{background:var(--color-error-bg)}
.practice-box{margin-top:40px;padding:25px;border:1px solid var(--color-border);border-radius:18px;background:linear-gradient(140deg,var(--color-wash),var(--color-surface))}.practice-box h2{margin-top:0}
.guide-sidebar{position:sticky;top:18px;display:grid;gap:13px}.sidebar-card{padding:19px;border:1px solid var(--color-border);border-radius:16px;background:color-mix(in srgb,var(--color-raised) 92%,transparent);box-shadow:var(--shadow-1)}.sidebar-card h2{margin:0 0 9px;font-family:var(--font-ui);font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}.sidebar-card ol,.sidebar-card ul{margin:0;padding-left:18px}.sidebar-card li,.sidebar-card p{margin:7px 0;color:var(--color-muted);font-size:.8rem;line-height:1.5}
.guide-article[data-learn-lesson] .guide-hero{position:relative}.guide-article[data-learn-lesson] .guide-hero::after{content:"";position:absolute;right:0;top:0;width:120px;height:120px;border:1px solid color-mix(in srgb,var(--color-clay) 44%,transparent);border-radius:50%;opacity:.65;pointer-events:none}.guide-article[data-learn-lesson] .guide-meta{position:relative;z-index:1}
@media(max-width:850px){.guide-main{grid-template-columns:1fr}.guide-sidebar{position:static;grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.guide-page .page-shell{width:min(100% - 16px,580px)}.guide-main{margin-top:20px}.guide-article{padding:24px 18px;border-radius:18px}.guide-sidebar{grid-template-columns:1fr}.sudoku-diagram{width:100%}}