@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&family=Noto+Serif+Telugu:wght@400;600;700&family=Tiro+Telugu&display=swap');

html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background-color: #fdf8f5; background-image: url('https://www.transparenttextures.com/patterns/cream-paper.png'); }

.telugu-text { font-family: 'Noto Serif Telugu', serif; }
.poem-text-font { font-family: 'Tiro Telugu', serif; line-height: 1.8; }

#ns-toast { transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
article { overflow: hidden; z-index: 1; }
.export-card { background-color: #ffffff !important; }

.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

@keyframes slideInLeft {
    0% { transform: translateX(70px); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes slideInRight {
    0% { transform: translateX(-70px); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

.anim-slide-left {
    animation: slideInLeft 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.anim-slide-right {
    animation: slideInRight 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}


/* Final per-line sloka fitting.
   Grid remains a single column. Each source line stays one visual line
   and only that line is reduced until it fits. */
.ns-linefit {
    display: block;
    width: 100%;
    font-size: 21px !important;
    line-height: 1.75 !important;
    text-align: center;
    overflow: visible;
}

.ns-linefit .ns-sloka-line {
    display: block;
    width: 100%;
    max-width: 100%;
    font-size: var(--ns-line-size, 21px);
    line-height: 1.75;
    white-space: nowrap;
    text-align: center;
    margin: 0;
    padding: 0;
}

.ns-bhavam-heading {
    font-size: 18px !important;
    line-height: 1.5 !important;
}

@media (max-width: 768px) {
    .ns-linefit {
        font-size: 19px !important;
        line-height: 1.7 !important;
    }
    .ns-linefit .ns-sloka-line {
        font-size: var(--ns-line-size, 19px);
        line-height: 1.7;
    }
    .ns-bhavam-heading {
        font-size: 16px !important;
    }
}

/* Watermark must sit visibly above the poem/bhavam content. */
article[id^="p"] > .absolute.pointer-events-none {
    z-index: 40 !important;
    opacity: 0.14 !important;
}


/* Only an individual sloka line may wrap after reaching the fixed minimum.
   The card, grid and all surrounding layout remain untouched. */
.ns-linefit .ns-sloka-line.ns-line-wrap {
    white-space: normal !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    text-align: center;
}


/* Locked minimum: Sloka font may never become smaller than the Bhavam heading. */
.ns-bhavam-heading {
    font-size: 18px !important;
    line-height: 1.5 !important;
}
@media (max-width: 768px) {
    .ns-bhavam-heading {
        font-size: 16px !important;
    }
}


/* FINAL: Sloka font size is fixed to exactly the Bhavam heading size.
   No auto-reduction. No responsive size change independent of Bhavam. */
.ns-linefit .ns-sloka-line {
    font-size: 18px !important;
    line-height: 1.75 !important;
}
@media (max-width: 768px) {
    .ns-linefit .ns-sloka-line {
        font-size: 16px !important;
        line-height: 1.7 !important;
    }
}