/* ============================================================
   ViewPortal — guides (/guides and /guides/*)
   Loaded only by guide pages, after style.css. Reuses the site's
   tokens, the .legal article column and the .faq accordion.
   ============================================================ */

.guide .legal__wrap{max-width:780px}
.crumbs{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;font-size:13.5px;color:var(--mut-2);margin-bottom:22px}
.crumbs a{color:var(--mut);border-bottom:1px solid transparent}
.crumbs a:hover{color:var(--ink);border-color:var(--line-3)}
.crumbs .sep{opacity:.6}
.guide .legal__head .eyebrow{margin-bottom:18px}
.guide .legal__head h1{font-size:clamp(30px,5.4vw,48px)}
.guide__lede{color:var(--mut);font-size:clamp(16px,2.2vw,19px);line-height:1.6;margin-top:16px;max-width:62ch}

.guide__answer{border:1px solid var(--line-2);border-left:3px solid var(--accent);border-radius:var(--radius-sm);
  background:var(--panel);padding:18px 20px;margin:0 0 30px;color:var(--ink);font-size:16.5px;line-height:1.65}
.guide__answer b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}

.legal__body ol{margin:0 0 16px;padding-left:22px}
.legal__body ol li{margin:8px 0}
.legal__body code{font:500 .9em ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);
  background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:1px 6px;overflow-wrap:anywhere}
.legal__body pre{background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius-sm);
  padding:14px 16px;margin:0 0 18px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.legal__body pre code{background:none;border:0;padding:0;font-size:13.5px;line-height:1.6;white-space:pre;overflow-wrap:normal;display:block}

.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 18px;border:1px solid var(--line-2);border-radius:var(--radius-sm);background:var(--panel)}
.tbl table{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.45}
.tbl th,.tbl td{text-align:left;padding:10px 12px;border-top:1px solid var(--line);vertical-align:top}
.tbl thead th{border-top:0;color:var(--ink);font-weight:600;background:var(--panel-2);white-space:nowrap}
.tbl td{color:var(--mut)}
.tbl td:first-child{color:var(--ink);font-weight:500}
.tbl .num{font-variant-numeric:tabular-nums;white-space:nowrap}

.guide__fit{border:1px solid var(--line-2);border-radius:var(--radius);background:linear-gradient(180deg,var(--panel),var(--panel-2));
  padding:22px 22px 8px;margin:34px 0 10px}
.guide__fit h2{margin-top:0 !important}
.guide__fit .btn{margin:6px 0 16px}

.guide .faq{margin:18px 0 0;max-width:none}
.guide__sources{font-size:14px;color:var(--mut-2);line-height:1.6}
.guide__sources li{margin:6px 0}
.guide__sources a{overflow-wrap:anywhere}
.guide__more{display:grid;gap:10px;margin:14px 0 0;padding:0;list-style:none}
.guide__more li{margin:0}
.guide__more a{display:block;border:1px solid var(--line-2) !important;border-radius:var(--radius-sm);padding:14px 16px;background:var(--panel);color:var(--ink)}
.guide__more a:hover{border-color:var(--line-3) !important}
.guide__updated{color:var(--mut-2);font-size:14px;margin-top:14px}

/* hub */
.guides-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:8px}
.guide-card{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line-2);border-radius:var(--radius);
  background:var(--panel);padding:20px;color:var(--ink);transition:border-color .2s var(--ease),transform .2s var(--ease)}
.guide-card:hover{border-color:var(--line-3);transform:translateY(-2px)}
.guide-card h2{font-size:18px;line-height:1.3;letter-spacing:-.015em;font-weight:600}
.guide-card p{color:var(--mut);font-size:14.5px;line-height:1.55}
.guide-card .go{margin-top:auto;font-size:14px;font-weight:600;color:var(--accent)}
@media (prefers-reduced-motion:reduce){.guide-card,.guide-card:hover{transition:none;transform:none}}