/* Petaholic 派荷栗寵物 — 雜誌風自訂樣式(降低可愛度版) */

.shadow-cute,
.shadow-cute-peach {
    box-shadow: 3px 3px 0 #FF8A65;
}
.shadow-cute-biscuit {
    box-shadow: 2px 2px 0 #FFD3B5;
}
.shadow-cute-hover {
    box-shadow: 5px 5px 0 #FF8A65;
}
.shadow-cute-ink {
    box-shadow: 2px 2px 0 #2D1810;
}

.cute-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cute-card:hover {
    transform: translate(-2px, -3px);
    box-shadow: 5px 5px 0 #FF8A65;
}
.cute-card.shadow-cute-biscuit:hover {
    box-shadow: 4px 4px 0 #FFB5A0;
}

.cute-btn {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.cute-btn:hover {
    transform: translate(-1px, -1px);
}
.cute-btn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0 #2D1810;
}

.prose {
    font-family: 'Huninn', 'Noto Sans TC', sans-serif;
}
.prose h1, .prose h2, .prose h3 {
    font-family: 'Fraunces', 'Huninn', Georgia, serif;
    color: #2D1810;
    font-weight: 700;
    margin-top: 1.5em;
    margin-bottom: 0.6em;
    line-height: 1.35;
    letter-spacing: -0.3px;
}
.prose h1 { font-size: 2rem; }
.prose h2 { font-size: 1.625rem; }
.prose h3 { font-size: 1.25rem; }

.prose p {
    margin-bottom: 1em;
    line-height: 1.85;
    color: #5A3F2E;
    font-size: 1.0625rem;
}

.prose a {
    color: #FF6F43;
    text-decoration: none;
    border-bottom: 1.5px solid #FFD3B5;
    transition: border-color 0.2s;
}
.prose a:hover {
    border-bottom-color: #FF6F43;
}

.prose strong { color: #2D1810; font-weight: 700; }

.prose ul, .prose ol {
    margin: 1em 0;
    padding-left: 1.5em;
    line-height: 1.85;
    color: #5A3F2E;
}
.prose ul li { list-style: disc; margin-bottom: 0.4em; }
.prose ul li::marker { color: #FF8A65; }
.prose ol li { list-style: decimal; margin-bottom: 0.4em; }
.prose ol li::marker { color: #FF6F43; font-weight: 700; }

.prose blockquote {
    border-left: 3px solid #FF8A65;
    background: #FFE8D9;
    padding: 0.9em 1.2em;
    margin: 1.5em 0;
    color: #5A3F2E;
    font-style: italic;
    border-radius: 0 10px 10px 0;
    font-family: 'Fraunces', 'Huninn', serif;
}

.prose code {
    background: #FFE8D9;
    color: #B8421E;
    padding: 0.15em 0.4em;
    border-radius: 4px;
    font-size: 0.875em;
    font-family: 'SF Mono', Menlo, Monaco, monospace;
}

.prose pre {
    background: #2D1810;
    color: #FFF5EE;
    padding: 1.2em;
    border-radius: 12px;
    overflow-x: auto;
    margin: 1.5em 0;
    border: 1px solid #FF8A65;
}
.prose pre code { background: transparent; color: inherit; padding: 0; }

.prose img {
    border-radius: 12px;
    margin: 1.5em auto;
    max-width: 100%;
    height: auto;
    border: 1px solid #2D1810;
}

.prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0;
    border: 1px solid #2D1810;
    border-radius: 12px;
    overflow: hidden;
    font-family: 'Huninn', sans-serif;
}
.prose table th {
    background: #FF8A65;
    color: #FFF5EE;
    padding: 0.75em 1em;
    text-align: left;
    font-weight: 700;
}
.prose table td {
    padding: 0.6em 1em;
    border-bottom: 1px solid #FFE8D9;
}
.prose table tr:last-child td { border-bottom: none; }

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

html { scroll-behavior: smooth; }

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

::selection { background: #FFD3B5; color: #2D1810; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
h1, h2, h3 {
    animation: fadeUp 0.5s ease-out backwards;
}
h2 { animation-delay: 0.08s; }
h3 { animation-delay: 0.16s; }

@media (max-width: 640px) {
    .prose p { font-size: 1rem; }
    .prose h1 { font-size: 1.75rem; }
    .prose h2 { font-size: 1.375rem; }
}