/* Article-only reading layout. The guide directory keeps its own design. */
.guide-reader { --gr-line:#33404e; --gr-muted:#aab8c8; --gr-blue:#79acff; }
.guide-reader .g-post-hero { padding:132px 24px 44px !important; margin:0 !important; min-height:0; height:auto; box-sizing:border-box; background:linear-gradient(135deg,#101923,#111820 70%); }
.guide-reader .g-post-hero-inner { width:100%; max-width:1120px; margin:auto; padding:0; display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:48px; align-items:center; border:0; background:none; box-shadow:none; }
.guide-reader .g-post-hero-inner::before,.guide-reader .g-post-hero-inner::after { display:none; }
.guide-reader .g-post-hero-copy { padding:0; min-width:0; }
.guide-reader .g-post-hero-kicker { display:block; color:var(--gr-blue); font-size:12px; margin-bottom:18px; }
.guide-reader .g-post-hero h1 { margin:0; font-size:clamp(28px,3.1vw,43px); line-height:1.2; overflow-wrap:break-word; }
.guide-reader .g-post-hero-desc { font-size:17px; line-height:1.65; margin:18px 0 0; max-width:680px; color:#c0ccda; }
.guide-reader .g-post-hero-meta { margin-top:20px; color:var(--gr-muted); font-size:13px; gap:18px; }
.guide-reader .g-post-hero-media { min-height:0; height:170px; border:1px solid var(--gr-line); border-radius:8px; overflow:hidden; box-shadow:none; }
.guide-reader .g-post-hero-media img { width:100%; height:100%; object-fit:cover; }
.guide-reader .g-post-hero-badge { display:none; }
.guide-reader .g-article-page { width:calc(100% - 48px); max-width:1120px; padding:0 0 48px; margin:0 auto; }
.guide-reader .g-article-nav { margin:0 0 34px; padding:16px 0; min-height:0; border:0; border-bottom:1px solid var(--gr-line); background:none; box-shadow:none; }
.guide-reader .g-article-nav .d-back-btn { border:0; padding:10px 0; background:none; box-shadow:none; font-size:13px; }
.guide-reader .g-article-nav-label { display:none; }
.guide-reader .g-action-link { border:0; background:none; box-shadow:none; padding:10px 0 10px 20px; font-size:14px; }
.gr-layout { display:grid; grid-template-columns:224px minmax(0,1fr); gap:48px; align-items:start; }
.gr-sidebar { position:sticky; top:96px; min-width:0; }
.gr-contents { border:0; border-left:2px solid var(--gr-line); padding-left:18px; }
.gr-contents summary { display:flex; justify-content:space-between; gap:12px; align-items:center; font:700 14px/1.4 'Segoe UI',Arial,sans-serif; color:#f1f5fb; cursor:pointer; list-style:none; padding:4px 0 14px; }
.gr-contents summary::-webkit-details-marker { display:none; }
.gr-contents summary span { color:var(--gr-blue); }
.gr-contents nav { display:grid; gap:3px; max-height:calc(100dvh - 190px); overflow:auto; }
.gr-contents a { color:var(--gr-muted); text-decoration:none; font:14px/1.5 'Segoe UI',Arial,sans-serif; padding:8px 10px 8px 0; transition:color .15s; }
.gr-contents a:hover,.gr-contents a[aria-current="location"] { color:var(--gr-blue); }
.guide-reader a:focus-visible,.gr-contents summary:focus-visible { outline:2px solid var(--gr-blue); outline-offset:4px; }
.guide-reader .g-content { width:100%; max-width:none; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; color:#c9d3df; font-size:17px; line-height:1.75; min-width:0; }
.guide-reader .g-content::before,.guide-reader .g-content::after { display:none; }
.guide-reader .g-content p { font-size:17px; line-height:1.75; margin:0 0 20px; }
.guide-reader .g-content :is(.g-path-card,.g-choice-card,.g-fix-card,.g-visual-card,.tpc-tool,.tpc-step-body) p { color:#bdc9d8; }
.guide-reader .g-content h2 { display:block; margin:44px 0 18px; padding:0; border:0; color:#f3f6fb; font:700 26px/1.3 'Segoe UI',Arial,sans-serif; text-shadow:none; letter-spacing:-.4px; scroll-margin-top:100px; }
.guide-reader .g-content h3 { margin:0 0 10px; font:700 19px/1.4 'Segoe UI',Arial,sans-serif; color:#f3f6fb; text-shadow:none; }
.guide-reader .g-content h2::before,.guide-reader .g-content h2::after { display:none; }
.guide-reader .g-content strong { color:#edf3fb; }
.guide-reader .g-content ul,.guide-reader .g-content ol { padding-left:24px; margin:12px 0 22px; }
.guide-reader .g-content li { line-height:1.7; margin:7px 0; }
.guide-reader .g-content a:not([class]) { color:var(--gr-blue); text-decoration:underline; text-underline-offset:3px; }
.guide-reader .g-content code { font-size:.88em; overflow-wrap:anywhere; }
.guide-reader .g-content .g-answer-box { margin:0 0 28px; padding:22px 26px; background:linear-gradient(100deg,#1b3048,#17222e); border:1px solid #354e6b; border-left:3px solid #4c83e2; border-radius:6px; box-shadow:none; }
.guide-reader .g-content .g-answer-box::before,.guide-reader .g-content .g-answer-box::after { display:none; }
.guide-reader .g-content .g-answer-box h2 { margin:0 0 12px; font-size:13px; text-transform:uppercase; letter-spacing:1.2px; color:#91baff; }
.guide-reader .g-content .g-answer-box p:last-child,.guide-reader .g-content .g-answer-box ol:last-child { margin-bottom:0; }
.guide-reader .g-content .g-visual-steps { display:grid; grid-template-columns:1fr; gap:0; margin:24px 0; border-top:1px solid var(--gr-line); counter-reset:guide-step; }
.guide-reader .g-content .g-visual-card { min-height:0; padding:22px 0 22px 52px; margin:0; border:0; border-bottom:1px solid var(--gr-line); border-radius:0; background:none; box-shadow:none; position:relative; counter-increment:guide-step; }
.guide-reader .g-content .g-visual-card::before { content:counter(guide-step); position:absolute; top:23px; left:0; width:30px; height:30px; display:grid; place-items:center; background:#1d314b; color:#a3c7ff; border:1px solid #3d618b; font:700 14px/1 'Segoe UI',Arial,sans-serif; border-radius:4px; transform:none; }
.guide-reader .g-content .g-visual-card::after { display:none; }
.guide-reader .g-content .g-visual-card p { margin:0; }
.guide-reader .g-content .g-path-grid,.guide-reader .g-content .g-fix-grid,.guide-reader .g-content .g-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; margin:22px 0; }
.guide-reader .g-content .g-path-card,.guide-reader .g-content .g-fix-card,.guide-reader .g-content .g-choice-card { min-height:0; padding:20px 0; background:none; border:0; border-top:1px solid var(--gr-line); border-radius:0; box-shadow:none; }
.guide-reader .g-content .g-path-card::before,.guide-reader .g-content .g-fix-card::before,.guide-reader .g-content .g-choice-card::before { display:none; }
.guide-reader .g-content .g-mini-note,.guide-reader .g-content .tpc-callout { margin:24px 0; padding:16px 18px; background:#19232e; border:0; border-left:3px solid #6b91c3; border-radius:0 4px 4px 0; box-shadow:none; font-size:16px; line-height:1.7; }
.guide-reader .g-content .g-guide-cta { margin:32px 0; padding:22px 0; background:none; border:0; border-top:1px solid var(--gr-line); border-bottom:1px solid var(--gr-line); box-shadow:none; border-radius:0; }
.guide-reader .g-content .g-guide-cta::before,.guide-reader .g-content .g-guide-cta::after { display:none; }
.guide-reader .g-content .g-guide-cta h2 { margin:0 0 12px; font-size:21px; }
.guide-reader .g-content .g-guide-links { display:flex; flex-wrap:wrap; gap:8px 20px; }
.guide-reader .g-content .g-guide-links a { background:none; border:0; padding:8px 0; box-shadow:none; font:600 15px/1.4 'Segoe UI',Arial,sans-serif; color:var(--gr-blue); }
.guide-reader .g-content .tpc-lead { margin:0 0 24px; font-size:17px; line-height:1.75; }
.guide-reader .g-content .tpc-tools { grid-template-columns:1fr; gap:0; }
.guide-reader .g-content .tpc-tool { padding:22px 0; background:none; border:0; border-top:1px solid var(--gr-line); box-shadow:none; }
.guide-reader .g-content .tpc-tool-head { margin-bottom:12px; }
.guide-reader .g-content .tpc-tool p { font-size:16px; margin:0 0 10px; }
.guide-reader .g-content .tpc-tool-best { font-size:14px; }
.guide-reader .g-content .tpc-step { padding:24px 0; border:0; border-top:1px solid var(--gr-line); background:none; box-shadow:none; gap:18px; grid-template-columns:34px minmax(0,1fr); }
.guide-reader .g-content .tpc-step-body { min-width:0; }
.guide-reader .g-content .tpc-step-img { display:none; }
.guide-reader .g-content .tpc-step-num { width:32px; height:32px; font-size:14px; }
.guide-reader .g-content .tpc-tree { padding:16px; overflow-x:auto; }
.guide-reader .g-content .tpc-tree-row { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; }
.guide-reader .g-content .tpc-code { max-width:100%; overflow:auto; font-size:14px; }
.guide-reader .g-content .tpc-mistakes { grid-template-columns:1fr; gap:0; }
.guide-reader .g-content .tpc-mistake { padding:18px 0; background:none; border:0; border-top:1px solid var(--gr-line); }
.guide-reader .g-content .tpc-mistake strong { font-size:17px; }
.guide-reader .g-content .tpc-mistake span { font-size:16px; line-height:1.7; }
.guide-reader .g-content .tpc-faq summary { min-height:48px; padding:18px 32px 18px 0; font-size:17px; }
.guide-reader .g-content .tpc-faq p { padding:0 0 18px; font-size:16px; }
.guide-reader .g-content .tpc-res { gap:16px; }
.guide-reader .g-content .tpc-res-item { background:none; border:0; border-top:1px solid var(--gr-line); padding:18px 0; }
.guide-reader .g-content .g-pack-entry { display:grid; grid-template-columns:180px minmax(0,1fr); gap:20px; align-items:center; margin:18px 0; padding:14px; border:1px solid var(--gr-line); border-radius:6px; background:#15202b; box-shadow:none; }
.guide-reader .g-content .g-pack-entry-img { width:100%; height:auto; aspect-ratio:16/9; min-height:0; }
.guide-reader .g-content .g-pack-entry-img > img { width:100%; height:100%; object-fit:cover; }
.guide-reader .g-content .g-pack-entry-body { padding:0; min-width:0; }
.guide-reader .g-content .g-pack-entry h3 { font-size:18px; margin:0 0 8px; }
.guide-reader .g-content .g-pack-entry-stats { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13px; }
.guide-reader .g-create-hub .ch-section { margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.guide-reader .g-create-hub .ch-section-answer:empty { display:none; }
.guide-reader .g-create-hub .ch-head { margin:40px 0 18px; padding:0; border:0; }
.guide-reader .g-create-hub .ch-head h2 { margin:0; }
.guide-reader .g-create-hub .ch-num { display:none; }
.guide-reader .g-hub-bar { display:none; }
.guide-reader .g-page-hed-inner { width:calc(100% - 48px); max-width:1120px; margin:auto; }
.guide-reader .g-page-hed-inner h1 { font-size:clamp(28px,3.1vw,43px); line-height:1.2; }
.guide-reader .g-page-hed-inner .g-hub-kicker { color:var(--gr-blue); }
.gr-after-reading { margin-top:52px; padding-top:32px; border-top:1px solid var(--gr-line); }
.guide-reader .gr-after-reading .g-guide-video { grid-template-columns:1fr 1fr; padding:24px; margin:0 0 28px; border:1px solid var(--gr-line); border-radius:6px; background:#141e28; box-shadow:none; gap:28px; }
.guide-reader .gr-after-reading .g-guide-video h2 { font-size:22px; line-height:1.4; }
.guide-reader .gr-after-reading .g-guide-video p { font-size:16px; line-height:1.65; }
.guide-reader .gr-after-reading .g-tool-cta { border:0 !important; border-bottom:1px solid var(--gr-line) !important; background:none !important; box-shadow:none !important; padding:22px 0 !important; }
.guide-reader .gr-after-reading .g-featured-packs { margin:32px 0; padding:0; background:none; border:0; box-shadow:none; }
.guide-reader .gr-after-reading .g-featured-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.guide-reader .gr-after-reading .g-related { margin:38px 0 0; }
.guide-reader .gr-after-reading .g-related h2 { font-size:24px; }
.guide-reader .dc { padding:36px 20px; border-top:1px solid var(--gr-line); }
.guide-reader .dc h2 { font-size:clamp(20px,2vw,28px); }
@media(max-width:900px) {
  .guide-reader .g-post-hero { padding:24px 24px 32px !important; margin-top:24px !important; }
  .guide-reader .g-post-hero-inner { grid-template-columns:1fr; gap:0; }
  .guide-reader .g-post-hero-media { display:none; }
  .gr-layout { grid-template-columns:1fr; gap:28px; }
  .gr-sidebar { position:static; }
  .gr-contents { padding:14px 18px; background:#15212d; border:1px solid var(--gr-line); border-radius:5px; }
  .gr-contents summary { padding:0; min-height:24px; }
  .gr-contents[open] summary { padding-bottom:12px; }
  .gr-contents nav { grid-template-columns:1fr 1fr; max-height:none; gap:4px 16px; }
  .guide-reader .g-content { max-width:800px; }
}
@media(max-width:600px) {
  .guide-reader .g-post-hero { padding:24px 20px 26px !important; }
  .guide-reader .g-post-hero h1 { font-size:28px; }
  .guide-reader .g-post-hero-desc { font-size:16px; margin-top:16px; }
  .guide-reader .g-post-hero-kicker { font-size:11px; margin-bottom:14px; }
  .guide-reader .g-article-page { width:calc(100% - 36px); padding-bottom:32px; }
  .guide-reader .g-article-nav { margin-bottom:22px; padding:8px 0; }
  .guide-reader .g-article-actions { gap:14px; }
  .guide-reader .g-action-link { padding:12px 0; font-size:13px; }
  .gr-contents nav { grid-template-columns:1fr; }
  .gr-contents a { padding:9px 0; }
  .guide-reader .g-content,.guide-reader .g-content p { font-size:16px; line-height:1.75; }
  .guide-reader .g-content h2 { margin-top:34px; font-size:23px; }
  .guide-reader .g-content h3 { font-size:18px; }
  .guide-reader .g-content .g-answer-box { padding:18px; }
  .guide-reader .g-content .g-path-grid,.guide-reader .g-content .g-fix-grid,.guide-reader .g-content .g-choice-grid { grid-template-columns:1fr; gap:0; }
  .guide-reader .g-content .g-visual-card { padding-left:44px; }
  .guide-reader .g-content .tpc-step { grid-template-columns:28px minmax(0,1fr); gap:12px; }
  .guide-reader .g-content .tpc-step-num { width:28px; height:28px; }
  .guide-reader .g-content .tpc-step-img { float:none; width:100%; max-width:100%; margin:0 0 16px; }
  .guide-reader .g-content .tpc-res { grid-template-columns:1fr; }
  .guide-reader .g-content .g-pack-entry { grid-template-columns:104px minmax(0,1fr); gap:14px; padding:12px; }
  .guide-reader .g-content .g-pack-entry h3 { font-size:16px; }
  .guide-reader .g-content .g-pack-entry-stats { font-size:12px; }
  .guide-reader .gr-after-reading .g-guide-video { grid-template-columns:1fr; padding:18px; }
  .guide-reader .gr-after-reading .g-tool-cta { align-items:flex-start !important; flex-direction:column; gap:16px !important; }
  .guide-reader .gr-after-reading .g-featured-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .guide-reader .gr-after-reading .g-featured-packs-head { align-items:flex-start; gap:16px; }
  .guide-reader .gr-after-reading .g-featured-packs-head h2 { font-size:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .guide-reader *, .guide-reader *::before, .guide-reader *::after { scroll-behavior:auto !important; transition:none !important; }
}