/* HeyGoldfish – Banyuwangi Goldfish Center */
:root{--pri:#EE4B1F;--bg:#fff;--card:#fff;--bd:#E9ECEF;--tx:#121212;--mu:#6C757D;--soft:#F8F9FA;--ok:#E8F7EE;--warn:#FFF4E5;--hero:#121212;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#121212;--card:#1c1c1e;--bd:#2c2c2e;--tx:#f4f4f5;--mu:#a1a1aa;--soft:#232326;--ok:#16301f;--warn:#33270f;--hero:#1c1c1e;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#121212;--card:#1c1c1e;--bd:#2c2c2e;--tx:#f4f4f5;--mu:#a1a1aa;--soft:#232326;--ok:#16301f;--warn:#33270f;--hero:#1c1c1e;color-scheme:dark}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{height:100%;margin:0;background:var(--soft);color:var(--tx)}

.ns::-webkit-scrollbar{display:none}.ns{scrollbar-width:none}

.tab{display:none;animation:f .25s}.tab.on{display:block}@keyframes f{from{opacity:0;transform:translateY(4px)}to{opacity:1}}

.art p,.art li{font-size:14px;line-height:1.7;color:var(--tx)}.art ul,.art ol{padding-left:1.1rem;margin:.4rem 0}.art ul{list-style:disc}.art ol{list-style:decimal}

.box{border-radius:14px;padding:12px;font-size:12.5px;line-height:1.55;margin-top:8px}

.nv{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;font-weight:500;color:var(--mu);min-width:50px}.nv svg{width:22px;height:22px}.nv.on{color:var(--pri);font-weight:700}

/* ===== Konten artikel (Markdown) ===== */
:root{--danger:#FDECEA}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--danger:#3a1a1a}}
:root[data-theme="dark"]{--danger:#3a1a1a}
.art h2{font-size:14px;font-weight:700;margin:1.25rem 0 .25rem}
.art h3{font-size:13px;font-weight:700;margin:1rem 0 .25rem}
.art a{color:var(--pri);text-decoration:underline}
.art img,.art video{max-width:100%;border-radius:14px;margin:.6rem 0;display:block}
.art figure{margin:.6rem 0}.art figure video{width:100%;background:#000;margin:0}
.art figcaption{font-size:11px;color:var(--mu);margin-top:4px}
.art blockquote{border-left:3px solid var(--pri);padding-left:.75rem;color:var(--mu)}
.art table{width:100%;font-size:12px;border-collapse:collapse;margin:.5rem 0}.art th,.art td{border:1px solid var(--bd);padding:6px 8px;text-align:left}
.art .box p{font-size:12.5px;margin:0}.art .box p+p{margin-top:.4rem}
.c-warn{background:var(--warn)}.c-info{background:var(--soft);border:1px solid var(--bd)}.c-danger{background:var(--danger)}.c-ok{background:var(--ok)}
.gal{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;margin:.6rem 0}.gal::-webkit-scrollbar{display:none}
.gal img{height:180px;width:auto;max-width:none;flex:none;margin:0;scroll-snap-align:start}
.yt{position:relative;aspect-ratio:16/9;margin:.6rem 0}.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:14px}
.cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;margin-top:1rem}

/* ===== Aksesibilitas ===== */
:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
button,a{-webkit-tap-highlight-color:transparent}
details summary{list-style:none}details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";float:right;color:var(--pri);font-weight:800}details[open] summary::after{content:"–"}

.art p{margin:.6rem 0}.art .box p{margin:0}
