*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F3F4F1;color:#1B1F1D;font-family:'Golos Text',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#0F6E68}a:hover{color:#0A4F4B}
.wrap{max-width:1180px;margin:0 auto;padding:32px 24px 56px;display:flex;flex-direction:column;gap:36px}
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#1B1F1D}
.brand svg{display:block;flex:none}
.brand span{font:600 22px Unbounded,sans-serif;letter-spacing:-.01em}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ghost{min-height:44px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;color:#5B625E;text-decoration:none;font-weight:500;font-size:15px}
.solid{min-height:44px;display:inline-flex;align-items:center;gap:10px;padding:0 20px;border-radius:999px;background:#1B1F1D;color:#fff;text-decoration:none;font-weight:500;font-size:15px}
.solid:hover{color:#fff;background:#2c322f}
.hero{display:flex;flex-direction:column;gap:10px;max-width:760px}
h1{margin:0 0 4px;font:600 clamp(32px,5vw,52px)/1.08 Unbounded,sans-serif;letter-spacing:-.02em}
.lead{margin:0;font-size:19px;line-height:1.5;color:#5B625E;text-wrap:balance}
.sub{margin:0;font-size:16px;line-height:1.5;color:#5B625E;text-wrap:balance}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 18px;border-radius:999px;font:500 15px 'Golos Text',sans-serif;cursor:pointer;background:#fff;color:#1B1F1D;border:1px solid #DDE0DA}
.chip[aria-pressed=true]{background:#1B1F1D;color:#fff;border-color:#1B1F1D}
.back{align-self:flex-start;min-height:44px;display:inline-flex;align-items:center;gap:8px;padding:0 16px 0 10px;border-radius:999px;background:#fff;border:1px solid #DDE0DA;color:#1B1F1D;font:500 15px 'Golos Text',sans-serif;text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.tile{position:relative;display:block;aspect-ratio:4/5;border-radius:24px;overflow:hidden;text-decoration:none;background:#1B1F1D;color:#fff;box-shadow:0 1px 2px rgba(27,31,29,.06),0 14px 34px rgba(27,31,29,.10);transition:transform .18s ease,box-shadow .18s ease}
.tile:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(27,31,29,.08),0 20px 44px rgba(27,31,29,.16);color:#fff}
.tile:focus-visible{outline:3px solid #0F6E68;outline-offset:3px}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,11,0) 38%,rgba(10,12,11,.82) 100%)}
.pill{position:absolute;top:18px;left:18px;font-size:12px;font-weight:600;padding:7px 11px;border-radius:999px;white-space:nowrap}
.pill.open{background:#fff;color:#0B5A55}
.pill.google{background:rgba(20,22,21,.72);color:#fff;border:1px solid rgba(255,255,255,.28)}
.pill.own{background:rgba(20,22,21,.72);color:#fff;border:1px solid rgba(255,255,255,.28)}
.pill.home{background:#F6EAD9;color:#7A3E06}
.pill.soon{background:#F2EADB;color:#4A3F2E}
.cap{position:absolute;left:22px;right:22px;bottom:22px;display:flex;flex-direction:column;gap:6px}
.cap .n{font:500 24px Unbounded,sans-serif;letter-spacing:-.01em}
.cap .d{font-size:15px;line-height:1.4;color:rgba(255,255,255,.88)}
.cap .u{font-size:13px;color:rgba(255,255,255,.72);margin-top:2px}
.cap .c{align-self:flex-start;margin-top:8px;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);font-size:13px;font-weight:500}
.empty{aspect-ratio:4/5;border-radius:24px;border:1.5px dashed #C2C7BF;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center;color:#5B625E;font-size:15px;line-height:1.45}
.tile[hidden],.empty[hidden]{display:none}
footer{display:flex;flex-direction:column;gap:8px;padding-top:24px;border-top:1px solid #DDE0DA;color:#5B625E;font-size:14px}
footer .row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
footer small{font-size:12px;line-height:1.5}
@media (prefers-reduced-motion:reduce){.tile{transition:none}.tile:hover{transform:none}}