/* Kozamia — Android / Capacitor + mobil tarayıcı kabuğu */

html.is-mobile-app,
body.is-mobile-app,
html.is-mobile-web,
body.is-mobile-web {
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: auto;
  overflow-x: clip;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  height: auto;
  min-height: 100dvh;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}

html.is-mobile-app *,
html.is-mobile-app *::before,
html.is-mobile-app *::after,
html.is-mobile-web *,
html.is-mobile-web *::before,
html.is-mobile-web *::after {
  box-sizing: border-box;
}

/* Yatay taşma kes — dikey belge kaydırmasını kilitleme */
html.is-mobile-app #app,
html.is-mobile-web #app,
html.is-mobile-app .page-wrap,
html.is-mobile-web .page-wrap {
  max-width: 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: clip;
}

html.is-mobile-app img,
html.is-mobile-web img,
html.is-mobile-app video,
html.is-mobile-web video,
html.is-mobile-app canvas,
html.is-mobile-web canvas,
html.is-mobile-app iframe,
html.is-mobile-web iframe {
  max-width: 100%;
}

/* Alt nav boşluğu — tek yerde, ekstra clear yok */
html.is-mobile-app .app-page.active,
html.is-mobile-web .app-page.active,
html.kozamia-app-shell .app-page.active {
  padding-bottom: var(--bottom-nav-h);
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

html.is-mobile-app #page-connect.active,
html.is-mobile-app #page-discover.active,
html.is-mobile-web #page-connect.active,
html.is-mobile-web #page-discover.active,
html.is-mobile-app #page-feed.is-feed-snap-active,
html.is-mobile-web #page-feed.is-feed-snap-active,
html.kozamia-app-shell #page-connect.active,
html.kozamia-app-shell #page-discover.active,
html.kozamia-app-shell #page-feed.is-feed-snap-active,
html.is-mobile-app #page-home.active,
html.is-mobile-web #page-home.active,
html.kozamia-app-shell #page-home.active {
  padding-bottom: 0 !important;
}

/* İç bölüm sheet’leri: sayfa pad’i kapat, panel alt nav’a kadar uzasın */
html.is-mobile-app #page-discover.discover-in-section.active,
html.kozamia-app-shell #page-discover.discover-in-section.active,
html.is-mobile-app #page-connect.connect-in-section.active,
html.kozamia-app-shell #page-connect.connect-in-section.active {
  padding-bottom: 0 !important;
}

/* Belge kaydırmalı sayfalar */
html.is-mobile-app #page-home.active,
html.is-mobile-app #page-profile.active,
html.is-mobile-app #page-admin.active,
html.is-mobile-app #page-feed.active:not(.is-feed-snap-active),
html.is-mobile-app #page-rewards.active,
html.is-mobile-web #page-home.active,
html.is-mobile-web #page-profile.active,
html.is-mobile-web #page-admin.active,
html.is-mobile-web #page-feed.active:not(.is-feed-snap-active),
html.is-mobile-web #page-rewards.active {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  touch-action: pan-y;
}

/* Ana sayfa açıkken (modal yoksa) gövde dikey kaydırsın */
html.is-mobile-app:has(#page-home.active) body:not(.modal-open):not(.video-fs-open):not(.dm-media-lightbox-open):not(.story-viewer-open):not(.dm-scroll-lock),
html.is-mobile-web:has(#page-home.active) body:not(.modal-open):not(.video-fs-open):not(.dm-media-lightbox-open):not(.story-viewer-open):not(.dm-scroll-lock),
html:has(#page-home.active) body:not(.modal-open):not(.video-fs-open):not(.dm-media-lightbox-open):not(.story-viewer-open):not(.dm-scroll-lock) {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  overflow-x: clip !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

html.is-mobile-app:has(#page-home.active):not(:has(body.modal-open)):not(:has(body.video-fs-open)),
html.is-mobile-web:has(#page-home.active):not(:has(body.modal-open)):not(:has(body.video-fs-open)),
html:has(#page-home.active):not(:has(body.modal-open)):not(:has(body.video-fs-open)) {
  overflow-x: clip !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  touch-action: pan-y;
}

html.is-mobile-app #page-home.active .page-wrap,
html.is-mobile-app #page-profile.active .page-wrap,
html.is-mobile-app #page-admin.active .page-wrap,
html.is-mobile-web #page-home.active .page-wrap,
html.is-mobile-web #page-profile.active .page-wrap,
html.is-mobile-web #page-admin.active .page-wrap {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

html.is-mobile-app,
html.is-mobile-web {
  --kozamia-sat: env(safe-area-inset-top, 0px);
  --nav-h: 3.25rem;
  --bottom-nav-h: 4rem;
}

.is-mobile-app .announcement-bar:not(:empty),
.is-mobile-web .announcement-bar:not(:empty),
body:not(.hide-announcement-bar) .announcement-bar:not(:empty) {
  padding-top: max(0.4rem, env(safe-area-inset-top, 0px), var(--kozamia-sat, 28px)) !important;
  padding-bottom: 0.4rem;
  box-sizing: border-box;
}

/* Duyuru varken header’a ikinci kez safe-area ekleme */
.is-mobile-app:has(.announcement-bar:not(:empty)):not(.hide-announcement-bar) .site-header,
.is-mobile-web:has(.announcement-bar:not(:empty)):not(body.hide-announcement-bar) .site-header,
html.is-mobile-app body:not(.hide-announcement-bar):has(.announcement-bar:not(:empty)) .site-header,
html.is-mobile-web body:not(.hide-announcement-bar):has(.announcement-bar:not(:empty)) .site-header {
  padding-top: 0.15rem !important;
}

.is-mobile-app .site-header,
.is-mobile-web .site-header {
  padding-top: max(0.35rem, env(safe-area-inset-top, 0px), var(--kozamia-sat, 28px));
  padding-left: max(0.5rem, env(safe-area-inset-left, 0px));
  padding-right: max(0.5rem, env(safe-area-inset-right, 0px));
  max-width: 100%;
}

/* Duyuru yoksa / gizliyse header safe-area taşır */
html.is-mobile-app body.hide-announcement-bar .site-header,
html.is-mobile-web body.hide-announcement-bar .site-header,
html.is-mobile-app body:has(.announcement-bar:empty) .site-header,
html.is-mobile-web body:has(.announcement-bar:empty) .site-header {
  padding-top: max(0.35rem, env(safe-area-inset-top, 0px), var(--kozamia-sat, 28px)) !important;
}

#safe-mode-banner.safe-mode-banner {
  padding-top: max(0.4rem, env(safe-area-inset-top, 0px), var(--kozamia-sat, 0px));
}

.is-mobile-app .bottom-nav,
.is-mobile-web .bottom-nav {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  z-index: 1100;
  padding-left: max(0.25rem, env(safe-area-inset-left, 0px));
  padding-right: max(0.25rem, env(safe-area-inset-right, 0px));
  padding-bottom: calc(0.375rem + env(safe-area-inset-bottom, 0));
}

.is-mobile-app .bottom-nav .nav-item,
.is-mobile-web .bottom-nav .nav-item {
  position: relative;
}

.is-mobile-app .bottom-nav .nav-tab-badge,
.is-mobile-web .bottom-nav .nav-tab-badge {
  position: absolute;
  top: 0.15rem;
  right: calc(50% - 1.35rem);
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.25rem;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  line-height: 1rem;
  text-align: center;
  pointer-events: none;
}

/* DM call — mobil tam ekran + safe-area */
.is-mobile-app .modal-dm-call-expand.is-open .dm-call-box,
.is-mobile-web .modal-dm-call-expand.is-open .dm-call-box {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 100dvh !important;
  border-radius: 0 !important;
  padding-top: max(1rem, env(safe-area-inset-top, 0px)) !important;
  padding-bottom: max(1.25rem, env(safe-area-inset-bottom, 0px)) !important;
}

.is-mobile-app .dm-call-pip:not([hidden]),
.is-mobile-web .dm-call-pip:not([hidden]) {
  bottom: calc(var(--bottom-nav-h) + 0.65rem) !important;
  right: max(0.75rem, env(safe-area-inset-right, 0px)) !important;
  z-index: 1300 !important;
}

.is-mobile-app #dm-voice-call-btn.is-waiting-conn,
.is-mobile-app #dm-video-call-btn.is-waiting-conn,
.is-mobile-web #dm-voice-call-btn.is-waiting-conn,
.is-mobile-web #dm-video-call-btn.is-waiting-conn {
  opacity: 0.55;
}

html.is-mobile-web .nav-burger,
html.is-mobile-app .nav-burger,
html.is-mobile-web .mobile-nav,
html.is-mobile-app .mobile-nav {
  display: none !important;
}
html.is-mobile-web .desktop-nav {
  display: none !important;
}

.is-mobile-app .mobile-nav {
  display: none !important;
}

.is-mobile-app #connect-panel-messages .dm-app,
.is-mobile-web #connect-panel-messages .dm-app {
  max-height: none;
  flex: 1 1 auto;
  min-height: 0;
  max-width: 100%;
}

/* Mesajlar: içerik sheet viewport’a yayılsın (kısa kart + altta pembe boşluk olmasın) */
.is-mobile-app #page-connect.is-messages-focus #connect-panel-messages .dm-app,
.is-mobile-web #page-connect.is-messages-focus #connect-panel-messages .dm-app,
.is-mobile-app #page-connect.is-dm-chat-open #connect-panel-messages .dm-app,
.is-mobile-web #page-connect.is-dm-chat-open #connect-panel-messages .dm-app {
  height: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Bağlan: belge kaydırması (APK’de iç panel max-height kaydırmayı yarıda kesiyordu) */
.is-mobile-app #page-connect.active .connect-hub,
.is-mobile-web #page-connect.active .connect-hub {
  height: auto !important;
  max-height: none !important;
  max-width: 100%;
  overflow: visible !important;
  display: block !important;
}

/* Gövde kilidi kaldır — connect açıkken de sayfa kayabilsin (DM sohbet / canlı hariç) */
html.is-mobile-app:has(#page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open)):has(body.logged-in):not(:has(body.modal-open)):not(:has(body.is-live-stage-open)),
html.is-mobile-web:has(#page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open)):has(body.logged-in):not(:has(body.modal-open)):not(:has(body.is-live-stage-open)),
html.is-mobile-app:has(#page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open)):has(body.logged-in):not(:has(body.modal-open)):not(:has(body.is-live-stage-open)) body,
html.is-mobile-web:has(#page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open)):has(body.logged-in):not(:has(body.modal-open)):not(:has(body.is-live-stage-open)) body {
  overflow-x: clip !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  position: static !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
}

html.is-mobile-app body.logged-in #page-connect.active:not(.is-live-stage-open):not(.is-messages-focus):not(.is-dm-chat-open):not(.connect-in-section),
html.is-mobile-web body.logged-in #page-connect.active:not(.is-live-stage-open):not(.is-messages-focus):not(.is-dm-chat-open):not(.connect-in-section),
html.kozamia-app-shell body.logged-in #page-connect.active:not(.is-live-stage-open):not(.is-messages-focus):not(.is-dm-chat-open):not(.connect-in-section) {
  display: block !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  padding-bottom: var(--bottom-nav-h) !important;
}
html.is-mobile-web body.logged-in #page-connect.active:not(.is-live-stage-open):not(.is-messages-focus):not(.is-dm-chat-open) .connect-hub {
  flex: none !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

html.is-mobile-app:has(#page-connect.active):has(body.logged-in) .site-header,
html.is-mobile-web:has(#page-connect.active):has(body.logged-in) .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1200 !important;
}

html.is-mobile-app #page-connect .connect-hub-header,
html.is-mobile-web #page-connect .connect-hub-header {
  flex: 0 0 auto !important;
  background: var(--bg, #f8f7ff);
  z-index: 20;
}

/* Genel sekmeler: panel belge ile uzasın */
html.is-mobile-app #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open) .connect-panel:not([hidden]),
html.is-mobile-web #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open) .connect-panel:not([hidden]) {
  flex: none !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  touch-action: pan-y !important;
  padding-bottom: 0.5rem;
}

/* DM sohbet açıkken iç scroll (mesaj listesi) */
html.is-mobile-app #page-connect.active.is-messages-focus,
html.is-mobile-web #page-connect.active.is-messages-focus,
html.kozamia-app-shell #page-connect.active.is-messages-focus {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  height: calc(100dvh - var(--bottom-nav-h)) !important;
  max-height: calc(100dvh - var(--bottom-nav-h)) !important;
  padding-bottom: 0 !important;
}

/* DM sohbet: viewport’ta alt nava kadar sabit (composergap1) */
html.is-mobile-app #page-connect.active.is-dm-chat-open,
html.is-mobile-web #page-connect.active.is-dm-chat-open,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: var(--bottom-nav-h) !important;
  height: auto !important;
  max-height: none !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus .connect-hub,
html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-hub,
html.is-mobile-web #page-connect.active.is-messages-focus .connect-hub,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-hub {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus .connect-panel:not([hidden]),
html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-panel:not([hidden]),
html.is-mobile-web #page-connect.active.is-messages-focus .connect-panel:not([hidden]),
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-panel:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-messages-focus .connect-panel:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-panel:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  touch-action: pan-y !important;
}

/* Gizli Bağlan panelleri — display:flex !important sızıntısını engelle */
html.is-mobile-app #page-connect .connect-panel[hidden],
html.is-mobile-web #page-connect .connect-panel[hidden],
html.kozamia-app-shell #page-connect .connect-panel[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  flex: 0 0 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html.is-mobile-app:has(#page-connect.active.is-messages-focus):has(body.logged-in):not(:has(body.modal-open)),
html.is-mobile-app:has(#page-connect.active.is-dm-chat-open):has(body.logged-in):not(:has(body.modal-open)),
html.is-mobile-web:has(#page-connect.active.is-messages-focus):has(body.logged-in):not(:has(body.modal-open)),
html.is-mobile-web:has(#page-connect.active.is-dm-chat-open):has(body.logged-in):not(:has(body.modal-open)),
html.is-mobile-app:has(#page-connect.active.is-messages-focus):has(body.logged-in):not(:has(body.modal-open)) body,
html.is-mobile-app:has(#page-connect.active.is-dm-chat-open):has(body.logged-in):not(:has(body.modal-open)) body,
html.is-mobile-web:has(#page-connect.active.is-messages-focus):has(body.logged-in):not(:has(body.modal-open)) body,
html.is-mobile-web:has(#page-connect.active.is-dm-chat-open):has(body.logged-in):not(:has(body.modal-open)) body {
  overflow: hidden !important;
  height: 100% !important;
  max-height: 100dvh !important;
  overscroll-behavior: none !important;
}

/* Keşfet: belge kaydırması (yukarı/aşağı simetrik) */
.is-mobile-app #page-discover.active .discover-hub,
.is-mobile-web #page-discover.active .discover-hub {
  height: auto !important;
  max-height: none !important;
  max-width: 100%;
  overflow: visible !important;
  display: block !important;
}

/* Misafir: hub davet kartları belge gibi kaydırılsın */
body:not(.logged-in) #page-connect.active .connect-hub,
body:not(.logged-in) #page-discover.active .discover-hub,
body:not(.logged-in) #page-feed.active .feed-hub,
html.is-mobile-app body:not(.logged-in) #page-connect.active .connect-hub,
html.is-mobile-app body:not(.logged-in) #page-discover.active .discover-hub,
html.is-mobile-app body:not(.logged-in) #page-feed.active .feed-hub,
html.is-mobile-web body:not(.logged-in) #page-connect.active .connect-hub,
html.is-mobile-web body:not(.logged-in) #page-discover.active .discover-hub,
html.is-mobile-web body:not(.logged-in) #page-feed.active .feed-hub {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
}

body:not(.logged-in) #page-connect.active,
body:not(.logged-in) #page-discover.active,
body:not(.logged-in) #page-feed.active,
html.is-mobile-app body:not(.logged-in) #page-connect.active,
html.is-mobile-app body:not(.logged-in) #page-discover.active,
html.is-mobile-app body:not(.logged-in) #page-feed.active,
html.is-mobile-web body:not(.logged-in) #page-connect.active,
html.is-mobile-web body:not(.logged-in) #page-discover.active,
html.is-mobile-web body:not(.logged-in) #page-feed.active {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  padding-bottom: var(--bottom-nav-h) !important;
}

body:not(.logged-in) .hub-guest-invite {
  overflow: visible;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
}

body:not(.logged-in) #page-feed.is-feed-snap-active,
body:not(.logged-in) #page-feed.is-feed-snap-active .feed-hub {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.is-mobile-app #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open) .connect-panel,
.is-mobile-app #page-discover .connect-panel,
.is-mobile-web #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open) .connect-panel,
.is-mobile-web #page-discover .connect-panel {
  flex: none !important;
  min-height: 0;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.5rem;
}

.is-mobile-app .msg-settings-form,
.is-mobile-web .msg-settings-form {
  padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0));
  overflow: visible;
}

.is-mobile-app #messages-settings-view,
.is-mobile-web #messages-settings-view {
  overflow: auto !important;
}

.is-mobile-app .modal-box,
.is-mobile-web .modal-box {
  max-width: calc(100% - 1rem) !important;
  max-height: calc(100dvh - 2rem - env(safe-area-inset-top, 0) - env(safe-area-inset-bottom, 0));
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  overscroll-behavior: contain;
}

/* Capacitor APK: profil düzenle — tek scroll kökü (flex-basis 0%) */
html.is-mobile-app #modal-profile-edit.is-open,
html.is-mobile-web #modal-profile-edit.is-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: none !important;
}

html.is-mobile-app #modal-profile-edit.is-open .profile-edit-modal,
html.is-mobile-web #modal-profile-edit.is-open .profile-edit-modal {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  height: min(92dvh, calc(100dvh - env(safe-area-inset-top, 0px))) !important;
  max-height: min(92dvh, calc(100dvh - env(safe-area-inset-top, 0px))) !important;
  touch-action: manipulation !important;
}

html.is-mobile-app #modal-profile-edit .profile-edit-scroll,
html.is-mobile-web #modal-profile-edit .profile-edit-scroll {
  flex: 1 1 0% !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: scroll !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
  overscroll-behavior-y: contain !important;
  overflow-anchor: none !important;
}

html.is-mobile-app #modal-profile-edit #profile-edit-form,
html.is-mobile-web #modal-profile-edit #profile-edit-form {
  flex: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

.is-mobile-app .vertical-video-feed.is-mobile-snap,
.is-mobile-web .vertical-video-feed.is-mobile-snap {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  max-height: none;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

/* Admin */
html.is-mobile-app #page-admin,
html.is-mobile-web #page-admin {
  max-width: 100%;
  overflow: visible;
}

html.is-mobile-app #page-admin .admin-shell,
html.is-mobile-web #page-admin .admin-shell,
html.is-mobile-app #page-admin .admin-layout,
html.is-mobile-web #page-admin .admin-layout {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
}

html.is-mobile-app #page-admin .admin-content,
html.is-mobile-web #page-admin .admin-content,
html.is-mobile-app #page-admin .admin-tab,
html.is-mobile-web #page-admin .admin-tab {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

html.is-mobile-app #page-admin table,
html.is-mobile-web #page-admin table {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

html.is-mobile-app .admin-user-drawer,
html.is-mobile-app #admin-user-drawer,
<html.is-mobile-app .km-dialog-panel,
html.is-mobile-web .km-dialog-panel {
  max-width: min(100%, 17.5rem);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1rem);
}

/* Profil alt boşluğu — body zaten nav payı bırakıyor */
html.is-mobile-app #page-profile .profile-fb,
html.is-mobile-web #page-profile .profile-fb {
  padding-bottom: 1.25rem !important;
}

@media (max-width: 48rem), (max-device-width: 48rem) {
  .page-wrap > *,
  .connect-panel,
  .discover-hub .connect-panel {
    min-width: 0;
    max-width: 100%;
  }
}

/* APK zorunlu güncelleme — kapatılamaz */
.kozamia-force-update {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: max(1.25rem, env(safe-area-inset-top)) 1.25rem max(1.25rem, env(safe-area-inset-bottom));
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(117, 47, 238, 0.45), transparent 55%),
    linear-gradient(165deg, #0f0a1a 0%, #0b1220 55%, #111827 100%);
  pointer-events: auto;
}
.kozamia-force-update.is-open,
.kozamia-force-update:not([hidden]) {
  display: flex !important;
}
.kozamia-force-update[hidden] {
  display: none !important;
}
.kozamia-force-update-card {
  width: min(100%, 22rem);
  text-align: center;
  padding: 1.75rem 1.35rem 1.5rem;
  border-radius: 1.35rem;
  background: rgba(255, 255, 255, 0.96);
  color: #0f172a;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.kozamia-force-update-badge {
  width: 3.5rem;
  height: 3.5rem;
  margin: 0 auto 0.85rem;
  border-radius: 1rem;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #752FEE, #db2777);
  color: #fff;
  box-shadow: 0 8px 24px rgba(117, 47, 238, 0.4);
}
.kozamia-force-update-badge .material-symbols-outlined {
  font-size: 1.75rem;
}
.kozamia-force-update-card h2 {
  margin: 0 0 0.5rem;
  font-size: 1.35rem;
  font-weight: 800;
  color: #111827;
}
.kozamia-force-update-msg {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
  line-height: 1.45;
  color: #374151;
}
.kozamia-force-update-meta {
  margin: 0 0 1.1rem;
  font-size: 0.75rem !important;
}
.kozamia-force-update-dl {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin-bottom: 0.75rem;
}
.kozamia-force-update-dl:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.kozamia-force-update-hint {
  margin: 0;
  font-size: 0.72rem !important;
  line-height: 1.35;
}
html.kozamia-force-update-lock,
body.kozamia-force-update-lock {
  overflow: hidden !important;
  overscroll-behavior: none;
  touch-action: none;
}
body.kozamia-force-update-lock > *:not(#kozamia-force-update):not(script):not(style) {
  pointer-events: none !important;
  user-select: none;
}
body.kozamia-force-update-lock #kozamia-force-update,
body.kozamia-force-update-lock #kozamia-force-update * {
  pointer-events: auto !important;
  user-select: auto;
}

/* APK: sadece Bağlan */
html.connect-only-apk .bottom-nav .nav-item[data-page="home"],
html.connect-only-apk .bottom-nav .nav-item[data-page="discover"],
html.connect-only-apk .bottom-nav .nav-item[data-page="feed"],
html.connect-only-apk .bottom-nav .nav-feed-fab,
body.connect-only-apk .bottom-nav .nav-item[data-page="home"],
body.connect-only-apk .bottom-nav .nav-item[data-page="discover"],
body.connect-only-apk .bottom-nav .nav-item[data-page="feed"],
body.connect-only-apk .bottom-nav .nav-feed-fab {
  display: none !important;
}
html.connect-only-apk #page-home,
html.connect-only-apk #page-discover,
html.connect-only-apk #page-feed,
body.connect-only-apk #page-home,
body.connect-only-apk #page-discover,
body.connect-only-apk #page-feed {
  display: none !important;
}
html.connect-only-apk #profile-feed-add-btn,
body.connect-only-apk #profile-feed-add-btn {
  display: none !important;
}
html.connect-only-apk .site-header .nav-links a[data-goto="home"],
html.connect-only-apk .site-header .nav-links a[data-goto="discover"],
html.connect-only-apk .site-header .nav-links a[data-goto="feed"],
body.connect-only-apk .site-header .nav-links a[data-goto="home"],
body.connect-only-apk .site-header .nav-links a[data-goto="discover"],
body.connect-only-apk .site-header .nav-links a[data-goto="feed"] {
  display: none !important;
}
html.connect-only-apk .bottom-nav {
  justify-content: space-evenly;
}

/* —— Capacitor WebView: tüm sayfalarda belge kaydırma garantisi —— */
html.is-mobile-app,
html.kozamia-app-shell {
  touch-action: pan-y;
  overflow-x: clip !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  -webkit-overflow-scrolling: touch;
}
html.is-mobile-app body:not(.modal-open):not(.video-fs-open):not(.dm-media-lightbox-open):not(.story-viewer-open):not(.global-search-open):not(.dm-scroll-lock),
html.kozamia-app-shell body:not(.modal-open):not(.video-fs-open):not(.dm-media-lightbox-open):not(.story-viewer-open):not(.global-search-open):not(.dm-scroll-lock) {
  -webkit-overflow-scrolling: touch;
  overflow-x: clip !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  position: static !important;
  touch-action: pan-y !important;
  overscroll-behavior-y: auto !important;
}
html.is-mobile-app #page-home.active,
html.is-mobile-app #page-profile.active,
html.is-mobile-app #page-discover.active,
html.is-mobile-app #page-feed.active:not(.is-feed-snap-active),
html.is-mobile-app #page-rewards.active,
html.is-mobile-app #page-admin.active,
html.is-mobile-app #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open),
html.kozamia-app-shell #page-home.active,
html.kozamia-app-shell #page-profile.active,
html.kozamia-app-shell #page-discover.active,
html.kozamia-app-shell #page-feed.active:not(.is-feed-snap-active),
html.kozamia-app-shell #page-rewards.active,
html.kozamia-app-shell #page-admin.active,
html.kozamia-app-shell #page-connect.active:not(.is-messages-focus):not(.is-dm-chat-open) {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  touch-action: pan-y !important;
}
html.is-mobile-app #page-discover.active .discover-hub,
html.is-mobile-app #page-discover.active .discover-hub > .connect-panel:not([hidden]),
html.kozamia-app-shell #page-discover.active .discover-hub,
html.kozamia-app-shell #page-discover.active .discover-hub > .connect-panel:not([hidden]) {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  flex: none !important;
}
html.is-mobile-app #connect-panel-messages .dm-inbox-list,
html.is-mobile-app #connect-panel-messages .dm-chat-messages,
html.is-mobile-app #connect-panel-messages .dm-sidebar,
html.kozamia-app-shell #connect-panel-messages .dm-inbox-list,
html.kozamia-app-shell #connect-panel-messages .dm-chat-messages,
html.kozamia-app-shell #connect-panel-messages .dm-sidebar {
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
}

/* —— APK native shell (cream / purple, center Akış) — mockup language —— */
html.is-mobile-app,
html.kozamia-app-shell {
  --kozamia-shell-cream: #fdf8f5;
  --kozamia-shell-purple: #6a3d8a;
  --kozamia-shell-purple-rgb: 106, 61, 138;
  /* Tam alt nav yüksekliği (safe-area dahil) — başka yerde safe-area / clear tekrar ekleme */
  --bottom-nav-h: calc(3.4rem + env(safe-area-inset-bottom, 0px));
  --app-bottom-clear: 0px;
  --bg: #fdf8f5;
  --bg-elevated: #ffffff;
  --header-bg: rgba(253, 248, 245, 0.92);
  --violet: #6a3d8a;
  --fuchsia: #8b5a9e;
  --accent-rgb: 106, 61, 138;
  --border: rgba(106, 61, 138, 0.1);
  --shadow-soft: 0 8px 24px rgba(45, 25, 60, 0.06);
}

/* Nav fixed — body’de ikinci kez pad olmasın (krem boşluk kaynağı) */
html.is-mobile-app body,
html.kozamia-app-shell body,
html.is-mobile-web body {
  padding-bottom: 0 !important;
}

html.is-mobile-app body,
html.kozamia-app-shell body {
  background-color: var(--kozamia-shell-cream);
  background-image: none;
}

html.is-mobile-app body::before,
html.kozamia-app-shell body::before {
  opacity: 0 !important;
  content: none !important;
}

html.is-mobile-app .btn-primary,
html.kozamia-app-shell .btn-primary,
html.is-mobile-app .btn.btn-primary,
html.kozamia-app-shell .btn.btn-primary {
  background: linear-gradient(
    145deg,
    var(--fuchsia, #7b4a9e),
    var(--kozamia-shell-purple, #6a3d8a) 55%,
    var(--violet, #55306f)
  ) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.28);
}

html.is-mobile-app .btn-primary:hover,
html.kozamia-app-shell .btn-primary:hover {
  filter: brightness(1.05);
}

html.is-mobile-app .bottom-nav,
html.kozamia-app-shell .bottom-nav {
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  gap: 0.15rem;
  padding: 0.35rem 0.4rem calc(0.35rem + env(safe-area-inset-bottom, 0px));
  background: var(--kozamia-shell-cream) !important;
  background-color: var(--kozamia-shell-cream) !important;
  border-top: 1px solid rgba(106, 61, 138, 0.1) !important;
  box-shadow: 0 -6px 24px rgba(45, 25, 60, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html.is-mobile-app .bottom-nav .nav-item,
html.kozamia-app-shell .bottom-nav .nav-item {
  flex: 1;
  min-width: 0;
  color: #8a7a90;
  background: transparent;
  border: none;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
  -webkit-appearance: none;
  appearance: none;
}

html.is-mobile-app .bottom-nav .nav-item .material-symbols-outlined,
html.kozamia-app-shell .bottom-nav .nav-item .material-symbols-outlined {
  font-size: 1.28rem !important;
  font-family: "Material Symbols Outlined" !important;
  font-weight: normal !important;
  font-style: normal !important;
  display: inline-block !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  direction: ltr !important;
  -webkit-font-smoothing: antialiased;
  /* Olgun ayarlar diline yakın: dolu glif, ince outline değil */
  font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24;
  opacity: 0.72;
}

html.is-mobile-app .bottom-nav .nav-item.active,
html.kozamia-app-shell .bottom-nav .nav-item.active {
  color: var(--kozamia-shell-purple) !important;
}

html.is-mobile-app .bottom-nav .nav-item.active .material-symbols-outlined,
html.kozamia-app-shell .bottom-nav .nav-item.active .material-symbols-outlined {
  font-variation-settings: "FILL" 1, "wght" 560, "GRAD" 0, "opsz" 24;
  opacity: 1;
}

/* Merkez Akış — diğer sekmelerle aynı düz nav (FAB kaldırıldı) */
html.is-mobile-app .bottom-nav .nav-feed,
html.kozamia-app-shell .bottom-nav .nav-feed {
  flex: 1;
  position: relative;
  top: 0;
  z-index: 1;
}

html.is-mobile-app .bottom-nav .nav-feed-fab,
html.kozamia-app-shell .bottom-nav .nav-feed-fab {
  flex: 1;
  position: relative;
  top: 0;
  color: inherit;
  font-weight: inherit;
  gap: inherit;
  z-index: 1;
}

html.is-mobile-app .bottom-nav .nav-feed-fab-circle,
html.kozamia-app-shell .bottom-nav .nav-feed-fab-circle {
  display: none !important;
}

html.is-mobile-app .site-header,
html.kozamia-app-shell .site-header {
  background: rgba(253, 248, 245, 0.92) !important;
  border-bottom-color: rgba(106, 61, 138, 0.08) !important;
}

html.is-mobile-app .brand,
html.kozamia-app-shell .brand,
html.is-mobile-app .logo-text,
html.kozamia-app-shell .logo-text {
  color: var(--kozamia-shell-purple) !important;
  font-weight: 700;
  letter-spacing: -0.02em;
}

html.is-mobile-app .connect-tabs,
html.kozamia-app-shell .connect-tabs {
  gap: 0.35rem;
  padding-bottom: 0.35rem;
}

html.is-mobile-app .connect-tab.active,
html.kozamia-app-shell .connect-tab.active {
  color: var(--kozamia-shell-purple) !important;
  border-color: var(--kozamia-shell-purple) !important;
  background: rgba(106, 61, 138, 0.08) !important;
}

html.is-mobile-app .profile-mood-picker,
html.kozamia-app-shell .profile-mood-picker,
html.is-mobile-app #pe-mood-picker,
html.kozamia-app-shell #pe-mood-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

html.is-mobile-app body.admin-mode #page-admin,
html.kozamia-app-shell body.admin-mode #page-admin {
  background: var(--kozamia-shell-cream);
}

html.is-mobile-app #admin-mobile-nav,
html.kozamia-app-shell #admin-mobile-nav {
  background: var(--kozamia-shell-cream);
  border-bottom: 1px solid rgba(106, 61, 138, 0.1);
}

html.is-mobile-app #admin-mobile-nav .admin-nav-btn.is-active,
html.kozamia-app-shell #admin-mobile-nav .admin-nav-btn.is-active {
  color: var(--kozamia-shell-purple);
  border-color: var(--kozamia-shell-purple);
}

html.is-mobile-app body.dm-call-active .bottom-nav,
html.kozamia-app-shell body.dm-call-active .bottom-nav {
  display: none !important;
}

/* Masaüstü / genel: merkez Akış — düz nav (FAB yok) */
.bottom-nav .nav-feed-fab-circle {
  display: none !important;
}
.bottom-nav .nav-feed-fab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.125rem;
  text-decoration: none;
  color: var(--text-muted);
  padding: 0.375rem 0.25rem;
  top: 0;
}

/* —— Mockup surfaces: cards, chips, mood, admin, login, notif, feed/story —— */
html.is-mobile-app .home-feed-card,
html.is-mobile-app .social-feed-post,
html.is-mobile-app .profile-wall-post,
html.is-mobile-app .content-card,
html.is-mobile-app .feature-card,
html.is-mobile-app .group-card,
html.is-mobile-app .voice-room-card,
html.is-mobile-app .reward-card,
html.is-mobile-app .hub-guest-invite,
html.is-mobile-app .profile-about-card,
html.is-mobile-app .profile-composer,
html.is-mobile-app .daily-flow-spotlight,
html.is-mobile-app .gossip-card,
html.is-mobile-app .community-group-card,
html.is-mobile-app .listen-room-card,
html.is-mobile-app .play-game-tile,
html.is-mobile-app .confession-card,
html.is-mobile-app .dream-card,
html.kozamia-app-shell .home-feed-card,
html.kozamia-app-shell .social-feed-post,
html.kozamia-app-shell .profile-wall-post,
html.kozamia-app-shell .content-card,
html.kozamia-app-shell .feature-card,
html.kozamia-app-shell .group-card,
html.kozamia-app-shell .voice-room-card,
html.kozamia-app-shell .reward-card,
html.kozamia-app-shell .hub-guest-invite,
html.kozamia-app-shell .profile-about-card,
html.kozamia-app-shell .profile-composer,
html.kozamia-app-shell .daily-flow-spotlight,
html.kozamia-app-shell .gossip-card,
html.kozamia-app-shell .community-group-card,
html.kozamia-app-shell .listen-room-card,
html.kozamia-app-shell .play-game-tile,
html.kozamia-app-shell .confession-card,
html.kozamia-app-shell .dream-card {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1rem !important;
  box-shadow: 0 8px 24px rgba(45, 25, 60, 0.06) !important;
}

html.is-mobile-app .connect-tabs,
html.is-mobile-app .connect-tabs-hub,
html.is-mobile-app .discover-tabs,
html.kozamia-app-shell .connect-tabs,
html.kozamia-app-shell .connect-tabs-hub,
html.kozamia-app-shell .discover-tabs {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  gap: 0.4rem !important;
}

html.is-mobile-app .connect-tab,
html.is-mobile-app .discover-tab,
html.kozamia-app-shell .connect-tab,
html.kozamia-app-shell .discover-tab {
  border-radius: 999px !important;
  border: 1px solid rgba(106, 61, 138, 0.12) !important;
  background: #fff !important;
  color: #8a7a90 !important;
}

html.is-mobile-app .connect-tab.active,
html.is-mobile-app .discover-tab.active,
html.kozamia-app-shell .connect-tab.active,
html.kozamia-app-shell .discover-tab.active {
  background: rgba(106, 61, 138, 0.1) !important;
  color: #6a3d8a !important;
  border-color: rgba(106, 61, 138, 0.35) !important;
  box-shadow: none !important;
}

html.is-mobile-app .mood-pick,
html.is-mobile-app .share-studio-mood-btn,
html.is-mobile-app .profile-composer-mood-btn,
html.kozamia-app-shell .mood-pick,
html.kozamia-app-shell .share-studio-mood-btn,
html.kozamia-app-shell .profile-composer-mood-btn {
  border-radius: 0.9rem !important;
  border: 1px solid rgba(106, 61, 138, 0.12) !important;
  background: #fff !important;
  min-height: 3.25rem;
}

html.is-mobile-app .mood-pick.active,
html.is-mobile-app .share-studio-mood-btn.active,
html.is-mobile-app .share-studio-mood-btn.is-active,
html.is-mobile-app .profile-composer-mood-btn.active,
html.is-mobile-app .profile-composer-mood-btn.is-active,
html.kozamia-app-shell .mood-pick.active,
html.kozamia-app-shell .share-studio-mood-btn.active,
html.kozamia-app-shell .share-studio-mood-btn.is-active,
html.kozamia-app-shell .profile-composer-mood-btn.active,
html.kozamia-app-shell .profile-composer-mood-btn.is-active {
  border-color: #6a3d8a !important;
  box-shadow: 0 0 0 2px rgba(106, 61, 138, 0.25) !important;
  outline: none;
}

html.is-mobile-app .profile-fb,
html.kozamia-app-shell .profile-fb {
  --profile-accent: #6a3d8a;
}

html.is-mobile-app .admin-shell,
html.is-mobile-app .admin-shell-body,
html.is-mobile-app #page-admin,
html.kozamia-app-shell .admin-shell,
html.kozamia-app-shell .admin-shell-body,
html.kozamia-app-shell #page-admin {
  background: #fdf8f5 !important;
}

html.is-mobile-app .admin-kpi,
html.is-mobile-app .admin-kpi-strip .admin-kpi,
html.is-mobile-app .admin-content-list > *,
html.is-mobile-app .admin-alive-panel,
html.is-mobile-app .admin-bot-card,
html.kozamia-app-shell .admin-kpi,
html.kozamia-app-shell .admin-alive-panel,
html.kozamia-app-shell .admin-bot-card {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 0.9rem !important;
  box-shadow: 0 6px 18px rgba(45, 25, 60, 0.05) !important;
}

html.is-mobile-app .admin-nav-btn.is-active,
html.is-mobile-app .admin-shell .admin-nav-btn.is-active,
html.kozamia-app-shell .admin-nav-btn.is-active {
  color: #6a3d8a !important;
  border-color: #6a3d8a !important;
  background: rgba(106, 61, 138, 0.08) !important;
}

html.is-mobile-app #modal-login .modal-login-box,
html.is-mobile-app #modal-login .modal-box,
html.kozamia-app-shell #modal-login .modal-login-box,
html.kozamia-app-shell #modal-login .modal-box {
  background: #fdf8f5 !important;
  border-radius: 1.25rem !important;
  border: 1px solid rgba(106, 61, 138, 0.1) !important;
  box-shadow: 0 16px 40px rgba(45, 25, 60, 0.12) !important;
}

html.is-mobile-app #modal-login .modal-header-row h2,
html.is-mobile-app #modal-login .brand,
html.kozamia-app-shell #modal-login .modal-header-row h2 {
  color: #6a3d8a !important;
}

html.is-mobile-app .auth-tab.active,
html.kozamia-app-shell .auth-tab.active {
  color: #6a3d8a !important;
  border-bottom-color: #6a3d8a !important;
}

html.is-mobile-app .notif-panel,
html.kozamia-app-shell .notif-panel {
  background: #fdf8f5 !important;
  border-left: 1px solid rgba(106, 61, 138, 0.1) !important;
  box-shadow: -12px 0 32px rgba(45, 25, 60, 0.1) !important;
}

html.is-mobile-app .notif-panel-head,
html.kozamia-app-shell .notif-panel-head {
  background: #fdf8f5 !important;
  border-bottom: 1px solid rgba(106, 61, 138, 0.08) !important;
}

html.is-mobile-app .notif-item.is-unread,
html.kozamia-app-shell .notif-item.is-unread {
  background: rgba(106, 61, 138, 0.06) !important;
}

html.is-mobile-app .notif-item.is-unread strong,
html.kozamia-app-shell .notif-item.is-unread strong {
  color: #6a3d8a !important;
}

html.is-mobile-app #page-feed,
html.is-mobile-app #page-feed .feed-hub,
html.kozamia-app-shell #page-feed,
html.kozamia-app-shell #page-feed .feed-hub {
  background: #fdf8f5;
}

html.is-mobile-app .feed-top-chrome,
html.is-mobile-app #feed-top-chrome,
html.kozamia-app-shell .feed-top-chrome,
html.kozamia-app-shell #feed-top-chrome {
  background: #fdf8f5 !important;
  border-bottom: 1px solid rgba(106, 61, 138, 0.08);
}

html.is-mobile-app .story-ring-avatar,
html.kozamia-app-shell .story-ring-avatar {
  background: linear-gradient(135deg, #6a3d8a, #8b5a9e, #c4a484) !important;
  box-shadow: 0 0 0 2px #fdf8f5, 0 4px 12px rgba(106, 61, 138, 0.25) !important;
}

html.is-mobile-app .story-ring-add .story-ring-avatar,
html.kozamia-app-shell .story-ring-add .story-ring-avatar {
  background: #fff !important;
  border: 2px dashed rgba(106, 61, 138, 0.35) !important;
  box-shadow: none !important;
  color: #6a3d8a !important;
}

html.is-mobile-app .feed-toolbar-pro,
html.is-mobile-app .feed-toolbar-menu-btn,
html.kozamia-app-shell .feed-toolbar-pro,
html.kozamia-app-shell .feed-toolbar-menu-btn {
  background: #fff;
  border-radius: 999px;
  border: 1px solid rgba(106, 61, 138, 0.1);
}

html.is-mobile-app #modal-share-studio .modal-box,
html.is-mobile-app #modal-story-upload .modal-box,
html.is-mobile-app #modal-feed-upload-pick .modal-box,
html.kozamia-app-shell #modal-share-studio .modal-box,
html.kozamia-app-shell #modal-story-upload .modal-box,
html.kozamia-app-shell #modal-feed-upload-pick .modal-box {
  background: #fdf8f5 !important;
  border-radius: 1.25rem 1.25rem 0 0 !important;
}

html.is-mobile-app #page-home,
html.is-mobile-app #page-discover,
html.is-mobile-app #page-connect,
html.is-mobile-app #page-profile,
html.is-mobile-app #page-rewards,
html.kozamia-app-shell #page-home,
html.kozamia-app-shell #page-discover,
html.kozamia-app-shell #page-connect,
html.kozamia-app-shell #page-profile,
html.kozamia-app-shell #page-rewards {
  background: transparent;
}

html.is-mobile-app .section-title,
html.kozamia-app-shell .section-title {
  color: #3d2a4a;
}

html.is-mobile-app .icon-btn,
html.kozamia-app-shell .icon-btn {
  color: #6a3d8a;
}

html.is-mobile-app .dm-thread-item,
html.is-mobile-app .dm-inbox-item,
html.kozamia-app-shell .dm-thread-item,
html.kozamia-app-shell .dm-inbox-item {
  border-radius: 0.85rem;
  background: #fff;
  border: 1px solid rgba(106, 61, 138, 0.06);
}

html.is-mobile-app .field-input,
html.is-mobile-app input.field-input,
html.is-mobile-app textarea.field-input,
html.kozamia-app-shell .field-input {
  border-radius: 0.75rem !important;
  border-color: rgba(106, 61, 138, 0.15) !important;
  background: #fff !important;
}

html.is-mobile-app .field-input:focus,
html.kozamia-app-shell .field-input:focus {
  border-color: #6a3d8a !important;
  box-shadow: 0 0 0 3px rgba(106, 61, 138, 0.15) !important;
}

/* ==========================================================================
   A-Z TAM KABUK (Faz B-F) azfull1
   home moods, discover grid, story, connect, profile, modals,
   rewards, overlays, admin tabs, hide podcast, serif brand
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&display=swap");

html.is-mobile-app,
html.kozamia-app-shell {
  --kozamia-shell-cream: #fdf8f5;
  --kozamia-shell-cream-2: #fffbf5;
  --kozamia-shell-purple: #6a3d8a;
  --kozamia-shell-purple-rgb: 106, 61, 138;
  --kozamia-brand-serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
}

html.is-mobile-app .brand-name,
html.is-mobile-app .site-header .brand,
html.is-mobile-app .site-header .logo-text,
html.is-mobile-app #modal-login .brand,
html.is-mobile-app #modal-login .modal-header-row h2,
html.kozamia-app-shell .brand-name,
html.kozamia-app-shell .site-header .brand,
html.kozamia-app-shell #modal-login .brand,
html.kozamia-app-shell #modal-login .modal-header-row h2 {
  font-family: var(--kozamia-brand-serif) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  color: var(--kozamia-shell-purple, #6a3d8a) !important;
}

html.is-mobile-app #page-podcast,
html.is-mobile-app a[data-goto="podcast"],
html.is-mobile-app .nav-item[data-goto="podcast"],
html.is-mobile-app .bottom-nav [data-goto="podcast"],
html.is-mobile-app .admin-nav-btn[data-tab="podcasts"],
html.kozamia-app-shell #page-podcast,
html.kozamia-app-shell a[data-goto="podcast"],
html.kozamia-app-shell .nav-item[data-goto="podcast"],
html.kozamia-app-shell .admin-nav-btn[data-tab="podcasts"] {
  display: none !important;
}

/* home daily-engage-moods */
html.is-mobile-app .daily-engage,
html.kozamia-app-shell .daily-engage {
  margin: 0 0 1rem;
  padding: 0.85rem 0.9rem;
  border-radius: 1rem;
  border: 1px solid rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.12);
  background: linear-gradient(160deg, color-mix(in srgb, var(--kozamia-shell-cream, #fffbf5) 80%, #fff), #fff);
  box-shadow: 0 8px 22px rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.05);
}
html.is-mobile-app .daily-engage-ask,
html.kozamia-app-shell .daily-engage-ask {
  margin: 0 0 0.55rem;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--mood-heading, var(--kozamia-shell-purple, #3d2a4a));
}
html.is-mobile-app .daily-engage-moods,
html.kozamia-app-shell .daily-engage-moods {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.55rem;
}
html.is-mobile-app .daily-engage-mood,
html.kozamia-app-shell .daily-engage-mood {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  min-width: 3.5rem;
  padding: 0.45rem 0.4rem;
  border-radius: 0.85rem;
  border: 1px solid rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.12);
  background: #fff;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
html.is-mobile-app .daily-engage-mood.is-active,
html.kozamia-app-shell .daily-engage-mood.is-active {
  border-color: var(--engage-mood-accent, var(--kozamia-shell-purple, #6a3d8a));
  background: color-mix(in srgb, var(--engage-mood-accent, var(--kozamia-shell-purple, #6a3d8a)) 14%, #fff);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--engage-mood-accent, var(--kozamia-shell-purple, #6a3d8a)) 28%, transparent);
}
html.is-mobile-app .daily-engage-mood-emoji,
html.kozamia-app-shell .daily-engage-mood-emoji { font-size: 1.25rem; line-height: 1; }
html.is-mobile-app .daily-engage-mood-label,
html.kozamia-app-shell .daily-engage-mood-label { font-size: 0.625rem; font-weight: 650; color: var(--text-muted, #8a7a90); }
html.is-mobile-app .daily-flow-spotlight,
html.kozamia-app-shell .daily-flow-spotlight {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1.1rem !important;
  box-shadow: 0 10px 28px rgba(45, 25, 60, 0.06) !important;
}

/* discover grid */
html.is-mobile-app #guide-grid,
html.is-mobile-app .content-grid,
html.is-mobile-app .discover-grid,
html.kozamia-app-shell #guide-grid,
html.kozamia-app-shell .content-grid,
html.kozamia-app-shell .discover-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}
html.is-mobile-app #guide-grid > *,
html.is-mobile-app .content-grid > .content-card,
html.kozamia-app-shell #guide-grid > *,
html.kozamia-app-shell .content-grid > .content-card {
  border-radius: 1rem !important;
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  box-shadow: 0 8px 22px rgba(45, 25, 60, 0.05) !important;
  overflow: hidden;
}

/* story */
html.is-mobile-app .stories-row,
html.is-mobile-app .story-rings,
html.is-mobile-app .feed-stories,
html.kozamia-app-shell .stories-row,
html.kozamia-app-shell .story-rings,
html.kozamia-app-shell .feed-stories {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  padding: 0.35rem 0 0.75rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
html.is-mobile-app .story-ring-avatar,
html.kozamia-app-shell .story-ring-avatar {
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 50%;
  object-fit: cover;
  background: linear-gradient(135deg, #6a3d8a, #8b5a9e, #c4a484) !important;
  box-shadow: 0 0 0 2px #fdf8f5, 0 4px 12px rgba(106, 61, 138, 0.25) !important;
}
html.is-mobile-app .story-ring-add .story-ring-avatar,
html.kozamia-app-shell .story-ring-add .story-ring-avatar {
  background: #fff !important;
  border: 2px dashed rgba(106, 61, 138, 0.35) !important;
  box-shadow: none !important;
  color: #6a3d8a !important;
}
html.is-mobile-app #page-feed,
html.is-mobile-app .feed-top-chrome,
html.is-mobile-app #feed-top-chrome,
html.kozamia-app-shell #page-feed,
html.kozamia-app-shell .feed-top-chrome,
html.kozamia-app-shell #feed-top-chrome {
  background: #fdf8f5 !important;
}

/* connect */
html.is-mobile-app .connect-tabs,
html.is-mobile-app .connect-tabs-hub,
html.is-mobile-app .discover-tabs,
html.kozamia-app-shell .connect-tabs,
html.kozamia-app-shell .connect-tabs-hub,
html.kozamia-app-shell .discover-tabs {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  gap: 0.4rem !important;
}
html.is-mobile-app .connect-tab,
html.is-mobile-app .discover-tab,
html.kozamia-app-shell .connect-tab,
html.kozamia-app-shell .discover-tab {
  border-radius: 999px !important;
  border: 1px solid rgba(106, 61, 138, 0.12) !important;
  background: #fff !important;
  color: #8a7a90 !important;
}
html.is-mobile-app .connect-tab.active,
html.is-mobile-app .discover-tab.active,
html.kozamia-app-shell .connect-tab.active,
html.kozamia-app-shell .discover-tab.active {
  background: rgba(106, 61, 138, 0.1) !important;
  color: #6a3d8a !important;
  border-color: rgba(106, 61, 138, 0.35) !important;
}
html.is-mobile-app .group-card,
html.is-mobile-app .voice-room-card,
html.is-mobile-app .listen-room-card,
html.is-mobile-app .play-game-tile,
html.is-mobile-app .confession-card,
html.is-mobile-app .dream-card,
html.is-mobile-app .community-group-card,
html.kozamia-app-shell .group-card,
html.kozamia-app-shell .voice-room-card,
html.kozamia-app-shell .listen-room-card,
html.kozamia-app-shell .play-game-tile,
html.kozamia-app-shell .confession-card,
html.kozamia-app-shell .dream-card,
html.kozamia-app-shell .community-group-card {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1rem !important;
  box-shadow: 0 8px 24px rgba(45, 25, 60, 0.06) !important;
}

/* profile */
html.is-mobile-app .profile-fb,
html.kozamia-app-shell .profile-fb { --profile-accent: #6a3d8a; }
html.is-mobile-app .profile-about-card,
html.is-mobile-app .profile-composer,
html.is-mobile-app .profile-wall-post,
html.kozamia-app-shell .profile-about-card,
html.kozamia-app-shell .profile-composer,
html.kozamia-app-shell .profile-wall-post {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1rem !important;
  box-shadow: 0 8px 24px rgba(45, 25, 60, 0.06) !important;
}
html.is-mobile-app .mood-pick,
html.is-mobile-app .share-studio-mood-btn,
html.is-mobile-app .profile-composer-mood-btn,
html.kozamia-app-shell .mood-pick,
html.kozamia-app-shell .share-studio-mood-btn,
html.kozamia-app-shell .profile-composer-mood-btn {
  border-radius: 0.9rem !important;
  border: 1px solid rgba(106, 61, 138, 0.12) !important;
  background: #fff !important;
  min-height: 3.25rem;
}
html.is-mobile-app .mood-pick.active,
html.is-mobile-app .share-studio-mood-btn.active,
html.is-mobile-app .share-studio-mood-btn.is-active,
html.is-mobile-app .profile-composer-mood-btn.active,
html.is-mobile-app .profile-composer-mood-btn.is-active,
html.kozamia-app-shell .mood-pick.active,
html.kozamia-app-shell .share-studio-mood-btn.active,
html.kozamia-app-shell .share-studio-mood-btn.is-active,
html.kozamia-app-shell .profile-composer-mood-btn.active,
html.kozamia-app-shell .profile-composer-mood-btn.is-active {
  border-color: #6a3d8a !important;
  box-shadow: 0 0 0 2px rgba(106, 61, 138, 0.25) !important;
}

/* modals */
html.is-mobile-app #modal-login .modal-login-box,
html.is-mobile-app #modal-login .modal-box,
html.is-mobile-app #modal-share-studio .modal-box,
html.is-mobile-app #modal-story-upload .modal-box,
html.is-mobile-app #modal-feed-upload-pick .modal-box,
html.is-mobile-app #modal-pact .modal-box,
html.is-mobile-app #modal-interests .modal-box,
html.is-mobile-app #modal-daily-fal .modal-box,
html.is-mobile-app #modal-meditation .modal-box,
html.is-mobile-app #modal-selfie-verify .modal-box,
html.is-mobile-app #modal-follow-list .modal-box,
html.is-mobile-app #modal-soul-intersect .modal-box,
html.is-mobile-app #modal-guide .modal-box,
html.is-mobile-app #modal-cycle .modal-box,
html.is-mobile-app #modal-coview .modal-box,
html.is-mobile-app #modal-vip-create .modal-box,
html.is-mobile-app #modal-live-start .modal-box,
html.is-mobile-app #modal-create-live .modal-box,
html.kozamia-app-shell #modal-login .modal-login-box,
html.kozamia-app-shell #modal-login .modal-box,
html.kozamia-app-shell #modal-share-studio .modal-box,
html.kozamia-app-shell #modal-story-upload .modal-box,
html.kozamia-app-shell #modal-feed-upload-pick .modal-box,
html.kozamia-app-shell #modal-pact .modal-box,
html.kozamia-app-shell #modal-interests .modal-box,
html.kozamia-app-shell #modal-daily-fal .modal-box,
html.kozamia-app-shell #modal-meditation .modal-box {
  background: #fdf8f5 !important;
  border-radius: 1.25rem 1.25rem 0 0 !important;
  border: 1px solid rgba(106, 61, 138, 0.1) !important;
  box-shadow: 0 16px 40px rgba(45, 25, 60, 0.12) !important;
}

/* Meditation glass player — keep teal/purple gradient (override cream modal shell) */
html.is-mobile-app #modal-meditation .meditation-player-shell,
html.kozamia-app-shell #modal-meditation .meditation-player-shell {
  background: linear-gradient(145deg, rgba(79, 214, 216, 0.95) 0%, rgba(123, 108, 240, 0.96) 48%, rgba(155, 120, 255, 0.98) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 1.15rem !important;
  box-shadow: 0 12px 32px rgba(20, 30, 80, 0.32) !important;
  color: #fff !important;
  padding: 0.55rem 0.65rem 0.6rem !important;
  max-height: min(90dvh, 34rem);
  overflow-y: auto;
}

html.is-mobile-app #modal-daily-fal .fal-mystic-shell,
html.kozamia-app-shell #modal-daily-fal .fal-mystic-shell {
  border-radius: 1.15rem 1.15rem 0 0 !important;
  padding: 0.7rem 0.75rem calc(0.8rem + env(safe-area-inset-bottom, 0px)) !important;
  max-height: min(88dvh, 40rem);
  overflow-y: auto;
}
html.is-mobile-app .auth-tab.active,
html.kozamia-app-shell .auth-tab.active {
  color: #6a3d8a !important;
  border-bottom-color: #6a3d8a !important;
}
html.is-mobile-app .btn-primary,
html.kozamia-app-shell .btn-primary {
  background: linear-gradient(
    145deg,
    var(--fuchsia, #7b4a9e),
    var(--kozamia-shell-purple, #6a3d8a) 55%,
    var(--violet, #55306f)
  ) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.28) !important;
}

/* rewards */
html.is-mobile-app #page-rewards,
html.kozamia-app-shell #page-rewards { background: transparent; }
html.is-mobile-app .reward-card,
html.is-mobile-app #page-rewards .content-card,
html.is-mobile-app #page-rewards .feature-card,
html.kozamia-app-shell .reward-card,
html.kozamia-app-shell #page-rewards .content-card {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1rem !important;
  box-shadow: 0 8px 24px rgba(45, 25, 60, 0.06) !important;
}

/* overlays */
html.is-mobile-app .notif-panel,
html.kozamia-app-shell .notif-panel {
  background: #fdf8f5 !important;
  border-left: 1px solid rgba(106, 61, 138, 0.1) !important;
  box-shadow: -12px 0 32px rgba(45, 25, 60, 0.1) !important;
}
html.is-mobile-app .notif-panel-head,
html.kozamia-app-shell .notif-panel-head {
  background: #fdf8f5 !important;
  border-bottom: 1px solid rgba(106, 61, 138, 0.08) !important;
}
html.is-mobile-app .notif-item.is-unread,
html.kozamia-app-shell .notif-item.is-unread {
  background: rgba(106, 61, 138, 0.06) !important;
}
html.is-mobile-app .notif-item.is-unread strong,
html.kozamia-app-shell .notif-item.is-unread strong { color: #6a3d8a !important; }
html.is-mobile-app #global-search-panel,
html.is-mobile-app .global-search-panel,
html.kozamia-app-shell #global-search-panel,
html.kozamia-app-shell .global-search-panel {
  background: #fdf8f5 !important;
  border-color: rgba(106, 61, 138, 0.1) !important;
}
html.is-mobile-app #kozamia-force-update,
html.is-mobile-app #biometric-overlay,
html.is-mobile-app .frozen-account-overlay,
html.kozamia-app-shell #kozamia-force-update,
html.kozamia-app-shell #biometric-overlay,
html.kozamia-app-shell .frozen-account-overlay {
  background: rgba(45, 25, 60, 0.55) !important;
  backdrop-filter: blur(8px);
}
html.is-mobile-app #kozamia-force-update .modal-box,
html.is-mobile-app #biometric-overlay .modal-box,
html.kozamia-app-shell #kozamia-force-update .modal-box,
html.kozamia-app-shell #biometric-overlay .modal-box {
  background: #fdf8f5 !important;
  border-radius: 1.25rem !important;
  border: 1px solid rgba(106, 61, 138, 0.12) !important;
}
html.is-mobile-app .soft-ad,
html.is-mobile-app .home-soft-ad,
html.kozamia-app-shell .soft-ad,
html.kozamia-app-shell .home-soft-ad {
  border-radius: 0.9rem !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  background: #fff !important;
}

/* admin tabs */
html.is-mobile-app .admin-shell,
html.is-mobile-app .admin-shell-body,
html.is-mobile-app #page-admin,
html.kozamia-app-shell .admin-shell,
html.kozamia-app-shell .admin-shell-body,
html.kozamia-app-shell #page-admin {
  background: #fdf8f5 !important;
}
html.is-mobile-app .admin-kpi,
html.is-mobile-app .admin-alive-panel,
html.is-mobile-app .admin-bot-card,
html.kozamia-app-shell .admin-kpi,
html.kozamia-app-shell .admin-alive-panel,
html.kozamia-app-shell .admin-bot-card {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 0.9rem !important;
  box-shadow: 0 6px 18px rgba(45, 25, 60, 0.05) !important;
}
html.is-mobile-app .admin-nav-btn.is-active,
html.is-mobile-app .admin-nav-btn.active,
html.is-mobile-app .admin-shell .admin-nav-btn.is-active,
html.kozamia-app-shell .admin-nav-btn.is-active,
html.kozamia-app-shell .admin-nav-btn.active {
  color: #6a3d8a !important;
  border-color: #6a3d8a !important;
  background: rgba(106, 61, 138, 0.08) !important;
}
html.is-mobile-app .admin-mobile-nav,
html.is-mobile-app #admin-mobile-nav,
html.kozamia-app-shell .admin-mobile-nav,
html.kozamia-app-shell #admin-mobile-nav {
  border-radius: 0.75rem !important;
  border: 1px solid rgba(106, 61, 138, 0.15) !important;
  background: #fff !important;
  color: #3d2a4a !important;
}
html.is-mobile-app #page-privacy,
html.is-mobile-app #page-terms,
html.kozamia-app-shell #page-privacy,
html.kozamia-app-shell #page-terms { background: #fdf8f5; }
html.is-mobile-app .section-title,
html.kozamia-app-shell .section-title { color: #3d2a4a; }
html.is-mobile-app .icon-btn,
html.kozamia-app-shell .icon-btn { color: #6a3d8a; }

/* end A-Z TAM KABUK / daily-engage-moods shell */

/* ==========================================================================
   Ana Sayfa mockup (homev2) — birebir: brand, welcome, akış, mood, fal, dedikodu, botlar, feed
   ========================================================================== */

html.is-mobile-app:has(#page-home.active.home-logged-in) .site-header,
html.kozamia-app-shell:has(#page-home.active.home-logged-in) .site-header {
  display: none !important;
}

html.is-mobile-app:has(#page-home.active.home-logged-in) #page-home .home-page-wrap,
html.kozamia-app-shell:has(#page-home.active.home-logged-in) #page-home .home-page-wrap {
  padding-top: calc(0.5rem + env(safe-area-inset-top, 0px));
}

html.is-mobile-app #page-home.home-logged-in .page-hero,
html.is-mobile-app #page-home.home-logged-in #home-guest-invite,
html.kozamia-app-shell #page-home.home-logged-in .page-hero,
html.kozamia-app-shell #page-home.home-logged-in #home-guest-invite {
  display: none !important;
}

html.is-mobile-app #page-home .home-page-wrap,
html.kozamia-app-shell #page-home .home-page-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 0.35rem 0 1rem;
}

/* —— Brand + welcome —— */
html.is-mobile-app .home-app-top,
html.kozamia-app-shell .home-app-top {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin: 0;
}
html.is-mobile-app .home-app-brand-row,
html.kozamia-app-shell .home-app-brand-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
html.is-mobile-app .home-app-brand-name,
html.kozamia-app-shell .home-app-brand-name {
  display: block;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  color: #6a3d8a;
}
html.is-mobile-app .home-app-brand-sub,
html.kozamia-app-shell .home-app-brand-sub {
  display: block;
  margin-top: 0.1rem;
  font-family: var(--kozamia-brand-serif);
  font-size: 0.78rem;
  font-style: italic;
  font-weight: 500;
  color: #8b78b0;
}
html.is-mobile-app .home-app-notify-btn,
html.kozamia-app-shell .home-app-notify-btn {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: #f0ece8;
  border: 0;
  color: #3d2a4a;
  box-shadow: none;
  position: relative;
}
html.is-mobile-app .home-app-welcome-inner,
html.kozamia-app-shell .home-app-welcome-inner {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
html.is-mobile-app .home-app-welcome-avatar,
html.kozamia-app-shell .home-app-welcome-avatar {
  flex-shrink: 0;
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  background: linear-gradient(145deg, #f3e8ff, #fff);
  border: 2px solid rgba(106, 61, 138, 0.14);
  overflow: hidden;
  box-shadow: 0 6px 16px rgba(106, 61, 138, 0.12);
}
html.is-mobile-app .home-app-welcome-avatar img,
html.kozamia-app-shell .home-app-welcome-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
html.is-mobile-app .home-app-welcome-text strong,
html.kozamia-app-shell .home-app-welcome-text strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 750;
  color: #4a306d;
  line-height: 1.25;
}
html.is-mobile-app .home-app-welcome-tag,
html.kozamia-app-shell .home-app-welcome-tag {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  color: #9a8aa0;
}

/* —— Günün Akışı card —— */
html.is-mobile-app .home-daily-mock,
html.kozamia-app-shell .home-daily-mock {
  background: var(--bg-elevated, #fff) !important;
  border: 1px solid rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.1) !important;
  border-radius: 1.35rem !important;
  box-shadow: 0 12px 32px rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.1) !important;
  padding: 0 !important;
  overflow: hidden;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-inner,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-inner {
  padding: 1rem 0.95rem 1.05rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-head,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-brand,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-icon,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-icon {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--mood-gradient, linear-gradient(145deg, #6a3d8a, #8b5a9e));
  color: #ffe08a;
  font-size: 1.05rem;
  box-shadow: var(--mood-glow, 0 6px 14px rgba(106, 61, 138, 0.28));
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-label,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-label {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text, #3d2a4a);
}
html.is-mobile-app .home-daily-mock .daily-flow-meditation-label,
html.kozamia-app-shell .home-daily-mock .daily-flow-meditation-label {
  margin: 0.15rem 0 0;
  font-size: 0.72rem !important;
  color: var(--text-muted, #9a8aa0) !important;
}
html.is-mobile-app .home-daily-see-all,
html.kozamia-app-shell .home-daily-see-all,
html.is-mobile-app .active-now-see-all,
html.kozamia-app-shell .active-now-see-all {
  border: 0;
  background: transparent;
  color: var(--icon, var(--kozamia-shell-purple, #6a3d8a));
  font: inherit;
  font-size: 0.72rem;
  font-weight: 650;
  cursor: pointer;
  padding: 0.25rem 0;
  white-space: nowrap;
}

html.is-mobile-app .home-daily-mock .daily-flow-carousel,
html.kozamia-app-shell .home-daily-mock .daily-flow-carousel {
  display: grid;
  grid-template-columns: 2.15rem minmax(0, 1fr) 2.15rem;
  grid-template-areas:
    "prev body next"
    ". dots .";
  align-items: center;
  column-gap: 0.45rem;
  row-gap: 0.55rem;
  margin: 0 0 0.25rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-body,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-body {
  grid-area: body;
  min-width: 0;
}
html.is-mobile-app .home-daily-mock .daily-flow-nav#daily-flow-prev,
html.kozamia-app-shell .home-daily-mock .daily-flow-nav#daily-flow-prev {
  grid-area: prev;
  justify-self: center;
}
html.is-mobile-app .home-daily-mock .daily-flow-nav#daily-flow-next,
html.kozamia-app-shell .home-daily-mock .daily-flow-nav#daily-flow-next {
  grid-area: next;
  justify-self: center;
}
html.is-mobile-app .home-daily-mock .daily-flow-nav,
html.kozamia-app-shell .home-daily-mock .daily-flow-nav {
  width: 2.05rem;
  height: 2.05rem;
  border-radius: 50%;
  border: 0;
  background: #fff;
  color: #6a3d8a;
  box-shadow: 0 2px 10px rgba(45, 25, 60, 0.12);
  display: grid;
  place-items: center;
  cursor: pointer;
  z-index: 1;
  padding: 0;
  flex-shrink: 0;
  position: static;
}
html.is-mobile-app .home-daily-mock .daily-flow-nav .material-symbols-outlined,
html.kozamia-app-shell .home-daily-mock .daily-flow-nav .material-symbols-outlined {
  font-size: 1.2rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-spotlight-body,
html.kozamia-app-shell .home-daily-mock .daily-flow-spotlight-body {
  position: relative;
  padding: 1.25rem 0.95rem 1.1rem;
  border-radius: 1.15rem;
  background:
    radial-gradient(circle at 12% 20%, rgba(255,255,255,0.55) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 28%, rgba(255,255,255,0.45) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 70% 78%, rgba(255,255,255,0.4) 0 1.5px, transparent 2.5px),
    linear-gradient(155deg,
      color-mix(in srgb, var(--kozamia-shell-purple, #6a3d8a) 22%, var(--bg-elevated, #fff)) 0%,
      color-mix(in srgb, var(--fuchsia, #d946ef) 12%, var(--bg-elevated, #fff)) 42%,
      color-mix(in srgb, var(--cyan, #06b6d4) 8%, var(--bg-elevated, #fff)) 100%);
  border: 1px solid rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.1);
  min-height: 7.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55);
  overflow: hidden;
}
html.is-mobile-app .daily-flow-quote-mark,
html.kozamia-app-shell .daily-flow-quote-mark {
  position: absolute;
  top: 0.35rem;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--kozamia-brand-serif);
  font-size: 2.4rem;
  line-height: 1;
  color: rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.35);
  pointer-events: none;
}
html.is-mobile-app .home-daily-mock .daily-affirmation,
html.kozamia-app-shell .home-daily-mock .daily-affirmation {
  margin: 0.55rem 0 0;
  padding: 0;
  border: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 0.95rem;
  font-weight: 650;
  line-height: 1.45;
  color: var(--text, #3d2a4a);
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
html.is-mobile-app .daily-flow-sparkle,
html.kozamia-app-shell .daily-flow-sparkle {
  margin-top: 0.55rem;
  color: #e8b84a;
  font-size: 0.85rem;
}
html.is-mobile-app .home-daily-mock .daily-intention,
html.kozamia-app-shell .home-daily-mock .daily-intention {
  display: none !important;
}
html.is-mobile-app .home-daily-mock .daily-flow-dots,
html.kozamia-app-shell .home-daily-mock .daily-flow-dots {
  grid-area: dots;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 0.28rem;
  margin: 0.1rem 0 0.2rem;
  min-height: 1rem;
  padding: 0.2rem 0 0.15rem;
}
html.is-mobile-app .home-daily-mock .daily-flow-dot,
html.kozamia-app-shell .home-daily-mock .daily-flow-dot {
  width: 0.28rem;
  height: 0.55rem;
  border-radius: 999px;
  border: 0;
  padding: 0;
  background: rgba(106, 61, 138, 0.22);
  cursor: pointer;
  transition: height 0.15s ease, background 0.15s ease;
}
html.is-mobile-app .home-daily-mock .daily-flow-dot.is-active,
html.kozamia-app-shell .home-daily-mock .daily-flow-dot.is-active {
  background: #6a3d8a;
  height: 0.9rem;
  transform: none;
}
html.is-mobile-app .home-daily-mock .daily-flow-actions,
html.kozamia-app-shell .home-daily-mock .daily-flow-actions,
html.is-mobile-app .home-daily-mock .daily-engage-ctas,
html.kozamia-app-shell .home-daily-mock .daily-engage-ctas,
html.is-mobile-app .home-daily-mock .daily-engage-streak,
html.kozamia-app-shell .home-daily-mock .daily-engage-streak {
  display: none !important;
}

/* —— Mood / Ritual —— */
html.is-mobile-app .home-mood-block,
html.kozamia-app-shell .home-mood-block {
  margin-top: 0.15rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(106, 61, 138, 0.08);
}
html.is-mobile-app .home-mood-head,
html.kozamia-app-shell .home-mood-head {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.55rem;
}
html.is-mobile-app .home-daily-ritual-btn,
html.kozamia-app-shell .home-daily-ritual-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(106, 61, 138, 0.28);
  background: rgba(139, 120, 176, 0.12);
  color: #6a3d8a;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 650;
  cursor: pointer;
}
html.is-mobile-app .home-daily-ritual-btn .material-symbols-outlined,
html.kozamia-app-shell .home-daily-ritual-btn .material-symbols-outlined {
  font-size: 0.95rem;
}
html.is-mobile-app .home-daily-progress,
html.kozamia-app-shell .home-daily-progress {
  display: flex;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
}
html.is-mobile-app .home-daily-progress-seg,
html.kozamia-app-shell .home-daily-progress-seg {
  flex: 1;
  height: 3px;
  border-radius: 999px;
  background: rgba(106, 61, 138, 0.12);
}
html.is-mobile-app .home-daily-progress-seg.is-active,
html.kozamia-app-shell .home-daily-progress-seg.is-active {
  background: #6a3d8a;
}
html.is-mobile-app .home-daily-mock .daily-engage,
html.kozamia-app-shell .home-daily-mock .daily-engage {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
html.is-mobile-app .daily-engage-ask,
html.kozamia-app-shell .daily-engage-ask {
  margin: 0 0 0.25rem;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.25;
  color: #3d2a4a;
}
html.is-mobile-app .daily-engage-sub,
html.kozamia-app-shell .daily-engage-sub {
  margin: 0 0 0.75rem;
  font-size: 0.78rem;
  color: #9a8aa0;
}
html.is-mobile-app .daily-engage-moods,
html.kozamia-app-shell .daily-engage-moods {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0.1rem 0 0.35rem;
  margin-bottom: 0.85rem;
}
html.is-mobile-app .daily-engage-moods::-webkit-scrollbar,
html.kozamia-app-shell .daily-engage-moods::-webkit-scrollbar { display: none; }
html.is-mobile-app .daily-engage-mood,
html.kozamia-app-shell .daily-engage-mood {
  flex: 0 0 auto;
  min-width: 4.35rem;
  min-height: 6.1rem;
  padding: 0.75rem 0.4rem 0.55rem;
  border-radius: 1.45rem;
  border: 0;
  box-shadow: 0 8px 18px rgba(45, 25, 60, 0.05);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  cursor: pointer;
  font: inherit;
}
html.is-mobile-app .daily-engage-mood[data-engage-mood="mutlu"],
html.kozamia-app-shell .daily-engage-mood[data-engage-mood="mutlu"] { background: #fef9e7; color: #c9a227; }
html.is-mobile-app .daily-engage-mood[data-engage-mood="huzurlu"],
html.kozamia-app-shell .daily-engage-mood[data-engage-mood="huzurlu"] { background: #eaf4eb; color: #5a9a6a; }
html.is-mobile-app .daily-engage-mood[data-engage-mood="enerjik"],
html.kozamia-app-shell .daily-engage-mood[data-engage-mood="enerjik"] { background: #f0ebf8; color: #6a3d8a; }
html.is-mobile-app .daily-engage-mood[data-engage-mood="yorgun"],
html.kozamia-app-shell .daily-engage-mood[data-engage-mood="yorgun"] { background: #ebf2f8; color: #5a7fa8; }
html.is-mobile-app .daily-engage-mood[data-engage-mood="karmasik"],
html.kozamia-app-shell .daily-engage-mood[data-engage-mood="karmasik"] { background: #f9ebf2; color: #c06a96; }
html.is-mobile-app .daily-engage-mood.is-active,
html.kozamia-app-shell .daily-engage-mood.is-active {
  box-shadow: 0 0 0 2px #6a3d8a, 0 10px 22px rgba(106, 61, 138, 0.18);
}
html.is-mobile-app .daily-engage-mood-emoji,
html.kozamia-app-shell .daily-engage-mood-emoji { font-size: 1.55rem; line-height: 1; }
html.is-mobile-app .daily-engage-mood-label,
html.kozamia-app-shell .daily-engage-mood-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: #5a4a62;
}

html.is-mobile-app .home-affirmation-card,
html.kozamia-app-shell .home-affirmation-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.75rem;
  align-items: start;
  padding: 0.95rem;
  border-radius: 1.25rem;
  background: #fff;
  border: 1px solid rgba(106, 61, 138, 0.07);
  box-shadow: 0 10px 26px rgba(45, 25, 60, 0.06);
}
html.is-mobile-app .home-affirmation-art,
html.kozamia-app-shell .home-affirmation-art {
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  background: radial-gradient(circle at 40% 35%, #f5eefc, #e4d4f4);
  box-shadow: 0 0 0 4px rgba(139, 120, 176, 0.12);
}
html.is-mobile-app .daily-affirmation-kicker,
html.kozamia-app-shell .daily-affirmation-kicker {
  margin: 0 0 0.4rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: #6a3d8a;
}
html.is-mobile-app .home-affirmation-quote,
html.kozamia-app-shell .home-affirmation-quote {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.45;
  color: #3d2a4a;
}
html.is-mobile-app .home-affirmation-heart,
html.kozamia-app-shell .home-affirmation-heart {
  border: 0;
  background: transparent;
  color: #c4b0d4;
  padding: 0;
  cursor: pointer;
}
html.is-mobile-app .home-affirmation-heart .material-symbols-outlined,
html.kozamia-app-shell .home-affirmation-heart .material-symbols-outlined {
  font-size: 1.25rem;
  font-variation-settings: "FILL" 0;
}

/* —— Fal + Meditasyon —— */
html.is-mobile-app .home-shortcuts,
html.kozamia-app-shell .home-shortcuts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  width: 100%;
  box-sizing: border-box;
}
html.is-mobile-app .home-shortcut,
html.kozamia-app-shell .home-shortcut {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  min-height: 5.9rem;
  padding: 0.9rem 0.85rem;
  border-radius: 1.2rem;
  border: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(45, 25, 60, 0.14);
  box-sizing: border-box;
}
html.is-mobile-app .home-shortcut-fal,
html.kozamia-app-shell .home-shortcut-fal {
  background: var(--mood-gradient, linear-gradient(160deg, #3d2460 0%, #6a3d8a 72%, #7a4a96 100%));
  color: var(--on-accent, #fff);
}
html.is-mobile-app .home-shortcut-meditation,
html.kozamia-app-shell .home-shortcut-meditation {
  background: linear-gradient(
    160deg,
    color-mix(in srgb, var(--fuchsia, #d4c4ef) 22%, var(--bg-elevated, #fff)) 0%,
    color-mix(in srgb, var(--mood-soft, #ebe2f7) 50%, var(--bg-elevated, #fff)) 55%,
    var(--bg-elevated, #f6f1fb) 100%
  );
  color: var(--text, #3d2a4a);
}
html.is-mobile-app .home-shortcut-visual,
html.kozamia-app-shell .home-shortcut-visual {
  font-size: 2rem;
  line-height: 1;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,0.12));
}
html.is-mobile-app .home-shortcut-copy,
html.kozamia-app-shell .home-shortcut-copy {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  max-width: 90%;
}
html.is-mobile-app .home-shortcut strong,
html.kozamia-app-shell .home-shortcut strong {
  font-size: 1rem;
  font-weight: 750;
}
html.is-mobile-app .home-shortcut-desc,
html.kozamia-app-shell .home-shortcut-desc {
  font-size: 0.68rem;
  line-height: 1.35;
  opacity: 0.92;
}
html.is-mobile-app .home-shortcut-go,
html.kozamia-app-shell .home-shortcut-go {
  position: absolute;
  right: 0.6rem;
  bottom: 0.6rem;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1rem;
  background: rgba(255, 255, 255, 0.22);
}
html.is-mobile-app .home-shortcut-meditation .home-shortcut-go,
html.kozamia-app-shell .home-shortcut-meditation .home-shortcut-go {
  background: rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.14);
  color: var(--icon, var(--kozamia-shell-purple, #6a3d8a));
}

/* —— Dedikodu —— */
html.is-mobile-app .home-gossip-spotlight,
html.kozamia-app-shell .home-gossip-spotlight { margin: 0; }
html.is-mobile-app .home-gossip-card,
html.kozamia-app-shell .home-gossip-card {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
  padding: 0.9rem 0.95rem;
  border-radius: 1.2rem;
  border: 1px solid rgba(196, 140, 160, 0.18);
  background: linear-gradient(100deg, #fff4ea 0%, #fff9f2 55%, #fff 100%);
  box-shadow: 0 10px 24px rgba(45, 25, 60, 0.05);
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
html.is-mobile-app .home-gossip-art,
html.kozamia-app-shell .home-gossip-art {
  position: relative;
  flex-shrink: 0;
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 0.95rem;
  display: grid;
  place-items: center;
  background: rgba(106, 61, 138, 0.08);
}
html.is-mobile-app .home-gossip-cup,
html.kozamia-app-shell .home-gossip-cup { font-size: 1.55rem; }
html.is-mobile-app .home-gossip-float,
html.kozamia-app-shell .home-gossip-float {
  position: absolute;
  font-size: 0.7rem;
  line-height: 1;
}
html.is-mobile-app .home-gossip-float-1,
html.kozamia-app-shell .home-gossip-float-1 { top: -0.15rem; right: -0.2rem; }
html.is-mobile-app .home-gossip-float-2,
html.kozamia-app-shell .home-gossip-float-2 { bottom: -0.1rem; left: -0.15rem; }
html.is-mobile-app .home-gossip-copy,
html.kozamia-app-shell .home-gossip-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}
html.is-mobile-app .home-gossip-kicker,
html.kozamia-app-shell .home-gossip-kicker {
  font-size: 0.78rem;
  font-weight: 750;
  color: #4a306d;
}
html.is-mobile-app .home-gossip-title,
html.kozamia-app-shell .home-gossip-title {
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.35;
  color: #5a4a62;
}
html.is-mobile-app .home-gossip-meta,
html.kozamia-app-shell .home-gossip-meta {
  font-size: 0.68rem;
  color: #9a8aa0;
}
html.is-mobile-app .home-gossip-cta,
html.kozamia-app-shell .home-gossip-cta {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.1rem;
  color: #6a3d8a;
}
html.is-mobile-app .home-gossip-emoji,
html.kozamia-app-shell .home-gossip-emoji { font-size: 1.2rem; }

/* —— Aktif Botlar —— */
html.is-mobile-app #active-bots-panel,
html.kozamia-app-shell #active-bots-panel {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0.05rem 0 0;
  margin: 0;
}
html.is-mobile-app .active-now-head,
html.kozamia-app-shell .active-now-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}
html.is-mobile-app .active-now-head-text,
html.kozamia-app-shell .active-now-head-text {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  flex-wrap: wrap;
}
html.is-mobile-app .active-now-title,
html.kozamia-app-shell .active-now-title {
  font-size: 0.82rem;
  font-weight: 750;
  color: #3d2a4a;
}
html.is-mobile-app .active-now-sub,
html.kozamia-app-shell .active-now-sub {
  font-size: 0.62rem;
  color: #7a9a7a;
}
html.is-mobile-app .active-now-head .live-dot,
html.kozamia-app-shell .active-now-head .live-dot {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: #3ecf6a;
  box-shadow: 0 0 0 2px rgba(62, 207, 106, 0.2);
}
html.is-mobile-app .active-now-strip,
html.kozamia-app-shell .active-now-strip {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  padding: 0.1rem 0 0.2rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
html.is-mobile-app .active-now-strip::-webkit-scrollbar,
html.kozamia-app-shell .active-now-strip::-webkit-scrollbar { display: none; }
html.is-mobile-app .active-now-chip,
html.kozamia-app-shell .active-now-chip {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
  min-width: 3.1rem;
}
html.is-mobile-app .active-now-avatar,
html.kozamia-app-shell .active-now-avatar {
  position: relative;
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #ede4f4, #fff);
  box-shadow: 0 3px 10px rgba(106, 61, 138, 0.1);
  overflow: visible;
  font-size: 0.95rem;
}
html.is-mobile-app .active-now-avatar-img,
html.kozamia-app-shell .active-now-avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}
html.is-mobile-app .active-now-dot,
html.kozamia-app-shell .active-now-dot {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #3ecf6a;
  border: 1.5px solid #fdf8f5;
}
html.is-mobile-app .active-now-name,
html.kozamia-app-shell .active-now-name {
  font-size: 0.58rem;
  font-weight: 650;
  color: #5a4a62;
  text-align: center;
  max-width: 3.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.is-mobile-app .active-now-see-all,
html.kozamia-app-shell .active-now-see-all {
  font-size: 0.68rem !important;
  padding: 0.15rem 0 !important;
}

/* —— Feed hero + posts —— */
html.is-mobile-app .home-feed-hero,
html.kozamia-app-shell .home-feed-hero {
  display: block;
  padding: 0.35rem 0 0.15rem;
}
html.is-mobile-app .home-feed-hero-title,
html.kozamia-app-shell .home-feed-hero-title {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--mood-heading, var(--kozamia-shell-purple, #6a3d8a));
}
html.is-mobile-app .home-feed-hero-sub,
html.kozamia-app-shell .home-feed-hero-sub {
  margin: 0.4rem 0 0.75rem;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--text-muted, #9a8aa0);
  max-width: 22rem;
}
html.is-mobile-app .home-feed-hero-btn,
html.kozamia-app-shell .home-feed-hero-btn {
  border-radius: 0.85rem;
  padding: 0.6rem 1.05rem;
  font-size: 0.8rem;
  font-weight: 650;
  background: var(--mood-gradient, var(--kozamia-shell-purple, #6a3d8a));
  color: var(--on-accent, #fff);
  box-shadow: var(--mood-glow, 0 10px 22px rgba(106, 61, 138, 0.28));
}
html.is-mobile-app .home-feed-hero-art,
html.kozamia-app-shell .home-feed-hero-art,
html.is-mobile-app .home-feed-quill,
html.kozamia-app-shell .home-feed-quill,
html.is-mobile-app .home-feed-birds,
html.kozamia-app-shell .home-feed-birds {
  display: none !important;
}
html.is-mobile-app #home-social-feed-section .home-feed-head,
html.kozamia-app-shell #home-social-feed-section .home-feed-head {
  display: none;
}
html.is-mobile-app #home-social-feed,
html.kozamia-app-shell #home-social-feed {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
html.is-mobile-app #home-social-feed .home-feed-card,
html.is-mobile-app #home-social-feed .social-feed-post,
html.kozamia-app-shell #home-social-feed .home-feed-card,
html.kozamia-app-shell #home-social-feed .social-feed-post {
  border-radius: 1.2rem !important;
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.06) !important;
  box-shadow: 0 10px 26px rgba(45, 25, 60, 0.06) !important;
  margin: 0 !important;
  overflow: hidden;
}
html.is-mobile-app #home-social-feed .home-feed-card-head,
html.is-mobile-app #home-social-feed .social-feed-post-head,
html.kozamia-app-shell #home-social-feed .home-feed-card-head,
html.kozamia-app-shell #home-social-feed .social-feed-post-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  padding: 0.55rem 0.7rem 0.25rem;
  gap: 0.5rem;
}
html.is-mobile-app #home-social-feed .home-feed-card-text,
html.is-mobile-app #home-social-feed .home-feed-media-inner.is-text p,
html.kozamia-app-shell #home-social-feed .home-feed-card-text,
html.kozamia-app-shell #home-social-feed .home-feed-media-inner.is-text p {
  padding: 0 0.7rem;
  font-size: 0.86rem;
  line-height: 1.45;
  color: #3d2a4a;
}
html.is-mobile-app #home-social-feed .social-feed-post-actions,
html.kozamia-app-shell #home-social-feed .social-feed-post-actions {
  padding: 0.35rem 0.7rem 0.65rem;
  color: #6a3d8a;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

html.is-mobile-app .home-affirmation-heart.is-liked,
html.kozamia-app-shell .home-affirmation-heart.is-liked {
  color: #6a3d8a;
}
html.is-mobile-app .home-affirmation-heart.is-liked .material-symbols-outlined,
html.kozamia-app-shell .home-affirmation-heart.is-liked .material-symbols-outlined {
  font-variation-settings: "FILL" 1;
}

/* end Ana Sayfa mockup homev2 */


/* ==========================================================================
   Keşfet mockup (discoverv1) — hub kartları, rehber grid, sağlık, moda
   ========================================================================== */

html.is-mobile-app:has(#page-discover.active.discover-logged-in) .site-header,
html.kozamia-app-shell:has(#page-discover.active.discover-logged-in) .site-header {
  display: none !important;
}

html.is-mobile-app #page-discover.discover-logged-in .discover-hub-header-web,
html.kozamia-app-shell #page-discover.discover-logged-in .discover-hub-header-web {
  display: none !important;
}

html.is-mobile-app #page-discover.discover-logged-in .discover-app-top,
html.kozamia-app-shell #page-discover.discover-logged-in .discover-app-top {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  padding: calc(0.35rem + env(safe-area-inset-top, 0px)) 0 0.35rem;
}

html.is-mobile-app .discover-app-brand-row,
html.kozamia-app-shell .discover-app-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
html.is-mobile-app .discover-back-x,
html.kozamia-app-shell .discover-back-x,
html.discover-mockup-on .discover-back-x {
  width: 2.15rem;
  height: 2.15rem;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  color: #6a3d8a;
  display: grid;
  place-items: center;
  padding: 0;
  cursor: pointer;
  flex-shrink: 0;
}
html.is-mobile-app .discover-back-x[hidden],
html.kozamia-app-shell .discover-back-x[hidden],
html.discover-mockup-on .discover-back-x[hidden] {
  display: none !important;
}
html.is-mobile-app .discover-back-x .material-symbols-outlined,
html.kozamia-app-shell .discover-back-x .material-symbols-outlined,
html.discover-mockup-on .discover-back-x .material-symbols-outlined {
  font-size: 1.2rem;
}
html.is-mobile-app #page-discover.discover-in-section .discover-app-brand-name,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-brand-name,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-brand-name,
html.is-mobile-app #page-discover.discover-in-section .discover-app-section-name,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-section-name,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-section-name {
  flex: 0 1 auto;
  text-align: center;
  font-family: var(--kozamia-brand-serif, Georgia, "Times New Roman", serif);
  font-size: 1.45rem !important;
  font-weight: 800;
  color: var(--text, #121212);
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.15;
}
html.is-mobile-app #page-discover.discover-in-section .discover-app-brand-row,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-brand-row,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-brand-row {
  justify-content: stretch;
  align-items: center;
  gap: 0.25rem;
}
html.is-mobile-app #page-discover .discover-tabs-sticky.is-explore-hidden,
html.kozamia-app-shell #page-discover .discover-tabs-sticky.is-explore-hidden,
html.discover-mockup-on #page-discover .discover-tabs-sticky.is-explore-hidden {
  display: none !important;
}
html.is-mobile-app .discover-app-brand-name,
html.kozamia-app-shell .discover-app-brand-name {
  font-family: var(--kozamia-brand-serif);
  font-size: 1.35rem;
  font-weight: 700;
  color: #6a3d8a;
  letter-spacing: -0.02em;
}
html.is-mobile-app .discover-app-title,
html.kozamia-app-shell .discover-app-title {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.85rem;
  font-weight: 700;
  color: #3d2a4a;
  line-height: 1.15;
}
html.is-mobile-app .discover-app-sub,
html.kozamia-app-shell .discover-app-sub {
  margin: 0.25rem 0 0;
  font-size: 0.82rem;
  color: #9a8aa0;
  line-height: 1.4;
}

/* tabs — underline style */
html.is-mobile-app #page-discover .discover-tabs-sticky,
html.kozamia-app-shell #page-discover .discover-tabs-sticky {
  margin: 0.35rem 0 0.75rem;
  background: transparent;
  border: 0;
  box-shadow: none;
  position: sticky;
  top: 0;
  z-index: 5;
  padding: 0.15rem 0 0;
}
html.is-mobile-app #page-discover .discover-tabs-sticky.is-explore-hidden,
html.kozamia-app-shell #page-discover .discover-tabs-sticky.is-explore-hidden {
  display: none !important;
}
html.is-mobile-app #page-discover .discover-tabs,
html.kozamia-app-shell #page-discover .discover-tabs {
  display: flex;
  gap: 0.15rem;
  overflow-x: auto;
  border-bottom: 1px solid rgba(106, 61, 138, 0.1);
  scrollbar-width: none;
  padding: 0;
}
html.is-mobile-app #page-discover .discover-tabs::-webkit-scrollbar,
html.kozamia-app-shell #page-discover .discover-tabs::-webkit-scrollbar { display: none; }
html.is-mobile-app #page-discover .discover-tab,
html.kozamia-app-shell #page-discover .discover-tab {
  flex: 0 0 auto;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0.55rem 0.7rem !important;
  color: #9a8aa0 !important;
  font-weight: 650;
  font-size: 0.82rem;
  border-bottom: 2px solid transparent !important;
}
html.is-mobile-app #page-discover .discover-tab .material-symbols-outlined,
html.kozamia-app-shell #page-discover .discover-tab .material-symbols-outlined {
  display: none;
}
html.is-mobile-app #page-discover .discover-tab.active,
html.kozamia-app-shell #page-discover .discover-tab.active {
  color: #6a3d8a !important;
  border-bottom-color: #6a3d8a !important;
  background: transparent !important;
}
html.is-mobile-app #page-discover .hub-tabs-chrome,
html.kozamia-app-shell #page-discover .hub-tabs-chrome {
  display: none;
}
html.is-mobile-app #page-discover .hub-panel-intro,
html.kozamia-app-shell #page-discover .hub-panel-intro {
  display: none;
}

/* 2x2 category landing */
html.is-mobile-app .discover-cat-grid,
html.kozamia-app-shell .discover-cat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  padding: 0.25rem 0 1rem;
}
html.is-mobile-app .discover-cat-card,
html.kozamia-app-shell .discover-cat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.45rem;
  min-height: 9.5rem;
  padding: 1.15rem 0.75rem 1.35rem;
  border: 0;
  border-radius: 1.25rem;
  background: #fff;
  box-shadow: 0 10px 26px rgba(45, 25, 60, 0.06);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
html.is-mobile-app .discover-cat-icon,
html.kozamia-app-shell .discover-cat-icon {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 0.5rem;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--icon, var(--kozamia-shell-purple, #6a3d8a)) 88%, #1a1420);
  color: #fff;
  margin-bottom: 0.15rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
html.is-mobile-app .discover-cat-icon .material-symbols-outlined,
html.kozamia-app-shell .discover-cat-icon .material-symbols-outlined {
  font-size: 1.1rem;
  color: #fff;
  font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 20;
}
html.is-mobile-app .discover-cat-card strong,
html.kozamia-app-shell .discover-cat-card strong {
  font-family: var(--kozamia-brand-serif);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text, #121212);
}
html.is-mobile-app .discover-cat-desc,
html.kozamia-app-shell .discover-cat-desc {
  font-size: 0.72rem;
  line-height: 1.35;
  color: #1f1f1f;
  max-width: 9.5rem;
}
html.is-mobile-app .discover-cat-go,
html.kozamia-app-shell .discover-cat-go {
  position: absolute;
  right: 0.55rem;
  bottom: 0.45rem;
  font-size: 1.1rem;
  color: var(--icon, var(--kozamia-shell-purple, #6a3d8a));
}

/* article grid (Rehber style) */
html.is-mobile-app .discover-article-grid,
html.kozamia-app-shell .discover-article-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0.75rem !important;
}
html.is-mobile-app .discover-article-card,
html.kozamia-app-shell .discover-article-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  text-align: left !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 1.1rem !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(45, 25, 60, 0.05) !important;
  overflow: hidden;
  min-height: 0;
  cursor: pointer;
}
html.is-mobile-app .discover-article-thumb,
html.kozamia-app-shell .discover-article-thumb {
  position: relative;
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #ebe0f5, #f7f1fb);
  color: #6a3d8a;
  overflow: hidden;
}
html.is-mobile-app .discover-article-thumb img,
html.kozamia-app-shell .discover-article-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
html.is-mobile-app .discover-article-thumb .material-symbols-outlined,
html.kozamia-app-shell .discover-article-thumb .material-symbols-outlined {
  font-size: 2rem;
  opacity: 0.75;
}
html.is-mobile-app .discover-article-thumb .content-tag,
html.kozamia-app-shell .discover-article-thumb .content-tag {
  position: absolute;
  left: 0.45rem;
  bottom: 0.45rem;
  margin: 0;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  background: rgba(237, 228, 244, 0.95);
  color: #6a3d8a;
  font-size: 0.58rem;
  font-weight: 750;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
html.is-mobile-app .discover-article-body,
html.kozamia-app-shell .discover-article-body {
  padding: 0.65rem 0.7rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  flex: 1;
}
html.is-mobile-app .discover-article-body h3,
html.kozamia-app-shell .discover-article-body h3 {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.3;
  color: #4a306d;
}
html.is-mobile-app .discover-article-body p,
html.kozamia-app-shell .discover-article-body p {
  margin: 0;
  font-size: 0.7rem;
  line-height: 1.4;
  color: #9a8aa0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html.is-mobile-app .discover-article-meta,
html.kozamia-app-shell .discover-article-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 0.35rem;
  font-size: 0.65rem;
  color: #9a8aa0;
}
html.is-mobile-app .discover-article-save,
html.kozamia-app-shell .discover-article-save {
  font-size: 1rem;
  color: #6a3d8a;
  font-variation-settings: "FILL" 0;
}
html.is-mobile-app .discover-article-save-btn,
html.kozamia-app-shell .discover-article-save-btn {
  border: 0;
  background: transparent;
  padding: 0.15rem;
  margin: 0;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  color: #6a3d8a;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  z-index: 2;
}
html.is-mobile-app .discover-article-save-btn.is-saved .discover-article-save,
html.kozamia-app-shell .discover-article-save-btn.is-saved .discover-article-save,
html.is-mobile-app .discover-modal-save-btn.is-saved .material-symbols-outlined,
html.kozamia-app-shell .discover-modal-save-btn.is-saved .material-symbols-outlined {
  font-variation-settings: "FILL" 1;
  color: #6a3d8a;
}
.discover-modal-header-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}
.discover-modal-save-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  white-space: nowrap;
}
.discover-modal-save-btn .material-symbols-outlined {
  font-size: 1.05rem;
}
.profile-saved-discover {
  margin-top: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.profile-saved-discover-title {
  margin: 0.25rem 0 0.15rem;
  font-size: 0.85rem;
  color: #6a3d8a;
}
.profile-saved-discover-card {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.65rem;
  border-radius: 0.75rem;
  background: #fff;
  border: 1px solid rgba(106, 61, 138, 0.1);
}
.profile-saved-discover-open {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  border: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  padding: 0;
}
.profile-saved-discover-open strong {
  display: block;
  font-size: 0.85rem;
}
.profile-saved-discover-open .material-symbols-outlined {
  color: #6a3d8a;
}
html.is-mobile-app #page-discover .category-pills,
html.kozamia-app-shell #page-discover .category-pills {
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.15rem 0 0.65rem;
  scrollbar-width: none;
}
html.is-mobile-app #page-discover .category-pills .pill,
html.kozamia-app-shell #page-discover .category-pills .pill {
  flex: 0 0 auto;
  border-radius: 999px;
  border: 1px solid rgba(106, 61, 138, 0.18);
  background: #fff;
  color: #8a7a90;
  padding: 0.4rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 650;
}
html.is-mobile-app #page-discover .category-pills .pill.active,
html.kozamia-app-shell #page-discover .category-pills .pill.active {
  background: #6a3d8a;
  border-color: #6a3d8a;
  color: #fff;
}
html.is-mobile-app #page-discover .page-info-box,
html.kozamia-app-shell #page-discover .page-info-box {
  display: none;
}

/* Sağlık: calendar + recs + mood */
html.is-mobile-app .cycle-smart-calendar,
html.kozamia-app-shell .cycle-smart-calendar {
  background: #fff !important;
  border: 1px solid rgba(106, 61, 138, 0.08) !important;
  border-radius: 1.25rem !important;
  box-shadow: 0 10px 26px rgba(45, 25, 60, 0.05) !important;
  padding: 1rem !important;
  margin-bottom: 0.85rem;
}
html.is-mobile-app .cycle-cal-head,
html.kozamia-app-shell .cycle-cal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
html.is-mobile-app .cycle-cal-head h2,
html.kozamia-app-shell .cycle-cal-head h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 750;
  color: #3d2a4a;
}
html.is-mobile-app .cycle-cal-settings,
html.kozamia-app-shell .cycle-cal-settings {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border: 0;
  background: transparent;
  color: #6a3d8a;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 650;
  cursor: pointer;
  white-space: nowrap;
}
html.is-mobile-app .cycle-cal-settings .material-symbols-outlined,
html.kozamia-app-shell .cycle-cal-settings .material-symbols-outlined {
  font-size: 1rem;
}

html.is-mobile-app .discover-recs,
html.kozamia-app-shell .discover-recs {
  margin: 0 0 0.85rem;
}
html.is-mobile-app .discover-recs-head,
html.kozamia-app-shell .discover-recs-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.55rem;
}
html.is-mobile-app .discover-recs-head strong,
html.kozamia-app-shell .discover-recs-head strong {
  font-size: 0.92rem;
  color: #3d2a4a;
}
html.is-mobile-app .discover-recs-strip,
html.kozamia-app-shell .discover-recs-strip {
  display: flex;
  gap: 0.65rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  scrollbar-width: none;
}
html.is-mobile-app .discover-recs-strip::-webkit-scrollbar,
html.kozamia-app-shell .discover-recs-strip::-webkit-scrollbar { display: none; }
html.is-mobile-app .discover-rec-card,
html.kozamia-app-shell .discover-rec-card {
  position: relative;
  flex: 0 0 11.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.3rem;
  min-height: 7.5rem;
  padding: 0.85rem 0.75rem;
  border: 0;
  border-radius: 1.1rem;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: #3d2a4a;
}
html.is-mobile-app .discover-rec-lavender,
html.kozamia-app-shell .discover-rec-lavender { background: #f2eefb; }
html.is-mobile-app .discover-rec-peach,
html.kozamia-app-shell .discover-rec-peach { background: #fff5eb; }
html.is-mobile-app .discover-rec-mint,
html.kozamia-app-shell .discover-rec-mint { background: #f0f7f1; }
html.is-mobile-app .discover-rec-icon,
html.kozamia-app-shell .discover-rec-icon { font-size: 1.25rem; }
html.is-mobile-app .discover-rec-card strong,
html.kozamia-app-shell .discover-rec-card strong {
  font-size: 0.82rem;
  font-weight: 750;
}
html.is-mobile-app .discover-rec-card span:not(.discover-rec-icon):not(.material-symbols-outlined),
html.kozamia-app-shell .discover-rec-card span:not(.discover-rec-icon):not(.material-symbols-outlined) {
  font-size: 0.68rem;
  line-height: 1.35;
  color: #7a6a82;
}
html.is-mobile-app .discover-rec-go,
html.kozamia-app-shell .discover-rec-go {
  position: absolute;
  right: 0.55rem;
  bottom: 0.55rem;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #6a3d8a;
  color: #fff;
  font-size: 0.95rem;
}

html.is-mobile-app .discover-mood-banner,
html.kozamia-app-shell .discover-mood-banner {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.85rem 0.9rem;
  margin: 0 0 0.85rem;
  border-radius: 1.1rem;
  border: 1px solid rgba(106, 61, 138, 0.1);
  background: #fff9f2;
}
html.is-mobile-app .discover-mood-banner-icon,
html.kozamia-app-shell .discover-mood-banner-icon {
  flex-shrink: 0;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(106, 61, 138, 0.1);
  color: #6a3d8a;
}
html.is-mobile-app .discover-mood-banner p,
html.kozamia-app-shell .discover-mood-banner p {
  margin: 0;
  flex: 1;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #5a4a62;
}
html.is-mobile-app .discover-mood-banner .btn,
html.kozamia-app-shell .discover-mood-banner .btn {
  flex-shrink: 0;
  border-radius: 999px;
  font-size: 0.68rem;
  padding: 0.45rem 0.7rem;
  white-space: nowrap;
}

/* Moda feature cards */
html.is-mobile-app .discover-feature-stack,
html.kozamia-app-shell .discover-feature-stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
html.is-mobile-app .discover-feature-card,
html.kozamia-app-shell .discover-feature-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem;
  border-radius: 1.25rem;
  overflow: hidden;
}
html.is-mobile-app .discover-feature-style,
html.kozamia-app-shell .discover-feature-style {
  background: color-mix(in srgb, var(--mood-soft, rgba(106, 61, 138, 0.14)) 70%, #f7f1ea);
}
html.is-mobile-app .discover-feature-inspire,
html.kozamia-app-shell .discover-feature-inspire {
  background: color-mix(in srgb, var(--mood-soft, rgba(106, 61, 138, 0.12)) 55%, #eef3ea);
}
html.is-mobile-app .discover-feature-pair,
html.kozamia-app-shell .discover-feature-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}
html.is-mobile-app .discover-feature-pair .discover-feature-card,
html.kozamia-app-shell .discover-feature-pair .discover-feature-card {
  flex-direction: column;
  align-items: flex-start;
  min-height: 11rem;
}
html.is-mobile-app .discover-feature-skin,
html.kozamia-app-shell .discover-feature-skin {
  background: color-mix(in srgb, var(--mood-soft, rgba(106, 61, 138, 0.16)) 75%, #ebe6f0);
}
html.is-mobile-app .discover-feature-mom,
html.kozamia-app-shell .discover-feature-mom {
  background: color-mix(in srgb, var(--mood-soft, rgba(106, 61, 138, 0.14)) 70%, #f8ebe6);
}
html.is-mobile-app .discover-feature-copy h3,
html.kozamia-app-shell .discover-feature-copy h3 {
  margin: 0 0 0.35rem;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.05rem;
  font-weight: 700;
  color: #3d2a4a;
}
html.is-mobile-app .discover-feature-copy p,
html.kozamia-app-shell .discover-feature-copy p {
  margin: 0 0 0.65rem;
  font-size: 0.72rem;
  line-height: 1.4;
  color: #7a6a82;
  max-width: 12rem;
}
html.is-mobile-app .discover-feature-pair .discover-feature-copy p,
html.kozamia-app-shell .discover-feature-pair .discover-feature-copy p {
  max-width: none;
}
html.is-mobile-app .discover-feature-cta,
html.kozamia-app-shell .discover-feature-cta {
  border-radius: 0.7rem !important;
  font-size: 0.72rem !important;
  padding: 0.45rem 0.7rem !important;
}
html.is-mobile-app .discover-feature-art,
html.kozamia-app-shell .discover-feature-art {
  flex-shrink: 0;
  font-size: 2.6rem;
  line-height: 1;
  filter: drop-shadow(0 6px 12px rgba(45, 25, 60, 0.1));
}

/* —— Keşfet compact (discoverv2) —— */
html.is-mobile-app #page-discover.discover-logged-in,
html.kozamia-app-shell #page-discover.discover-logged-in,
html.discover-mockup-on #page-discover.discover-logged-in {
  background: #fdf8f5;
}

html.is-mobile-app #page-discover.discover-logged-in:not(.discover-in-section) .discover-hub,
html.kozamia-app-shell #page-discover.discover-logged-in:not(.discover-in-section) .discover-hub,
html.discover-mockup-on #page-discover.discover-logged-in:not(.discover-in-section) .discover-hub {
  padding-left: 0.85rem;
  padding-right: 0.85rem;
  padding-bottom: var(--bottom-nav-h);
}

html.is-mobile-app #page-discover.discover-in-section .discover-hub,
html.kozamia-app-shell #page-discover.discover-in-section .discover-hub,
html.discover-mockup-on #page-discover.discover-in-section .discover-hub {
  padding-bottom: 0 !important;
}

html.is-mobile-app #page-discover .discover-tab-extra,
html.kozamia-app-shell #page-discover .discover-tab-extra,
html.discover-mockup-on #page-discover .discover-tab-extra {
  display: none !important;
}

html.is-mobile-app #page-discover.discover-logged-in .discover-app-top,
html.kozamia-app-shell #page-discover.discover-logged-in .discover-app-top,
html.discover-mockup-on #page-discover.discover-logged-in .discover-app-top {
  gap: 0.35rem !important;
  padding: calc(0.2rem + env(safe-area-inset-top, 0px)) 0 0.15rem !important;
}

html.is-mobile-app .discover-app-brand-name,
html.kozamia-app-shell .discover-app-brand-name,
html.discover-mockup-on .discover-app-brand-name {
  font-size: 1.15rem !important;
}

html.is-mobile-app .discover-app-title,
html.kozamia-app-shell .discover-app-title,
html.discover-mockup-on .discover-app-title {
  font-size: 1.45rem !important;
}

html.is-mobile-app .discover-app-sub,
html.kozamia-app-shell .discover-app-sub,
html.discover-mockup-on .discover-app-sub {
  font-size: 0.72rem !important;
  margin-top: 0.15rem !important;
}

html.is-mobile-app #page-discover .discover-tabs-sticky,
html.kozamia-app-shell #page-discover .discover-tabs-sticky,
html.discover-mockup-on #page-discover .discover-tabs-sticky {
  margin: 0.15rem 0 0.45rem !important;
}

html.is-mobile-app #page-discover .discover-tab,
html.kozamia-app-shell #page-discover .discover-tab,
html.discover-mockup-on #page-discover .connect-tab[data-dtab] {
  padding: 0.4rem 0.55rem !important;
  font-size: 0.75rem !important;
}

html.is-mobile-app .discover-cat-grid,
html.kozamia-app-shell .discover-cat-grid,
html.discover-mockup-on .discover-cat-grid {
  gap: 0.55rem !important;
  padding: 0.15rem 0 0.5rem !important;
}

html.is-mobile-app .discover-cat-card,
html.kozamia-app-shell .discover-cat-card,
html.discover-mockup-on .discover-cat-card {
  min-height: 7.4rem !important;
  padding: 0.85rem 0.55rem 1.1rem !important;
  border-radius: 1rem !important;
  gap: 0.3rem !important;
}

html.is-mobile-app .discover-cat-icon,
html.kozamia-app-shell .discover-cat-icon,
html.discover-mockup-on .discover-cat-icon {
  width: 2.5rem !important;
  height: 2.5rem !important;
  margin-bottom: 0 !important;
}

html.is-mobile-app .discover-cat-icon .material-symbols-outlined,
html.kozamia-app-shell .discover-cat-icon .material-symbols-outlined,
html.discover-mockup-on .discover-cat-icon .material-symbols-outlined {
  font-size: 1.2rem !important;
}

html.is-mobile-app .discover-cat-card strong,
html.kozamia-app-shell .discover-cat-card strong,
html.discover-mockup-on .discover-cat-card strong {
  font-size: 0.92rem !important;
}

html.is-mobile-app .discover-cat-desc,
html.kozamia-app-shell .discover-cat-desc,
html.discover-mockup-on .discover-cat-desc {
  font-size: 0.64rem !important;
  max-width: 8.5rem !important;
}

html.is-mobile-app .discover-article-grid,
html.kozamia-app-shell .discover-article-grid,
html.discover-mockup-on .discover-article-grid {
  gap: 0.5rem !important;
}

html.is-mobile-app .discover-article-body,
html.kozamia-app-shell .discover-article-body,
html.discover-mockup-on .discover-article-body {
  padding: 0.45rem 0.5rem 0.55rem !important;
  gap: 0.2rem !important;
}

html.is-mobile-app .discover-article-body h3,
html.kozamia-app-shell .discover-article-body h3,
html.discover-mockup-on .discover-article-body h3 {
  font-size: 0.78rem !important;
}

html.is-mobile-app .discover-article-body p,
html.kozamia-app-shell .discover-article-body p,
html.discover-mockup-on .discover-article-body p {
  font-size: 0.62rem !important;
  -webkit-line-clamp: 2;
}

html.is-mobile-app #page-discover .category-pills .pill,
html.kozamia-app-shell #page-discover .category-pills .pill,
html.discover-mockup-on #page-discover .category-pills .pill {
  padding: 0.3rem 0.6rem !important;
  font-size: 0.66rem !important;
}

html.is-mobile-app .cycle-smart-calendar,
html.kozamia-app-shell .cycle-smart-calendar,
html.discover-mockup-on .cycle-smart-calendar {
  padding: 0.7rem !important;
  margin-bottom: 0.55rem !important;
  border-radius: 1rem !important;
}

html.is-mobile-app .cycle-cal-head h2,
html.kozamia-app-shell .cycle-cal-head h2,
html.discover-mockup-on .cycle-cal-head h2 {
  font-size: 0.88rem !important;
}

html.is-mobile-app .discover-recs,
html.kozamia-app-shell .discover-recs,
html.discover-mockup-on .discover-recs {
  margin-bottom: 0.55rem !important;
}

html.is-mobile-app .discover-rec-card,
html.kozamia-app-shell .discover-rec-card,
html.discover-mockup-on .discover-rec-card {
  flex: 0 0 9.5rem !important;
  min-height: 6.2rem !important;
  padding: 0.65rem 0.55rem !important;
  border-radius: 0.9rem !important;
}

html.is-mobile-app .discover-mood-banner,
html.kozamia-app-shell .discover-mood-banner,
html.discover-mockup-on .discover-mood-banner {
  gap: 0.45rem !important;
  padding: 0.65rem 0.7rem !important;
  margin-bottom: 0.55rem !important;
  border-radius: 0.9rem !important;
}

html.is-mobile-app .discover-mood-banner p,
html.kozamia-app-shell .discover-mood-banner p,
html.discover-mockup-on .discover-mood-banner p {
  font-size: 0.7rem !important;
}

html.is-mobile-app .discover-mood-banner .btn,
html.kozamia-app-shell .discover-mood-banner .btn,
html.discover-mockup-on .discover-mood-banner .btn {
  font-size: 0.7rem !important;
  padding: 0.4rem 0.7rem !important;
}

html.is-mobile-app .discover-feature-stack,
html.kozamia-app-shell .discover-feature-stack,
html.discover-mockup-on .discover-feature-stack {
  gap: 0.55rem !important;
  margin-bottom: 0.55rem !important;
}

html.is-mobile-app .discover-feature-card,
html.kozamia-app-shell .discover-feature-card,
html.discover-mockup-on .discover-feature-card {
  padding: 0.75rem !important;
  border-radius: 1rem !important;
  min-height: 0 !important;
}

html.is-mobile-app .discover-feature-pair .discover-feature-card,
html.kozamia-app-shell .discover-feature-pair .discover-feature-card,
html.discover-mockup-on .discover-feature-pair .discover-feature-card {
  min-height: 8.5rem !important;
}

html.is-mobile-app .discover-feature-copy h3,
html.kozamia-app-shell .discover-feature-copy h3,
html.discover-mockup-on .discover-feature-copy h3 {
  font-size: 0.92rem !important;
}

html.is-mobile-app .discover-feature-copy p,
html.kozamia-app-shell .discover-feature-copy p,
html.discover-mockup-on .discover-feature-copy p {
  font-size: 0.64rem !important;
  margin-bottom: 0.45rem !important;
}

html.is-mobile-app .discover-feature-cta,
html.kozamia-app-shell .discover-feature-cta,
html.discover-mockup-on .discover-feature-cta {
  font-size: 0.66rem !important;
  padding: 0.35rem 0.55rem !important;
}

html.is-mobile-app .discover-feature-art,
html.kozamia-app-shell .discover-feature-art,
html.discover-mockup-on .discover-feature-art {
  font-size: 1.85rem !important;
}

html.discover-mockup-on:has(#page-discover.active.discover-logged-in) .site-header {
  display: none !important;
}
html.discover-mockup-on #page-discover.discover-logged-in .discover-hub-header-web {
  display: none !important;
}
html.discover-mockup-on #page-discover.discover-logged-in .discover-app-top {
  display: flex;
  flex-direction: column;
}
html.discover-mockup-on #page-discover .discover-tabs-sticky.is-explore-hidden {
  display: none !important;
}
html.discover-mockup-on #page-discover .hub-tabs-chrome,
html.discover-mockup-on #page-discover .hub-panel-intro {
  display: none !important;
}
html.discover-mockup-on .discover-cat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
html.discover-mockup-on .discover-cat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border: 0;
  background: #fff;
  box-shadow: 0 8px 20px rgba(45, 25, 60, 0.06);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
html.discover-mockup-on .discover-cat-icon {
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(106, 61, 138, 0.1);
  color: #6a3d8a;
}
html.discover-mockup-on .discover-cat-go {
  position: absolute;
  right: 0.45rem;
  bottom: 0.35rem;
  color: #6a3d8a;
  font-size: 1rem;
}

html.is-mobile-app .discover-cat-card-wide,
html.kozamia-app-shell .discover-cat-card-wide,
html.discover-mockup-on .discover-cat-card-wide {
  grid-column: 1 / -1;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  min-height: 4.5rem !important;
  padding: 0.75rem 1rem 0.75rem 0.85rem !important;
  gap: 0.75rem !important;
}
html.is-mobile-app .discover-cat-card-wide .discover-cat-icon,
html.kozamia-app-shell .discover-cat-card-wide .discover-cat-icon,
html.discover-mockup-on .discover-cat-card-wide .discover-cat-icon {
  margin: 0 !important;
  flex-shrink: 0;
}
html.is-mobile-app .discover-cat-card-wide .discover-cat-desc,
html.kozamia-app-shell .discover-cat-card-wide .discover-cat-desc,
html.discover-mockup-on .discover-cat-card-wide .discover-cat-desc {
  max-width: none !important;
}
html.is-mobile-app .discover-health-assistants,
html.kozamia-app-shell .discover-health-assistants,
html.discover-mockup-on .discover-health-assistants {
  margin: 0 0 0.55rem !important;
}

/* —— Keşfet restore (discoverv3 ezmesini geri al) —— */
html.is-mobile-app #page-discover.discover-logged-in .discover-hub,
html.kozamia-app-shell #page-discover.discover-logged-in .discover-hub,
html.discover-mockup-on #page-discover.discover-logged-in .discover-hub {
  padding-left: 0.9rem !important;
  padding-right: 0.9rem !important;
}
html.is-mobile-app .discover-app-title,
html.kozamia-app-shell .discover-app-title,
html.discover-mockup-on .discover-app-title {
  font-size: 1.4rem !important;
  line-height: 1.2 !important;
}
html.is-mobile-app .discover-app-sub,
html.kozamia-app-shell .discover-app-sub,
html.discover-mockup-on .discover-app-sub {
  font-size: 0.78rem !important;
  margin-top: 0.2rem !important;
  line-height: 1.35 !important;
}
html.is-mobile-app .discover-cat-grid,
html.kozamia-app-shell .discover-cat-grid,
html.discover-mockup-on .discover-cat-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0.75rem !important;
  padding: 0.25rem 0 0.85rem !important;
}
html.is-mobile-app .discover-cat-card,
html.kozamia-app-shell .discover-cat-card,
html.discover-mockup-on .discover-cat-card {
  min-height: 8.75rem !important;
  padding: 1.05rem 0.7rem 1.25rem !important;
  border-radius: 1.15rem !important;
  gap: 0.4rem !important;
  box-shadow: 0 8px 22px rgba(45, 25, 60, 0.06) !important;
}
html.is-mobile-app .discover-cat-icon,
html.kozamia-app-shell .discover-cat-icon,
html.discover-mockup-on .discover-cat-icon {
  width: 2.85rem !important;
  height: 2.85rem !important;
  margin-bottom: 0.1rem !important;
}
html.is-mobile-app .discover-cat-icon .material-symbols-outlined,
html.kozamia-app-shell .discover-cat-icon .material-symbols-outlined,
html.discover-mockup-on .discover-cat-icon .material-symbols-outlined {
  font-size: 1.35rem !important;
}
html.is-mobile-app .discover-cat-card strong,
html.kozamia-app-shell .discover-cat-card strong,
html.discover-mockup-on .discover-cat-card strong {
  font-size: 1rem !important;
}
html.is-mobile-app .discover-cat-desc,
html.kozamia-app-shell .discover-cat-desc,
html.discover-mockup-on .discover-cat-desc {
  font-size: 0.72rem !important;
  line-height: 1.35 !important;
  max-width: 9.5rem !important;
}
html.is-mobile-app .discover-cat-go,
html.kozamia-app-shell .discover-cat-go,
html.discover-mockup-on .discover-cat-go {
  font-size: 1.05rem !important;
  right: 0.5rem !important;
  bottom: 0.4rem !important;
}
html.is-mobile-app .discover-article-grid,
html.kozamia-app-shell .discover-article-grid,
html.discover-mockup-on .discover-article-grid {
  gap: 0.75rem !important;
}
html.is-mobile-app .discover-article-body,
html.kozamia-app-shell .discover-article-body,
html.discover-mockup-on .discover-article-body {
  padding: 0.65rem 0.7rem 0.75rem !important;
  gap: 0.3rem !important;
}
html.is-mobile-app .discover-article-body h3,
html.kozamia-app-shell .discover-article-body h3,
html.discover-mockup-on .discover-article-body h3 {
  font-size: 0.88rem !important;
  line-height: 1.3 !important;
}
html.is-mobile-app .discover-article-body p,
html.kozamia-app-shell .discover-article-body p,
html.discover-mockup-on .discover-article-body p {
  font-size: 0.72rem !important;
}
html.is-mobile-app .discover-article-meta,
html.kozamia-app-shell .discover-article-meta,
html.discover-mockup-on .discover-article-meta {
  font-size: 0.68rem !important;
  padding-top: 0.3rem !important;
}
html.is-mobile-app #page-discover .category-pills .pill,
html.kozamia-app-shell #page-discover .category-pills .pill,
html.discover-mockup-on #page-discover .category-pills .pill {
  padding: 0.4rem 0.75rem !important;
  font-size: 0.78rem !important;
}
html.is-mobile-app #page-discover .content-grid,
html.kozamia-app-shell #page-discover .content-grid,
html.discover-mockup-on #page-discover .content-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0.75rem !important;
}
html.is-mobile-app #page-discover .content-card,
html.is-mobile-app #page-discover .content-card-btn,
html.kozamia-app-shell #page-discover .content-card,
html.kozamia-app-shell #page-discover .content-card-btn,
html.discover-mockup-on #page-discover .content-card,
html.discover-mockup-on #page-discover .content-card-btn {
  padding: 0.85rem 0.8rem !important;
  border-radius: 1rem !important;
  text-decoration: none !important;
}
html.is-mobile-app #page-discover .content-card h3,
html.is-mobile-app #page-discover .content-card-btn h3,
html.kozamia-app-shell #page-discover .content-card h3,
html.kozamia-app-shell #page-discover .content-card-btn h3,
html.discover-mockup-on #page-discover .content-card h3,
html.discover-mockup-on #page-discover .content-card-btn h3 {
  font-size: 0.9rem !important;
  line-height: 1.3 !important;
  margin-bottom: 0.3rem !important;
}
html.is-mobile-app #page-discover .content-card p,
html.is-mobile-app #page-discover .content-card-btn p,
html.kozamia-app-shell #page-discover .content-card p,
html.kozamia-app-shell #page-discover .content-card-btn p,
html.discover-mockup-on #page-discover .content-card p,
html.discover-mockup-on #page-discover .content-card-btn p {
  font-size: 0.74rem !important;
  line-height: 1.4 !important;
}
html.is-mobile-app .cycle-smart-calendar,
html.kozamia-app-shell .cycle-smart-calendar,
html.discover-mockup-on .cycle-smart-calendar {
  padding: 0.85rem !important;
  margin-bottom: 0.75rem !important;
  border-radius: 1.05rem !important;
}
html.is-mobile-app .cycle-cal-head h2,
html.kozamia-app-shell .cycle-cal-head h2,
html.discover-mockup-on .cycle-cal-head h2 {
  font-size: 1rem !important;
}
html.is-mobile-app .discover-feature-card,
html.kozamia-app-shell .discover-feature-card,
html.discover-mockup-on .discover-feature-card {
  padding: 0.9rem 0.95rem !important;
  border-radius: 1.05rem !important;
}
html.is-mobile-app .discover-feature-pair .discover-feature-card,
html.kozamia-app-shell .discover-feature-pair .discover-feature-card,
html.discover-mockup-on .discover-feature-pair .discover-feature-card {
  min-height: 10rem !important;
}
html.is-mobile-app .discover-feature-copy h3,
html.kozamia-app-shell .discover-feature-copy h3,
html.discover-mockup-on .discover-feature-copy h3 {
  font-size: 1.02rem !important;
  margin-bottom: 0.3rem !important;
}
html.is-mobile-app .discover-feature-copy p,
html.kozamia-app-shell .discover-feature-copy p,
html.discover-mockup-on .discover-feature-copy p {
  font-size: 0.74rem !important;
  margin-bottom: 0.55rem !important;
}
html.is-mobile-app .discover-feature-cta,
html.kozamia-app-shell .discover-feature-cta,
html.discover-mockup-on .discover-feature-cta {
  font-size: 0.78rem !important;
  padding: 0.45rem 0.7rem !important;
}
html.is-mobile-app .discover-feature-art,
html.kozamia-app-shell .discover-feature-art,
html.discover-mockup-on .discover-feature-art {
  font-size: 1.85rem !important;
}
html.is-mobile-app #page-discover .hub-panel-intro,
html.kozamia-app-shell #page-discover .hub-panel-intro,
html.discover-mockup-on #page-discover .hub-panel-intro {
  display: none !important;
}

/* end Keşfet mockup discoverv1 */
/* ==========================================================================
   Share Studio mockup (sharev1) — Düşünceni Paylaş + ruh hali grid
   ========================================================================== */

html.is-mobile-app #modal-share-studio .share-studio-sheet,
html.kozamia-app-shell #modal-share-studio .share-studio-sheet {
  background: #fdf8f5 !important;
  border-radius: 1.5rem 1.5rem 0 0 !important;
  max-height: min(94vh, 920px) !important;
  padding: 0.35rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px)) !important;
}

html.is-mobile-app .share-studio-handle,
html.kozamia-app-shell .share-studio-handle {
  display: block;
  width: 2.5rem;
  height: 0.28rem;
  border-radius: 999px;
  background: rgba(106, 61, 138, 0.18);
  margin: 0.35rem auto 0.55rem;
}

html.is-mobile-app .share-studio-head,
html.kozamia-app-shell .share-studio-head {
  display: grid;
  grid-template-columns: 2.5rem 1fr 2.5rem;
  align-items: start;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}
html.is-mobile-app .share-studio-head .modal-close,
html.kozamia-app-shell .share-studio-head .modal-close {
  opacity: 0.55;
}
html.is-mobile-app .share-studio-brand-block,
html.kozamia-app-shell .share-studio-brand-block {
  text-align: center;
  margin-bottom: 0.45rem;
}
html.is-mobile-app .share-studio-brand-name,
html.kozamia-app-shell .share-studio-brand-name {
  display: block;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.15rem;
  font-weight: 700;
  color: #6a3d8a;
  line-height: 1.1;
}
html.is-mobile-app .share-studio-brand-sub,
html.kozamia-app-shell .share-studio-brand-sub {
  display: block;
  font-size: 0.72rem;
  color: #8b78b0;
  margin-top: 0.1rem;
}
html.is-mobile-app .share-studio-head-copy,
html.kozamia-app-shell .share-studio-head-copy {
  text-align: center;
}
html.is-mobile-app #share-studio-title,
html.kozamia-app-shell #share-studio-title {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.45rem;
  font-weight: 700;
  color: #6a3d8a;
  line-height: 1.2;
}
html.is-mobile-app #share-studio-sub,
html.kozamia-app-shell #share-studio-sub {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  color: #9a8aa0;
  line-height: 1.4;
}

html.is-mobile-app .share-studio-progress,
html.kozamia-app-shell .share-studio-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin: 0.55rem 0 0.85rem;
  padding: 0 0.5rem;
}
html.is-mobile-app .share-studio-progress-dot,
html.kozamia-app-shell .share-studio-progress-dot {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  border: 2px solid rgba(106, 61, 138, 0.22);
  background: #fff;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
html.is-mobile-app .share-studio-progress-dot .material-symbols-outlined,
html.kozamia-app-shell .share-studio-progress-dot .material-symbols-outlined {
  font-size: 0.85rem;
  color: #fff;
}
html.is-mobile-app .share-studio-progress-dot.is-done,
html.is-mobile-app .share-studio-progress-dot.is-current,
html.kozamia-app-shell .share-studio-progress-dot.is-done,
html.kozamia-app-shell .share-studio-progress-dot.is-current {
  background: #6a3d8a;
  border-color: #6a3d8a;
}
html.is-mobile-app .share-studio-progress-line,
html.kozamia-app-shell .share-studio-progress-line {
  flex: 1;
  height: 2px;
  max-width: 1.6rem;
  background: rgba(106, 61, 138, 0.15);
}
html.is-mobile-app .share-studio-progress-line.is-done,
html.kozamia-app-shell .share-studio-progress-line.is-done {
  background: #6a3d8a;
}

html.is-mobile-app .share-studio-author,
html.is-mobile-app .share-studio-addon-bar,
html.kozamia-app-shell .share-studio-author,
html.kozamia-app-shell .share-studio-addon-bar {
  display: none !important;
}

html.is-mobile-app .share-studio-create-head,
html.kozamia-app-shell .share-studio-create-head {
  margin: 0.15rem 0 0.65rem;
}
html.is-mobile-app .share-studio-create-title,
html.kozamia-app-shell .share-studio-create-title {
  margin: 0;
  font-family: var(--kozamia-brand-serif);
  font-size: 1.25rem;
  font-weight: 700;
  color: #3d2a4a;
}
html.is-mobile-app .share-studio-create-sub,
html.kozamia-app-shell .share-studio-create-sub {
  margin: 0.25rem 0 0;
  font-size: 0.82rem;
  color: #5a4a62;
}

html.is-mobile-app .share-studio-mood-grid,
html.kozamia-app-shell .share-studio-mood-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0.55rem !important;
  margin: 0 0 0.9rem !important;
}
html.is-mobile-app .share-studio-mood-btn,
html.kozamia-app-shell .share-studio-mood-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.4rem !important;
  min-height: 4.8rem;
  padding: 0.55rem 0.25rem !important;
  border-radius: 0.95rem !important;
  border: 1px solid rgba(106, 61, 138, 0.1) !important;
  background: #fff !important;
  box-shadow: 0 6px 16px rgba(45, 25, 60, 0.04);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
html.is-mobile-app .share-studio-mood-btn.is-active,
html.kozamia-app-shell .share-studio-mood-btn.is-active {
  border-color: #6a3d8a !important;
  box-shadow: 0 0 0 2px rgba(106, 61, 138, 0.22), 0 8px 18px rgba(106, 61, 138, 0.12) !important;
}
html.is-mobile-app .share-studio-mood-icon,
html.kozamia-app-shell .share-studio-mood-icon {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.15rem;
  background: color-mix(in srgb, var(--mood-accent, #6a3d8a) 18%, #fff);
}
html.is-mobile-app .share-studio-mood-label,
html.kozamia-app-shell .share-studio-mood-label {
  font-size: 0.65rem;
  font-weight: 700;
  color: #5a4a62;
  text-align: center;
  line-height: 1.2;
}

html.is-mobile-app .share-studio-caption-wrap,
html.kozamia-app-shell .share-studio-caption-wrap {
  display: block;
  position: relative;
  margin-bottom: 0.75rem;
}
html.is-mobile-app .share-studio-caption-label,
html.kozamia-app-shell .share-studio-caption-label {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 0.78rem;
  font-weight: 650;
  color: #5a4a62;
}
html.is-mobile-app #share-studio-caption,
html.kozamia-app-shell #share-studio-caption {
  width: 100%;
  min-height: 6.5rem;
  padding: 0.85rem 0.9rem 1.6rem !important;
  border-radius: 1rem !important;
  border: 1.5px solid rgba(106, 61, 138, 0.22) !important;
  background: #fff !important;
  font: inherit;
  font-size: 0.92rem;
  resize: vertical;
}
html.is-mobile-app .share-studio-char-count,
html.kozamia-app-shell .share-studio-char-count {
  position: absolute;
  right: 0.75rem;
  bottom: 0.55rem;
  font-size: 0.68rem;
  color: #9a8aa0;
}

html.is-mobile-app .share-studio-media-pair,
html.kozamia-app-shell .share-studio-media-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  margin: 0 0 0.85rem;
}
html.is-mobile-app .share-studio-media-btn,
html.kozamia-app-shell .share-studio-media-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.7rem 0.65rem;
  border-radius: 0.9rem;
  border: 1.5px solid rgba(106, 61, 138, 0.28);
  background: #fff;
  color: #6a3d8a;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 650;
  cursor: pointer;
}
html.is-mobile-app .share-studio-media-btn .material-symbols-outlined,
html.kozamia-app-shell .share-studio-media-btn .material-symbols-outlined {
  font-size: 1.15rem;
}

html.is-mobile-app .share-studio-actions,
html.kozamia-app-shell .share-studio-actions {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: 0.35rem;
}
html.is-mobile-app #share-studio-publish,
html.kozamia-app-shell #share-studio-publish {
  width: 100%;
  border-radius: 0.95rem !important;
  padding: 0.85rem 1rem !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 24px rgba(106, 61, 138, 0.28);
}
html.is-mobile-app #share-studio-publish .material-symbols-outlined,
html.kozamia-app-shell #share-studio-publish .material-symbols-outlined {
  font-size: 1.15rem;
}
html.is-mobile-app .share-studio-privacy-note,
html.kozamia-app-shell .share-studio-privacy-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  margin: 0.55rem 0 0;
  font-size: 0.68rem;
  color: #9a8aa0;
  text-align: center;
}
html.is-mobile-app .share-studio-privacy-note .material-symbols-outlined,
html.kozamia-app-shell .share-studio-privacy-note .material-symbols-outlined {
  font-size: 0.9rem;
}

html.is-mobile-app #share-studio-step2,
html.kozamia-app-shell #share-studio-step2 {
  display: none !important;
}

html.is-mobile-app .share-studio-inline-fields.is-mood-primary,
html.kozamia-app-shell .share-studio-inline-fields.is-mood-primary {
  display: block !important;
}

/* end Share Studio mockup sharev1 */

/* —— Çevrimiçi Kişiler sayfası —— */
.online-page-wrap {
  max-width: 26rem;
  margin: 0 auto;
  padding: calc(0.25rem + env(safe-area-inset-top, 0px)) 0.65rem calc(8.75rem + env(safe-area-inset-bottom, 0px));
}

.online-page-top {
  display: grid;
  grid-template-columns: 1.85rem 1fr auto;
  align-items: center;
  gap: 0.3rem;
  margin-bottom: 0.3rem;
}

.online-back-btn {
  width: 1.85rem;
  height: 1.85rem;
  border: 0;
  border-radius: 50%;
  background: rgba(106, 61, 138, 0.08);
  color: var(--kozamia-shell-purple, #6a3d8a);
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}

.online-back-btn .material-symbols-outlined {
  font-size: 1.05rem;
}

.online-page-heading h1 {
  margin: 0;
  font-family: var(--kozamia-brand-serif, Fraunces, Georgia, serif);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--kozamia-shell-purple, #6a3d8a);
  line-height: 1.15;
}

.online-page-heading .muted {
  margin: 0;
  font-size: 0.62rem;
  line-height: 1.2;
}

.online-select-all-btn {
  border-radius: 999px !important;
  padding: 0.2rem 0.45rem !important;
  font-size: 0.62rem !important;
  min-height: 0 !important;
  line-height: 1.2 !important;
}

.online-toolbar {
  margin-bottom: 0.3rem;
}

.online-search-wrap {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: var(--bg-elevated, #fff);
  border: 1px solid var(--border, rgba(106, 61, 138, 0.12));
}

.online-search-wrap .material-symbols-outlined {
  color: var(--kozamia-shell-purple, #6a3d8a);
  font-size: 0.95rem;
  opacity: 0.7;
}

.online-search-wrap input {
  flex: 1;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 0.75rem;
  color: var(--text, #3d2a4f);
  outline: none;
  min-width: 0;
  line-height: 1.2;
  padding: 0;
}

.online-people-list {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.online-person-row {
  display: grid;
  grid-template-columns: auto 1.85rem 1fr auto;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  padding: 0.28rem 0.4rem;
  border-radius: 0.65rem;
  border: 1px solid var(--border, rgba(106, 61, 138, 0.1));
  background: var(--bg-elevated, #fff);
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.online-person-row.is-selected {
  border-color: var(--kozamia-shell-purple, #6a3d8a);
  background: color-mix(in srgb, var(--kozamia-shell-purple, #6a3d8a) 8%, var(--bg-elevated, #fff));
  box-shadow: 0 0 0 1px rgba(var(--kozamia-shell-purple-rgb, 106, 61, 138), 0.12);
}

.online-person-row.is-self {
  opacity: 0.92;
}

.online-person-check {
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 0.22rem;
  border: 1.5px solid rgba(106, 61, 138, 0.35);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: var(--bg-elevated, #fff);
}

.online-person-row.is-selected .online-person-check {
  background: var(--kozamia-shell-purple, #6a3d8a);
  border-color: var(--kozamia-shell-purple, #6a3d8a);
  color: #fff;
}

.online-person-check .material-symbols-outlined {
  font-size: 0.72rem;
  line-height: 1;
  opacity: 0;
}

.online-person-row.is-selected .online-person-check .material-symbols-outlined {
  opacity: 1;
}

.online-person-avatar {
  position: relative;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--kozamia-shell-purple, #6a3d8a) 12%, transparent);
  display: grid;
  place-items: center;
  overflow: hidden;
  font-size: 0.8rem;
}

.online-person-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.online-person-dot {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 50%;
  background: #22c55e;
  border: 1.5px solid var(--bg-elevated, #fff);
}

.online-person-meta {
  min-width: 0;
}

.online-person-name {
  display: block;
  font-weight: 700;
  font-size: 0.74rem;
  color: var(--text, #3d2a4f);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.online-person-status {
  display: block;
  font-size: 0.58rem;
  color: #22a06b;
  margin-top: 0;
  line-height: 1.2;
}

.online-person-open {
  width: 1.55rem;
  height: 1.55rem;
  border: 0;
  border-radius: 50%;
  background: rgba(106, 61, 138, 0.08);
  color: var(--kozamia-shell-purple, #6a3d8a);
  display: grid;
  place-items: center;
  padding: 0;
  cursor: pointer;
}

.online-person-open .material-symbols-outlined {
  font-size: 0.9rem;
}

.online-page-empty {
  text-align: center;
  padding: 1rem 0.75rem;
  font-size: 0.75rem;
}

/* FAB (+ ) üstünde dursun — alt nav ile çakışmasın */
.online-selection-bar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--bottom-nav-h) + 0.65rem);
  width: min(24rem, calc(100vw - 0.75rem));
  z-index: 45;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  padding: 0.32rem 0.4rem;
  border-radius: 0.75rem;
  background: var(--bg-elevated, #fff);
  border: 1px solid var(--border, rgba(106, 61, 138, 0.12));
  box-shadow: 0 8px 20px rgba(45, 25, 60, 0.14);
}

.online-selection-bar[hidden] {
  display: none !important;
}

.online-sel-count {
  flex: 0 0 auto;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--kozamia-shell-purple, #6a3d8a);
  white-space: nowrap;
  padding-left: 0.15rem;
}

.online-sel-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.2rem;
  min-width: 0;
  flex: 1 1 auto;
}

.online-sel-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  border-radius: 999px !important;
  font-size: 0.62rem !important;
  padding: 0.22rem 0.4rem !important;
  min-height: 1.7rem !important;
  line-height: 1 !important;
  white-space: nowrap;
  flex: 0 0 auto;
}

.online-sel-actions .material-symbols-outlined {
  font-size: 0.85rem;
}

html.is-mobile-app #page-online,
html.kozamia-app-shell #page-online,
html.home-mockup-on #page-online {
  background: var(--kozamia-shell-cream, #fdf8f5);
}

/* Dar ekranda Profil / Temizle ikon-only — Mesaj metinli kalsın */
@media (max-width: 390px) {
  .online-sel-actions #online-sel-profile,
  .online-sel-actions #online-sel-clear {
    padding: 0.22rem !important;
    width: 1.7rem;
    min-width: 1.7rem;
    font-size: 0 !important;
    gap: 0 !important;
  }
  .online-sel-actions #online-sel-profile .material-symbols-outlined,
  .online-sel-actions #online-sel-clear .material-symbols-outlined {
    font-size: 0.95rem;
  }
}

/* —— Alt boşluk tekilleştirme (son override) —— */
html.is-mobile-app body,
html.kozamia-app-shell body,
html.is-mobile-web body {
  padding-bottom: 0 !important;
}

html.is-mobile-app #page-profile.active .page-wrap,
html.kozamia-app-shell #page-profile.active .page-wrap,
html.is-mobile-web #page-profile.active .page-wrap {
  padding-bottom: var(--bottom-nav-h);
}

html.is-mobile-app #page-profile.active,
html.kozamia-app-shell #page-profile.active,
html.is-mobile-web #page-profile.active {
  padding-bottom: 0 !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus #connect-panel-messages .dm-chat-form,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-form,
html.kozamia-app-shell #page-connect.active.is-messages-focus #connect-panel-messages .dm-chat-form,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-form {
  padding-bottom: 0.55rem !important;
}

/* —— İçerik sheet: Mesajlar/Aramalar alta kadar dolsun (fill2) —— */
html.is-mobile-app #page-connect.active.is-messages-focus,
html.is-mobile-app #page-connect.active.is-dm-chat-open,
html.kozamia-app-shell #page-connect.active.is-messages-focus,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open,
html.is-mobile-web #page-connect.active.is-messages-focus,
html.is-mobile-web #page-connect.active.is-dm-chat-open {
  background: var(--bg-elevated, #ffffff) !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open,
html.is-mobile-web #page-connect.active.is-dm-chat-open {
  background: #ffffff !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus .connect-hub,
html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-hub,
html.kozamia-app-shell #page-connect.active.is-messages-focus .connect-hub,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-hub,
html.is-mobile-web #page-connect.active.is-messages-focus .connect-hub,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-hub {
  display: flex !important;
  flex-direction: column !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: var(--bg-elevated, #ffffff) !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-hub,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-hub,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-hub {
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #ffffff !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus .connect-app-top,
html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-app-top,
html.kozamia-app-shell #page-connect.active.is-messages-focus .connect-app-top,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-app-top,
html.is-mobile-web #page-connect.active.is-messages-focus .connect-app-top,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-app-top {
  flex: 0 0 auto !important;
  padding-left: var(--page-pad-x, 0.65rem) !important;
  padding-right: var(--page-pad-x, 0.65rem) !important;
  background: #ffffff !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus .connect-hub > #connect-panel-messages,
html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages,
html.kozamia-app-shell #page-connect.active.is-messages-focus .connect-hub > #connect-panel-messages,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages,
html.is-mobile-web #page-connect.active.is-messages-focus .connect-hub > #connect-panel-messages,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages,
html.is-mobile-web #page-connect.active.is-dm-chat-open .connect-hub > #connect-panel-messages {
  background: #ffffff !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-app,
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-app,
html.is-mobile-web #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-app {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border-radius: 1.2rem 1.2rem 0 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
  overflow: hidden !important;
  margin: 0 !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-app,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-app,
html.is-mobile-web #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-app {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  border-radius: 1.15rem 1.15rem 0 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
  overflow: hidden !important;
  margin: 0 !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-body,
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-logged,
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-split:not([hidden]),
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-sidebar:not([hidden]),
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-calls-view:not([hidden]),
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .messages-ai-view:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-body,
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-logged,
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-split:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-sidebar:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-calls-view:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  background: #ffffff !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-body,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-logged,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-split:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-body,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-logged,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-split:not([hidden]) {
  flex: 1 1 auto !important;
  height: auto !important;
  overflow: hidden !important;
}

html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-inbox-list,
html.is-mobile-app #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-calls-list,
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-inbox-list,
html.kozamia-app-shell #page-connect.active.is-messages-focus:not(.is-dm-chat-open) #connect-panel-messages .dm-calls-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  background: #ffffff !important;
  padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px)) !important;
}

/* Sohbetler / Aramalar / AI: gizli sekme panelleri üst üste binmesin */
html.is-mobile-app #page-connect #messages-inbox-view[hidden],
html.is-mobile-app #page-connect #messages-calls-view[hidden],
html.is-mobile-app #page-connect #messages-ai-view[hidden],
html.is-mobile-app #page-connect #messages-lounge-view[hidden],
html.is-mobile-app #page-connect #messages-vip-view[hidden],
html.kozamia-app-shell #page-connect #messages-inbox-view[hidden],
html.kozamia-app-shell #page-connect #messages-calls-view[hidden],
html.kozamia-app-shell #page-connect #messages-ai-view[hidden],
html.kozamia-app-shell #page-connect #messages-lounge-view[hidden],
html.kozamia-app-shell #page-connect #messages-vip-view[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  flex: 0 0 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Mobil sohbet açık: liste TAM gizlenir, chat paneli sayfayı doldurur */
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages #messages-list-view,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-sidebar,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-empty-state,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages #messages-list-view,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-sidebar,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-empty-state {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-toolbar,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-toolbar {
  display: none !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-split:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-split:not([hidden]) {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  background: #fdf8f5 !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-pane:not([hidden]),
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-pane:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  background: #fdf8f5 !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-header,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-header {
  flex: 0 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-messages,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
}

html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-composer-wrap,
html.is-mobile-app #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-form,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-composer-wrap,
html.kozamia-app-shell #page-connect.active.is-dm-chat-open #connect-panel-messages .dm-chat-form {
  flex: 0 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* X + bölüm adı: beyaz panelin üstünde, başlık ortalı, X solda */
html.is-mobile-app #page-discover.discover-in-section .discover-app-top,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-top,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-top {
  gap: 0 !important;
  padding-bottom: 0 !important;
}

html.is-mobile-app #page-discover.discover-in-section .discover-app-brand-row,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-brand-row,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-brand-row {
  display: grid !important;
  grid-template-columns: 2.4rem minmax(0, 1fr) 2.4rem;
  align-items: center;
  justify-content: stretch;
  gap: 0.25rem;
  min-height: 2.75rem;
  margin: 0;
  padding: 0.65rem 0.55rem 0.5rem;
  background: var(--bg-elevated, #fff);
html.kozamia-app-shell #page-discover.discover-in-section .discover-back-x,
html.discover-mockup-on #page-discover.discover-in-section .discover-back-x {
  grid-column: 1;
  justify-self: start;
  z-index: 2;
}

html.is-mobile-app #page-discover.discover-in-section .discover-app-brand-name,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-brand-name,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-brand-name,
html.is-mobile-app #page-discover.discover-in-section .discover-app-section-name,
html.kozamia-app-shell #page-discover.discover-in-section .discover-app-section-name,
html.discover-mockup-on #page-discover.discover-in-section .discover-app-section-name {
  grid-column: 2;
  flex: none;
  width: 100%;
  text-align: center !important;
  font-family: var(--kozamia-brand-serif, Georgia, "Times New Roman", serif);
  font-size: 1.45rem !important;
  font-weight: 800;
  color: var(--text, #121212) !important;
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.15;
}

html.is-mobile-app #page-discover.discover-in-section .connect-panel:not([hidden]),
html.kozamia-app-shell #page-discover.discover-in-section .connect-panel:not([hidden]) {
  min-height: calc(100dvh - var(--bottom-nav-h) - 3.35rem);
  background: var(--bg-elevated, #ffffff);
  border-radius: 0 0 0 0;
  padding-top: 0.35rem !important;
  padding-bottom: calc(0.5rem + var(--bottom-nav-h)) !important;
  box-sizing: border-box;
  margin-bottom: 0 !important;
}

html.is-mobile-app #page-discover.discover-in-section .discover-hub,
html.kozamia-app-shell #page-discover.discover-in-section .discover-hub {
  padding-bottom: 0 !important;
}

html.is-mobile-app body.mood-theme #page-discover.discover-in-section .discover-app-brand-row,
html.kozamia-app-shell body.mood-theme #page-discover.discover-in-section .discover-app-brand-row,
html.is-mobile-app body.mood-theme #page-discover.discover-in-section .connect-panel:not([hidden]),
html.kozamia-app-shell body.mood-theme #page-discover.discover-in-section .connect-panel:not([hidden]) {
  background: var(--bg-elevated, #ffffff);
}

/* Keşfet içerik başlıkları: siyah — ruh hali temasında da okunaklı */
html.is-mobile-app #page-discover .discover-app-section-name,
html.kozamia-app-shell #page-discover .discover-app-section-name,
html.is-mobile-app body.mood-theme #page-discover .discover-app-section-name,
html.kozamia-app-shell body.mood-theme #page-discover .discover-app-section-name,
html.is-mobile-app #page-discover .content-card h3,
html.is-mobile-app #page-discover .content-card-btn h3,
html.kozamia-app-shell #page-discover .content-card h3,
html.kozamia-app-shell #page-discover .content-card-btn h3,
html.is-mobile-app body.mood-theme #page-discover .content-card h3,
html.is-mobile-app body.mood-theme #page-discover .content-card-btn h3,
html.kozamia-app-shell body.mood-theme #page-discover .content-card h3,
html.kozamia-app-shell body.mood-theme #page-discover .content-card-btn h3,
html.is-mobile-app #page-discover .discover-feature-copy h3,
html.kozamia-app-shell #page-discover .discover-feature-copy h3,
html.is-mobile-app body.mood-theme #page-discover .discover-feature-copy h3,
html.kozamia-app-shell body.mood-theme #page-discover .discover-feature-copy h3,
html.is-mobile-app #page-discover .cycle-cal-head h2,
html.kozamia-app-shell #page-discover .cycle-cal-head h2,
html.is-mobile-app body.mood-theme #page-discover .cycle-cal-head h2,
html.kozamia-app-shell body.mood-theme #page-discover .cycle-cal-head h2,
html.is-mobile-app #page-discover .style-ai-title,
html.kozamia-app-shell #page-discover .style-ai-title,
html.is-mobile-app body.mood-theme #page-discover .style-ai-title,
html.kozamia-app-shell body.mood-theme #page-discover .style-ai-title,
html.is-mobile-app #page-discover .skin-ai-title,
html.kozamia-app-shell #page-discover .skin-ai-title,
html.is-mobile-app body.mood-theme #page-discover .skin-ai-title,
html.kozamia-app-shell body.mood-theme #page-discover .skin-ai-title,
html.is-mobile-app #page-discover .mom-ai-title,
html.kozamia-app-shell #page-discover .mom-ai-title,
html.is-mobile-app body.mood-theme #page-discover .mom-ai-title,
html.kozamia-app-shell body.mood-theme #page-discover .mom-ai-title,
html.is-mobile-app #page-discover .hub-panel-intro h2,
html.kozamia-app-shell #page-discover .hub-panel-intro h2,
html.is-mobile-app body.mood-theme #page-discover .hub-panel-intro h2,
html.kozamia-app-shell body.mood-theme #page-discover .hub-panel-intro h2 {
  color: var(--text, #121212) !important;
  font-weight: 800;
}

html.is-mobile-app #page-discover .content-card,
html.is-mobile-app #page-discover .content-card-btn,
html.kozamia-app-shell #page-discover .content-card,
html.kozamia-app-shell #page-discover .content-card-btn {
  border-radius: 1.25rem !important;
}

/* —— Daire butonlar: genişlik=yükseklik (oval olmasın) —— */
html.is-mobile-app .icon-btn,
html.kozamia-app-shell .icon-btn,
html.is-mobile-web .icon-btn,
html.is-mobile-app label.icon-btn,
html.kozamia-app-shell label.icon-btn,
html.is-mobile-app .home-app-notify-btn,
html.kozamia-app-shell .home-app-notify-btn,
html.is-mobile-app .profile-app-icon-btn,
html.kozamia-app-shell .profile-app-icon-btn,
html.is-mobile-app .ps-notify-btn,
html.kozamia-app-shell .ps-notify-btn,
html.is-mobile-app .discover-back-x,
html.kozamia-app-shell .discover-back-x,
html.is-mobile-app .connect-back-x,
html.kozamia-app-shell .connect-back-x,
html.is-mobile-app .icon-action-btn,
html.kozamia-app-shell .icon-action-btn,
html.is-mobile-app .community-back-btn,
html.kozamia-app-shell .community-back-btn {
  aspect-ratio: 1 / 1 !important;
  width: 2.35rem !important;
  height: 2.35rem !important;
  min-width: 2.35rem !important;
  min-height: 2.35rem !important;
  max-width: 2.35rem !important;
  max-height: 2.35rem !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Küçük daireler — eşit kenar, oval yok */
html.is-mobile-app .dm-inbox-menu-btn,
html.kozamia-app-shell .dm-inbox-menu-btn,
html.is-mobile-app .home-daily-mock .daily-flow-nav,
html.kozamia-app-shell .home-daily-mock .daily-flow-nav,
html.home-mockup-on .home-daily-mock .daily-flow-nav {
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

html.is-mobile-app .bottom-nav .nav-item > .material-symbols-outlined,
html.kozamia-app-shell .bottom-nav .nav-item > .material-symbols-outlined,
html.is-mobile-app .discover-cat-icon,
html.kozamia-app-shell .discover-cat-icon,
html.is-mobile-app .connect-cat-icon,
html.kozamia-app-shell .connect-cat-icon,
html.is-mobile-app .profile-hub-icon,
html.kozamia-app-shell .profile-hub-icon,
html.is-mobile-app .ps-row-icon,
html.kozamia-app-shell .ps-row-icon,
html.is-mobile-app .home-shortcut-visual,
html.kozamia-app-shell .home-shortcut-visual {
  aspect-ratio: 1 / 1 !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}