/* Public menus keep a portrait canvas; the backoffice keeps its own layout. */
body.public{overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#e8dac8 0,#f4eddf 55%,#eee6d9 100%)}
.public #app{display:flex;align-items:center;justify-content:center;min-height:100dvh;height:100dvh;padding:24px;overflow:hidden}
.public .desktop-note{display:none}
.public .phone{width:min(430px,calc((100dvh - 48px)*.53));min-width:min(340px,calc(100vw - 48px));max-width:100%;height:min(860px,calc(100dvh - 48px));max-height:none;flex-shrink:0;border:9px solid #262321;border-radius:42px;box-shadow:0 0 0 1px #ffffff70,0 20px 65px #3a271b35;isolation:isolate;container-type:inline-size}
.public .restaurant{font-size:clamp(25px,8cqw,32px)}
.public .restaurant small{font-size:clamp(12px,3.5cqw,14px)}
.public .restaurant-logo{width:clamp(48px,15cqw,62px)}
.public .phone:before{content:'';position:absolute;z-index:8;left:50%;top:5px;transform:translateX(-50%);width:56px;height:4px;border-radius:10px;background:#ffffff60;pointer-events:none}
.public .public-head{padding-top:17px}
.portrait-notice{display:none}
.portrait-notice[hidden]{display:none!important}
.public.compact-landscape #app{visibility:hidden;pointer-events:none}
.public.compact-landscape #detail{visibility:hidden}
.public.compact-landscape #detail::backdrop{background:transparent;backdrop-filter:none}
.public.compact-landscape .portrait-notice{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px max(24px,env(safe-area-inset-right)) 24px max(24px,env(safe-area-inset-left));text-align:center;background:var(--accent);color:#fff}
.portrait-notice svg{width:64px;height:64px;flex-shrink:0}
.portrait-notice h1{font:400 30px/1.15 Georgia,serif;margin:0}
.portrait-notice p{font:400 16px/1.5 Arial,Helvetica,sans-serif;max-width:400px;margin:0;color:#fff;opacity:.9}
@media(max-width:600px) and (orientation:portrait){
 .public #app{padding:0}
 .public .phone{width:100%;min-width:0;height:100dvh;border:0;border-radius:0;box-shadow:none}
 .public .phone:before{display:none}
 .public .public-head{padding-top:12px}
}
