:root { color-scheme: light; --primary:#d97706; --text:#431407; --muted:#78350f; --panel:rgba(255,255,255,.78); --border:rgba(67,20,7,.15); font-family:system-ui,-apple-system,"Segoe UI",sans-serif; background:#fdf6e3; color:var(--text); line-height:1.65; }
* { box-sizing:border-box; }
body { margin:0; overflow-wrap:anywhere; }
main,.shell { width:min(1040px,calc(100% - 2rem)); margin:auto; padding:1.25rem 0 3rem; }
.topbar,.actions,.meta,nav { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; }
.topbar { justify-content:space-between; margin-block-end:1rem; }
.brand { display:inline-flex; flex-wrap:wrap; max-width:100%; align-items:center; gap:.75rem; font-size:clamp(1rem,5vw,1.4rem); text-decoration:none; }
.app-icon { width:64px; height:64px; border-radius:16px; }
a { color:var(--muted); text-decoration:underline; text-underline-offset:.15em; overflow-wrap:anywhere; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--primary); outline-offset:4px; }
.hero,section,.card { border:1px solid var(--border); background:var(--panel); border-radius:1.5rem; padding:clamp(.5rem,4vw,2rem); margin-block:1rem; }
h1 { font-size:clamp(1.2rem,calc(1rem + 2vw),3rem); line-height:1.2; }
h2 { font-size:1.2rem; line-height:1.4; }
h3 { font-size:1.05rem; }
p,li,h1,h2,h3,.label { overflow-wrap:anywhere; }
p { margin-block:0 .85rem; }
ul,ol { padding-inline-start:1.5rem; }
li+li { margin-block-start:.4rem; }
.section-label,.mini-label { font-weight:700; }
.pill,.btn { display:inline-block; vertical-align:middle; min-height:2.75rem; min-width:0; max-width:100%; overflow-wrap:anywhere; padding:.5rem .8rem; border:1px solid var(--border); border-radius:1rem; }
.meta { margin-block-start:1rem; }
.note,.mini-card { padding:1rem; border:1px solid var(--border); border-radius:1rem; background:rgba(217,119,6,.06); margin-block:1rem; }
.quick-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap:1rem; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:start; vertical-align:top; padding:.75rem; border-block-end:1px solid var(--border); }
td nav { align-items:flex-start; }
@media(max-width:480px) { main,.shell { width:calc(100% - 1rem); } .topbar { align-items:flex-start; } th,td { padding:.5rem; } }
@media(max-width:480px) {
  table,tbody,tr,th,td { display:block; width:100%; }
  thead { position:absolute; width:1px; height:1px; overflow:hidden; }
  tbody tr { margin-block:1rem; border:1px solid var(--border); border-radius:1rem; }
  tbody th { border:0; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; } }
