/* Doro app additions on top of the prototype styles. */
html,body{height:100%}
body{overflow:hidden}
#stage{height:100%;display:grid;place-items:center}
.views{flex:1;position:relative;min-height:0}
.view.active{overflow-y:auto}
a{color:inherit;text-decoration:none}
.tab{text-decoration:none}
.cap-btn{display:block;text-decoration:none}
.inline{display:inline}.flex1{flex:1;display:flex}.flex1 .btn{width:100%}
.rx-form{display:inline}.tray-form{display:contents}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.av-link{display:block;margin-top:22px;border-radius:50%}.av-link .post-av{margin-top:0}
.post{position:relative}
.post .more{position:absolute;right:-2px;top:4px;width:30px;height:30px;display:grid;place-items:center;color:var(--muted);opacity:.6;border-radius:50%}
.post.mine .more{display:none}
.post .more svg{width:18px;height:18px}
.post.sending .photo{opacity:.7}
.sending-chip{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;background:rgba(22,13,7,.65);color:#F7EDDC;padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:700;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.rx-row{position:relative}
.rx-row .tray{position:absolute;bottom:38px;left:0;z-index:30}
.post.mine .rx-row .tray{left:auto;right:0}
.older{display:block}
.city-switch{position:relative}
.city-switch summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:4px}
.city-switch summary::-webkit-details-marker{display:none}
.city-switch summary svg{width:16px;height:16px;color:var(--lager)}
.city-menu{position:absolute;top:28px;left:0;z-index:12;background:var(--raised);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;min-width:160px;display:grid}
.city-menu a{padding:10px 12px;border-radius:10px;font-weight:600}
.city-menu a.on{background:var(--lager-soft);color:var(--lager)}
.board-kind{display:flex;gap:6px;margin:-6px 0 12px;font-size:13px;font-weight:700}
.board-kind a{padding:6px 10px;border-radius:999px;color:var(--muted);border:1.5px solid var(--line)}
.board-kind a.on{background:var(--lager-soft);color:var(--lager);border-color:var(--lager)}
.seg a{position:relative;z-index:1;height:40px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-weight:700;font-size:13.5px;color:var(--muted);transition:color .25s}
.seg a[aria-selected="true"]{color:var(--lager-ink)}
.seg.three{grid-template-columns:repeat(3,1fr)}
.period a{height:28px;display:inline-flex;align-items:center;border-radius:7px;font-size:12.5px;font-weight:700;color:var(--muted);padding:0 10px}
.period a[aria-pressed="true"]{background:var(--surface);color:var(--ink)}
.week-nav{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--lager);margin:0 2px 8px}
.venue-av{color:var(--lager)}.venue-av svg{width:20px;height:20px}
.rname b a{color:inherit}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:16px}
.gallery img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block;background:#1a0f08}
.stampv{text-decoration:none}
.known-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;margin:8px 0}
.known-row span{color:var(--muted)}
.btn.small{height:36px;font-size:13px;border-radius:10px;padding:0 12px;width:auto}
.warn{color:var(--cap)}
.field.search{position:relative;display:block;margin:6px 0 10px}
.field.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--muted)}
.field.search input{padding-left:44px;height:48px}
.results{min-height:24px}
.results .chips.wrap{flex-wrap:wrap}
.chip.radio{cursor:pointer}
.chip.radio:has(input:checked){background:var(--lager);border-color:var(--lager);color:var(--lager-ink)}
.picked{margin-bottom:8px}
.settings-form{margin-bottom:14px}
.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.toggle-row>span b{display:block;font-size:14.5px}.toggle-row>span span{display:block;font-size:12.5px;color:var(--muted)}
.toggle-row .toggle{width:50px;height:30px;border-radius:15px;border:0;background:var(--line);position:relative;flex:none;padding:0;transition:background .2s}
.toggle-row .toggle i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .25s var(--spring)}
.toggle-row .toggle[aria-pressed="true"]{background:var(--lager)}.toggle-row .toggle[aria-pressed="true"] i{transform:translateX(20px)}
.toggle-row select{height:36px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:600 14px var(--ui);padding:0 8px}
.gate.glass{background:var(--bg);overflow:hidden}
.glass-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;display:block}
.gate-copy{position:relative}
.gate.glass:not(.no-webgl) .gate-copy{color:#FFF6E6;text-shadow:0 1px 2px rgba(60,30,5,.35),0 6px 22px rgba(60,30,5,.35)}
.gate.glass:not(.no-webgl) .gate-mark{color:#FFF6E6}
.gate.glass:not(.no-webgl) .gate-sub{color:rgba(255,246,230,.85)}
.gate.glass:not(.no-webgl) .gate-actions{position:relative}
.gate.glass:not(.no-webgl) .gate-actions::before{content:"";position:absolute;inset:-40px -26px -28px;background:linear-gradient(to bottom,transparent,rgba(40,20,5,.45) 40%);z-index:-1;pointer-events:none}
.gate.glass:not(.no-webgl) .fine{color:rgba(255,246,230,.8)}
.gate.glass:not(.no-webgl) .fine a{color:#FFD27A}
.gate .fine a{color:var(--lager);font-weight:700;margin-left:6px}
.fizz.static{display:none}
.gate.no-webgl .fizz.static{display:block}
.gate.no-webgl .glass-canvas{display:none}
.deck .card .photo{cursor:inherit}
.celebrate .cele-caps svg{animation-delay:calc(.15s + var(--i)*90ms)}
.opt{text-decoration:none}
.tilt-hint{animation:fadeUp .5s var(--out)}
.step .btn+.btn{margin-top:8px}
form.reset{display:contents}
button.reset{display:block;margin:18px auto 0}

.new-pill{white-space:nowrap}
.new-pill .post-av{width:30px;height:30px;font-size:13px}

/* Scanning: sweep repeatedly until the count lands, then the reveal sweep runs once. */
.scan-photo .scanline{animation:scan 1.7s cubic-bezier(.45,.05,.35,1) infinite alternate}
.scan-photo .scanline.reveal{animation:scan 1.7s cubic-bezier(.45,.05,.35,1) forwards}
.scan-photo .scanline.slow{opacity:.55}
/* Count step shows the whole photo (no crop) so every counted drink is visible under its box. */
.scan-photo>img{object-fit:contain;background:#1a0f08}
