/* Only the watch mode uses this surface. Mobile and desktop keep their layouts. */
#comparo-watch{display:none}
html.comparo-watch{background:#f7f4ef;scrollbar-width:none}
html.comparo-watch::-webkit-scrollbar,html.comparo-watch body::-webkit-scrollbar{display:none}
html.comparo-watch body{margin:0;padding:0;min-width:0;min-height:100vh;background:#f7f4ef;color:#211a14}
html.comparo-watch body>:not(#comparo-watch):not(.luna-dialog):not(script):not(style){display:none!important}
html.comparo-watch #comparo-watch{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;box-sizing:border-box;min-height:100vh;min-height:100dvh;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));font-family:system-ui,sans-serif;text-align:center;overflow-wrap:anywhere}
.watch-logo{display:block;width:108px;max-width:65%;height:auto;object-fit:contain}
#comparo-watch h1{font-size:18px;line-height:1.2;font-weight:750;margin:0}
#comparo-watch p{max-width:230px;font-size:12px;line-height:1.35;margin:0;color:#75665c}
#comparo-watch .watch-voice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:100px;max-width:100%;min-height:68px;border:0;border-radius:22px;padding:10px 14px;background:#ef361c;color:#fff;font:650 13px/1.2 system-ui,sans-serif;cursor:pointer;touch-action:manipulation}
#comparo-watch .watch-voice:focus-visible{outline:3px solid #211a14;outline-offset:3px}
#comparo-watch .watch-status:empty{display:none}
@media(max-height:240px){html.comparo-watch #comparo-watch{gap:6px}.watch-logo{width:83px}#comparo-watch h1{font-size:16px}#comparo-watch .watch-voice{min-height:62px;padding:8px 12px}}
