/* === FROST REACH === */
        .reach-frost {
            --reach-primary: #8694AA;
            --reach-accent: #BCF4FF;
            --reach-light: #E9FBFF;
            --reach-background: #8694AA;
            --reach-text: #E9FBFF;
            --reach-muted: #B4C5D1;
            --reach-highlight: #BCF4FF;
            
            --reach-font-heading: 'Agu Display', serif;
            --reach-font-body: 'Oswald', sans-serif;
            --reach-font-decorative: 'Agu Display', serif;
            
            background-color: var(--reach-background);
            color: var(--reach-text);
        }

        /* Frost: Snowflake wax seals */
        .reach-frost .wax-seal::after {
            content: "❄️";
        }

        /* Frost: Icy crystalline edges */
        .reach-frost .artifact-frame.style-torn {
            border: 2px solid var(--reach-accent);
            border-radius: 15px;
            position: relative;
            clip-path: none;
            overflow: hidden;
        }

        .reach-frost .artifact-frame.style-torn::before {
            content: "";
            position: absolute;
            top: -2px;
            left: -2px;
            right: -2px;
            bottom: -2px;
            background: 
                linear-gradient(45deg, var(--reach-highlight) 1px, transparent 1px),
                linear-gradient(-45deg, var(--reach-accent) 1px, transparent 1px);
            background-size: 8px 8px, 12px 12px;
            z-index: -1;
            border-radius: 15px;
            animation: frost-shimmer 4s ease-in-out infinite;
        }

        @keyframes frost-shimmer {
            0%, 100% { opacity: 0.3; background-position: 0px 0px; }
            50% { opacity: 0.7; background-position: 8px 8px; }
        }

        /* Frost: Ice crystal watermarks */
        .reach-frost .watermark {
            background: 
                radial-gradient(circle, var(--reach-highlight) 1px, transparent 2px),
                conic-gradient(from 0deg, var(--reach-accent), transparent, var(--reach-accent));
            background-size: 15px 15px, 60px 60px;
            opacity: 0.15;
            animation: ice-rotate 8s linear infinite;
        }

        @keyframes ice-rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }


/* === EXAMPLES === */
/*
<div class="reach-REACHNAME">
  <h1 class="text-main">Title</h1>
  <p class="text-muted">Subtle info here</p>
  <button class="bg-accent">Click me</button>
</div>
*/