/* /en-us/insights/page-anatomy-for-ai-answers/ : page diagram and the test widgets. */
.ppb { --ppb-ink: var(--cr-ink, #111); --ppb-ink-2: var(--cr-ink-2, #4d4d4d); --ppb-line: var(--cr-line, #e8e8e8); --ppb-paper: var(--cr-paper, #fafafa); --ppb-accent: var(--cr-chrome, rgb(146 92 240)); }
.ppb-fig { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 28px; align-items: start; }
.ppb-page { border: 1px solid var(--ppb-line); border-radius: 14px; background: #fff; overflow: hidden; }
.ppb-chrome { display: flex; gap: 6px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--ppb-line); background: var(--ppb-paper); }
.ppb-chrome i { width: 8px; height: 8px; border-radius: 50%; background: #d9d9d9; display: block; }
.ppb-chrome span { margin-left: 10px; font-size: 12px; color: var(--ppb-ink-2); }
.ppb-body { padding: 18px 18px 6px; }
.ppb-zone { position: relative; border: 1px solid var(--ppb-line); border-radius: 10px; padding: 12px 14px 12px 46px; margin: 0 0 12px; background: #fff; }
.ppb-zone--soft { background: var(--ppb-paper); border-style: dashed; }
.ppb-n { position: absolute; left: 12px; top: 12px; width: 22px; height: 22px; border-radius: 50%; background: var(--ppb-accent); color: #fff; font-size: 12px; font-weight: 600; line-height: 22px; text-align: center; }
.ppb-h { font-size: 15px; font-weight: 600; color: var(--ppb-ink); margin: 0 0 6px; line-height: 1.3; }
.ppb-h--lg { font-size: 18px; }
.ppb-t { font-size: 13px; color: var(--ppb-ink-2); margin: 0; line-height: 1.5; }
.ppb-t mark { background: rgb(146 92 240 / .14); color: var(--ppb-ink); border-radius: 3px; padding: 0 3px; }
.ppb-bar { height: 7px; border-radius: 4px; background: #ececec; margin: 7px 0 0; }
.ppb-bar.w80 { width: 80%; } .ppb-bar.w60 { width: 60%; } .ppb-bar.w90 { width: 90%; }
.ppb-tag { display: inline-block; font-size: 11px; color: var(--ppb-ink-2); border: 1px solid var(--ppb-line); border-radius: 999px; padding: 1px 8px; margin-top: 8px; }
.ppb-code { font-family: var(--cr-mono, ui-monospace, Menlo, monospace); font-size: 12px; color: var(--ppb-ink-2); }
.ppb-notes { list-style: none; margin: 0; padding: 0; counter-reset: none; }
.ppb-notes li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--ppb-line); }
.ppb-notes li:first-child { padding-top: 0; }
.ppb-notes .ppb-n { position: static; }
.ppb-stat { font-size: 26px; font-weight: 500; letter-spacing: -0.02em; color: var(--ppb-ink); line-height: 1.1; display: block; }
.ppb-what { font-size: 15px; font-weight: 600; color: var(--ppb-ink); display: block; margin: 4px 0 2px; }
.ppb-why { font-size: 14px; color: var(--ppb-ink-2); line-height: 1.5; margin: 0; }
.ppb-src { font-size: 12px; color: var(--ppb-ink-2); margin-top: 18px; }
html body .ppb p.ppb-h:not(#_) { margin: 0 0 6px; }
html body .ppb p.ppb-t:not(#_), html body .ppb p.ppb-why:not(#_) { margin: 0; }
@media (max-width: 860px) { .ppb-fig { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .ppb-body { padding: 10px 10px 2px; } .ppb-zone { padding: 10px 12px; margin-bottom: 10px; } .ppb-zone > .ppb-n { position: static; display: block; margin: 0 0 6px; } html body #anatomy.content-block:not(#_) { padding-left: 14px; padding-right: 14px; } .ppb-h--lg { font-size: 16px; } .ppb-chrome span { margin-left: 4px; } .ppb-stat { font-size: 23px; } }
.ppb-notes a{color:var(--ppb-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ppb-line)}
.pa-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 0}
.pa-actions .nrlc-btn{padding:.7rem 1.2rem;font-size:.92rem}
.pa-actions__note{font-size:14px;color:var(--cr-ink-2,#4d4d4d);margin:10px 0 0}
.pa-actions__status{font-size:14px;color:var(--cr-ink-2,#4d4d4d)}
.pa-scores{border-collapse:collapse;width:100%;font-size:15px;margin:12px 0 4px}
.pa-scores th,.pa-scores td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--cr-line,#e8e8e8);vertical-align:top}
.pa-scores th{font-size:12px;font-weight:600;color:var(--cr-ink-2,#4d4d4d)}
.pa-scores td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.pa-tw{overflow-x:auto;border:1px solid var(--cr-line,#e8e8e8);border-radius:10px;background:#fff;margin:14px 0}
.pa-tw .pa-scores{margin:0}.pa-tw tr:last-child td{border-bottom:0}