@tailwind base;@tailwind components;@tailwind utilities;@layer base{:root{--bg-deep:#0b0e17;--bg-glass:#1216248c;--bg-glass-hover:#1e263ea6;--bg-glass-active:#466ec840;--bg-glass-sidebar:#0e121eb3;--bg-glass-input:#1c223899;--bg-glass-topbar:#0e121ebf;--bg-bubble-out:#5078dc33;--bg-bubble-in:#181e3299;--bg-badge:linear-gradient(135deg, #6366f1, #8b5cf6);--bg-scrollbar:#ffffff0f;--bg-scrollbar-hover:#ffffff1f;--glass-border:#ffffff14;--glass-border-hover:#ffffff24;--glass-blur:20px;--glass-blur-heavy:32px;--text-primary:#e8eaf0;--text-secondary:#b4bcd2b3;--text-message:#d8dce6;--text-time:#a0aac899;--text-link:#818cf8;--text-badge:#fff;--text-placeholder:#8c96b480;--accent:#818cf8;--accent-glow:#818cf84d;--accent-warm:#f59e0b;--accent-send:#818cf8;--accent-green:#34d399;--shadow-glass:0 8px 32px #0000004d, inset 0 1px 0 #ffffff0d;--shadow-bubble:0 2px 12px #0003;--shadow-glow:0 0 40px #818cf826;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--duration-fast:.15s;--duration-normal:.3s;--duration-slow:.6s}[data-theme=light]{--bg-deep:#e8ecf4;--bg-glass:#ffffff8c;--bg-glass-hover:#ffffffb3;--bg-glass-active:#6366f11f;--bg-glass-sidebar:#ffffffa6;--bg-glass-input:#ffffffb3;--bg-glass-topbar:#ffffffb3;--bg-bubble-out:#6366f11a;--bg-bubble-in:#ffffffbf;--bg-scrollbar:#00000014;--bg-scrollbar-hover:#00000026;--glass-border:#0000000f;--glass-border-hover:#0000001a;--text-primary:#1a1d2e;--text-secondary:#3c415ab3;--text-message:#2d3148;--text-time:#646e8cb3;--text-link:#6366f1;--text-placeholder:#646e8c80;--accent:#6366f1;--accent-glow:#6366f133;--accent-send:#6366f1;--shadow-glass:0 8px 32px #00000014, inset 0 1px 0 #fffc;--shadow-bubble:0 2px 8px #0000000f;--shadow-glow:0 0 40px #6366f11a}@apply border-border;body{color:var(--text-primary);background:var(--bg-deep);-webkit-font-smoothing:antialiased;height:100vh;font-family:DM Sans,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;line-height:1.45;overflow:hidden}@apply transition-colors duration-300;::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-scrollbar);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--bg-scrollbar-hover)}}@layer components{.bg-canvas{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.aurora{filter:blur(120px);opacity:.4;border-radius:50%;animation:20s ease-in-out infinite alternate aurora-drift;position:absolute}[data-theme=light] .aurora{opacity:.25}.aurora-1{background:radial-gradient(circle,#6366f1 0%,#0000 70%);width:600px;height:600px;animation-duration:22s;top:-15%;left:10%}.aurora-2{background:radial-gradient(circle,#8b5cf6 0%,#0000 70%);width:500px;height:500px;animation-duration:18s;animation-delay:-8s;top:50%;right:-5%}.aurora-3{opacity:.2;background:radial-gradient(circle,#f59e0b 0%,#0000 70%);width:450px;height:450px;animation-duration:25s;animation-delay:-14s;bottom:-10%;left:30%}.aurora-4{opacity:.15;background:radial-gradient(circle,#34d399 0%,#0000 70%);width:350px;height:350px;animation-duration:30s;animation-delay:-5s;top:30%;left:50%}@keyframes aurora-drift{0%{transform:translate(0)scale(1)}33%{transform:translate(60px,-40px)scale(1.1)}66%{transform:translate(-30px,50px)scale(.95)}to{transform:translate(40px,20px)scale(1.05)}}.particle{background:#ffffff14;border-radius:50%;animation:linear infinite particle-float;position:absolute}[data-theme=light] .particle{background:#6366f114}@keyframes particle-float{0%{opacity:0;transform:translateY(100vh)scale(0)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-10vh)scale(1)}}.mesh-grid{background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:60px 60px;animation:40s linear infinite grid-shift;position:absolute;inset:0}[data-theme=light] .mesh-grid{background-image:linear-gradient(#00000008 1px,#0000 1px),linear-gradient(90deg,#00000008 1px,#0000 1px)}@keyframes grid-shift{0%{transform:translate(0)}to{transform:translate(60px,60px)}}.glass{background:var(--bg-glass);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass)}.app-container{z-index:1;gap:10px;width:100%;height:100vh;padding:10px;display:flex;position:relative}.sidebar{background:var(--bg-glass-sidebar);width:310px;min-width:310px;-webkit-backdrop-filter:blur(var(--glass-blur-heavy));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border-radius:16px;flex-direction:column;animation-delay:.1s;display:flex;overflow:hidden}.topics-panel{background:var(--bg-glass-sidebar);width:310px;min-width:310px;-webkit-backdrop-filter:blur(var(--glass-blur-heavy));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border-radius:16px;flex-direction:column;animation-delay:.2s;display:flex;overflow:hidden}.chat-area{background:var(--bg-glass);min-width:0;-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass), var(--shadow-glow);animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border-radius:16px;flex-direction:column;flex:1;animation-delay:.3s;display:flex;overflow:hidden}@keyframes panel-slide-in{0%{opacity:0;transform:translateY(20px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.group-item{cursor:pointer;transition:all var(--duration-fast) ease;animation:item-fade-in .4s var(--ease-out-expo) both;border:1px solid #0000;border-radius:12px;align-items:center;gap:12px;padding:10px;display:flex;position:relative}.group-item:first-child{animation-delay:.3s}.group-item:nth-child(2){animation-delay:.38s}.group-item:nth-child(3){animation-delay:.46s}.group-item:nth-child(4){animation-delay:.54s}.group-item:nth-child(5){animation-delay:.62s}.group-item:nth-child(6){animation-delay:.7s}@keyframes item-fade-in{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}.group-item:hover{background:var(--bg-glass-hover);border-color:var(--glass-border-hover);transform:translate(2px)}.group-item:active{transform:scale(.98)}.group-item.active{background:var(--bg-glass-active);border:1px solid #818cf833;box-shadow:0 0 20px #818cf814,inset 0 1px #ffffff0d}.group-avatar{color:#fff;text-transform:uppercase;width:48px;height:48px;transition:transform var(--duration-fast) var(--ease-spring);border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;font-size:17px;font-weight:600;display:flex;position:relative;overflow:hidden}.group-item:hover .group-avatar{transform:scale(1.08)}.avatar-indigo{background:linear-gradient(135deg,#6366f1,#818cf8);box-shadow:0 4px 14px #6366f14d}.avatar-emerald{background:linear-gradient(135deg,#059669,#34d399);box-shadow:0 4px 14px #0596694d}.avatar-amber{background:linear-gradient(135deg,#d97706,#fbbf24);box-shadow:0 4px 14px #d977064d}.avatar-violet{background:linear-gradient(135deg,#7c3aed,#a78bfa);box-shadow:0 4px 14px #7c3aed4d}.avatar-rose{background:linear-gradient(135deg,#e11d48,#fb7185);box-shadow:0 4px 14px #e11d484d}.avatar-teal{background:linear-gradient(135deg,#0d9488,#5eead4);box-shadow:0 4px 14px #0d94884d}.group-info{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.group-top-row{justify-content:space-between;align-items:center;display:flex}.group-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.group-time{color:var(--text-time);flex-shrink:0;margin-left:8px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:400}.group-bottom-row{justify-content:space-between;align-items:center;display:flex}.group-preview-text{flex:1;gap:4px;min-width:0;display:flex}.group-sender{color:var(--accent);flex-shrink:0;font-size:12.5px;font-weight:500}.group-preview{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.badge{background:var(--bg-badge);color:var(--text-badge);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;min-width:22px;height:20px;margin-left:8px;padding:0 6px;font-size:10px;font-weight:700;animation:3s ease-in-out infinite badge-pulse;display:flex;box-shadow:0 2px 8px #6366f14d}@keyframes badge-pulse{0%,to{box-shadow:0 2px 8px #6366f14d}50%{box-shadow:0 2px 16px #6366f180}}.badge.muted{box-shadow:none;background:#7882a04d;animation:none}.topic-item{cursor:pointer;transition:all var(--duration-fast) ease;animation:item-fade-in .4s var(--ease-out-expo) both;border:1px solid #0000;border-radius:12px;align-items:center;gap:12px;padding:9px 10px;display:flex}.topic-item:first-child{animation-delay:.35s}.topic-item:nth-child(2){animation-delay:.4s}.topic-item:nth-child(3){animation-delay:.45s}.topic-item:nth-child(4){animation-delay:.5s}.topic-item:nth-child(5){animation-delay:.55s}.topic-item:hover{background:var(--bg-glass-hover);transform:translate(2px)}.topic-item:active{transform:scale(.98)}.topic-item.active{background:var(--bg-glass-active);border-color:#818cf833;box-shadow:0 0 20px #818cf80f}.topic-icon{background:var(--bg-glass-input);border:1px solid var(--glass-border);width:40px;height:40px;transition:transform var(--duration-fast) var(--ease-spring);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:19px;display:flex}.topic-item:hover .topic-icon{transform:scale(1.1)rotate(5deg)}.topic-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.topic-top-row{justify-content:space-between;align-items:center;display:flex}.topic-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:500;overflow:hidden}.topic-time{color:var(--text-time);flex-shrink:0;margin-left:8px;font-family:JetBrains Mono,monospace;font-size:11px}.topic-preview{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.messages-area{flex-direction:column;flex:1;padding:16px 0;display:flex;overflow-y:auto}.messages-container{flex-direction:column;gap:6px;width:100%;max-width:720px;margin:0 auto;padding:0 20px;display:flex}.message-row{animation:message-appear .45s var(--ease-out-expo) both;margin-bottom:3px;display:flex}.message-row:first-child{animation-delay:.5s}.message-row:nth-child(2){animation-delay:.6s}.message-row:nth-child(3){animation-delay:.7s}.message-row:nth-child(4){animation-delay:.8s}.message-row:nth-child(5){animation-delay:.9s}@keyframes message-appear{0%{opacity:0;transform:translateY(16px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.message-row.outgoing{justify-content:flex-end}.message-row.incoming{justify-content:flex-start}.bubble{word-break:break-word;max-width:480px;transition:transform var(--duration-fast) ease;border-radius:16px;padding:8px 12px 6px;position:relative}.bubble:hover{transform:scale(1.01)}.bubble.out{background:var(--bg-bubble-out);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #818cf826;border-bottom-right-radius:6px;box-shadow:0 2px 12px #6366f11a}.bubble.in{background:var(--bg-bubble-in);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--shadow-bubble);border-bottom-left-radius:6px}.bubble-sender{background:linear-gradient(135deg, var(--accent), #a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:2px;font-size:12.5px;font-weight:600}.bubble-sender.green{background:linear-gradient(135deg,#059669,#34d399);-webkit-background-clip:text;background-clip:text}.bubble-sender.amber{background:linear-gradient(135deg,#d97706,#fbbf24);-webkit-background-clip:text;background-clip:text}.bubble-sender.violet{background:linear-gradient(135deg,#7c3aed,#c084fc);-webkit-background-clip:text;background-clip:text}.bubble-text{color:var(--text-message);font-size:14px;line-height:1.5}.bubble-meta{justify-content:flex-end;align-items:center;gap:5px;margin-top:3px;display:flex}.bubble-time{color:var(--text-time);font-family:JetBrains Mono,monospace;font-size:10.5px}.input-area{border-top:1px solid var(--glass-border);background:var(--bg-glass-topbar);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));flex-shrink:0;align-items:flex-end;gap:8px;padding:10px 12px;display:flex}.input-area-inner{align-items:flex-end;gap:8px;width:100%;max-width:720px;margin:0 auto;display:flex}.send-btn{background:var(--bg-badge);color:#fff;cursor:pointer;width:42px;height:42px;transition:all var(--duration-fast) var(--ease-spring);border:none;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;display:flex;box-shadow:0 4px 14px #6366f159}.send-btn:hover{transform:scale(1.1);box-shadow:0 6px 20px #6366f180}.send-btn:active{transform:scale(.9)}.send-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.input-wrapper{background:var(--bg-glass-input);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);min-height:42px;transition:all var(--duration-normal) var(--ease-out-expo);border-radius:14px;flex:1;align-items:center;padding:4px 14px;display:flex}.input-wrapper:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.msg-input{color:var(--text-primary);resize:none;background:0 0;border:none;outline:none;flex:1;max-height:120px;padding:7px 0;font-family:DM Sans,sans-serif;font-size:14px;line-height:1.45}.msg-input::placeholder{color:var(--text-placeholder)}.input-field{background:var(--bg-glass-input);width:100%;color:var(--text-primary);transition:all var(--duration-normal) var(--ease-out-expo);border:none;border-radius:20px;outline:none;padding:10px 14px;font-size:15px}.input-field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);background:var(--bg-glass-hover)}.input-field::placeholder{color:var(--text-placeholder)}.attach-btn,.emoji-btn{width:40px;height:40px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration-fast) ease;background:0 0;border:none;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.attach-btn:hover,.emoji-btn:hover{background:var(--bg-glass-hover);color:var(--text-primary);transform:scale(1.1)}.attach-btn:active,.emoji-btn:active{transform:scale(.9)}.attach-btn svg,.emoji-btn svg{width:22px;height:22px}.theme-toggle{z-index:100;border:1px solid var(--glass-border);background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:42px;height:42px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration-normal) var(--ease-spring);box-shadow:var(--shadow-glass);border-radius:14px;justify-content:center;align-items:center;display:flex;position:fixed;top:20px;right:20px}.theme-toggle:hover{color:var(--accent);border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow);transform:scale(1.1)rotate(15deg)}.theme-toggle:active{transform:scale(.9)rotate(-10deg)}.theme-toggle svg{width:18px;height:18px}@media (width<=1000px){.topics-panel{display:none}}@media (width<=650px){.sidebar{width:100%;min-width:100%}.chat-area{display:none}.app-container{gap:6px;padding:6px}}}@layer utilities{.text-ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}.sidebar{background:var(--bg-glass-sidebar);width:310px;min-width:310px;-webkit-backdrop-filter:blur(var(--glass-blur-heavy));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border-radius:16px;flex-direction:column;animation-delay:.1s;display:flex;overflow:hidden}.sidebar-header{border-bottom:1px solid var(--glass-border);flex-shrink:0;align-items:center;gap:10px;height:58px;padding:0 12px;display:flex}.hamburger-btn{width:40px;height:40px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration-fast) ease;background:0 0;border:none;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.hamburger-btn:hover{background:var(--bg-glass-hover);color:var(--text-primary);transform:scale(1.05)}.hamburger-btn:active{transform:scale(.95)}.hamburger-btn svg{width:22px;height:22px}.search-box{background:var(--bg-glass-input);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);height:38px;color:var(--text-primary);transition:all var(--duration-normal) var(--ease-out-expo);border-radius:12px;outline:none;flex:1;padding:0 14px;font-family:DM Sans,sans-serif;font-size:13px}.search-box::placeholder{color:var(--text-placeholder)}.search-box:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);background:var(--bg-glass-hover)}.groups-list{flex:1;padding:6px;overflow-y:auto}.topics-header{border-bottom:1px solid var(--glass-border);flex-shrink:0;align-items:center;gap:10px;height:58px;padding:0 12px;display:flex}.back-btn{width:36px;height:36px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration-fast) ease;background:0 0;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.back-btn:hover{background:var(--bg-glass-hover);color:var(--text-primary);transform:translate(-2px)}.back-btn svg{width:20px;height:20px}.topics-header-info{flex-direction:column;flex:1;min-width:0;display:flex}.topics-header-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;overflow:hidden}.topics-header-meta{color:var(--text-secondary);font-size:11.5px}.topics-list{flex:1;padding:6px;overflow-y:auto}.chat-topbar{background:var(--bg-glass-topbar);height:58px;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-bottom:1px solid var(--glass-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 16px;display:flex}.chat-topbar-info{flex-direction:column;min-width:0;display:flex}.chat-topbar-name{color:var(--text-primary);font-size:15px;font-weight:600}.chat-topbar-status{color:var(--accent-green);font-size:12px}.chat-topbar-status:before{content:"";background:var(--accent-green);border-radius:50%;width:6px;height:6px;margin-right:5px;animation:2s ease-in-out infinite online-pulse;display:inline-block}.chat-topbar-actions{gap:2px;display:flex}.topbar-btn{width:38px;height:38px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration-fast) ease;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;display:flex}.topbar-btn:hover{background:var(--bg-glass-hover);color:var(--text-primary);transform:scale(1.08)}.topbar-btn:active{transform:scale(.92)}.topbar-btn svg{width:20px;height:20px}.empty-state{color:var(--text-secondary);background:var(--bg-glass);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);border-radius:16px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.empty-state svg{opacity:.3}@media (width<=1000px){.topics-panel{display:none}}.mobile-visible{width:100%!important;max-width:none!important;display:flex!important}.mobile-hidden{display:none!important}@media (width<=650px){.app-container{gap:0;padding:0}.sidebar{z-index:10;border:none;border-radius:0;width:100%;max-width:none;position:fixed;inset:0}.sidebar.mobile-hidden{display:none!important}.topics-panel{z-index:20;width:100%;max-width:none;animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border:none;border-radius:0;position:fixed;inset:0}.topics-panel.mobile-hidden{display:none!important}.chat-area{z-index:30;width:100%;max-width:none;animation:panel-slide-in var(--duration-slow) var(--ease-out-expo) both;border:none;border-radius:0;flex-direction:column;position:fixed;inset:0}.chat-area.mobile-hidden{display:none!important}.theme-toggle{z-index:100}.empty-state{z-index:15;border:none;border-radius:0;position:fixed;inset:0}}

/* ===== MOBILE PWA FIXES ===== */
:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

/* Fix notch/Dynamic Island */
.chat-topbar {
  padding-top: calc(10px + var(--safe-top)) !important;
}

/* Fix input area for Safari bottom bar */
.input-area {
  padding-bottom: calc(10px + var(--safe-bottom)) !important;
}

/* Mobile back button - show on mobile only */
.mobile-back-btn {
  display: none;
}

@media (max-width: 768px) {
  /* Show back button in chat topbar on mobile */
  .mobile-back-btn {
    display: flex !important;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: var(--text-primary);
    cursor: pointer;
    font-size: 15px;
    font-weight: 500;
    padding: 6px 8px;
    border-radius: 10px;
    margin-right: 8px;
    transition: background 0.15s ease;
  }
  .mobile-back-btn:hover {
    background: var(--bg-glass-hover);
  }
  .mobile-back-btn svg {
    width: 20px;
    height: 20px;
  }

  /* Mobile app container: full screen, no gaps, no padding */
  .app-container {
    gap: 0 !important;
    padding: 0 !important;
    height: 100dvh !important;
  }

  /* Sidebar takes full screen when no chat selected */
  .sidebar {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    border-radius: 0 !important;
    border: none !important;
    z-index: 10;
    padding-top: var(--safe-top);
    padding-left: var(--safe-left);
    padding-right: var(--safe-right);
  }

  /* Chat area takes full screen when chat selected */
  .chat-area {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 0 !important;
    border: none !important;
    z-index: 20;
    display: flex !important;
    flex-direction: column !important;
    padding-left: var(--safe-left);
    padding-right: var(--safe-right);
  }

  /* When chat is selected - hide sidebar, show chat */
  .sidebar.mobile-hidden {
    display: none !important;
  }
  .chat-area.mobile-hidden {
    display: none !important;
  }

  /* Chat topbar: account for notch */
  .chat-topbar {
    padding-top: calc(10px + var(--safe-top)) !important;
    height: calc(58px + var(--safe-top)) !important;
  }

  /* Input area: account for home indicator */
  .input-area {
    padding-bottom: calc(10px + var(--safe-bottom)) !important;
  }

  /* Sidebar header: account for notch */
  .sidebar-header {
    padding-top: calc(10px + var(--safe-top)) !important;
    height: calc(58px + var(--safe-top)) !important;
  }
}