/* Mobile-first conversations. Kept separate from legacy dashboard styling. */
.mobile-dock { display:none; }
.welcome-dialog { width:min(480px,calc(100% - 32px)); max-height:85dvh; overflow:auto; padding:30px; border:1px solid #334356; border-radius:26px; background:#0c1420; color:#edf4ff; box-shadow:0 32px 120px #000a; }
.welcome-dialog::backdrop { background:#02050ccc; backdrop-filter:blur(12px); }
.welcome-dialog img { display:block; margin-bottom:20px; border-radius:20px; }
.welcome-dialog h2 { font-size:28px; margin:12px 0; }
.welcome-dialog p { line-height:1.7; color:#b9c9dc; }
.welcome-check { display:flex; align-items:center; gap:12px; margin:24px 0 12px; }
.welcome-check input { width:20px; height:20px; }
.welcome-dialog > .primary { width:100%; margin:12px 0 20px; }
.welcome-dialog small { display:block; line-height:1.6; color:#8fa3bd; }
#ai .ai-overview, #ai .ai-legal-center { display:none; }
#ai .ai-quick-panel { display:none; }
#ai .ai-workspace { display:block; }
#ai .ai-main-panel { display:flex; flex-direction:column; height:calc(100dvh - 150px); min-height:400px; padding:0; overflow:hidden; }
#ai .ai-composer-head { order:0; padding:18px 24px; border-bottom:1px solid #ffffff0d; }
#ai .ai-composer-head .section-index, #ai .ai-composer-head .eyebrow { display:none; }
#ai .ai-composer-head h2 { font-size:18px; }
#ai .ai-conversation { order:1; flex:1; min-height:0; display:flex; flex-direction:column; padding:0; }
#ai .ai-conversation-head { padding:12px 24px; }
#ai .ai-conversation-head > .workspace-section-head, #ai .ai-history-actions small { display:none; }
#ai .ai-history-actions { margin-left:auto; }
#ai #aiResults { flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:20px; padding:20px 24px; overscroll-behavior:contain; }
#ai .ai-turn { flex-shrink:0; width:90%; border-radius:20px 20px 20px 5px; padding:18px; }
#ai .ai-turn-user { align-self:flex-end; width:fit-content; max-width:85%; background:#153d4c; border-radius:20px 20px 5px 20px; }
#ai .ai-turn-head { margin-bottom:10px; }
#ai .ai-turn-head div > span { display:none; }
#ai .ai-composer { order:2; flex-shrink:0; margin:0; padding:14px 24px; border-top:1px solid #ffffff12; background:#0b1420; }
#ai .ai-prompt-field > span, #ai .ai-compose-hint, #ai .ai-web-toggle small, #ai .ai-visible-tools > button { display:none; }
#ai #aiPrompt { min-height:52px; height:52px; max-height:130px; resize:vertical; padding:14px; border-radius:16px; }
#ai .ai-composer-options { margin:8px 0; }
#ai .ai-web-toggle { display:flex; align-items:center; gap:8px; padding:0; font-size:12px; }
#ai .ai-web-toggle input { width:16px; height:16px; }
#ai .ai-compose-actions { margin:0; }
#social .thread-row { transition:background .18s,transform .18s; }
#social .thread-row:active { transform:scale(.98); }
.view.is-active { animation:sky-page-enter .25s ease-out; }
@keyframes sky-page-enter { from {opacity:0;transform:translateY(7px)} to {opacity:1;transform:none} }
@media(max-width:860px) {
 :root { --sky-visible-height:100dvh; }
 body { overflow-x:hidden; }
 .app-shell { padding:0 12px calc(90px + env(safe-area-inset-bottom)) !important; }
 .topbar { min-height:74px; padding:16px 4px !important; }
 .topbar h1 { font-size:23px; }
 .topbar .eyebrow { font-size:10px; }
 .top-actions { gap:5px; }
 .top-actions .icon-button { width:36px; height:36px; }
 .mobile-menu-toggle, .status-strip { display:none !important; }
 .mobile-dock { display:grid; grid-template-columns:repeat(4,1fr); position:fixed; z-index:90; bottom:0; left:0; right:0; padding:8px 10px calc(8px + env(safe-area-inset-bottom)); border-top:1px solid #ffffff15; background:#09111aee; backdrop-filter:blur(24px); }
 .is-locked .mobile-dock { display:none; }
 .mobile-dock button { display:flex; flex-direction:column; gap:5px; align-items:center; justify-content:center; min-height:48px; border:0; background:transparent; color:#8194ad; font-size:11px; }
 .mobile-dock button span { font-size:21px; }
 .mobile-dock button.is-current { color:#d0f6ff; background:#7ad8ff0d; border-radius:14px; }
 .app-shell.mobile-menu-open .tabs { bottom:calc(76px + env(safe-area-inset-bottom)); max-height:75dvh; overflow:auto; border-radius:24px 24px 0 0; }
 #social .game-main { padding:0; border:0; background:transparent; box-shadow:none; }
 #social .game-header { padding:12px 4px; }
 #social .game-header p, #social .game-header h2 { display:none; }
 #social .social-tabs { margin:0 0 18px; gap:4px; padding:5px; }
 #social .social-tab { min-width:0; flex:1; padding:12px 6px; font-size:12px; }
 #social .social-panel .social-grid.whatsapp-layout { display:block !important; }
 #social:not(.chat-focus) .social-chat-main, #social .social-share-card { display:none !important; }
 #social .social-thread-card { display:block; min-height:0; padding:4px !important; border:0; background:transparent; box-shadow:none; }
 #social .thread-row { margin:0; padding:18px 14px; border-radius:0; border:0; border-bottom:1px solid #ffffff0a; background:transparent; min-height:88px; }
 #social .thread-row small { color:#8b9fb7; }
 #social.chat-focus { position:fixed; inset:0; height:var(--sky-visible-height); z-index:110; background:#08101a; padding:0; overflow:hidden; }
 #social.chat-focus .social-layout, #social.chat-focus .game-main, #social.chat-focus .social-panels, #social.chat-focus .social-panel.is-active, #social.chat-focus .whatsapp-layout { height:100%; min-height:0; }
 #social.chat-focus .game-header, #social.chat-focus .social-tabs, #social.chat-focus .social-thread-card, #social.chat-focus [data-social-tool], #social.chat-focus .social-column-head { display:none !important; }
 #social.chat-focus .social-chat-main { display:flex !important; flex-direction:column; height:100%; min-height:0; margin:0; padding:0; border:0; border-radius:0; background:linear-gradient(#0b1521ee,#08121ddd),url('/assets/sky-night-stars-v1.jpg') center/cover; }
 #social .chat-card-head { flex-shrink:0; min-height:76px; padding:calc(14px + env(safe-area-inset-top)) 16px 14px; background:#0b1724ef; border-bottom:1px solid #ffffff0c; }
 #social .chat-back { display:inline-flex !important; width:40px; height:40px; align-items:center; justify-content:center; }
 #social .chat-log { flex:1; min-height:0; max-height:none; padding:24px 16px; overflow-y:auto; overscroll-behavior:contain; }
 #social .chat-message { max-width:85%; font-size:15px; line-height:1.55; padding:12px 15px; margin-bottom:14px; }
 #social .chat-form { flex-shrink:0; position:relative; bottom:auto; padding:12px 12px calc(12px + env(safe-area-inset-bottom)); gap:8px; background:#0b1724; display:flex; }
 #social .chat-form input { flex:1; min-width:0; height:46px; border-radius:23px; font-size:16px; }
 #social .chat-form button[type=submit] { min-width:58px; padding:12px; border-radius:23px; }
 #ai .ai-main-panel { height:calc(var(--sky-visible-height) - 155px - env(safe-area-inset-bottom)); min-height:280px; border-radius:20px; }
 #ai .ai-composer-head { padding:16px; }
 #ai .ai-composer-head h2 { font-size:16px; }
 #ai .ai-conversation-head { padding:8px 16px 0; }
 #ai #aiResults { padding:16px; gap:16px; }
 #ai .ai-turn { width:96%; padding:14px; }
 #ai .ai-turn-user { max-width:90%; }
 #ai .ai-composer { padding:12px; }
 #ai .ai-submit-button { min-height:42px; padding:10px 16px; font-size:13px; }
 .integrated-game-module { height:calc(100dvh - 158px - env(safe-area-inset-bottom)); min-height:0; border-radius:18px; }
 .unified-hero { padding:24px !important; }
 .unified-hero h2 { font-size:30px; }
 .unified-orbit { display:none; }
 .unified-actions-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .unified-action { padding:16px 12px; }
 .unified-action b { display:none; }
 .unified-games-grid { grid-template-columns:1fr; gap:14px; }
}
@media(prefers-reduced-motion:reduce) { .view.is-active { animation:none; } #social .thread-row { transition:none; } }
