[x-cloak] { display: none !important; }
html { scroll-behavior: smooth; }
body { -webkit-tap-highlight-color: transparent; }
.pb-safe { padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px)); }
.mb-nav { margin-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #FF8FAB66; border-radius: 3px; }

.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 3.5rem;
    border-radius: 1rem;
    color: #9ca3af;
    transition: color .15s ease;
}
.nav-item span { font-size: 10px; margin-top: 2px; font-weight: 500; }
.nav-item.is-active { color: #f43f7a; }
.nav-item:hover { color: #fb7185; }
.dark .nav-item { color: #6b7280; }
.dark .nav-item.is-active { color: #fb7185; }

.toast-enter { animation: toastIn .35s cubic-bezier(.16,1,.3,1); }
@keyframes toastIn {
    from { opacity: 0; transform: translateY(16px) scale(.96); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.prose-damla { font-size: 1.05rem; line-height: 1.85; color: inherit; }
.prose-damla p { margin-bottom: 1.1rem; }
.prose-damla h1, .prose-damla h2, .prose-damla h3 {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 600;
    margin: 1.4rem 0 .7rem;
    line-height: 1.3;
}
.prose-damla h2 { font-size: 1.45rem; }
.prose-damla h3 { font-size: 1.2rem; }
.prose-damla blockquote {
    margin: 1.25rem 0;
    padding: .9rem 1rem;
    border-left: 3px solid #FF8FAB;
    background: rgba(255,143,171,.08);
    border-radius: 0 .85rem .85rem 0;
    font-style: italic;
}
.prose-damla img { border-radius: 1rem; margin: 1.25rem 0; }
.prose-damla strong { font-weight: 600; }
.dark .prose-damla blockquote { background: rgba(255,107,157,.08); }