/* BN699 - Public booth and mall pages: photo-led grid, the booth's logo and name up top, calm neutral surfaces with a warm accent.
   Restyles the existing sf-* classes; loaded after the page's own styles. */
:root{--sh-bg:#f7f6f3;--sh-card:#fff;--sh-line:#e7e3dc;--sh-ink:#1c1917;--sh-soft:#57534e;--sh-mute:#78716c;--sh-accent:#14532d;--sh-accent-2:#166534;--sh-warm:#b45309}
html,body{background:var(--sh-bg)!important;color:var(--sh-ink)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif!important;-webkit-font-smoothing:antialiased}
.sf-top{background:rgba(255,255,255,.9)!important;backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--sh-line)!important;position:sticky;top:0;z-index:20}
.sf-top .wrap{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.sf-top a.home{display:inline-flex;align-items:center;gap:10px;font-family:inherit!important;font-weight:700!important;font-size:16px!important;color:var(--sh-ink)!important;text-decoration:none}
.sh-logo{display:block;object-fit:contain;background:#fff;border:1px solid var(--sh-line);border-radius:12px}
.sf-top .sh-logo{width:36px;height:36px;padding:3px}
.sf-hero{display:grid!important;grid-template-columns:auto 1fr;column-gap:18px;row-gap:4px;align-items:center;padding:26px 0 8px!important}
.sf-hero>.sh-logo{grid-row:1 / span 2}
.sf-hero>h1,.sf-hero>.sf-meta,.sf-hero>div{grid-column:2}
.sf-hero>.sf-about,.sf-hero>.sh-about{grid-column:1/-1}
.sf-hero .sh-logo{width:96px;height:96px;padding:6px;border-radius:20px;box-shadow:0 1px 2px rgba(28,25,23,.06)}
.sf-hero:not(:has(.sh-logo)){grid-template-columns:1fr}
.sf-hero:not(:has(.sh-logo))>*{grid-column:1/-1!important}
.sf-hero h1{font-family:inherit!important;font-weight:800!important;letter-spacing:-.025em;font-size:clamp(28px,4.4vw,40px)!important;line-height:1.1;margin:0 0 6px!important;color:var(--sh-ink)!important;text-wrap:balance}
.sf-meta{display:flex;flex-wrap:wrap;gap:6px 16px;color:var(--sh-soft)!important;font-size:15px}
.sf-meta span{display:inline-flex;align-items:center;gap:6px}
.sf-about,.sh-about{grid-column:1/-1;max-width:68ch;color:var(--sh-soft);font-size:16px;line-height:1.55;margin:4px 0 0}
.sf-bar{display:flex!important;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 0 14px!important;border:0!important;background:none!important}
.sf-search{display:flex;gap:8px;flex:1 1 320px;max-width:520px}
.sf-search input[type=search],.sf-search input#sfq{flex:1;min-height:46px;font-size:16px!important;border:1px solid var(--sh-line)!important;border-radius:12px!important;background:#fff!important;padding:0 14px!important;color:var(--sh-ink)}
.sf-search input#sfq:focus{outline:2px solid var(--sh-accent);outline-offset:1px}
.btn{min-height:44px;border-radius:12px!important;font-family:inherit!important;font-weight:600!important;font-size:14.5px!important;padding:0 16px!important;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--sh-line)!important;background:#fff!important;color:var(--sh-ink)!important;text-decoration:none;touch-action:manipulation}
.btn.solid{background:var(--sh-accent)!important;border-color:var(--sh-accent)!important;color:#fff!important}
.sf-count{color:var(--sh-mute)!important;font-size:14px}
.sf-filter{display:inline-flex;gap:2px;padding:3px;background:#efece6;border-radius:12px}
.sf-filter .btn{min-height:36px;border:0!important;background:transparent!important;color:var(--sh-soft)!important}
.sf-filter .btn.solid{background:#fff!important;color:var(--sh-ink)!important;box-shadow:0 1px 2px rgba(28,25,23,.1)}
.sf-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))!important;gap:14px!important}
.sf-card{display:flex!important;flex-direction:column;background:var(--sh-card)!important;border:1px solid var(--sh-line)!important;border-radius:16px!important;overflow:hidden;text-decoration:none;color:inherit;transition:border-color 140ms ease,box-shadow 140ms ease}
@media (hover:hover) and (pointer:fine){.sf-card:hover{border-color:#d6d0c6!important;box-shadow:0 8px 24px -14px rgba(28,25,23,.35)}}
.sf-ph{aspect-ratio:1/1;background:#f1eee8!important;display:grid;place-items:center;overflow:hidden}
.sf-ph img{width:100%;height:100%;object-fit:cover;display:block}
.sf-ph svg{width:44px!important;height:44px!important;opacity:.45}
.sf-info{display:grid;gap:4px;padding:10px 12px 12px!important}
.sf-title{font-size:14.5px!important;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--sh-ink)!important;min-height:2.6em}
.sf-price{font-family:inherit!important;font-size:17px!important;font-weight:800!important;color:var(--sh-ink)!important;font-variant-numeric:tabular-nums}
.sh-booth{font-size:12.5px;color:var(--sh-mute);font-weight:600}
.sf-pages{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 0}
.sf-foot{border-top:1px solid var(--sh-line);background:#fff!important;color:var(--sh-mute)!important}
.sh-dir{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:thin}
.sh-dir a{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:1px solid var(--sh-line);border-radius:999px;background:#fff;color:var(--sh-ink);text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.sh-dir a.on{background:var(--sh-accent);border-color:var(--sh-accent);color:#fff}
.sh-dir a small{color:inherit;opacity:.7;font-weight:500}
@media (max-width:640px){.sf-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.sf-hero{gap:12px;padding-top:18px!important}.sf-hero .sh-logo{width:68px;height:68px;border-radius:16px}.sf-title{font-size:14px!important}.sf-search{flex-basis:100%;max-width:none}}
@media (prefers-reduced-motion:reduce){.sf-card{transition:none}}
.wrap{padding-left:max(16px,env(safe-area-inset-left))!important;padding-right:max(16px,env(safe-area-inset-right))!important;box-sizing:border-box}
.sf-hero.wrap{max-width:1180px}