/* Teller gallery, premium look: night sky, gold halos, per-teller accent (--accent). Motion is limited to a soft
   star twinkle and a small lift on hover; no zooming or shaking. Loaded after teller-gallery.css. */
.teller-gallery{background:radial-gradient(ellipse at 50% -12%,#7a2a4066,transparent 55%),radial-gradient(ellipse at 50% 112%,#b8893f38,transparent 52%),linear-gradient(180deg,#120a10 0%,#1d0f14 42%,#160c09 100%);overflow:hidden}
.teller-gallery::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(1.6px 1.6px at 8% 12%,#fff3d0 50%,transparent 52%),radial-gradient(1.2px 1.2px at 18% 34%,#fff3d0 50%,transparent 52%),radial-gradient(2px 2px at 27% 8%,#ffe7b0 50%,transparent 52%),radial-gradient(1.2px 1.2px at 39% 22%,#fff3d0 50%,transparent 52%),radial-gradient(1.8px 1.8px at 52% 6%,#fff3d0 50%,transparent 52%),radial-gradient(1.2px 1.2px at 63% 28%,#ffe7b0 50%,transparent 52%),radial-gradient(2px 2px at 74% 11%,#fff3d0 50%,transparent 52%),radial-gradient(1.3px 1.3px at 86% 30%,#fff3d0 50%,transparent 52%),radial-gradient(1.7px 1.7px at 94% 9%,#ffe7b0 50%,transparent 52%),radial-gradient(1.2px 1.2px at 12% 62%,#fff3d0 50%,transparent 52%),radial-gradient(1.5px 1.5px at 91% 58%,#fff3d0 50%,transparent 52%),radial-gradient(1.2px 1.2px at 48% 44%,#ffe7b0 50%,transparent 52%);animation:gallery-twinkle 7s ease-in-out infinite alternate}
@keyframes gallery-twinkle{from{opacity:.35}to{opacity:.95}}
.gallery-top .gallery-home{min-height:44px;padding:9px 16px;border:1px solid #e5bd796b;border-radius:30px;background:#281a15aa;color:#ffe3b0;font:600 16px/1.5 var(--sans)}
.gallery-top .gallery-home:hover{border-color:#f0cf8c}
.gallery-top-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.gallery-intro{margin-bottom:38px}
.gallery-intro .gallery-kicker{font-size:17px;letter-spacing:.2em;color:#e9c27c}
.gallery-intro h1{border-bottom:0;padding-bottom:0;font:800 clamp(38px,4.4vw,56px)/1.4 var(--serif);letter-spacing:-.03em;background:linear-gradient(180deg,#fff6e0 25%,#e9c27c 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.gallery-ornament{margin:6px 0 0;font:600 20px/1 var(--serif);letter-spacing:.3em;color:#d9b56f}
.gallery-intro>p:last-child{font-size:20px;color:#ecd9bb}

.teller-grid{gap:28px 26px;max-width:1120px}
.teller-card{position:relative;overflow:hidden;align-items:stretch;padding:30px 22px 26px;border:1px solid color-mix(in srgb,var(--accent,#d9b56f) 55%,#d9b56f);border-radius:18px;background:linear-gradient(165deg,color-mix(in srgb,var(--accent,#7a3a2a) 32%,transparent) 0%,#2a1712f2 44%,#1c0f0bf5 100%);box-shadow:inset 0 0 0 1px #ffffff0d,0 18px 40px #0007;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.teller-card::before{content:"";position:absolute;inset:9px;border:1px solid #e9c27c30;border-radius:12px;pointer-events:none}
.teller-card:hover,.teller-card:focus-visible{transform:translateY(-4px);background:linear-gradient(165deg,color-mix(in srgb,var(--accent,#7a3a2a) 42%,transparent) 0%,#2e1914f2 44%,#1c0f0bf5 100%);border-color:#f0cf8c;box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#d9b56f) 60%,transparent),0 0 38px color-mix(in srgb,var(--accent,#d9b56f) 45%,transparent),0 22px 44px #000a}
.teller-card.is-featured{border-color:#f0cf8c}
.teller-badge{position:absolute;top:16px;left:16px;z-index:2;padding:5px 12px;border-radius:999px;background:linear-gradient(135deg,#f8e2a8,#c99a4d);color:#2a120c;font:800 18px/1.4 var(--sans);box-shadow:0 4px 12px #0007}
.teller-mark{position:absolute;top:16px;right:18px;writing-mode:vertical-rl;font:800 58px/1 var(--serif);letter-spacing:.08em;color:#ffe9b8;opacity:.11;pointer-events:none}
.teller-halo{position:relative;display:block;align-self:center;margin:6px auto 20px;padding:7px;border-radius:50%;background:conic-gradient(from 20deg,#f8e2a8,#b8893f,#f8e2a8,#8a6424,#f8e2a8);box-shadow:0 0 0 5px #1c0f0b,0 0 0 7px color-mix(in srgb,var(--accent,#d9b56f) 75%,#d9b56f),0 0 44px color-mix(in srgb,var(--accent,#d9b56f) 55%,transparent)}
.teller-halo .teller-portrait{width:clamp(150px,15vw,190px);margin:0;border:3px solid #1c0f0b;box-shadow:none}
.teller-body{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.teller-card strong{font:800 30px/1.35 var(--serif);color:#fff3d6}
.teller-card .teller-tag{margin:0;font:700 18px/1.5 var(--sans);color:#f0c985}
.teller-card .teller-description{margin:0;max-width:290px;font:500 18px/1.75 var(--sans);color:#ecd9bb}
.teller-topics{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:4px}
.teller-topics span{padding:4px 12px;border:1px solid color-mix(in srgb,var(--accent,#d9b56f) 70%,#e9c27c);border-radius:999px;background:color-mix(in srgb,var(--accent,#7a3a2a) 24%,transparent);color:#fff0d2;font:700 18px/1.45 var(--sans)}
.teller-quote{margin-top:6px;max-width:290px;font:italic 500 18px/1.7 var(--serif);color:#f3d9a0}
.teller-card .teller-enter{display:inline-flex;align-items:center;justify-content:center;min-height:52px;margin-top:10px;padding:10px 22px;border-radius:999px;background:linear-gradient(135deg,#f8e2a8,#c99a4d);color:#2a120c;font:800 18px/1.4 var(--sans);box-shadow:0 6px 16px #0006}
.teller-card[aria-busy="true"] .teller-enter{opacity:.7}
.gallery-legal{max-width:760px;margin:22px auto 0;text-align:center;font:500 16px/1.8 var(--sans);color:#c9b08f}
.gallery-legal a{color:#f0d4a6}

@media(max-width:720px){
  .gallery-top{flex-wrap:wrap}
  .gallery-intro h1{font-size:36px}.gallery-intro>p:last-child{font-size:18px}
  .teller-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  /* Phone card: portrait with name beside it, then description, topics and a full-width button. */
  .teller-card{display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-areas:"halo name" "halo tag" "desc desc" "topics topics" "enter enter";column-gap:16px;row-gap:4px;align-items:center;padding:22px 18px 20px;text-align:left}
  .teller-card.is-featured{padding-top:58px}
  .teller-body{display:contents;text-align:left}
  .teller-halo{grid-area:halo;margin:0;padding:5px}
  .teller-halo .teller-portrait{width:92px}
  .teller-card strong{grid-area:name;align-self:end;font-size:27px}
  .teller-card .teller-tag{grid-area:tag;align-self:start}
  .teller-card .teller-description{grid-area:desc;max-width:none;margin-top:12px}
  .teller-topics{grid-area:topics;justify-content:flex-start;margin-top:8px}
  .teller-quote{display:none}
  .teller-card .teller-enter{grid-area:enter;width:100%;min-height:54px;margin-top:14px}
  .teller-badge{top:14px;left:16px;right:auto}
  .teller-mark{top:16px;right:16px;bottom:auto;font-size:40px}
}
@media(prefers-reduced-motion:reduce){.teller-gallery::after{animation:none}.teller-card,.teller-card:hover,.teller-card:focus-visible{transform:none;transition:none}}
