/* Only styles #ov-app and the open/closed switch. Original .hp-container remains untouched. */
#ov-app{display:none;position:fixed;inset:0;z-index:4000;background:#fff;color:#111;font-family:Arial,Helvetica,sans-serif;box-sizing:border-box;flex-direction:column;overflow:auto}
#ov-app *,#ov-app *::before,#ov-app *::after{box-sizing:border-box}
body.ov-opened{overflow:hidden}
body.ov-opened main{display:none!important}
body.ov-opened #ov-app{display:flex}
#ov-app .ov-header{height:100px;min-height:100px;display:flex;gap:30px;align-items:center;padding:8px 26px;border-bottom:1px solid #dedede;box-shadow:0 2px 4px #0000000c}
#ov-app .ov-brand{display:flex;align-items:center;gap:8px;color:#f28524;font-size:clamp(30px,3.6vw,54px);font-weight:800;letter-spacing:-2px;line-height:1}
#ov-app .ov-brand img{width:58px;height:58px;object-fit:contain}
#ov-app .ov-tagline{font-size:clamp(19px,2.5vw,34px);font-family:'Comic Sans MS','Trebuchet MS',cursive,sans-serif;transform:rotate(-5deg);white-space:nowrap;margin-left:30px}
#ov-app .ov-header-note{margin-left:auto;color:#66748a;font-size:14px;text-align:right;font-weight:600}
#ov-app .ov-main{display:grid;grid-template-columns:minmax(280px,38%) minmax(0,1fr);gap:12px;flex:1;min-height:300px;padding:12px 14px 0}
#ov-app .ov-videos{display:grid;grid-template-rows:minmax(170px,55%) minmax(150px,1fr);gap:12px;min-height:0}
#ov-app .ov-remote,#ov-app .ov-self{position:relative;overflow:hidden;background:#080a0e;border-radius:11px;min-height:0}
#ov-app .ov-remote{background:radial-gradient(circle at 50% 50%,#3d4250,#141720 76%)}
#ov-app #ov-player{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;background:#090a0e;display:none;z-index:2}
#ov-app .ov-placeholder{display:flex;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:white;gap:14px;padding:24px}
#ov-app .ov-placeholder strong{font-size:clamp(20px,2.1vw,30px)}
#ov-app .ov-placeholder span:not(.ov-refresh-icon){font-size:clamp(13px,1.3vw,17px);color:#e3e5ef;line-height:1.45}
#ov-app .ov-refresh-icon{font-size:58px;line-height:1;color:#f9fafc}
#ov-app .ov-video-label{position:absolute;bottom:9px;left:12px;padding:4px 9px;border-radius:5px;background:#000a;color:#fff;z-index:3;font-size:12px;max-width:calc(100% - 24px)}
#ov-app .ov-self{display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;text-align:center;color:#c4c6cb;font-size:19px}
#ov-app .ov-self small{font-size:13px;color:#898c97}
#ov-app .ov-camera-icon{font-size:50px;opacity:.6;line-height:1}
#ov-app .ov-conversation{border:1px solid #d4d4d4;border-radius:12px;min-width:0;display:flex;flex-direction:column;padding:17px 20px;overflow:auto;background:#fff}
#ov-app .ov-intro-text{font-size:22px;font-weight:700;margin-bottom:16px}
#ov-app .ov-notice{display:flex;align-items:flex-start;gap:12px;background:#fff2d6;border:1px solid #ffdda0;border-radius:10px;padding:15px 19px;color:#332418;font-size:18px;line-height:1.4}
#ov-app .ov-notice strong{display:block;font-size:20px}
#ov-app .ov-notice p{margin:3px 0 0;font-size:17px}
#ov-app .ov-notice-emoji{font-size:24px;flex:0 0 auto}
#ov-app .ov-faint{color:#697386;font-size:14px;margin:19px 4px}
#ov-app .ov-toolbar{display:grid;grid-template-columns:170px 155px 1fr 110px;gap:12px;min-height:92px;height:92px;padding:12px 14px;background:#fff}
#ov-app .ov-toolbar button{border:1px solid #d4d4d4;border-radius:9px;font-size:24px;font-weight:700;cursor:pointer}
#ov-app .ov-toolbar button small{display:block;font-size:13px;font-weight:400;padding-top:4px}
#ov-app .ov-next{background:linear-gradient(155deg,#52a0ff,#2572ef);color:white;border-color:#2875e8!important}
#ov-app .ov-next:hover{filter:brightness(.95)}
#ov-app .ov-stop{background:#f4f4f4;color:#222}
#ov-app .ov-stop:hover{background:#e9e9e9}
#ov-app .ov-message{border:1px solid #ccc;border-radius:9px;color:#8290a3;display:flex;align-items:center;padding:12px 16px;font-size:16px;background:#fbfbfb}
#ov-app .ov-toolbar .ov-send{color:#6c9fdb;background:#f6f6f6;cursor:not-allowed;opacity:.65}
@media(max-width:900px){#ov-app .ov-header{gap:12px;height:80px;min-height:80px;padding:8px 14px}#ov-app .ov-brand{font-size:35px}#ov-app .ov-brand img{height:42px;width:42px}#ov-app .ov-tagline{font-size:20px;margin-left:4px}#ov-app .ov-header-note{font-size:11px}#ov-app .ov-toolbar{grid-template-columns:110px 100px 1fr 85px;gap:7px}#ov-app .ov-toolbar button{font-size:18px}#ov-app .ov-toolbar button small{font-size:11px}}
@media(max-width:640px){body.ov-opened #ov-app{overflow:auto}#ov-app .ov-header{min-height:65px;height:65px;flex-wrap:nowrap}#ov-app .ov-brand{font-size:30px;letter-spacing:-1px}#ov-app .ov-brand img{height:32px;width:32px}#ov-app .ov-tagline{display:none}#ov-app .ov-header-note{font-size:10px}#ov-app .ov-main{display:flex;flex-direction:column;min-height:auto;padding:9px 10px 0;flex:1}#ov-app .ov-videos{display:flex;flex-direction:column;min-height:400px;flex:0 0 auto;gap:8px}#ov-app .ov-remote{height:235px;min-height:235px}#ov-app .ov-self{min-height:150px;height:150px}#ov-app .ov-conversation{min-height:220px;flex:auto;padding:13px}#ov-app .ov-intro-text{font-size:18px;margin-bottom:10px}#ov-app .ov-notice{font-size:14px;padding:12px}#ov-app .ov-notice strong{font-size:16px}#ov-app .ov-notice p{font-size:13px}#ov-app .ov-toolbar{position:sticky;bottom:0;z-index:10;grid-template-columns:1fr 1fr;grid-template-rows:50px;padding:7px 10px;height:64px;min-height:64px;border-top:1px solid #eee;background:#fff}#ov-app .ov-toolbar button{font-size:18px}#ov-app .ov-toolbar .ov-message,#ov-app .ov-toolbar .ov-send{display:none}}

/* Match-style transition applies ONLY inside the in-page preview interface. */
#ov-app .ov-placeholder.ov-searching{background:radial-gradient(circle at center,#252b39 0%,#0b0e16 85%);z-index:1}
#ov-app .ov-placeholder.ov-searching .ov-refresh-icon{display:inline-block;animation:ov-rotate 1.1s linear infinite;color:#6fa8ff}
#ov-app .ov-placeholder.ov-searching strong{font-size:clamp(20px,2vw,29px)}
#ov-app #ov-player{opacity:0;transition:opacity .32s ease-in}
#ov-app #ov-player.ov-video-ready{opacity:1}
@keyframes ov-rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){#ov-app .ov-placeholder.ov-searching .ov-refresh-icon{animation:none}#ov-app #ov-player{transition:none}}

/* Google sign-in dialog and webcam preview */
.ov-login[hidden]{display:none!important}
.ov-login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#0009;z-index:5000;padding:18px;font-family:Arial,Helvetica,sans-serif}
.ov-login-card{position:relative;width:min(420px,100%);background:#fff;border-radius:14px;box-shadow:0 24px 60px #0003;padding:34px 28px;text-align:center;color:#202124}
.ov-login-card h2{font-size:24px;margin:0 0 14px}.ov-login-card p{line-height:1.5}.ov-login-card small{display:block;color:#666;line-height:1.4}
.ov-login-close{position:absolute;top:7px;right:13px;border:0;background:transparent;font-size:30px;cursor:pointer;color:#4a4a4a}
.ov-google-button{border:1px solid #dadce0;background:#fff;border-radius:6px;padding:12px 20px;font-size:16px;cursor:pointer;display:inline-flex;align-items:center;gap:12px;margin:15px auto;color:#1f1f1f}
.ov-google-button:hover{background:#f8fafd}.ov-google-button:disabled{opacity:.5;cursor:not-allowed}
.ov-google-g{color:#4285f4;font-size:22px;font-weight:bold}.ov-login-status{color:#a14210;font-size:13px;min-height:20px}
#ov-app .ov-self #ov-local-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);position:absolute;inset:0;display:none}
#ov-app .ov-self .ov-camera-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:#ddd}
#ov-app .ov-camera-fallback>span{font-size:50px}#ov-app .ov-camera-fallback strong{font-size:18px}#ov-app .ov-camera-fallback small{color:#aab1c0}
#ov-app #ov-camera-retry{background:#252c38;color:#fff;border:1px solid #566277;border-radius:6px;padding:8px 15px;cursor:pointer}
/* Not a seekable VOD player; keep browser fullscreen / playback chrome hidden. */
#ov-app #ov-player::-webkit-media-controls{display:none!important}
#ov-app #ov-player::-webkit-media-controls-enclosure{display:none!important}

/* Anonymous access and transparent legal links */
.ov-anonymous-button{display:block;width:100%;margin:7px 0 16px;padding:12px 18px;background:#f1f5fb;border:1px solid #cbd5e1;border-radius:7px;color:#1a5fab;font-weight:700;font-size:15px;cursor:pointer}
.ov-anonymous-button:hover{background:#e2eeff}
.ov-legal-notice{font-size:12px;color:#526072;line-height:1.6;margin:12px 0}
.ov-legal-notice a{color:#236fd0;text-decoration:underline}
