.teller-gallery{position:relative;min-height:100svh;padding:28px max(24px,5vw) 40px;background:radial-gradient(ellipse at 50% 20%,#602d1e40,transparent 65%),linear-gradient(160deg,#180d0b,#281712 50%,#110a09);isolation:isolate}
.teller-gallery::before{content:"";position:absolute;inset:14px;z-index:-1;border:1px solid #d9b67538;pointer-events:none}
.gallery-top{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1160px;margin:0 auto 26px}
.gallery-top .brand{font-size:36px}.gallery-top small{color:#d7bc91;font-size:15px}
.sound-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.music-toggle{min-height:44px;border:1px solid #e5bd796b;background:#281a15cc;color:#efd6b1;border-radius:30px;padding:9px 15px;font:600 14px/1.5 var(--sans)}.music-toggle[aria-pressed=true]{color:#fff1c6;border-color:#e5bd79;background:#533024}
.gallery-intro{text-align:center;margin:0 auto 30px;max-width:760px}.gallery-intro .gallery-kicker{color:#e5bd79;font-size:15px;font-weight:700;letter-spacing:.16em;margin:0 0 9px}.gallery-intro h1{display:inline-block;white-space:normal;color:#fff0d3;font:700 clamp(34px,4vw,48px)/1.5 var(--serif);border-bottom:4px solid #cc9c5d;padding-bottom:13px;letter-spacing:-.04em}.gallery-intro>p:last-child{font:400 18px/1.8 var(--sans);color:#e2c9aa;margin:16px 0 0;word-break:keep-all}
.teller-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 34px;max-width:1020px;margin:auto}
.teller-card{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:21px 18px 22px;border:1px solid #a879475e;border-radius:12px;background:linear-gradient(160deg,#71372b24,#35201947);color:#ffedcb;font-family:var(--sans);transition:border-color .18s,background .18s,box-shadow .18s;min-width:0}
.teller-card:hover,.teller-card:focus-visible{border-color:#e8bb76;background:#5a30266b;box-shadow:0 0 0 3px #b889491c,0 10px 30px #08030350}.teller-card:focus-visible{outline:3px solid #ffe2a3;outline-offset:4px}
.teller-portrait{display:block;width:clamp(132px,15vw,178px);aspect-ratio:1;border-radius:50%;background-image:url('../characters.webp');background-size:482.667% 362%;background-position:var(--portrait-position);background-repeat:no-repeat;border:3px solid #d5ab68;box-shadow:0 0 0 5px #322019,0 0 0 6px #a782504d,0 12px 26px #0006;margin-bottom:17px;flex:none}
.teller-card strong{font:700 28px/1.4 var(--serif);letter-spacing:-.03em;color:#fff0d3}.teller-tag{font:700 16px/1.5 var(--sans);color:#edc27e;margin-top:7px}.teller-description{font:400 16px/1.8 var(--sans);color:#dfc9ac;max-width:235px;margin-top:8px;word-break:keep-all}.teller-enter{font:600 15px/1.6 var(--sans);color:#f3d29e;margin-top:13px}.teller-enter span{margin-left:10px}
.gallery-note{font:400 14px/1.8 var(--sans);text-align:center;color:#c3a989;margin:29px auto 0;max-width:700px}.gallery-error{color:#ffcfb7;text-align:center;min-height:25px;font-size:16px;margin:14px 0 0}
.room-toolbar{position:relative;z-index:5;display:flex;align-items:center;gap:12px}.change-teller{min-height:44px;background:#25150fbb;border:1px solid #d8b77c70;border-radius:30px;color:#ffdfac;font:600 15px/1.5 var(--sans);padding:10px 17px;backdrop-filter:blur(6px)}
.room header{z-index:4}.room .greeting{pointer-events:none}.room .greeting .speaker{display:inline-block;padding:7px 11px;background:#25110ccc;border:1px solid #deb37a88;border-radius:4px;color:#f5cd8a;font-size:16px;font-weight:700;letter-spacing:.05em}
.reading-wait{position:relative;margin:auto;width:min(960px,100%);padding:50px 35px;text-align:center;border:3px solid #bb9458;border-radius:12px;background:#38161eee;color:#fff0d1;box-shadow:0 15px 70px #0007}.reading-wait h2{font:700 clamp(29px,3vw,38px)/1.6 var(--serif);margin:10px 0 20px;word-break:keep-all}.reading-wait p{font-size:18px;line-height:1.8;color:#f0d9b5;margin:12px 0}.reading-wait .wait-badge{display:inline-block;font-size:15px;font-weight:700;padding:7px 14px;background:#e4c487;color:#50222b;border-radius:4px}.wait-steps{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:28px 0}.wait-steps span{padding:9px 14px;border:1px solid #bb94587a;border-radius:6px;color:#dec8a6;font-size:16px}.wait-steps .active{color:#ffe8b5;background:#714032;border-color:#ebc07f}.wait-lights{display:flex;gap:10px;justify-content:center;height:20px;margin:22px}.wait-lights i{width:8px;height:8px;border-radius:50%;background:#efc581;animation:wait-light 1.2s ease-in-out infinite}.wait-lights i:nth-child(2){animation-delay:.2s}.wait-lights i:nth-child(3){animation-delay:.4s}@keyframes wait-light{0%,100%{opacity:.35}50%{opacity:1}}
.rp-summary-link{margin:0 0 20px;padding:15px 18px;border:2px solid #b88c51;border-radius:5px;background:#f3dcae;font-size:18px;color:#5d3032;font-weight:700}.rp-pillar-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:20px 0}.rp-pillar{border:1px solid #b69057;border-radius:6px;background:#fff6e0;text-align:center;overflow:hidden}.rp-pillar-label{display:block;padding:7px 4px;background:#682638;color:#fff0cd;font-size:16px;font-weight:700}.rp-pillar strong{display:block;font:700 28px/1.55 var(--serif);padding:12px 3px;color:#672939}.rp-pillar small{display:block;font-size:15px;padding:0 3px 10px;color:#614936}.rp-basis{margin-top:22px;padding:15px 17px;background:#ecd8b05c;border:1px solid #b494644d;border-radius:5px;font-size:15px;color:#69503d}.rp-basis p{font-size:15px;margin:8px 0;line-height:1.8}.rp-basis summary{font-size:16px;cursor:pointer;font-weight:700}
@media(max-width:720px){.teller-gallery{padding:24px 22px 35px}.gallery-top{margin-bottom:30px}.gallery-top .brand{font-size:31px}.gallery-top small{display:none}.gallery-intro{margin-bottom:26px}.gallery-intro h1{font-size:34px}.gallery-intro>p:last-child{font-size:17px}.teller-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}.teller-card{padding:18px 10px}.teller-portrait{width:clamp(108px,27vw,155px);margin-bottom:17px}.teller-card strong{font-size:25px}.teller-tag{font-size:15px}.teller-description{font-size:15px}.teller-enter{font-size:14px}.room-toolbar{gap:7px}.room header{align-items:flex-start;gap:10px}.room .brand{font-size:29px}.change-teller{font-size:14px;padding:9px 12px}.room-toolbar .sound-controls{display:flex;max-width:170px;gap:6px}.room-toolbar .sound,.room-toolbar .music-toggle{font-size:13px;min-height:40px;padding:8px 10px}.room .greeting{top:150px}.room .greeting .speaker{font-size:15px}.room.book-open .greeting{display:none}.reading-wait{padding:33px 20px}.reading-wait p{font-size:17px}.rp-pillar-grid{gap:5px}.rp-pillar strong{font-size:25px}.rp-pillar small{font-size:14px}.rp-pillar-label{font-size:15px}.rp-summary-link{font-size:17px}}
@media(max-width:390px){.teller-gallery{padding-left:16px;padding-right:16px}.teller-grid{gap:14px 9px}.teller-card{padding:17px 7px}.teller-description{font-size:14px}.gallery-intro h1{font-size:31px}.teller-card strong{font-size:24px}.room-toolbar{gap:5px}.change-teller{font-size:13px;padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.teller-card,.wait-lights i{animation:none;transition:none}}
.record-seal,.rp-seal{white-space:pre-line;line-height:1.2}
.entry-steps:has(#stepBasic[hidden]){grid-template-columns:repeat(2,minmax(0,1fr))}
.book-form .photo-field-label{font:700 20px/1.6 var(--sans);color:#63313a;margin:0 0 16px}
.room .greeting h1{word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:720px){
  .room:not(.book-open){min-height:820px}
  .room header{display:flex;flex-wrap:wrap;gap:12px;left:18px;right:18px;top:18px}
  .room .brand{flex:none;white-space:nowrap;line-height:1.2}
  .room-toolbar{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .room-toolbar .sound-controls{display:contents}
  .room-toolbar .sound,.room-toolbar .music-toggle,.change-teller{display:flex;justify-content:center;align-items:center;width:100%;min-height:44px;padding:7px 5px;font-size:13px;white-space:nowrap;border-radius:7px}
  .room-toolbar .sound svg{display:none}
  .room:not(.book-open) .greeting{top:auto;bottom:385px;left:24px;right:24px;max-width:none}
  .room:not(.book-open) .greeting h1{font-size:26px;line-height:1.5}
  .room .greeting .speaker{font-size:14px;margin-bottom:8px;padding:5px 9px}
}
