/* 商圈導覽頁（area-*.html，由 tools/area-guides/build.py 產生）專用樣式。
   版面沿用 site.css 的長指南：主圖 → 位置列 → 速覽欄 → 章節（site-nav.js 產生桌機側欄／手機章節列）→ 注意事項 → 地圖 → 上下一個商圈 → 相關指南 → 來源。 */

/* 位置列 */
.ag-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;padding-top:var(--s5);font-size:12.5px;color:var(--ink-3)}
.ag-crumb a{color:var(--ink-2);text-decoration:none}
.ag-crumb a:hover{color:var(--ai);text-decoration:underline}
.ag-crumb i{font-style:normal;color:var(--ink-3)}
.ag-crumb span{color:var(--ink)}

/* 速覽欄 */
.ag-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin:var(--s4) 0 0;background:var(--sheet);
  border:1px solid var(--line);border-top:2px solid var(--ink);border-radius:0 0 var(--r-card) var(--r-card)}
.ag-facts{gap:1px;background:var(--line);overflow:hidden}
.ag-facts div{padding:var(--s4) var(--s5);background:var(--sheet);min-width:0}
@media (min-width:761px){
  .ag-facts[data-n="3"]{grid-template-columns:repeat(3,1fr)}
  .ag-facts[data-n="4"]{grid-template-columns:repeat(4,1fr)}
  .ag-facts[data-n="5"],.ag-facts[data-n="6"]{grid-template-columns:repeat(3,1fr)}
  .ag-facts[data-n="5"] div:last-child{grid-column:span 2}
}
.ag-facts dt{font:500 11px/1.4 var(--f-body);letter-spacing:.14em;color:var(--kin);margin-bottom:6px}
.ag-facts dd{margin:0;font-size:15px;line-height:1.6;font-weight:500;color:var(--ink)}
@media (max-width:760px){
  .ag-facts{grid-template-columns:1fr;border-radius:0 0 var(--r-img) var(--r-img)}
  .ag-facts div{display:grid;grid-template-columns:5.5em 1fr;gap:var(--s3);padding:10px var(--s4)}
  .ag-facts dt{margin:3px 0 0;font-size:11.5px;letter-spacing:.08em}
  .ag-facts dd{font-size:14.5px}
}

/* 章節內文 */
.ag-sec>p{margin:0 0 var(--s3)}
.ag-sec .note{max-width:var(--measure)}
.ag-list{list-style:none;margin:var(--s3) 0;padding:0;max-width:var(--measure)}
.ag-list li{position:relative;padding:9px 0 9px 22px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.75}
.ag-list li:first-child{border-top:1px solid var(--line)}
.ag-list li::before{content:"";position:absolute;left:4px;top:19px;width:7px;height:7px;border-radius:1px;background:var(--kin);transform:rotate(45deg)}
.ag-list b,.ag-warn b{font-weight:700;margin-right:.35em}

/* 路線／時間軸 */
.ag-steps{list-style:none;margin:var(--s4) 0;padding:0;max-width:calc(var(--measure) + 7em)}
.ag-steps li{display:grid;grid-template-columns:6.5em 1fr;gap:var(--s4);position:relative;padding:0 0 var(--s4)}
.ag-steps li::before{content:"";position:absolute;left:calc(6.5em + 7px);top:10px;bottom:-4px;width:1px;background:var(--line)}
.ag-steps li:last-child::before{display:none}
.ag-st-t{font:500 13px/1.5 var(--f-mono);color:var(--kin);text-align:right;padding-top:4px;font-variant-numeric:tabular-nums}
.ag-steps p{margin:0;position:relative;padding-left:var(--s5);font-size:15px;line-height:1.75}
.ag-steps p::before{content:"";position:absolute;left:3px;top:9px;width:9px;height:9px;border-radius:50%;background:var(--paper);border:2px solid var(--ink)}
@media (max-width:760px){
  .ag-steps li{grid-template-columns:1fr;gap:2px;padding:0 0 var(--s4) var(--s5)}
  .ag-steps li::before{left:7px;top:14px}
  .ag-st-t{text-align:left;padding:0}
  .ag-steps p{padding-left:0;position:static}
  .ag-steps p::before{left:2px;top:5px}
}

/* 注意事項 */
.ag-warn{counter-reset:w;list-style:none;margin:0;padding:var(--s2) var(--s5);background:var(--sheet);border:1px solid var(--line);
  border-left:3px solid var(--warn);border-radius:0 var(--r-card) var(--r-card) 0;max-width:calc(var(--measure) + 4em)}
.ag-warn li{position:relative;padding:12px 0 12px 34px;font-size:15px;line-height:1.7;border-bottom:1px dashed var(--line)}
.ag-warn li:last-child{border-bottom:0}
.ag-warn li::before{counter-increment:w;content:counter(w,decimal-leading-zero);position:absolute;left:0;top:14px;font:500 12px/1.4 var(--f-mono);color:var(--warn)}
@media (max-width:760px){.ag-warn{padding:var(--s1) var(--s4)}.ag-warn li{padding-left:28px;font-size:14.5px}}

/* 在地圖上看 */
.ag-mapbox{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--s5);align-items:start}
.ag-loc{margin:0;padding:var(--s4);background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card)}
.ag-loc svg{display:block;width:100%;height:auto;max-height:260px}
.ag-loc .s{fill:var(--paper-2)}
.ag-loc .z{fill:none;stroke:var(--sheet);stroke-width:1.3;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ag-loc .t{fill:var(--zc);stroke:var(--zc);stroke-width:1;vector-effect:non-scaling-stroke}
.ag-loc circle{fill:none;stroke:var(--ink);stroke-width:1.6;vector-effect:non-scaling-stroke}
.ag-loc figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2);margin-top:var(--s3);padding-top:var(--s2);border-top:1px solid var(--line)}
.ag-loc figcaption b{font:700 16px var(--f-display);letter-spacing:.06em}
.ag-loc figcaption span{font-size:12px;color:var(--ink-3)}
.ag-maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s3)}
.ag-map{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4);background:var(--sheet);border:1px solid var(--line);
  border-radius:var(--r-card);text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s,box-shadow .15s}
.ag-map:hover{border-color:var(--ai);transform:translateY(-1px);box-shadow:var(--shadow)}
.ag-map i{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:700 15px/1 var(--f-display);font-style:normal;color:#fff;background:var(--gc,var(--ai))}
.ag-map span{display:flex;flex-direction:column;min-width:0}
.ag-map b{font-size:15px;font-weight:700;line-height:1.4}
.ag-map small{font-size:12.5px;color:var(--ink-2);line-height:1.5}
.ag-map::after{content:"→";margin-left:auto;color:var(--ink-3);font-family:var(--f-mono)}
.ag-m-all i{background:conic-gradient(#d0601a 0 25%,#a8802f 0 50%,#4a5d8f 0 75%,#2f5a48 0);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.ag-m-food{--gc:var(--tabe)} .ag-m-art{--gc:var(--kin)} .ag-m-design{--gc:#4a5d8f} .ag-m-shop{--gc:var(--shu)} .ag-m-wear{--gc:var(--kinu)}
@media (max-width:760px){
  .ag-mapbox{grid-template-columns:1fr;gap:var(--s3)}
  .ag-loc{display:grid;grid-template-columns:96px 1fr;gap:var(--s3);align-items:center;padding:var(--s3)}
  .ag-loc figcaption{flex-direction:column;align-items:flex-start;gap:2px;margin:0;padding:0;border:0}
  .ag-maps{grid-template-columns:1fr 1fr;gap:var(--s2)}
  .ag-map{padding:10px var(--s3);gap:10px}
  .ag-map i{width:30px;height:30px;font-size:13px}
  .ag-map small,.ag-map::after{display:none}
}

/* 上一個／下一個商圈 */
.ag-pn{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-top:var(--s7)}
.ag-pn a{display:flex;flex-direction:column;gap:4px;padding:var(--s4) var(--s5);background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);
  text-decoration:none;color:var(--ink);min-width:0;transition:border-color .15s}
.ag-pn a:hover{border-color:var(--ai)}
.ag-pn-next{text-align:right;align-items:flex-end}
.ag-pn small{font:500 11px var(--f-mono);letter-spacing:.14em;color:var(--kin)}
.ag-pn b{font:700 19px/1.35 var(--f-display);letter-spacing:.06em}
.ag-pn b span{font:500 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-left:8px}
.ag-pn em{font-style:normal;font-size:13px;line-height:1.6;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:760px){.ag-pn{grid-template-columns:1fr}.ag-pn .is-empty{display:none}.ag-pn-next{text-align:left;align-items:flex-start}.ag-pn em{display:none}}

/* 資料來源 */
.ag-src p{margin:0 0 6px;font-size:12.5px;color:var(--ink-3)}
.ag-src ul{font-size:12.5px;line-height:1.7}
.ag-src a{color:var(--ink-2);word-break:break-word}

/* ───────── 第二版：照片、路線、示意圖、心得 ───────── */

/* 照片（section.figure）：手機也顯示（使用者要求圖文說明），高度受限 */
.ag-fig{margin:var(--s5) 0}
.ag-fig-i{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-img);background:var(--paper-2)}
.ag-fig-i img{display:block;width:100%;height:100%;object-fit:cover}
.ag-fig.is-tall{max-width:380px}
.ag-fig.is-tall .ag-fig-i{aspect-ratio:4/5}
.ag-fig figcaption{display:flex;flex-direction:column;gap:2px;margin-top:var(--s2);padding-left:var(--s3);border-left:2px solid var(--kin)}
.ag-fig-c{font-size:14px;line-height:1.6;color:var(--ink)}
.ag-fig-cr{font:400 11px/1.5 var(--f-mono);color:var(--ink-3);word-break:break-word}
.ag-fig-cr a{color:inherit;text-decoration:none}
.ag-fig-cr a:hover{text-decoration:underline;color:var(--ink-2)}
@media (max-width:760px){
  .ag-fig{margin:var(--s4) 0}
  .ag-fig-i{aspect-ratio:3/2;border-radius:6px}
  .ag-fig.is-tall .ag-fig-i{aspect-ratio:1/1}
  .ag-fig-c{font-size:13.5px}
}

/* 示意圖共用外框 */
.ag-dg{margin:var(--s5) 0;padding:var(--s4) var(--s5) var(--s5);background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card)}
.ag-dg-t{display:flex;align-items:baseline;gap:10px;margin:0 0 var(--s4);font:700 16px/1.4 var(--f-display);letter-spacing:.04em;color:var(--ink)}
.ag-dg-t span{flex:none;font:500 10.5px/1 var(--f-mono);letter-spacing:.14em;color:var(--kin);border:1px solid currentColor;border-radius:3px;padding:3px 5px}
.ag-dg ul{list-style:none;margin:0;padding:0}
.ag-dc{display:flex;flex-direction:column;gap:1px;min-width:0}
.ag-dc b{font-size:14px;font-weight:700;line-height:1.45}
.ag-dc small{font-size:12.5px;line-height:1.5;color:var(--ink-2)}
@media (max-width:760px){.ag-dg{padding:var(--s3) var(--s4) var(--s4);margin:var(--s4) 0}.ag-dg-t{font-size:15px;margin-bottom:var(--s3)}}

/* floors：樓層剖面，地面線分隔地上／地下 */
.ag-floors{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ag-fl{display:grid;grid-template-columns:4.6em 1fr;gap:var(--s3);align-items:stretch}
.ag-fl-p{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;word-break:keep-all;font:500 13px/1.2 var(--f-mono);color:var(--sheet);background:var(--ai);border-radius:6px;padding:8px 4px;text-align:center;font-variant-numeric:tabular-nums}
.ag-fl.is-b .ag-fl-p{background:var(--ink-2)}
.ag-fl ul{display:flex;flex-wrap:wrap;gap:6px;padding:6px;background:var(--paper);border-radius:6px;min-width:0}
.ag-fl.is-b ul{background:var(--paper-2)}
.ag-fl .ag-dc{flex:1 1 11em;padding:6px 10px 6px 12px;background:var(--sheet);border:1px solid var(--line);border-left:4px solid var(--lc,var(--ink-3));border-radius:4px}
.ag-gl{position:relative;height:18px;margin:2px 0}
.ag-gl::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px solid var(--kinu);opacity:.75}
.ag-gl span{position:absolute;left:0;top:50%;transform:translateY(-50%);background:var(--sheet);padding:0 8px 0 0;font:500 11px/1 var(--f-mono);letter-spacing:.12em;color:var(--kinu)}
@media (max-width:760px){
  .ag-fl{grid-template-columns:3.6em 1fr;gap:8px}
  .ag-fl-p{font-size:12px}
  .ag-fl .ag-dc{flex-basis:100%}
}

/* sides：左右分區 */
.ag-sides{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:0}
.ag-sides[data-n="2"]{--n:2}.ag-sides[data-n="3"]{--n:3}.ag-sides[data-n="4"]{--n:4}.ag-sides[data-n="5"]{--n:5}
.ag-side{padding:0 var(--s4);border-left:1px dashed var(--line);min-width:0}
.ag-side:first-child{padding-left:0;border-left:0}
.ag-side:last-child{padding-right:0}
.ag-side-h{margin:0 0 var(--s3);padding:7px 10px;font:700 15px/1.3 var(--f-display);letter-spacing:.08em;color:var(--sheet);background:var(--ai);border-radius:6px;text-align:center}
.ag-side:nth-child(2) .ag-side-h{background:var(--kinu)}
.ag-side:nth-child(3) .ag-side-h{background:var(--kin)}
.ag-side:nth-child(4) .ag-side-h{background:var(--tabe)}
.ag-side:nth-child(5) .ag-side-h{background:var(--shu)}
.ag-sides[data-n="5"] .ag-side{padding:0 10px}.ag-sides[data-n="5"] .ag-side-h{font-size:14px;padding:7px 4px}
.ag-side ul{display:flex;flex-direction:column;gap:0}
.ag-side .ag-dc{padding:8px 0;border-bottom:1px solid var(--line)}
.ag-side .ag-dc:last-child{border-bottom:0}
.ag-side .ag-dc.has-c b::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--lc);margin-right:6px;vertical-align:1px}
@media (max-width:760px){
  .ag-side{padding:0 10px}
  .ag-side-h{font-size:14px;padding:6px 6px}
  .ag-sides[data-n="3"],.ag-sides[data-n="4"],.ag-sides[data-n="5"]{grid-template-columns:1fr;gap:var(--s3)}
  .ag-sides[data-n="3"] .ag-side,.ag-sides[data-n="4"] .ag-side,.ag-sides[data-n="5"] .ag-side{padding:0;border-left:0}
  .ag-sides[data-n="3"] .ag-side-h,.ag-sides[data-n="4"] .ag-side-h,.ag-sides[data-n="5"] .ag-side-h{text-align:left;margin-bottom:4px;font-size:14px;padding:6px 10px}
  .ag-side .ag-dc b{font-size:13.5px}
  .ag-side .ag-dc small{font-size:12px}
}

/* grid：街區方格（方位 3×3、列欄座標或依序方塊） */
.ag-grid{display:grid;grid-template-columns:repeat(var(--nc,3),minmax(0,1fr));gap:6px}
.ag-grid.is-free{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.ag-cell{display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:var(--paper);border:1px solid var(--line);border-radius:6px;min-height:68px;min-width:0}
.ag-cell.is-empty{background:repeating-linear-gradient(135deg,transparent 0 6px,var(--paper-2) 6px 7px);border-style:dashed;min-height:0}
.ag-cell-p{font:500 10.5px/1.2 var(--f-mono);letter-spacing:.12em;color:var(--kin)}
.ag-cell.is-empty .ag-cell-p{color:var(--ink-3)}
.ag-cell ul{display:flex;flex-direction:column;gap:6px}
.ag-grid-n{margin:8px 0 0;text-align:right;font:500 11px var(--f-mono);letter-spacing:.12em;color:var(--ink-3)}
@media (max-width:760px){
  .ag-grid{gap:4px}
  .ag-cell{padding:8px;min-height:56px}
  .ag-cell .ag-dc b{font-size:13px}
  .ag-cell .ag-dc small{font-size:11.5px}
  .ag-grid.is-free{grid-template-columns:1fr 1fr}
}

/* 路線（section.route）：地圖＋站點清單 */
.ag-route{margin:var(--s5) 0;background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.ag-route-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px var(--s3);padding:var(--s3) var(--s4);border-bottom:1px solid var(--line)}
.ag-route-h b{font:700 16px/1.4 var(--f-display);letter-spacing:.04em}
.ag-route-h span{font:500 11.5px var(--f-mono);color:var(--ink-3)}
.ag-route-b{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.ag-rmap{position:relative;min-height:340px;background:#f1f1ee;border-right:1px solid var(--line)}
.ag-rsvg{position:absolute;inset:0;width:100%;height:100%}
.ag-rsvg .bg{fill:#f1f1ee}
.ag-rsvg pattern path{stroke:#e2e2dd;stroke-width:1}
.ag-rsvg .ln{fill:none;stroke:var(--ai);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.ag-rsvg .ln-train{stroke:var(--shu);stroke-dasharray:8 6}
.ag-rsvg circle{fill:var(--ai);stroke:#fff;stroke-width:2.5}
.ag-rsvg text{fill:#fff;font:700 12px var(--f-mono);text-anchor:middle}
.ag-rsvg text.n{fill:var(--ink-3);font-size:11px;text-anchor:end}
.ag-rmap .ag-rgl{position:absolute;inset:0;opacity:0;transition:opacity .35s}
.ag-route.is-live .ag-rgl{opacity:1}
.ag-route.is-live .ag-rsvg{visibility:hidden}
.ag-rnote{position:absolute;left:10px;bottom:8px;margin:0;font:500 10.5px var(--f-mono);color:var(--ink-3);pointer-events:none}
.ag-route.is-live .ag-rnote{display:none}
.ag-rlist{list-style:none;margin:0;padding:var(--s2) 0;counter-reset:none;max-height:420px;overflow:auto}
.ag-rlist li{position:relative}
.ag-rlist li:not(:last-child)::after{content:"";position:absolute;left:calc(var(--s4) + 12px);top:38px;bottom:-6px;border-left:2px dotted var(--line)}
.ag-r-train .ag-rlist li:not(:last-child)::after{border-left-style:dashed}
.ag-rs{display:flex;gap:var(--s3);align-items:flex-start;width:100%;padding:8px var(--s4);background:none;border:0;text-align:left;font:inherit;color:inherit;cursor:pointer}
.ag-rs i{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ai);color:var(--sheet);font:700 12px/1 var(--f-mono);font-style:normal;position:relative;z-index:1;box-shadow:0 0 0 3px var(--sheet)}
.ag-r-train .ag-rs i{background:var(--shu)}
.ag-rs span{display:flex;flex-direction:column;gap:1px;min-width:0;padding-top:2px}
.ag-rs b{font-size:14.5px;font-weight:700;line-height:1.45}
.ag-rs small{font-size:13px;line-height:1.55;color:var(--ink-2)}
.ag-route:not(.is-live) .ag-rs{cursor:default}
.ag-route.is-live .ag-rs:hover,.ag-rlist li.is-on .ag-rs{background:var(--paper)}
.ag-rlist li.is-on .ag-rs i{background:var(--glow);color:var(--ink)}
.ag-rs:focus-visible{outline:2px solid var(--ai);outline-offset:-2px}
/* 地圖上的編號點 */
.ag-pin{width:26px;height:26px;padding:0;border-radius:50%;border:2.5px solid #fff;background:#22365c;color:#fff;font:700 12px/1 "IBM Plex Mono",ui-monospace,monospace;
  box-shadow:0 2px 6px rgba(20,30,50,.35);cursor:pointer;display:grid;place-items:center;transition:transform .15s}
.ag-r-train .ag-pin{background:#c8463a}
.ag-pin.is-hover,.ag-pin.is-on{transform:scale(1.22);z-index:2}
.ag-pin.is-on{background:#f2b632;color:#1b1f27}
.ag-rreset{position:absolute;left:10px;top:10px;z-index:2;padding:6px 10px;font:500 12px/1 var(--f-body);color:var(--ink);background:rgba(255,255,255,.94);
  border:1px solid rgba(0,0,0,.12);border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.12);cursor:pointer}
.ag-rgl .maplibregl-cooperative-gesture-screen{font-family:var(--f-body);font-size:15px}
.ag-rgl .maplibregl-ctrl-attrib{font-size:10.5px}
@media (max-width:900px){
  .ag-route-b{grid-template-columns:1fr}
  .ag-rmap{min-height:0;aspect-ratio:4/3;max-height:360px;border-right:0;border-bottom:1px solid var(--line)}
  .ag-rlist{max-height:none}
}
@media (max-width:760px){
  .ag-route{margin:var(--s4) 0;border-radius:var(--r-img)}
  .ag-route-h{padding:10px var(--s3)}
  .ag-route-h b{font-size:15px}
  .ag-rmap{aspect-ratio:1/1;max-height:340px}
  .ag-rs{padding:7px var(--s3)}
  .ag-rlist li:not(:last-child)::after{left:calc(var(--s3) + 12px)}
  .ag-rs b{font-size:14px}.ag-rs small{font-size:12.5px}
}

/* 實用心得（section.tips）：金色系卡片，與注意事項（紅）、旅人經驗（藍）區分 */
.ag-tips{list-style:none;margin:var(--s5) 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--s3)}
.ag-tips li{padding:var(--s3) var(--s4) var(--s4);background:color-mix(in srgb,var(--kin) 7%,var(--sheet));border:1px solid color-mix(in srgb,var(--kin) 28%,var(--line));border-radius:var(--r-card)}
.ag-tip-t{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:15px;font-weight:700;line-height:1.45;color:var(--ink)}
.ag-tip-t i{flex:none;font:500 10.5px/1 var(--f-body);font-style:normal;letter-spacing:.1em;color:var(--sheet);background:var(--kin);border-radius:3px;padding:4px 5px}
.ag-tips li p:last-child{margin:0;font-size:14px;line-height:1.7;color:var(--ink-2)}
@media (max-width:760px){.ag-tips{grid-template-columns:1fr;gap:var(--s2);margin:var(--s4) 0}.ag-tips li{padding:10px var(--s3) var(--s3)}.ag-tips li p:last-child{font-size:13.5px}}

/* 旅人常見經驗（insights） */
.ag-ins{list-style:none;counter-reset:i;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-top:2px solid var(--ai);border-radius:0 0 var(--r-card) var(--r-card);overflow:hidden;max-width:900px}
.ag-ins li{position:relative;padding:var(--s4) var(--s5) var(--s4) calc(var(--s5) + 30px);background:var(--sheet)}
.ag-ins li::before{counter-increment:i;content:counter(i);position:absolute;left:var(--s5);top:calc(var(--s4) + 1px);width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;font:700 11px/1 var(--f-mono);color:var(--ai);border:1.5px solid var(--ai)}
.ag-ins-t{margin:0 0 4px;font-size:15px;font-weight:700;line-height:1.5}
.ag-ins li p:last-child{margin:0;font-size:14px;line-height:1.7;color:var(--ink-2)}
.ag-ins li:nth-child(odd):last-child{grid-column:span 2}
@media (max-width:760px){
  .ag-ins{grid-template-columns:1fr}
  .ag-ins li:nth-child(odd):last-child{grid-column:auto}
  .ag-ins li{padding:12px var(--s4) 12px calc(var(--s4) + 30px)}
  .ag-ins li::before{left:var(--s4);top:13px}
  .ag-ins li p:last-child{font-size:13.5px}
}