/* HappyGram V52 — auth gate + polished messenger surface */
:root{--hg-accent:#6366f1;--hg-accent2:#8b5cf6;--hg-bg:#f5f7fb;--hg-panel:#fff;--hg-text:#182033;--hg-muted:#7a8499;--hg-line:#e7eaf1}
body{font-family:Inter,Manrope,Roboto,Arial,sans-serif}
/* Never expose the messenger shell while unauthenticated. */
#screen-app[data-active="false"]{display:none!important}
#screen-auth[data-active="true"]{display:flex!important}
.card-auth{width:min(94vw,440px)!important;padding:32px!important;border-radius:28px!important}
.card-auth .tabs{background:rgba(127,127,160,.10);border:1px solid rgba(127,127,160,.14);padding:4px;border-radius:14px}
.card-auth .tab{border-radius:10px;min-height:42px;font-weight:700}
.card-auth .tab.is-active{box-shadow:0 5px 18px rgba(99,102,241,.16)}
.card-auth .field input{min-height:50px;border-radius:14px}
.card-auth #auth-submit{min-height:50px;border-radius:14px;font-weight:800}
/* Messenger desktop */
.app-shell{border-radius:24px!important;overflow:hidden!important;background:var(--hg-panel)!important;border:1px solid var(--hg-line)!important;box-shadow:0 24px 70px rgba(22,31,55,.14)!important}
.chat-list,.chat-window{background:#fff!important}
.chat-list{border-right:1px solid var(--hg-line)!important}
.chat-header{background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--hg-line)!important;backdrop-filter:blur(16px)}
.msg.mine{background:linear-gradient(135deg,#e9eaff,#e7ddff)!important;color:#1b1f33!important;border:1px solid #ddd9fb!important}
.msg.theirs{background:#f4f6fa!important;color:#202638!important;border:1px solid #e9ebf1!important}
.msg-time{color:#8c94a6!important}
.message-composer{background:#fff!important;border-top:1px solid var(--hg-line)!important}
.message-composer textarea,.composer-input{border:1px solid #e2e6ef!important;background:#f8f9fc!important;border-radius:16px!important}
.search-new{background:#f6f7fa!important;border:1px solid #e7eaf0!important;border-radius:14px!important}
.search-new input{padding-left:15px!important}
/* Mobile: full-width messenger, no inherited desktop scaling */
@media(max-width:760px){
 html,body{width:100%!important;min-width:0!important;overflow-x:hidden!important;zoom:1!important;transform:none!important}
 .app-shell{width:100vw!important;max-width:100vw!important;min-width:0!important;height:100dvh!important;border-radius:0!important;box-shadow:none!important}
 .chat-list,.chat-window{width:100%!important;min-width:0!important;max-width:100%!important}
 .chat-header{min-height:58px!important}
 .message-composer{padding:8px max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))!important}
 .card-auth{width:min(94vw,440px)!important;padding:24px 18px!important}
}

/* V53 — Liquid Glass / iOS-like surface layer */
:root{--lg-bg:rgba(255,255,255,.12);--lg-border:rgba(255,255,255,.35);--lg-hi:rgba(255,255,255,.5);--lg-shadow:0 18px 60px rgba(15,23,42,.16);--lg-blur:24px;--lg-spring:cubic-bezier(.34,1.56,.64,1)}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.glass,.card-auth,.panel-card,.call-card,.settings-panel,.card-step,.chat-shell,.chat-list,.app-rail,.conversation-header,.composer,.bottom-nav,.search-box,.msg{background:var(--lg-bg)!important;backdrop-filter:blur(var(--lg-blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--lg-blur)) saturate(180%);border:1px solid var(--lg-border);box-shadow:inset 0 1px 0 var(--lg-hi),var(--lg-shadow);border-radius:30px}
.btn,.icon-btn,.tab,.settings-nav-item,.choice-card,.wallpaper-choice{transition:transform .36s var(--lg-spring),background .25s ease,box-shadow .25s ease}
.btn:active,.icon-btn:active,.tab:active{transform:scale(.94)}
.card-auth,.panel-card,.chat-shell,.chat-list{overflow:hidden}
.cloud-password-step{padding:8px 2px}.cloud-lock-icon{width:58px;height:58px;border-radius:20px;display:grid;place-items:center;margin:8px 0 16px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 1px rgba(255,255,255,.5)}
.cloud-password-manager{margin:12px 0;padding:16px;border-radius:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@supports not ((backdrop-filter:blur(2px))){.glass,.card-auth,.panel-card,.call-card,.settings-panel,.card-step,.chat-shell,.chat-list,.app-rail,.conversation-header,.composer,.bottom-nav,.search-box,.msg{background:rgba(25,28,38,.92)!important}}
