:root{font-family:Inter,system-ui,sans-serif;color:#65402e;background:#fff8f4}*{box-sizing:border-box}body{margin:0;background:#fff8f4}.loading,.error{min-height:100dvh;display:grid;place-content:center;text-align:center;padding:32px}.loading span{width:42px;height:42px;border:4px solid #ead5cb;border-top-color:#c96f72;border-radius:50%;animation:spin 1s linear infinite;margin:auto}.error button{border:0;border-radius:999px;padding:14px 22px;background:#c96f72;color:white;font-weight:700}@keyframes spin{to{transform:rotate(360deg)}}
.hero{height:min(42vw,430px);min-height:310px;position:relative;overflow:hidden;background:#ead5cb}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,248,244,.96) 0 43%,rgba(255,248,244,.08) 72%)}.hero img{width:100%;height:100%;object-fit:cover}.hero div{position:absolute;z-index:2;left:6%;top:18%;width:46%}.hero small{letter-spacing:.35em;color:#c96f72}.hero h1{font-family:Georgia,serif;font-size:clamp(2rem,5vw,4.5rem);line-height:1;margin:.25em 0}.hero p{font-size:clamp(1rem,2.2vw,1.5rem)}
.toolbar{display:flex;gap:22px;align-items:center;justify-content:space-between;padding:28px 4%;background:#fffdfb}.toolbar nav{display:flex;flex:1;max-width:560px;background:#f8ebe5;border-radius:999px;padding:4px}.toolbar nav button{flex:1;border:0;border-radius:999px;padding:14px;background:transparent;color:#65402e;font-size:1.05rem}.toolbar nav button.active{background:#c96f72;color:#fff}.toolbar aside{display:grid;padding:10px 20px;border-radius:24px;background:#f4e1da}.greeting{text-align:center;font-size:1.1rem}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:24px 4% 120px;max-width:1000px;margin:auto}.grid article{border:3px solid transparent;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 6px 18px #7a49321c}.grid article.selected{border-color:#c96f72}.grid button{width:100%;border:0;background:#fff;padding:0;position:relative;color:#65402e}.grid img{width:100%;aspect-ratio:1.35;object-fit:cover;display:block}.grid i{position:absolute;right:12px;top:12px;width:38px;height:38px;border:3px solid white;border-radius:50%;display:grid;place-items:center;background:#c96f72;color:#fff;font-style:normal}.grid strong{display:block;padding:14px;font-size:1.15rem}
footer{position:fixed;z-index:5;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:30px;padding:16px;background:#fffdfbea;backdrop-filter:blur(14px);box-shadow:0 -4px 18px #62351f1a}footer span{display:grid}.footer-actions{display:flex;gap:10px}footer button{border:0;border-radius:999px;padding:17px 30px;background:#c96f72;color:#fff;font-size:1rem;font-weight:700}footer button:disabled{opacity:.55}footer .upgrade-button{background:#f4e1da;color:#65402e}#notice{position:fixed;z-index:12;left:50%;bottom:92px;transform:translateX(-50%);background:#65402e;color:#fff;padding:10px 16px;border-radius:999px;max-width:90%;text-align:center}#notice:empty{display:none}
.modal-backdrop{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:18px;background:#301b14a8}.upgrade-modal{position:relative;width:min(560px,100%);max-height:90dvh;overflow:auto;border-radius:28px;padding:30px;background:#fff8f4;box-shadow:0 24px 80px #2b171580}.upgrade-modal>small{color:#c96f72;letter-spacing:.18em;font-weight:800}.upgrade-modal h2{margin:.35rem 0;font:700 2rem Georgia,serif}.modal-close{position:absolute;right:16px;top:14px;border:0;background:transparent;color:#65402e;font-size:2rem}.upgrade-options{display:grid;gap:12px;margin-top:22px}.upgrade-options button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:17px;border:1px solid #e2c8bd;border-radius:18px;background:#fff;color:#65402e;text-align:left}.upgrade-options span{display:grid;gap:4px}.upgrade-options small{font-size:.82rem}.upgrade-options strong{white-space:nowrap;color:#b95f63}
@media(max-width:650px){.hero{height:330px}.hero div{left:7%;top:12%;width:58%}.toolbar{align-items:stretch;gap:10px}.toolbar aside{font-size:.75rem}.grid{gap:10px;padding-inline:10px}.grid article{border-radius:17px}.grid strong{font-size:.9rem;padding:10px}footer{justify-content:space-between;gap:8px}footer button{padding:13px 15px}.footer-actions{gap:6px}.footer-actions button{font-size:.78rem}.upgrade-modal{padding:26px 20px}}
