:root {
                --color-bg: #07070a;
                --color-text: #e5e5e5;
                --color-text-dim: #9ca3af;
                --color-accent-gold: #d4af37;
                --color-accent-gold-dim: rgba(212, 175, 55, 0.3);
                --color-accent-purple: #9d8baf;
                --color-panel: rgba(20, 20, 25, 0.6);
            }

            body {
                background-color: #030304;
                color: var(--color-text);
                font-family: "Noto Sans SC", sans-serif;
                margin: 0;
                padding: 2rem 0;
                overflow-x: hidden;
                font-weight: 300;
            }

            h1,
            h2,
            h3,
            h4,
            .serif {
                font-family: "Noto Serif SC", serif;
            }

            .art-font {
                font-family: "Cormorant Garamond", serif;
            }

            /* A4 Page Container */
            .a4-page {
                width: 210mm;
                height: 297mm;
                margin: 0 auto 3rem auto;
                background-color: var(--color-bg);
                position: relative;
                box-shadow:
                    0 30px 60px -15px rgba(0, 0, 0, 1),
                    0 0 0 1px rgba(255, 255, 255, 0.05);
                overflow: hidden;
                box-sizing: border-box;
            }

            /* Backgrounds & Textures */
            .noise-bg {
                position: absolute;
                inset: 0;
                background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
                opacity: 0.05;
                mix-blend-mode: overlay;
                pointer-events: none;
                z-index: 1;
            }

            .fluid-glow {
                position: absolute;
                border-radius: 50%;
                filter: blur(100px);
                opacity: 0.4;
                pointer-events: none;
                z-index: 0;
            }

            /* ----- DECORATIVE FRAMES (New) ----- */
            .page-frame {
                position: absolute;
                inset: 20px;
                border: 1px solid rgba(255, 255, 255, 0.08);
                pointer-events: none;
                z-index: 5;
            }

            .page-frame::before {
                content: "";
                position: absolute;
                inset: 4px;
                border: 1px solid var(--color-accent-gold-dim);
                opacity: 0.3;
            }

            /* Corner Accents */
            .corner-accent {
                position: absolute;
                width: 15px;
                height: 15px;
                border: 1px solid var(--color-accent-gold);
                opacity: 0.8;
                z-index: 6;
            }

            .tl {
                top: 15px;
                left: 15px;
                border-right: none;
                border-bottom: none;
            }

            .tr {
                top: 15px;
                right: 15px;
                border-left: none;
                border-bottom: none;
            }

            .bl {
                bottom: 15px;
                left: 15px;
                border-right: none;
                border-top: none;
            }

            .br {
                bottom: 15px;
                right: 15px;
                border-left: none;
                border-top: none;
            }

            .content {
                position: relative;
                z-index: 10;
                width: 100%;
                height: 100%;
                padding: 55px 65px;
                box-sizing: border-box;
                display: flex;
                flex-direction: column;
            }

            /* Decorative Panels & Borders */
            .ornate-panel {
                background: linear-gradient(
                    135deg,
                    rgba(25, 25, 30, 0.8) 0%,
                    rgba(10, 10, 15, 0.9) 100%
                );
                border: 1px solid rgba(255, 255, 255, 0.05);
                border-top: 1px solid var(--color-accent-gold-dim);
                position: relative;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
            }

            .ornate-panel::after {
                content: "";
                position: absolute;
                bottom: 0;
                left: 50%;
                transform: translateX(-50%);
                width: 40px;
                height: 1px;
                background: var(--color-accent-gold);
                opacity: 0.5;
            }

            .text-gradient-gold {
                background: linear-gradient(120deg, #fff 0%, #d4af37 100%);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
            }

            .text-justify-art {
                text-align: justify;
                text-justify: inter-ideograph;
                letter-spacing: 0.05em;
            }

            /* Abstract SVG Backgrounds */
            .bg-graphic {
                position: absolute;
                pointer-events: none;
                opacity: 0.15;
                z-index: 2;
            }

            /* Animations */
            .fade-in {
                opacity: 0;
                transform: translateY(15px);
                transition:
                    opacity 1.2s cubic-bezier(0.25, 1, 0.5, 1),
                    transform 1.2s cubic-bezier(0.25, 1, 0.5, 1);
            }

            .fade-in.visible {
                opacity: 1;
                transform: translateY(0);
            }

            /* Print Settings */
            @media print {
                body {
                    padding: 0;
                    background: #000;
                }

                .a4-page {
                    margin: 0;
                    box-shadow: none;
                    page-break-after: always;
                    -webkit-print-color-adjust: exact;
                    print-color-adjust: exact;
                }

                .a4-page:last-child {
                    page-break-after: auto;
                }
            }

            @media (max-width: 850px) {
                .a4-page {
                    width: 100%;
                    height: auto;
                    aspect-ratio: 21 / 29.7;
                    margin-bottom: 2rem;
                }

                .content {
                    padding: 40px;
                }

                html {
                    font-size: 14px;
                }
            }