:root{font:16px system-ui,sans-serif;color:#292719;background:#f7f3ea;--accent:#eab656;--line:#ddd3bc;--paper:#fffdf7}
*{box-sizing:border-box}
body{margin:0}
header,main,nav{width:min(100% - 2rem,60rem);margin-inline:auto}
header{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.6rem;font-size:1.35rem;font-weight:800;text-decoration:none;color:inherit}
.brand img{width:2.25rem;height:2.25rem}
main{padding:1.5rem 0}
nav{display:flex;gap:.25rem;justify-content:space-between;padding:.5rem 0 max(.8rem,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
nav a{flex:1;text-align:center;text-decoration:none;padding:.75rem .2rem;border-radius:.65rem;color:inherit;font-size:.95rem}
nav a[aria-current]{background:#eadcbb;font-weight:700}
h1{font-size:clamp(2rem,6vw,3.3rem);line-height:1.05;margin:.3em 0}
h2{line-height:1.2}
p{line-height:1.5}
.eyebrow{letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;font-weight:750;color:#625338}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1rem}
.card{background:var(--paper);border:1px solid var(--line);border-radius:1rem;padding:1rem;margin-block:.75rem;min-width:0}
.tile{display:block;text-decoration:none;color:inherit;padding:1.4rem}
.tile strong{display:block;font-size:1.45rem;margin:.3em 0}
.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
button,select,input,.button{font:inherit;border:1px solid #9d9277;background:white;border-radius:.55rem;padding:.6rem;color:inherit;max-width:100%}
button,.button{min-height:44px;cursor:pointer;font-weight:650}
button:disabled{cursor:default;opacity:.6}
.button{display:inline-flex;align-items:center;text-decoration:none}
.primary{background:var(--accent);border-color:#a47626}
:focus-visible{outline:3px solid #855816;outline-offset:3px}
label{display:inline-flex;gap:.45rem;align-items:center;flex-wrap:wrap}
input[type=number]{width:6rem}
input[type=checkbox]{width:1.25rem;height:1.25rem}
small,.muted{color:#5c523e}
output{overflow-wrap:anywhere}
summary{cursor:pointer;font-weight:700}
li{margin:.35rem 0}
#status{width:min(100% - 2rem,60rem);margin:.5rem auto;min-height:1.5rem}
@media(min-width:46rem){nav{position:sticky;bottom:0;background:#f7f3ea}}