:root .sig--br-tisch { container-type: inline-size; display: grid; place-items: center; padding: clamp(18px, 3vw, 40px); background: radial-gradient(70% 70% at 25% 35%, rgba(255, 168, 82, .2), transparent 65%), radial-gradient(60% 60% at 90% 90%, rgba(161, 0, 255, .16), transparent 70%), #1e1714; border-color: rgba(255, 190, 120, .16); }
:root .sig--br-tisch svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
:root .sig--br-tisch .brgt { position: relative; width: 100%; max-width: 680px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; }
:root .sig--br-tisch .brgt__glow { position: absolute; inset: -10%; pointer-events: none; }
:root .sig--br-tisch .brgt__glow i { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #ffc27a; filter: blur(3px); opacity: .0; animation: brgtGlow 7s ease-in-out infinite; }
:root .sig--br-tisch .brgt__glow i:nth-child(1) { left: 6%; top: 18%; }
:root .sig--br-tisch .brgt__glow i:nth-child(2) { left: 46%; top: 6%; width: 6px; height: 6px; animation-delay: -2s; }
:root .sig--br-tisch .brgt__glow i:nth-child(3) { left: 92%; top: 30%; animation-delay: -4s; }
:root .sig--br-tisch .brgt__glow i:nth-child(4) { left: 12%; top: 88%; width: 7px; height: 7px; animation-delay: -1s; }
:root .sig--br-tisch .brgt__glow i:nth-child(5) { left: 70%; top: 94%; animation-delay: -5s; }
@keyframes brgtGlow{ 0%, 100% { opacity: .15; transform: translateY(0); } 50% { opacity: .7; transform: translateY(-14px); } }
:root .sig--br-tisch .brgt__menu { position: relative; z-index: 1; padding: 22px 22px 16px; border-radius: 6px; background: linear-gradient(170deg, #f7f1e6, #efe5d4); color: #2b211b; box-shadow: 0 0 0 1px rgba(150, 110, 60, .25) inset, 0 0 0 6px #f4ecdf inset, 0 0 0 7px rgba(150, 110, 60, .35) inset, 0 40px 70px -30px rgba(0, 0, 0, .9); transform: rotate(-2.5deg); }
:root .sig--br-tisch .brgt__house { text-align: center; font: 600 11px/1 var(--f-display); letter-spacing: .22em; text-transform: uppercase; color: #8a6a3e; }
:root .sig--br-tisch .brgt__book { position: relative; height: 236px; margin-top: 10px; perspective: 900px; }
:root .sig--br-tisch .brgt__pg { position: absolute; inset: 0; padding: 4px 2px; background: linear-gradient(170deg, #f7f1e6, #efe5d4); transform-origin: 0 50%; backface-visibility: hidden; }
:root .sig--br-tisch .brgt__sec { text-align: center; font: italic 500 24px/1.1 var(--f-display); letter-spacing: -.02em; color: #2b211b; }
:root .sig--br-tisch .brgt__orn { display: block; width: 110px; height: 10px; margin: 8px auto 14px; color: #b08a55; stroke-width: 1.2; }
:root .sig--br-tisch .brgt__dishes { display: grid; gap: 13px; text-align: center; }
:root .sig--br-tisch .brgt__dishes b { display: block; font: 600 14.5px/1.25 var(--f-display); color: #2b211b; }
:root .sig--br-tisch .brgt__dishes small { display: block; margin-top: 2px; font: 400 12.5px/1.35 var(--f-body); color: #6e5a45; }
:root .sig--br-tisch .brgt__foot { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 6px; font: 500 11px/1 var(--f-display); letter-spacing: .14em; text-transform: uppercase; color: #8a6a3e; }
:root .sig--br-tisch .brgt__foot svg { width: 15px; height: 15px; stroke-width: 1.5; }
:root .sig--br-tisch .brgt__res { position: relative; z-index: 2; margin-left: -26px; padding: 20px; border-radius: 20px; background: rgba(38, 30, 26, .92); border: 1px solid rgba(255, 200, 140, .18); backdrop-filter: blur(10px); color: #f3ebe2; box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .95); transform: rotate(1.5deg) translateY(18px); }
:root .sig--br-tisch .brgt__rt { font: 600 18px/1.2 var(--f-display); letter-spacing: -.02em; margin-bottom: 14px; }
:root .sig--br-tisch .brgt__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid rgba(255, 220, 180, .1); }
:root .sig--br-tisch .brgt__row--chips { display: grid; gap: 8px; justify-content: stretch; }
:root .sig--br-tisch .brgt__k { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #d9cbbd; }
:root .sig--br-tisch .brgt__k svg { width: 17px; height: 17px; color: #ffc27a; }
:root .sig--br-tisch .brgt__step { display: inline-flex; align-items: center; gap: 12px; }
:root .sig--br-tisch .brgt__step b { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255, 220, 180, .25); }
:root .sig--br-tisch .brgt__step b svg { width: 14px; height: 14px; }
:root .sig--br-tisch .brgt__step b.tap { animation: brgtTap .4s var(--ease-out); }
@keyframes brgtTap{ 40% { transform: scale(.85); background: rgba(255, 194, 122, .3); } }
:root .sig--br-tisch .brgt__step em { min-width: 14px; text-align: center; font: 600 17px/1 var(--f-display); font-style: normal; display: inline-block; }
:root .sig--br-tisch .brgt__chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
:root .sig--br-tisch .brgt__chips i { font-style: normal; text-align: center; padding: 8px 0; border-radius: 10px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 220, 180, .12); font: 500 12.5px/1 var(--f-display); color: #e6d9cc; transition: all .5s var(--ease-out); }
:root .sig--br-tisch .brgt__chips i.on { background: #ffc27a; border-color: #ffc27a; color: #2b1d10; transform: translateY(-2px); box-shadow: 0 10px 20px -10px rgba(255, 170, 80, .8); }
:root .sig--br-tisch .brgt__btn { display: block; margin-top: 14px; padding: 12px; border-radius: 999px; text-align: center; background: rgba(255, 255, 255, .08); color: #bfb2a6; font: 600 14px/1 var(--f-display); transition: background .5s, color .5s, transform .2s; }
:root .sig--br-tisch .brgt__btn.on { background: #a100ff; color: #fff; box-shadow: 0 14px 30px -14px rgba(161, 0, 255, .9); }
:root .sig--br-tisch .brgt__btn.press { transform: scale(.95); }
:root .sig--br-tisch .brgt__res > :not(.brgt__tix) { transition: opacity .6s, filter .6s; }
:root .sig--br-tisch .brgt__res.done > :not(.brgt__tix) { opacity: .18; filter: blur(2px); }
:root .sig--br-tisch .brgt__tix { position: absolute; left: 14px; right: 14px; top: 50%; display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 16px; background: #f7f1e6; color: #2b211b; box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .9); transform: translateY(-30%) scale(.9); opacity: 0; transition: transform .8s var(--ease-back), opacity .4s; }
:root .sig--br-tisch .brgt__tix::before, :root .sig--br-tisch .brgt__tix::after { content: ""; position: absolute; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; background: #2a211c; }
:root .sig--br-tisch .brgt__tix::before { left: -8px; }
:root .sig--br-tisch .brgt__tix::after { right: -8px; }
:root .sig--br-tisch .brgt__tix.on { transform: translateY(-50%); opacity: 1; }
:root .sig--br-tisch .brgt__tick { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #a100ff; color: #fff; }
:root .sig--br-tisch .brgt__tick svg { width: 20px; height: 20px; stroke-width: 2.4; }
:root .sig--br-tisch .brgt__tix b { display: block; font: 600 16px/1.2 var(--f-display); }
:root .sig--br-tisch .brgt__tix small { display: block; margin-top: 3px; font-size: 13px; color: #5d4a39; }
@container (max-width: 540px){:root .sig--br-tisch .brgt { grid-template-columns: 1fr; }
:root .sig--br-tisch .brgt__menu { padding: 16px 16px 12px; transform: rotate(-1.5deg); }
:root .sig--br-tisch .brgt__book { height: 150px; }
:root .sig--br-tisch .brgt__dishes li:nth-child(3) { display: none; }
:root .sig--br-tisch .brgt__res { margin: -26px 8px 0; padding: 16px; transform: rotate(1deg); }
:root .sig--br-tisch .brgt__rt { font-size: 16px; margin-bottom: 8px; }

}
@media (prefers-reduced-motion: reduce){:root .sig--br-tisch .brgt__glow i { animation: none; opacity: .4; }
 }

