:root {
            --p-green: #a0f98c;
            --s-yellow: #e1e6ac;
            --dark-line: rgba(8, 13, 8, 0.4);
            --bangers: 'Bangers', cursive;
        }

        * {
            cursor: crosshair;
            scrollbar-width: thin;
            scrollbar-color: var(--p-green) var(--s-yellow);
        }

        body {
            background-color: var(--p-green);
            color: var(--dark-line);
            font-family: var(--bangers);
            margin: 0;
            overflow-x: hidden;
            line-height: 1.1;
            letter-spacing: 0em;
        }

        /* --- BACKGROUND GRIDS --- */
        .blueprint-grid {
            background-image: 
                linear-gradient(var(--dark-line) 1px, transparent 1px),
                linear-gradient(90deg, var(--dark-line) 1px, transparent 1px);
            background-size: 50px 50px;
        }

        .blueprint-grid-fine {
            background-image: 
                linear-gradient(var(--dark-line) 0.5px, transparent 0.5px),
                linear-gradient(90deg, var(--dark-line) 0.5px, transparent 0.5px);
            background-size: 10px 10px;
        }

        /* --- ANIMATIONS --- */
        @keyframes drawLine { from { width: 0; } to { width: 100%; } }
        @keyframes stamp { 
            0% { transform: scale(5); opacity: 0; } 
            100% { transform: scale(1); opacity: 1; } 
        }
        @keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
        @keyframes bounceDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(10px); } }

        .stamp { animation: stamp 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
        .draw-full { animation: drawLine 1.5s ease-out forwards; }
        .blink { animation: blink 1s infinite; }
        .bounce { animation: bounceDown 2s infinite; }

        /* --- UI COMPONENTS --- */
        .btn-blueprint {
            background: var(--s-yellow);
            border: 4px solid var(--dark-line);
            padding: 1rem 1rem;
            text-transform: uppercase;
            font-size:1rem;
            transition: all 0.1s steps(2);
            position: relative;
        }

        .btn-blueprint:hover {
            transform: translate(-4px, -4px);
            box-shadow: 8px 8px 0px var(--dark-line);
        }

        .btn-outline {
            background: transparent;
            border: 4px solid var(--dark-line);
            padding: 1rem 2rem;
            font-size: 1rem;
            transition: all 0.2s;
        }

        .btn-outline:hover {
            background: rgba(246, 255, 153, 0.3);
            border-style: dashed;
        }

        .card-blueprint {
            border: 3px solid var(--dark-line);
            background: rgba(246, 255, 153, 0.1);
            padding: 2.5rem;
            transition: 0.3s cubic-bezier(0.2, 1, 0.3, 1);
            position: relative;
            overflow: hidden;
        }

        .card-blueprint:hover {
            background: var(--s-yellow);
            transform: rotate(-1deg) scale(1.02);
        }

        .diagonal-split {
            clip-path: polygon(0 0, 100% 0, 100% 88%, 0% 100%);
        }

        .pull-quote {
            font-size: 2rem;
            transform: rotate(-3deg);
            background: var(--s-yellow);
            display: inline-block;
            padding: 1rem 3rem;
            border: 4px solid var(--dark-line);
            margin: 4rem 0;
        }

        /* --- LOADER --- */
        #loader {
            position: fixed;
            inset: 0;
            background: var(--p-green);
            z-index: 9999;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 2rem;
        }

        /* --- UTILS --- */
        .huge-text { font-size: clamp(2rem, 10vw, 10rem); line-height: 0.85; text-transform: uppercase; }
        .modal-bg { background: rgba(167, 227, 153, 0.95); backdrop-filter: blur(10px); }
        input, select { 
            background: transparent; 
            border: 4px solid var(--dark-line); 
            padding: 1rem; 
            font-family: var(--bangers);
            font-size: 0.5rem;
            width: 100%;
        }

        .page-transition {
            animation: slideIn 0.5s steps(10) forwards;
        }

        @keyframes slideIn {
            from { transform: translateX(50px); opacity: 0; }
            to { transform: translateX(0); opacity: 1; }
        }