/* Compact topic guide. Uses the shared app colors and type throughout. */
.guide-main { max-width:1236px;min-width:0;font-family:var(--ui);font-size:13px;line-height:1.65;container:wareyva-guide / inline-size; }
.guide-main [hidden] { display:none!important; }
.guide-intro { display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 28px;padding:2px 0 24px;border-bottom:1px solid var(--rule); }
.guide-intro h1 { margin:0;color:var(--ink);font:500 26px/1.25 var(--ui);letter-spacing:-.025em; }
.guide-intro p { margin:7px 0 0;color:var(--quiet);font-size:13px; }
.guide-intro>.btn { flex:none;min-height:36px;padding:8px 12px;border-radius:8px;font:500 12px/1.5 var(--ui); }
.guide-intro .icon { width:15px;height:15px; }
.guide-layout { display:block; }
.guide-topic-nav { min-width:0;margin:0; }
.guide-topics { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border:0; }
.guide-topics a { display:flex;align-items:center;gap:16px;min-width:0;min-height:72px;padding:16px;border:1px solid var(--rule2);border-radius:14px;background:var(--raise);color:var(--ink);font:500 14px/1.45 var(--ui);text-decoration:none; }
.guide-topics a:hover { border-color:var(--mark);background:var(--mark-wash); }
.guide-topics a:focus-visible { outline:2px solid var(--focus);outline-offset:3px; }
.guide-topic-icon { display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:9px;background:var(--mark-wash);color:var(--mark); }
.guide-topic-icon .icon { width:20px;height:20px; }
.guide-topic-label { min-width:0; }
.guide-topic-arrow { display:flex;flex:none;margin-left:auto;color:var(--quiet); }
.guide-topic-arrow .icon { width:16px;height:16px; }
.guide-back { display:inline-flex;align-items:center;gap:7px;min-height:36px;margin-bottom:22px;padding:7px 11px;border:1px solid var(--rule2);border-radius:8px;background:var(--raise);color:var(--quiet);font:500 12px/1.45 var(--ui);text-decoration:none; }
.guide-back .icon { width:15px;height:15px; }
.guide-back:hover { color:var(--mark);border-color:var(--mark); }
.guide-reading { max-width:920px;min-width:0; }
.guide-section { margin:0;padding:0;scroll-margin-top:24px; }
.guide-section+.guide-section { margin-top:32px;padding-top:24px;border-top:1px solid var(--rule); }
.guide-ready .guide-section.is-active { margin:0;padding:0;border:0; }
.guide-section-heading { margin:0 0 8px; }
.guide-section-heading h2 { margin:0 0 6px;font:500 20px/1.35 var(--ui);letter-spacing:-.02em;color:var(--ink); }
.guide-section-heading h2:focus { outline:0; }
.guide-section-heading h2:focus-visible { outline:2px solid var(--focus);outline-offset:5px;border-radius:2px; }
.guide-section-heading p { margin:0;color:var(--quiet);font-size:13px; }
.guide-topic-body { min-width:0; }
.guide-topic-body p { max-width:85ch;margin:0 0 12px; }
.guide-topic-body a,.guide-responsible a,.guide-help-footer a { color:var(--mark);text-underline-offset:3px; }
.guide-topic-body h3 { font:500 14px/1.5 var(--ui);letter-spacing:0;color:var(--ink); }
.guide-steps { counter-reset:guide-step;list-style:none;margin:0;padding:0; }
.guide-steps>li { position:relative;counter-increment:guide-step;padding:18px 0 18px 38px;border-bottom:1px solid var(--rule); }
.guide-steps>li:last-child { border-bottom:0;padding-bottom:4px; }
.guide-steps>li::before { content:counter(guide-step) / "";position:absolute;left:0;top:18px;display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:var(--mark-wash);color:var(--mark);font-size:12px;font-weight:500; }
.guide-steps h3 { margin:0 0 5px; }
.guide-steps p { margin:0;color:var(--quiet);font-size:13px; }
.guide-note { display:flex;align-items:flex-start;gap:10px;padding:12px 14px;margin:20px 0 0;border-left:2px solid var(--mark);border-radius:0 8px 8px 0;background:var(--mark-wash); }
.guide-note>span { display:flex;flex:none;margin-top:2px;color:var(--mark); }
.guide-note .icon { width:16px;height:16px; }
.guide-note p { margin:0;color:var(--quiet);font-size:12px; }
.guide-note strong { color:var(--ink);font-weight:500; }
.guide-two,.guide-three { display:grid;grid-template-columns:minmax(0,1fr);gap:0; }
.guide-card { min-width:0;padding:18px 0;border-bottom:1px solid var(--rule); }
.guide-card:last-child { border-bottom:0;padding-bottom:0; }
.guide-card h3 { margin:0 0 8px; }
.guide-card p,.guide-card li { color:var(--quiet);font-size:13px; }
.guide-card p:last-child { margin-bottom:0; }
.guide-card ul,.guide-card ol { padding-left:18px;margin:0 0 12px; }
.guide-card li+li { margin-top:5px; }
.guide-card>a { justify-self:start;color:var(--mark);font-size:12px;font-weight:500; }
.guide-card:has(>.icon-box) { display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:12px; }
.guide-card>.icon-box { grid-column:1;grid-row:1;width:28px;height:28px;border-radius:8px;background:var(--mark-wash);color:var(--mark); }
.guide-card>.icon-box .icon { width:16px;height:16px; }
.guide-card>.icon-box~* { grid-column:2; }
.guide-card>.icon-box+h3 { align-self:center;margin:0 0 5px; }
.guide-controls { margin:8px 0 0; }
.guide-controls>div { display:grid;grid-template-columns:142px minmax(0,1fr);gap:22px;padding:15px 0;border-bottom:1px solid var(--rule); }
.guide-controls>div:last-child { border-bottom:0; }
.guide-controls dt { font-size:13px;font-weight:500;color:var(--ink); }
.guide-controls dd { max-width:85ch;margin:0;color:var(--quiet);font-size:13px; }
.guide-caption { margin:16px 0;color:var(--quiet);font-size:12px; }
.guide-detail { margin:0;border-bottom:1px solid var(--rule); }
.guide-detail summary { min-height:44px;padding:14px 0;color:var(--ink);font-size:13px;font-weight:500;cursor:pointer; }
.guide-detail[open]>summary { color:var(--mark); }
.guide-detail>div { padding:0 0 16px;color:var(--quiet);font-size:13px; }
.guide-detail p:last-child { margin-bottom:0; }
.guide-main .hint { color:var(--quiet);font-size:12px; }
.guide-platforms { display:flex;flex-wrap:wrap;gap:4px;margin:18px 0 12px;border-bottom:1px solid var(--rule); }
.guide-platforms button { min-height:42px;padding:10px 12px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--quiet);font:400 12px/1.5 var(--ui);cursor:pointer; }
.guide-platforms button[aria-pressed=true] { border-bottom-color:var(--mark);color:var(--mark);font-weight:500; }
.guide-table-wrap { max-width:100%;overflow-x:auto;margin-top:18px;overscroll-behavior:auto; }
.guide-table { width:100%;border-collapse:collapse;text-align:left;font-size:12px; }
.guide-table th,.guide-table td { padding:12px 8px;border-bottom:1px solid var(--rule);vertical-align:top;overflow-wrap:anywhere; }
.guide-table th { color:var(--quiet);font-weight:500; }
.guide-table th:first-child,.guide-table td:first-child { padding-left:0; }
.guide-table th:last-child,.guide-table td:last-child { padding-right:0; }
.guide-table td:first-child { width:28%;font-weight:500;color:var(--ink); }
.guide-table td:nth-child(2) { width:28%; }
.guide-table td:last-child { width:44%;color:var(--quiet); }
.guide-main kbd { display:inline-block;padding:1px 5px;margin:1px 0;border:1px solid var(--rule2);border-bottom-width:2px;border-radius:4px;background:var(--raise);color:var(--ink);font:400 11px/1.6 var(--ui);white-space:nowrap; }
.guide-rate { display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--rule);font-size:13px; }
.guide-rate:last-child { border-bottom:0; }
.guide-rate strong { font-weight:500;color:var(--ink);text-align:right; }
#guide-rates { margin-bottom:12px; }
.guide-resource-grid { display:grid;grid-template-columns:minmax(0,1fr); }
.guide-resource-grid>a { display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--rule);text-decoration:none; }
.guide-resource-grid>a:hover strong { color:var(--mark); }
.guide-resource-grid>a>span:first-child { display:flex;flex:none;color:var(--mark); }
.guide-resource-grid .icon { width:17px;height:17px; }
.guide-resource-grid>a>span:last-child { margin-left:auto;color:var(--quiet); }
.guide-resource-grid strong { display:block;color:var(--ink);font-size:13px;font-weight:500; }
.guide-resource-grid small { display:block;margin-top:2px;color:var(--quiet);font-size:12px; }
.guide-responsible { margin:28px 0 0;padding-top:16px;border-top:1px solid var(--rule);color:var(--quiet);font-size:12px; }
.guide-help-footer { display:flex;align-items:center;gap:8px;margin-top:14px;color:var(--quiet);font-size:12px; }
@container wareyva-guide (max-width:760px) { .guide-topics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container wareyva-guide (max-width:480px) { .guide-topics { grid-template-columns:minmax(0,1fr); } }
@media(max-width:600px) {
  .guide-main { padding:24px 20px 40px; }
  .guide-topics { grid-template-columns:minmax(0,1fr); }
  .guide-back { min-height:44px; }
  .guide-intro { align-items:flex-start;flex-wrap:wrap;gap:14px;margin-bottom:22px;padding-bottom:20px; }
  .guide-intro h1 { font-size:24px; }
  .guide-section-heading h2 { font-size:19px; }
  .guide-controls>div { grid-template-columns:minmax(0,1fr);gap:5px; }
  .guide-card:has(>.icon-box) { column-gap:10px; }
  .guide-table td:first-child { width:29%; }
  .guide-table td:nth-child(2) { width:30%; }
  .guide-table td:last-child { width:41%; }
  .guide-platforms button { padding-inline:10px; }
}
@media(pointer:coarse) {
  .guide-intro>.btn,.guide-topics a,.guide-platforms button,.guide-mobile-topics select { min-height:44px; }
}



@media(max-width:600px){.guide-topics{gap:18px}.guide-topics a{min-height:72px;padding:14px}}