/* app/static/style.css */
html{background:#d2d5bf}   /* faded soft warm lichen */
body{font-family:system-ui,sans-serif;max-width:1000px;margin:0 auto;padding:1rem;background:transparent}
.hero{width:100%;border:6px solid #e4d6b2;border-radius:8px;box-sizing:border-box}
.grid{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;padding:0}
@media(min-width:560px){.grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem}.grid img{height:150px}.card a{padding:.5rem}.card .name{font-size:1rem}}
.grid img{width:100%;height:108px;object-fit:contain}
.card{background:#f2ecdb;border:5px solid #e4d6b2;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px #cebb91;transition:box-shadow .15s;box-sizing:border-box}
.card:hover{box-shadow:inset 0 0 0 1px #cebb91, 0 3px 10px rgba(0,0,0,.15)}
.card a{display:block;color:inherit;text-decoration:none;padding:.35rem}
.card .name{display:block;font-weight:600;margin-top:.3rem;font-size:.78rem;line-height:1.15}
.btn{display:inline-block;margin:.3rem .5rem .3rem 0;padding:.4rem .8rem;background:#5e7144;color:#fff;border-radius:6px;text-decoration:none}
figure{display:inline-block;margin:.4rem}figure img{max-width:240px}
.debug{margin-top:1.5rem;text-align:center;font-family:ui-monospace,monospace;font-size:.75rem;color:#999}
.almanac{margin-top:1.5rem;background:#f2ecdb;border:5px solid #e4d6b2;border-radius:8px;padding:.6rem 1rem;box-shadow:inset 0 0 0 1px #cebb91}
.almanac h2{margin:.2rem 0 .4rem;font-size:1rem;letter-spacing:.02em}
.almanac-list{margin:.2rem 0;padding-left:1.1rem;line-height:1.5}
.almanac-list li{margin:.15rem 0}
.almanac-note{margin:.5rem 0 .1rem;font-size:.72rem;color:#7a6f52;font-style:italic}