/* Fase 9 (31/10/2026): figuras e tabela dos artigos sobre viver com glaucoma.
   Mesmo desenho da figura do filme lacrimal (tear-figure.css): cartão azul, imagem sem texto, legenda numerada em HTML. */
.reading-body .h-figure{margin:30px 0 34px;background:linear-gradient(135deg,#0b294e,#193f6a);border:1px solid #baa16b;border-radius:8px;overflow:hidden;color:#edf3fa;scroll-margin-top:125px}
.reading-body .h-figure-head{padding:25px 25px 0}
.reading-body .h-figure .h-figure-kicker{font:11px/1.5 Arial,sans-serif;letter-spacing:1.8px;color:#e1c685;margin:0 0 8px}
.reading-body .h-figure h2,.reading-body .h-figure .h-figure-title{font:normal 27px/1.25 Georgia,serif;color:#fff;margin:0 0 10px;letter-spacing:0}
.reading-body .h-figure .h-figure-intro{font:15px/1.7 Arial,sans-serif;color:#cedced;margin:0}
.reading-body .h-figure img.h-figure-img{display:block;width:calc(100% - 50px);height:auto;margin:18px 25px 4px;border-radius:6px}
.reading-body .h-figure-items{display:grid;grid-template-columns:1fr;padding:0 25px 15px}
.reading-body .h-figure-item{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:15px 0;border-top:1px solid #ffffff20}
.reading-body .h-figure-item b{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid currentColor;border-radius:50%;font:16px/1 Arial,sans-serif;color:var(--tone)}
.reading-body .h-figure-item h3{font:18px/1.4 Arial,sans-serif;color:var(--tone);margin:0 0 4px;letter-spacing:0}
.reading-body .h-figure-item p{font:15px/1.7 Arial,sans-serif;color:#d2e0ee;margin:0}
/* Dia a dia: grelha de atividades */
.reading-body .h-life-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:20px 25px 25px;margin:0;list-style:none}
.reading-body .h-life-grid li{margin:0;padding:16px;border:1px solid #ffffff22;border-radius:6px;background:#ffffff08;display:flex;flex-direction:column;gap:6px}
.reading-body .h-life-grid img{width:44px;height:44px;margin:0 0 4px}
.reading-body .h-life-grid h3{font:16px/1.35 Arial,sans-serif;color:#fff;margin:0;letter-spacing:0}
.reading-body .h-life-grid .h-life-tag{align-self:flex-start;font:11px/1 Arial,sans-serif;letter-spacing:.6px;padding:5px 8px;border-radius:20px;margin:0}
.reading-body .h-life-grid .ok .h-life-tag{background:#b8d99a;color:#173b1f}
.reading-body .h-life-grid .cuidado .h-life-tag{background:#ebcf8b;color:#4a3610}
.reading-body .h-life-grid p{font:14px/1.6 Arial,sans-serif;color:#d2e0ee;margin:0}
/* Tabela dos colírios */
.reading-body table.h-drops-table{display:table;width:100%;border-collapse:collapse;font-size:15px;line-height:1.6;margin:22px 0 30px}
.reading-body .h-drops-table th,.reading-body .h-drops-table td{padding:14px;border:1px solid #d8dfe8;vertical-align:top;text-align:left}
.reading-body .h-drops-table thead th{background:#102f53;color:#fff;font-weight:600;font-size:13px;letter-spacing:.3px}
.reading-body .h-drops-table tbody th{background:#f4f6fa;color:#102f53;font-weight:600;width:24%}
.reading-body .h-drops-table .h-mobile-label{display:none}
@media(max-width:760px){
 .reading-body .h-life-grid{grid-template-columns:1fr 1fr}
 .reading-body table.h-drops-table,.reading-body .h-drops-table tbody,.reading-body .h-drops-table tr,.reading-body .h-drops-table th,.reading-body .h-drops-table td{display:block;width:auto}
 .reading-body .h-drops-table thead{display:none}
 .reading-body .h-drops-table tr{border:1px solid #d8dfe8;border-radius:6px;margin:0 0 14px;overflow:hidden}
 .reading-body .h-drops-table th,.reading-body .h-drops-table td{border:0;border-top:1px solid #e3e8ef}
 .reading-body .h-drops-table tbody th{border-top:0;width:auto}
 .reading-body .h-drops-table .h-mobile-label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#7a6a3f;margin-bottom:4px}
}
@media(max-width:500px){
 .reading-body .h-figure-head{padding:20px 17px 0}
 .reading-body .h-figure h2,.reading-body .h-figure .h-figure-title{font-size:24px}
 .reading-body .h-figure img.h-figure-img{width:calc(100% - 34px);margin:16px 17px 4px}
 .reading-body .h-figure-items{padding:0 17px 10px}
 .reading-body .h-figure-item{gap:10px}
 .reading-body .h-life-grid{grid-template-columns:1fr;padding:16px 17px 20px}
 .reading-body .h-life-grid li{display:grid;grid-template-columns:44px 1fr;column-gap:12px;row-gap:4px}
 .reading-body .h-life-grid img{grid-row:span 3;margin:0}
 .reading-body .h-life-grid .h-life-tag{justify-self:start}
}