/* /dennys/ brand guide 2.0 (2026-10-20, owner: "the LGBTQ+ page is much nicer"): photo cards, category tiles,
   spotlights with a live list, recommendation rail, Promoter bands, the history reel. Loaded after dennys.css;
   tools/dennys_derive.py turns dn- into dn- for /dennys/. CSP-safe, reduced motion handled in dennys.css. */
/* photo on every card */
.dn-store{padding-top:0;overflow:hidden}
.dn-store-photo{display:block;position:relative;margin:0 -18px 0;aspect-ratio:3/2;overflow:hidden;background:#2a160e}
.dn-store-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.dn-store:hover .dn-store-photo img{transform:scale(1.05)}
.dn-illus{position:absolute;left:10px;bottom:10px;padding:.2em .55em;border-radius:6px;background:#000a;color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.04em}
.dn-store-roof{position:relative;top:auto;left:auto;right:auto;margin:0 0 14px;height:12px}
.dn-house{display:none}
.dn-store h3{padding-right:0}
.dn-store.is-open .dn-store-city::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#2fbf71;margin-left:8px;box-shadow:0 0 0 3px #2fbf7133;vertical-align:1px}
.dn-store.is-classic::after{top:14px;right:14px;z-index:2}
/* tiles */
.dn-tiles-wrap{padding-top:34px}
.dn-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dn-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:150px;padding:16px;border-radius:18px;overflow:hidden;color:#fff;text-decoration:none;isolation:isolate;box-shadow:0 16px 30px -22px #1d0b09}
.dn-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}
.dn-tile:hover img,.dn-tile:focus-visible img{transform:scale(1.07)}
.dn-tile-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#1d0b09ee 0%,#1d0b0966 55%,#1d0b0922 100%)}
.dn-tile b{font:800 2.4rem/1 Georgia,serif;color:var(--dn-glow)}
.dn-tile span{font-weight:700;line-height:1.25}
.dn-tile:first-child .dn-tile-shade{background:linear-gradient(0deg,#7c0d14ee,#7c0d1444)}
.dn-tile-chip{margin:0;display:inline-flex;align-items:center;gap:8px;padding:.35em .5em .35em .9em;border-radius:999px;background:var(--dn-red);color:#fff;font-weight:700;width:max-content;max-width:100%}
.dn-tile-chip button{border:0;background:#fff3;color:#fff;border-radius:50%;width:24px;height:24px;cursor:pointer;font:inherit;line-height:1}
/* spotlights */
.dn-spot{padding:clamp(40px,6vw,80px) 0;background:var(--dn-paper)}
.dn-spot.is-dark{background:linear-gradient(180deg,var(--dn-deep),var(--dn-night));color:#fff}
.dn-spot-inner{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center}
.dn-spot.is-flip .dn-spot-photo{order:2}
.dn-spot-photo{margin:0;position:relative}
.dn-spot-photo img{width:100%;height:clamp(280px,40vw,480px);object-fit:cover;border-radius:24px;display:block;box-shadow:0 30px 60px -30px #000}
.dn-spot-photo figcaption{font-size:.72rem;color:var(--dn-muted);margin-top:6px}
.dn-spot.is-dark .dn-spot-photo figcaption{color:#d9c3b3}
.dn-spot-photo figcaption a{color:inherit}
.dn-spot-copy .eyebrow{color:var(--dn-red)}
.dn-spot.is-dark .dn-spot-copy .eyebrow{color:var(--dn-glow)}
.dn-spot-copy h2{font:700 clamp(1.8rem,3.6vw,2.8rem)/1.08 Georgia,serif;margin:.2em 0 .4em}
.dn-spot-copy p{line-height:1.6;font-size:1.04rem}
.dn-spot.is-dark .dn-spot-copy p{color:#f1dfd0}
.dn-spot.is-dark .dn-ref{background:#ffffff22;color:var(--dn-glow)}
.dn-spot-list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.dn-spot-list a{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px;border-radius:14px;background:#fff;border:1px solid #f0e2d1;color:var(--dn-ink);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.dn-spot.is-dark .dn-spot-list a{background:#ffffff12;border-color:#ffffff22;color:#fff}
.dn-spot-list a:hover{transform:translateX(4px);box-shadow:0 10px 24px -16px #000}
.dn-spot-list img{width:72px;height:48px;object-fit:cover;border-radius:9px;display:block}
.dn-spot-list b{display:block;font-weight:800}
.dn-spot-list small{color:var(--dn-muted);font-size:.84rem}
.dn-spot.is-dark .dn-spot-list small{color:#d9c3b3}
.dn-spot-list em{font-style:normal;font-size:.78rem;font-weight:700;padding:.25em .6em;border-radius:999px;background:#f4ebe0;color:#5a4637;white-space:nowrap}
.dn-spot-list em:empty{display:none}
.dn-spot-list em.is-open{background:#2fbf7122;color:#1d7a47}
.dn-spot.is-dark .dn-spot-list em{background:#ffffff1a;color:#f3e3d4}
.dn-spot.is-dark .dn-spot-list em.is-open{background:#2fbf7140;color:#c8ffe0}
.dn-spot-more{display:inline-block;margin-top:14px;font-weight:800;color:var(--dn-red)}
.dn-spot.is-dark .dn-spot-more{color:var(--dn-glow)}
/* promoter bands and in-list slots */
.dn-promo-band{padding-top:26px;padding-bottom:6px}
.dn-stores .qd-promo{grid-column:1/-1}
/* recommendations */
.dn-rec-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dn-rec{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:#fff;border:1px solid #f0e2d1;color:var(--dn-ink);text-decoration:none;box-shadow:0 14px 30px -24px #3b2216;transition:transform .2s ease}
.dn-rec:hover{transform:translateY(-4px)}
.dn-rec img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.dn-rec-copy{padding:14px 16px 18px;display:grid;gap:4px}
.dn-rec-copy small{text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;font-weight:800;color:var(--dn-red)}
.dn-rec-copy b{font:700 1.15rem/1.25 Georgia,serif}
.dn-rec-copy span{color:var(--dn-muted);font-size:.92rem;line-height:1.45}
/* history reel */
.dn-reel-wrap{position:relative}
.dn-reel{list-style:none;margin:0;padding:6px 4px 22px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,320px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin}
.dn-reel-item{scroll-snap-align:start;background:#fff;border-radius:20px;padding:18px;border:1px solid #f0e2d1;box-shadow:0 16px 30px -24px #3b2216;display:flex;flex-direction:column;gap:6px;position:relative}
.dn-reel-item.is-michigan{background:linear-gradient(160deg,#fff4dc,#fff);border-color:var(--dn-amber)}
.dn-reel-item.is-michigan::before{content:"Michigan";position:absolute;right:14px;top:14px;z-index:1;font:800 .66rem/1 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#b07a12;background:#fff4dc;padding:.35em .6em;border-radius:999px}
.dn-reel-item figure{margin:-18px -18px 6px}
.dn-reel-item figure img{width:100%;height:170px;object-fit:cover;border-radius:20px 20px 0 0;display:block}
.dn-reel-year{font:800 2.2rem/1 Georgia,serif;color:var(--dn-red)}
.dn-reel-item h3{margin:0;font:700 1.08rem/1.3 Georgia,serif}
.dn-reel-item p{margin:0;line-height:1.55;font-size:.95rem}
.dn-reel-credit{font-size:.66rem;color:var(--dn-muted)}
.dn-reel-credit a{color:inherit}
.dn-reel-btn{position:absolute;top:40%;z-index:2;width:46px;height:46px;border-radius:50%;border:0;background:var(--dn-red);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer;box-shadow:0 10px 24px -10px #000}
.dn-reel-btn.is-prev{left:-10px}.dn-reel-btn.is-next{right:-10px}
@media (max-width:900px){.dn-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.dn-spot-inner{grid-template-columns:1fr}.dn-spot.is-flip .dn-spot-photo{order:0}.dn-rec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dn-reel-btn{display:none}}
@media (max-width:560px){.dn-rec-grid{grid-template-columns:1fr}.dn-tile{min-height:120px}}
.dn-spot-inner{align-items:start}.dn-spot-photo{position:sticky;top:90px}

/* Finder dock 2.1 (owner 2026-10-21: the old filter box was ugly): one sticky full-width control dock above the map
   and the list. Native radios, checkbox and select are hidden behind a sliding segment, a toggle switch and sort pills. */
.dn-finder{grid-template-columns:1fr}
.dn-maps{max-width:1100px;width:100%;margin:0 auto;box-sizing:border-box}
.dn-dock{position:sticky;top:56px;z-index:19;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:6px 0 24px;padding:14px;border-radius:28px;
 background:color-mix(in srgb,var(--dn-paper) 88%,transparent);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
 border:1px solid #ecdcc8;box-shadow:0 22px 48px -30px #5a0b10cc,0 2px 0 #fff inset}
.dn-dock-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;min-width:0}
.dn-dock>*,.dn-q,.dn-dock-controls{min-width:0}
.dn-q{position:relative;display:flex;align-items:center;height:58px;padding:0 10px 0 54px;border-radius:999px;background:#fff;border:2px solid #ead6bf;transition:border-color .2s,box-shadow .2s;cursor:text}
.dn-q:focus-within{border-color:var(--dn-red);box-shadow:0 0 0 5px color-mix(in srgb,var(--dn-red) 16%,transparent)}
.dn-q-icon{position:absolute;left:19px;top:50%;width:22px;height:22px;margin-top:-11px;fill:none;stroke:var(--dn-red);stroke-width:2.6;stroke-linecap:round}
.dn-q input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:600 1.08rem/1.2 inherit;font-family:inherit;color:var(--dn-ink);padding:0}
.dn-q input::placeholder{color:#a8907c;font-weight:500}
.dn-q input::-webkit-search-cancel-button{display:none}
.dn-q-clear{flex:0 0 34px;height:34px;border:0;border-radius:50%;background:#f3e6d6;color:var(--dn-ink);font:700 1.25rem/1 inherit;cursor:pointer;transition:background .2s}
.dn-q-clear:hover{background:var(--dn-red);color:#fff}
.dn-dock .dn-count{margin:0;white-space:nowrap;font-weight:600;color:var(--dn-muted);font-size:.95rem}
.dn-dock .dn-count b{display:inline-block;margin-right:.18em;font:800 2rem/1 Georgia,"Times New Roman",serif;color:var(--dn-red);vertical-align:-.12em;animation:dn-count-pop .35s ease}
@keyframes dn-count-pop{from{transform:scale(.7);opacity:.3}to{transform:none;opacity:1}}
.dn-dock-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px}
.dn-seg{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;margin:0;padding:4px;border:0;border-radius:999px;background:#f1e3d1;min-width:0}
.dn-seg input,.dn-switch input,.dn-pill input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.dn-seg label{position:relative;z-index:1;padding:.62em 1.2em;border-radius:999px;font-weight:700;font-size:.95rem;text-align:center;white-space:nowrap;cursor:pointer;color:var(--dn-ink);transition:color .25s}
.dn-seg label b{font-weight:800;opacity:.55;margin-left:.15em}
.dn-seg input:checked+label{color:#fff}
.dn-seg input:checked+label b{opacity:.85}
.dn-seg input:focus-visible+label{outline:3px solid color-mix(in srgb,var(--dn-red) 45%,transparent);outline-offset:2px}
.dn-seg-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--dn-red);box-shadow:0 8px 18px -8px var(--dn-red);transition:transform .32s cubic-bezier(.3,1.35,.5,1)}
.dn-seg input:nth-of-type(2):checked~.dn-seg-thumb{transform:translateX(100%)}
.dn-switch{position:relative;display:inline-flex;align-items:center;gap:.6em;padding:.42em .95em .42em .45em;border-radius:999px;background:#fff;border:2px solid #ead6bf;font-weight:700;font-size:.95rem;cursor:pointer;transition:border-color .2s,background .2s}
.dn-switch-track{position:relative;flex:0 0 44px;height:26px;border-radius:999px;background:#d9c6b1;transition:background .25s}
.dn-switch-track span{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #0003;transition:transform .28s cubic-bezier(.3,1.35,.5,1)}
.dn-switch input:checked+.dn-switch-track{background:#1f9d55}
.dn-switch input:checked+.dn-switch-track span{transform:translateX(18px)}
.dn-switch input:focus-visible+.dn-switch-track{outline:3px solid #1f9d5566;outline-offset:2px}
.dn-switch:has(input:checked){border-color:#1f9d55;background:#effaf3}
.dn-live{display:inline-block;width:8px;height:8px;margin-right:.45em;border-radius:50%;background:#1f9d55;vertical-align:.05em;animation:dn-live 1.8s ease-out infinite}
@keyframes dn-live{0%{box-shadow:0 0 0 0 #1f9d5599}80%,100%{box-shadow:0 0 0 7px #1f9d5500}}
.dn-sortbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-left:auto}
.dn-sortbar-label{margin-right:4px;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dn-muted)}
.dn-pill{position:relative;display:inline-flex;align-items:center;gap:.35em;padding:.5em .95em;border-radius:999px;border:1.5px solid #ead6bf;background:#fff;color:var(--dn-ink);font:inherit;font-weight:700;font-size:.88rem;line-height:1.2;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .15s}
.dn-pill:hover{border-color:var(--dn-red);transform:translateY(-1px)}
.dn-pill:has(input:checked),.dn-pill.is-on{background:var(--dn-ink);border-color:var(--dn-ink);color:#fff}
.dn-pill:has(input:focus-visible),.dn-pill:focus-visible{outline:3px solid color-mix(in srgb,var(--dn-red) 45%,transparent);outline-offset:2px}
.dn-pill svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round}
.dn-pill.is-near{color:var(--dn-red);border-color:color-mix(in srgb,var(--dn-red) 35%,#fff)}
.dn-pill.is-near.is-on{background:var(--dn-red);border-color:var(--dn-red);color:#fff}
.dn-pill.is-busy svg{animation:dn-pin-hop .7s ease-in-out infinite}
@keyframes dn-pin-hop{50%{transform:translateY(-3px)}}
.dn-dock .dn-tile-chip{justify-self:start}
@media (max-width:900px){
 .dn-dock{position:static;padding:12px;border-radius:24px}
 .dn-dock-top{grid-template-columns:minmax(0,1fr);gap:8px}
 .dn-dock .dn-count{order:2}
 .dn-sortbar{margin-left:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-12px;padding-right:12px;width:calc(100% + 12px);-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
 .dn-sortbar::-webkit-scrollbar{display:none}
}
@media (max-width:560px){
 .dn-q{height:54px}
 .dn-seg label{padding:.6em .95em}
 .dn-switch{padding-right:.8em}
}
@media (prefers-reduced-motion:reduce){.dn-seg-thumb,.dn-switch-track span{transition:none}.dn-live,.dn-dock .dn-count b,.dn-pill.is-busy svg{animation:none}}
