{"id":579,"date":"2026-03-17T00:00:31","date_gmt":"2026-03-17T00:00:31","guid":{"rendered":"https:\/\/onlinetexteditor.io\/?page_id=579"},"modified":"2026-04-06T09:18:24","modified_gmt":"2026-04-06T09:18:24","slug":"crazy-text-generator","status":"publish","type":"page","link":"https:\/\/onlinetexteditor.io\/it\/crazy-text-generator\/","title":{"rendered":"Crazy Text Generator \u2013 Transform Instantly"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8221;1&#8243; fullwidth=&#8221;on&#8221; theme_builder_area=&#8221;post_content&#8221; _builder_version=&#8221;4.27.4&#8243; _module_preset=&#8221;default&#8221;][et_pb_fullwidth_code _builder_version=&#8221;4.27.4&#8243; _module_preset=&#8221;default&#8221; theme_builder_area=&#8221;post_content&#8221; hover_enabled=&#8221;0&#8243; sticky_enabled=&#8221;0&#8243;]<!-- START OF FILE Crazy Text Generator -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n    .pg-crazy-wrapper {\r\n        --primary-font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\r\n        \r\n        --theme-panel: rgba(25, 15, 40, 0.96);\r\n        --theme-panel-hover: rgba(40, 20, 65, 0.98);\r\n        --theme-bg-alt: rgba(15, 8, 25, 0.9);\r\n        --theme-border: rgba(255, 0, 128, 0.25);\r\n        \r\n        --crazy-neon: #ff0080;\r\n        --crazy-green: #00ff88;\r\n        --crazy-yellow: #ffff00;\r\n        --crazy-purple: #8000ff;\r\n        --crazy-cyan: #00ffff;\r\n        --text-bright: #ffddff;\r\n        --text-muted: #c89fd8;\r\n        \r\n        --grad-master: linear-gradient(135deg, #667eea 0%, #361656 100%);\r\n        --grad-crazy: linear-gradient(135deg, #ff0080, #8000ff, #00ff88);\r\n        --grad-shimmer: linear-gradient(90deg, transparent, rgba(255, 0, 128, 0.4), transparent);\r\n        \r\n        --glow-neon: 0 0 30px rgba(255, 0, 128, 0.6);\r\n        --glow-green: 0 0 25px rgba(0, 255, 136, 0.5);\r\n        --shadow-ui: 0 20px 50px rgba(0, 0, 0, 0.75);\r\n        --shadow-card: 0 10px 25px rgba(128, 0, 255, 0.4);\r\n        \r\n        --transition-ui: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        --transition-fast: all 0.2s ease;\r\n        \r\n        font-family: var(--primary-font);\r\n        color: var(--text-bright);\r\n        line-height: 1.5;\r\n        width: 100%;\r\n        overflow-x: hidden;\r\n        text-align: center;\r\n        background: var(--grad-master);\r\n        background-attachment: fixed;\r\n    }\r\n\r\n    .pg-crazy-wrapper * { box-sizing: border-box; }\r\n\r\n    .pg-crazy-container {\r\n        max-width: 1100px !important;\r\n        width: 100% !important;\r\n        margin: 0 auto !important;\r\n        padding: 40px 20px !important;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    .pg-crazy-hero {\r\n        z-index: 2;\r\n        padding-top: 10px;\r\n        width: 100%;\r\n    }\r\n\r\n    .pg-crazy-title {\r\n        font-family: var(--primary-font);\r\n        font-size: 3.2rem;\r\n        font-weight: 900;\r\n        line-height: 1.1;\r\n        margin: 0 auto 12px auto;\r\n        letter-spacing: -1px;\r\n        color: #ffffff !important;\r\n        background: none;\r\n        -webkit-text-fill-color: #ffffff !important;\r\n        max-width: 1000px;\r\n        position: relative;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        flex-wrap: wrap;\r\n        gap: 16px;\r\n        filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.25));\r\n        transition: var(--transition-ui);\r\n    }\r\n    \r\n    .pg-crazy-title i {\r\n        background: linear-gradient(135deg, #ff0080, #00ffff);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        background-clip: text;\r\n        background: transparent;\r\n        border-radius: 16px;\r\n        padding: 12px;\r\n        font-size: 2.2rem;\r\n        filter: drop-shadow(0 0 15px rgba(0, 255, 136, 0.6));\r\n        transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n    }\r\n    \r\n    .pg-crazy-title:hover i {\r\n        animation: crazy-shake 0.6s ease-in-out;\r\n    }\r\n    \r\n    @keyframes crazy-shake {\r\n        0%, 100% { transform: rotate(0deg); }\r\n        20% { transform: rotate(-20deg) scale(1.2); }\r\n        40% { transform: rotate(20deg) scale(1.1); }\r\n        60% { transform: rotate(-15deg) scale(1.15); }\r\n        80% { transform: rotate(10deg) scale(1.05); }\r\n    }\r\n\r\n    .pg-crazy-title::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: -15px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        display: block;\r\n        width: 60px;\r\n        height: 5px;\r\n        background: var(--grad-crazy);\r\n        border-radius: 5px;\r\n        transition: var(--transition-ui);\r\n    }\r\n    \r\n    .pg-crazy-title:hover::after {\r\n        width: 280px;\r\n        box-shadow: var(--glow-neon);\r\n    }\r\n    \r\n    .pg-crazy-subtitle {\r\n        font-family: var(--primary-font);\r\n        font-size: 1.2rem;\r\n        color: rgba(255, 221, 255, 0.9);\r\n        max-width: 850px;\r\n        margin: 25px auto 35px auto;\r\n        padding: 0 10px;\r\n        font-weight: 600;\r\n        text-shadow: 0 2px 10px rgba(0,0,0,0.6);\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .pg-crazy-main-card {\r\n        background: var(--theme-panel);\r\n        backdrop-filter: blur(16px);\r\n        -webkit-backdrop-filter: blur(16px);\r\n        border: 2px solid transparent;\r\n        width: 100%;\r\n        box-shadow: var(--shadow-ui);\r\n        border-radius: 20px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        display: flex;\r\n        flex-direction: column;\r\n        background-clip: padding-box;\r\n    }\r\n    \r\n    .pg-crazy-main-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0; right: 0; bottom: 0;\r\n        background: linear-gradient(135deg, var(--crazy-neon), var(--crazy-purple), var(--crazy-green)) border-box;\r\n        border: 2px solid transparent;\r\n        -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\r\n        -webkit-mask-composite: xor;\r\n        mask-composite: exclude;\r\n        opacity: 0.8;\r\n        z-index: 0;\r\n        animation: border-rotate 4s linear infinite;\r\n    }\r\n    \r\n    @keyframes border-rotate {\r\n        0%, 100% { opacity: 0.8; filter: hue-rotate(0deg); }\r\n        50% { opacity: 1; filter: hue-rotate(90deg); }\r\n    }\r\n    \r\n    .pg-crazy-main-card:hover::before {\r\n        opacity: 1;\r\n    }\r\n\r\n    .pg-crazy-header {\r\n        padding: 20px 24px;\r\n        border-bottom: 2px dashed rgba(255, 0, 128, 0.3);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 18px;\r\n        background: linear-gradient(90deg, rgba(255,0,128,0.1), transparent);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-avatar {\r\n        width: 52px;\r\n        height: 52px;\r\n        border-radius: 14px;\r\n        background: var(--grad-crazy);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 1.6rem;\r\n        color: #fff;\r\n        box-shadow: 0 0 20px rgba(255, 0, 128, 0.5);\r\n        transition: transform 0.3s ease;\r\n        animation: pulse-glow 2s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes pulse-glow {\r\n        0%, 100% { box-shadow: 0 0 20px rgba(255, 0, 128, 0.5); }\r\n        50% { box-shadow: 0 0 35px rgba(0, 255, 136, 0.7); }\r\n    }\r\n    \r\n    .pg-crazy-header:hover .pg-crazy-avatar { \r\n        transform: rotate(720deg) scale(1.1);\r\n    }\r\n\r\n    .pg-crazy-header-text {\r\n        font-weight: 800;\r\n        font-size: 1.3rem;\r\n        color: var(--crazy-neon);\r\n        letter-spacing: 1px;\r\n        text-transform: uppercase;\r\n        text-shadow: 0 0 10px rgba(255, 0, 128, 0.4);\r\n    }\r\n\r\n    .pg-crazy-input-area {\r\n        padding: 28px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 20px;\r\n        background: var(--theme-bg-alt);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-textarea {\r\n        width: 100% !important;\r\n        min-height: 160px !important;\r\n        padding: 24px 24px !important;\r\n        background: rgba(0, 0, 0, 0.4) !important;\r\n        border: 2px dashed var(--crazy-neon) !important;\r\n        color: var(--crazy-green) !important;\r\n        font-family: var(--primary-font) !important;\r\n        font-weight: 700 !important;\r\n        font-size: 1.8rem !important;\r\n        outline: none !important;\r\n        text-align: left !important;\r\n        white-space: pre-wrap !important;\r\n        word-break: break-word !important;\r\n        overflow-wrap: break-word !important;\r\n        resize: vertical;\r\n        border-radius: 16px;\r\n        transition: var(--transition-fast);\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-textarea:focus {\r\n        border-style: solid !important;\r\n        border-color: var(--crazy-cyan) !important;\r\n        box-shadow: 0 0 0 5px rgba(0, 255, 255, 0.2), inset 0 0 30px rgba(0, 255, 255, 0.05) !important;\r\n        animation: glitch-border 0.3s ease;\r\n    }\r\n    \r\n    @keyframes glitch-border {\r\n        0% { transform: translate(0); }\r\n        20% { transform: translate(-3px, 2px); }\r\n        40% { transform: translate(3px, -2px); }\r\n        60% { transform: translate(-2px, -3px); }\r\n        80% { transform: translate(2px, 3px); }\r\n        100% { transform: translate(0); }\r\n    }\r\n    \r\n    .pg-crazy-textarea::placeholder { color: var(--text-muted); opacity: 0.6; }\r\n\r\n    .pg-crazy-toolbar {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n        gap: 14px;\r\n        padding: 16px 20px;\r\n        border: 2px solid var(--crazy-purple);\r\n        border-radius: 14px;\r\n        background: rgba(128, 0, 255, 0.15);\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-toolbar::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: -2px; left: 50%; transform: translateX(-50%);\r\n        width: 80px; height: 2px;\r\n        background: var(--crazy-green);\r\n        box-shadow: var(--glow-green);\r\n    }\r\n\r\n    .pg-crazy-tool-group {\r\n        display: flex;\r\n        gap: 12px;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n    }\r\n\r\n    .pg-crazy-btn {\r\n        background: transparent;\r\n        color: var(--text-muted);\r\n        border: 2px solid var(--crazy-purple);\r\n        padding: 12px 16px;\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 700;\r\n        border-radius: 10px;\r\n        cursor: pointer;\r\n        transition: var(--transition-fast);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-btn::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: -100%;\r\n        width: 100%; height: 100%;\r\n        background: var(--grad-shimmer);\r\n        transition: left 0.4s ease;\r\n    }\r\n    \r\n    .pg-crazy-btn:hover {\r\n        background: rgba(255, 0, 128, 0.2);\r\n        color: var(--crazy-neon);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n        transform: scale(1.05);\r\n    }\r\n    \r\n    .pg-crazy-btn:hover::before { left: 100%; }\r\n\r\n    .pg-crazy-btn.primary-btn {\r\n        color: var(--crazy-green);\r\n        background: rgba(0, 255, 136, 0.15);\r\n        border-color: var(--crazy-green);\r\n    }\r\n    \r\n    .pg-crazy-btn.primary-btn:hover {\r\n        background: rgba(0, 255, 136, 0.3);\r\n        box-shadow: var(--glow-green);\r\n    }\r\n\r\n    .pg-crazy-btn:active { transform: scale(0.95); }\r\n\r\n    .pg-crazy-preset {\r\n        background: rgba(0,0,0,0.4);\r\n        color: var(--crazy-yellow);\r\n        border: 2px solid var(--crazy-yellow);\r\n        padding: 12px 16px;\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 700;\r\n        border-radius: 10px;\r\n        cursor: pointer;\r\n        outline: none;\r\n        transition: var(--transition-fast);\r\n        min-width: 200px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n    \r\n    .pg-crazy-preset:hover, .pg-crazy-preset:focus {\r\n        background: rgba(255, 255, 0, 0.2);\r\n        color: var(--crazy-neon);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n    }\r\n    \r\n    .pg-crazy-preset option {\r\n        background: var(--theme-panel);\r\n        color: var(--text-bright);\r\n    }\r\n\r\n    .pg-crazy-settings {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        gap: 26px;\r\n        padding: 30px 24px;\r\n        background: var(--theme-panel);\r\n        border-top: 2px solid var(--crazy-purple);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-label {\r\n        display: flex;\r\n        align-items: center;\r\n        font-family: var(--primary-font);\r\n        font-size: 1rem;\r\n        font-weight: 800;\r\n        color: var(--crazy-neon);\r\n        margin-bottom: 14px;\r\n        gap: 10px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n        text-shadow: 0 0 15px rgba(255, 0, 128, 0.5);\r\n    }\r\n    \r\n    .pg-crazy-label i {\r\n        color: var(--crazy-cyan);\r\n        font-size: 1.2rem;\r\n        animation: icon-bounce 2s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes icon-bounce {\r\n        0%, 100% { transform: translateY(0); }\r\n        50% { transform: translateY(-5px) scale(1.1); }\r\n    }\r\n\r\n    .pg-crazy-options {\r\n        display: grid;\r\n        gap: 12px;\r\n        grid-template-columns: repeat(2, 1fr);\r\n    }\r\n\r\n    .pg-crazy-opt-btn {\r\n        background: rgba(255, 255, 255, 0.04);\r\n        border: 2px solid transparent;\r\n        padding: 16px 12px;\r\n        color: var(--text-bright);\r\n        font-family: var(--primary-font);\r\n        font-size: 0.85rem;\r\n        font-weight: 700;\r\n        cursor: pointer;\r\n        border-radius: 14px;\r\n        transition: var(--transition-fast);\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        gap: 8px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 0.5px;\r\n    }\r\n    \r\n    .pg-crazy-opt-btn i {\r\n        font-size: 1.4rem;\r\n        color: var(--text-muted);\r\n        transition: var(--transition-fast);\r\n    }\r\n    \r\n    .pg-crazy-opt-btn::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; right: 0;\r\n        width: 0; height: 100%;\r\n        background: linear-gradient(90deg, transparent, rgba(255, 0, 128, 0.2), transparent);\r\n        transition: width 0.6s ease;\r\n    }\r\n    \r\n    .pg-crazy-opt-btn:hover::after { width: 100%; }\r\n    \r\n    .pg-crazy-opt-btn:hover {\r\n        background: rgba(255, 0, 128, 0.15);\r\n        transform: translateY(-4px) rotate(-2deg);\r\n        border-color: var(--crazy-purple);\r\n        box-shadow: 0 0 20px rgba(128, 0, 255, 0.4);\r\n    }\r\n\r\n    .pg-crazy-opt-btn:hover i {\r\n        color: var(--crazy-yellow);\r\n        transform: scale(1.3) rotate(10deg);\r\n    }\r\n\r\n    .pg-crazy-opt-btn.active {\r\n        background: rgba(255, 0, 128, 0.4);\r\n        color: #fff;\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: 0 0 25px rgba(255, 0, 128, 0.6), inset 0 0 15px rgba(255, 0, 128, 0.3);\r\n        animation: btn-pulse 1.5s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes btn-pulse {\r\n        0%, 100% { box-shadow: 0 0 25px rgba(255, 0, 128, 0.6); }\r\n        50% { box-shadow: 0 0 40px rgba(255, 0, 128, 0.9); }\r\n    }\r\n    \r\n    .pg-crazy-opt-btn.active::after { width: 100%; background: rgba(255, 255, 255, 0.1); }\r\n    \r\n    .pg-crazy-opt-btn.active i {\r\n        color: var(--crazy-green);\r\n        animation: icon-rotate 2s linear infinite;\r\n    }\r\n    \r\n    @keyframes icon-rotate {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    .pg-crazy-results {\r\n        padding: 45px 0;\r\n        width: 100%;\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(3, 1fr);\r\n        gap: 24px;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n\r\n    .pg-crazy-card {\r\n        background: var(--theme-panel);\r\n        border: 2px solid var(--theme-border);\r\n        padding: 22px;\r\n        transition: var(--transition-ui);\r\n        position: relative;\r\n        overflow: hidden;\r\n        border-radius: 16px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        box-shadow: var(--shadow-card);\r\n        clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));\r\n    }\r\n    \r\n    .pg-crazy-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -50%; left: -50%;\r\n        width: 200%; height: 200%;\r\n        background: conic-gradient(from 0deg, transparent, var(--crazy-neon), transparent 40%);\r\n        opacity: 0;\r\n        transition: opacity 0.5s ease;\r\n        animation: spin 4s linear infinite;\r\n    }\r\n    \r\n    @keyframes spin {\r\n        to { transform: rotate(360deg); }\r\n    }\r\n    \r\n    .pg-crazy-card:hover {\r\n        transform: translateY(-8px) scale(1.02);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: 0 0 30px rgba(255, 0, 128, 0.5), 0 20px 40px rgba(0, 0, 0, 0.7);\r\n    }\r\n    \r\n    .pg-crazy-card:hover::before { opacity: 0.15; }\r\n    \r\n    .pg-crazy-card::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0;\r\n        width: 100%; height: 100%;\r\n        background: linear-gradient(135deg, transparent 40%, rgba(0, 255, 136, 0.05) 100%);\r\n        pointer-events: none;\r\n    }\r\n\r\n    .pg-crazy-card-header {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        width: 100%;\r\n        margin-bottom: 18px;\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n    \r\n    .pg-crazy-card-profile {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 14px;\r\n    }\r\n\r\n    .pg-crazy-card-avatar {\r\n        width: 44px;\r\n        height: 44px;\r\n        border-radius: 12px;\r\n        background: var(--grad-crazy);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        color: #fff;\r\n        font-size: 1.2rem;\r\n        box-shadow: 0 0 15px rgba(255, 0, 128, 0.5);\r\n    }\r\n\r\n    .pg-crazy-card-meta {\r\n        display: flex;\r\n        flex-direction: column;\r\n        text-align: left;\r\n    }\r\n\r\n    .pg-crazy-card-title {\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 800;\r\n        color: var(--crazy-neon);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-card-time {\r\n        font-size: 0.75rem;\r\n        color: var(--text-muted);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 5px;\r\n    }\r\n\r\n    .pg-crazy-copy-btn {\r\n        background: rgba(255, 0, 128, 0.15);\r\n        border: 2px solid var(--crazy-purple);\r\n        color: var(--crazy-cyan);\r\n        width: 42px;\r\n        height: 42px;\r\n        border-radius: 12px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        cursor: pointer;\r\n        transition: var(--transition-fast);\r\n        outline: none;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n    \r\n    .pg-crazy-copy-btn i { font-size: 1.1rem; transition: all 0.25s ease; }\r\n    \r\n    .pg-crazy-copy-btn:hover {\r\n        background: var(--crazy-neon);\r\n        color: #fff;\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n        transform: scale(1.15);\r\n    }\r\n    \r\n    .pg-crazy-copy-btn:hover i { transform: rotate(360deg) scale(1.3); }\r\n    \r\n    .pg-crazy-copy-btn:active { transform: scale(0.85); }\r\n    \r\n    .pg-crazy-copy-btn.copied {\r\n        background: var(--crazy-green) !important;\r\n        color: #000 !important;\r\n        border-color: var(--crazy-green) !important;\r\n        box-shadow: var(--glow-green) !important;\r\n    }\r\n\r\n    .pg-crazy-card-preview {\r\n        font-size: 1.3rem;\r\n        color: var(--crazy-cyan);\r\n        width: 100%;\r\n        text-align: left;\r\n        font-family: var(--primary-font);\r\n        font-weight: 700;\r\n        position: relative;\r\n        z-index: 1;\r\n        padding: 8px 0 18px 0;\r\n        transition: all 0.3s ease;\r\n        white-space: pre-wrap !important;\r\n        word-break: break-word !important;\r\n        overflow-wrap: break-word !important;\r\n        box-sizing: border-box !important;\r\n        line-height: 1.4 !important;\r\n        max-height: 150px;\r\n        overflow: hidden;\r\n        letter-spacing: 0.5px;\r\n    }\r\n    \r\n    .pg-crazy-card:hover .pg-crazy-card-preview {\r\n        color: var(--crazy-neon);\r\n        text-shadow: 0 0 10px rgba(255, 0, 128, 0.4);\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-card-footer {\r\n        border-top: 2px dashed rgba(128, 0, 255, 0.4);\r\n        padding-top: 15px;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        color: var(--text-muted);\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        flex-wrap: wrap;\r\n        gap: 6px;\r\n        position: relative;\r\n        z-index: 1;\r\n        text-transform: uppercase;\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .pg-crazy-card-action {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n        cursor: pointer;\r\n        transition: all 0.2s ease;\r\n    }\r\n    .pg-crazy-card-action:hover { color: var(--crazy-green); }\r\n    .pg-crazy-card-action:hover i { transform: scale(1.3) rotate(-10deg); }\r\n    .pg-crazy-card-action i { transition: all 0.25s ease; }\r\n\r\n    .pg-crazy-load-btn {\r\n        background: var(--theme-panel);\r\n        color: var(--crazy-neon);\r\n        border: 3px solid var(--crazy-neon);\r\n        padding: 16px 45px;\r\n        font-family: var(--primary-font);\r\n        font-weight: 900;\r\n        font-size: 1.1rem;\r\n        cursor: pointer;\r\n        margin-top: 35px;\r\n        border-radius: 12px;\r\n        transition: var(--transition-fast);\r\n        position: relative;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 14px;\r\n        box-shadow: 0 0 25px rgba(255, 0, 128, 0.4);\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n    }\r\n    \r\n    .pg-crazy-load-btn::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: -100%; width: 100%; height: 100%;\r\n        background: var(--grad-crazy);\r\n        transition: left 0.5s ease;\r\n        z-index: 0;\r\n    }\r\n    \r\n    .pg-crazy-load-btn span, .pg-crazy-load-btn i { position: relative; z-index: 1; }\r\n    \r\n    .pg-crazy-load-btn:hover {\r\n        color: #fff;\r\n        border-color: transparent;\r\n        transform: translateY(-5px);\r\n        box-shadow: 0 0 50px rgba(255, 0, 128, 0.8);\r\n    }\r\n    \r\n    .pg-crazy-load-btn:hover::before { left: 0; }\r\n    .pg-crazy-load-btn:hover i { transform: translateY(8px) rotate(720deg); }\r\n    .pg-crazy-load-btn:active { transform: translateY(0); }\r\n\r\n    .pg-crazy-toast {\r\n        visibility: hidden;\r\n        background: rgba(15, 8, 25, 0.98);\r\n        color: var(--crazy-green);\r\n        padding: 20px 30px;\r\n        position: fixed;\r\n        left: 50%;\r\n        bottom: 50px;\r\n        transform: translateX(-50%) translateY(30px);\r\n        font-family: var(--primary-font);\r\n        font-weight: 800;\r\n        z-index: 10000;\r\n        border-radius: 12px;\r\n        box-shadow: 0 15px 40px rgba(0,0,0,0.8);\r\n        opacity: 0;\r\n        transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 16px;\r\n        border: 2px solid var(--crazy-green);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n    \r\n    .pg-crazy-toast i {\r\n        color: #000;\r\n        background: var(--crazy-green);\r\n        border-radius: 50%;\r\n        padding: 6px;\r\n        font-size: 1.2rem;\r\n        box-shadow: var(--glow-green);\r\n    }\r\n    \r\n    .pg-crazy-toast.show {\r\n        visibility: visible;\r\n        opacity: 1;\r\n        transform: translateX(-50%) translateY(0);\r\n    }\r\n\r\n    @media (max-width: 900px) {\r\n        .pg-crazy-grid { grid-template-columns: repeat(2, 1fr); }\r\n        .pg-crazy-title { font-size: 2.5rem; }\r\n        .pg-crazy-settings { grid-template-columns: 1fr; }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .pg-crazy-grid { grid-template-columns: 1fr; }\r\n        .pg-crazy-container { padding: 30px 15px !important; }\r\n        .pg-crazy-results { padding: 25px 0; }\r\n        .pg-crazy-settings { padding: 20px; gap: 20px; }\r\n        .pg-crazy-textarea { min-height: 140px !important; font-size: 1.4rem !important; }\r\n        \r\n        .pg-crazy-toolbar { flex-direction: column; align-items: stretch; }\r\n        .pg-crazy-tool-group { justify-content: space-between; }\r\n        .pg-crazy-preset { width: 100%; text-align: center; }\r\n        \r\n        .pg-crazy-card { padding: 18px; }\r\n        .pg-crazy-card-preview { font-size: 1.15rem; max-height: 140px; }\r\n        \r\n        .pg-crazy-opt-btn { padding: 14px 10px; font-size: 0.8rem; }\r\n        .pg-crazy-load-btn { padding: 14px 30px; font-size: 0.95rem; width: 100%; justify-content: center; }\r\n        .pg-crazy-title { font-size: 1.9rem; }\r\n        .pg-crazy-subtitle { font-size: 0.95rem; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"pg-crazy-wrapper\" id=\"pg-crazy-tool\">\r\n    <div class=\"pg-crazy-container pg-crazy-hero\">\r\n        <h1 class=\"pg-crazy-title\"><i class=\"fa-solid fa-bolt-lightning\"><\/i> <i class=\"fa-solid fa-wand-magic-sparkles\"><\/i> Crazy Text Generator \u2013 Transform Instantly<\/h1>\r\n        <p class=\"pg-crazy-subtitle\">Unleash chaos! Transform boring text into wild, glitchy, attention-grabbing madness with random case, symbols, strikes, and insane Unicode effects.<\/p>\r\n        \r\n        <div class=\"pg-crazy-main-card\">\r\n            <div class=\"pg-crazy-header\">\r\n                <div class=\"pg-crazy-avatar\"><i class=\"fa-solid fa-skull\"><\/i><\/div>\r\n                <div class=\"pg-crazy-header-text\">\ud83d\udca5 Generate Insanity \ud83d\udca5<\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"pg-crazy-input-area\">\r\n                <textarea class=\"pg-crazy-textarea\" id=\"pgCrazyInput\" placeholder=\"Type something to go CRAZY with!\"><\/textarea>\r\n                \r\n                <div class=\"pg-crazy-toolbar\">\r\n                    <div class=\"pg-crazy-tool-group\">\r\n                        <button class=\"pg-crazy-btn\" id=\"pgCrazyPaste\" title=\"Paste\"><i class=\"fa-solid fa-clipboard\"><\/i> Paste<\/button>\r\n                        <button class=\"pg-crazy-btn\" id=\"pgCrazySelect\" title=\"Select\"><i class=\"fa-solid fa-object-group\"><\/i> Select<\/button>\r\n                        <button class=\"pg-crazy-btn primary-btn\" id=\"pgCrazyCopyBase\" title=\"Copy Original\"><i class=\"fa-regular fa-copy\"><\/i> Copy<\/button>\r\n                    <\/div>\r\n                    \r\n                    <select class=\"pg-crazy-preset\" id=\"pgCrazyPreset\">\r\n                        <option value=\"\" disabled selected>\ud83e\udd2a Crazy Presets<\/option>\r\n                        <option value=\"THIS IS INSANE!\">\ud83d\udd25 Pure Chaos<\/option>\r\n                        <option value=\"Glitch Mode Activated\">\ud83d\udcbb Glitch Text<\/option>\r\n                        <option value=\"S T R E T C H E D\">\ud83d\udccf Spaced Out<\/option>\r\n                        <option value=\"zalgo text is scary\">\ud83d\udc79 Zalgo Horror<\/option>\r\n                        <option value=\"l33t h4x0r\">\ud83c\udfae Leet Speak<\/option>\r\n                        <option value=\"cRiNgE wRiTInG\">\ud83d\ude2c Alternating Caps<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"pg-crazy-settings\">\r\n                <div>\r\n                    <div class=\"pg-crazy-label\"><i class=\"fa-solid fa-text-height\"><\/i> Chaos Style<\/div>\r\n                    <div class=\"pg-crazy-options\">\r\n                        <button class=\"pg-crazy-opt-btn style-btn active\" data-mode=\"Wild\">\r\n                            <i class=\"fa-solid fa-fire\"><\/i> Wild Chaos\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Glitch\">\r\n                            <i class=\"fa-solid fa-bolt\"><\/i> Glitch Mix\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Zalgo\">\r\n                            <i class=\"fa-solid fa-ghost\"><\/i> Zalgo\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Gothic\">\r\n                            <i class=\"fa-solid fa-chess\"><\/i> Gothic\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div>\r\n                    <div class=\"pg-crazy-label\"><i class=\"fa-solid fa-wand-magic-sparkles\"><\/i> Crazy Effects<\/div>\r\n                    <div class=\"pg-crazy-options\">\r\n                        <button class=\"pg-crazy-opt-btn deco-btn active\" data-deco=\"Clean\">\r\n                            <i class=\"fa-solid fa-ban\"><\/i> Clean\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Strike\">\r\n                            <i class=\"fa-solid fa-strikethrough\"><\/i> Strike Through\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Invert\">\r\n                            <i class=\"fa-solid fa-arrows-up-down\"><\/i> Upside Down\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Symbols\">\r\n                            <i class=\"fa-solid fa-symbols\"><\/i> Symbol Bomb\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"pg-crazy-results\">\r\n            <div class=\"pg-crazy-grid\" id=\"pgCrazyGrid\"><\/div>\r\n            <button class=\"pg-crazy-load-btn\" id=\"pgCrazyLoadBtn\"><span>Load More Chaos<\/span> <i class=\"fa-solid fa-chevron-down\"><\/i><\/button>\r\n        <\/div>\r\n    <\/div>\r\n    <div id=\"pgCrazyToast\" class=\"pg-crazy-toast\"><i class=\"fa-solid fa-check\"><\/i> <span>Copied to Clipboard!<\/span><\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n    const wrapper = document.getElementById('pg-crazy-tool');\r\n    const input = wrapper.querySelector('#pgCrazyInput');\r\n    const grid = wrapper.querySelector('#pgCrazyGrid');\r\n    const loadBtn = wrapper.querySelector('#pgCrazyLoadBtn');\r\n    const toast = wrapper.querySelector('#pgCrazyToast');\r\n    const pasteBtn = wrapper.querySelector('#pgCrazyPaste');\r\n    const selectBtn = wrapper.querySelector('#pgCrazySelect');\r\n    const copyBase = wrapper.querySelector('#pgCrazyCopyBase');\r\n    const presetSel = wrapper.querySelector('#pgCrazyPreset');\r\n\r\n    let currentMode = 'Wild';\r\n    let currentDeco = 'Clean';\r\n    let limit = 9;\r\n    const INCREMENT = 9;\r\n    const TOTAL = 108;\r\n\r\n    const base = \"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    const baseArr = Array.from(base);\r\n\r\n    const zalgo = ['\u0337', '\u0335', '\u0338', '\u0336', '\u0334', '\u0321', '\u0327', '\u0328', '\u031b', '\u0316', '\u0317', '\u0318', '\u0319', '\u031c', '\u031d', '\u031e', '\u031f', '\u0320', '\u0323', '\u0324'];\r\n    const symbols = ['\u26a1', '\ud83d\udc80', '\ud83d\udd25', '\ud83d\udca5', '\ud83d\udc79', '\ud83e\udd2a', '\u2694\ufe0f', '\u2620\ufe0f', '\ud83c\udfad', '\ud83d\udc7b'];\r\n    const flipMap = \"\u0250q\u0254p\u01dd\u025f\u0183\u0265\u1d09\u027e\u029el\u026fuodb\u0279s\u0287u\u028c\u028dx\u028ez\u2200q\u0186p\u018e\u2132\u05e4HI\u017f\u029e\u02e5WNO\u0500Q\u0279S\u2534\u2229\u039bMX\u2144Z0\u0196\u1105\u0190\u3123\u03db9\u312586\";\r\n    const flipArr = Array.from(flipMap);\r\n    \r\n    const gothicMap = \"\ud835\udd1e\ud835\udd1f\ud835\udd20\ud835\udd21\ud835\udd22\ud835\udd23\ud835\udd24\ud835\udd25\ud835\udd26\ud835\udd27\ud835\udd28\ud835\udd29\ud835\udd2a\ud835\udd2b\ud835\udd2c\ud835\udd2d\ud835\udd2e\ud835\udd2f\ud835\udd30\ud835\udd31\ud835\udd32\ud835\udd33\ud835\udd34\ud835\udd35\ud835\udd36\ud835\udd37\ud835\udd04\ud835\udd05\u212d\ud835\udd07\ud835\udd08\ud835\udd09\ud835\udd0a\u210c\u2111\ud835\udd0d\ud835\udd0e\ud835\udd0f\ud835\udd10\ud835\udd11\ud835\udd12\ud835\udd13\ud835\udd14\u211c\ud835\udd16\ud835\udd17\ud835\udd18\ud835\udd19\ud835\udd1a\ud835\udd1b\ud835\udd1c\u2128\ud835\udfce\ud835\udfcf\ud835\udfd0\ud835\udfd1\ud835\udfd2\ud835\udfd3\ud835\udfd4\ud835\udfd5\ud835\udfd6\ud835\udfd7\";\r\n    const gothicArr = Array.from(gothicMap);\r\n\r\n    const copyText = (txt, btn) => {\r\n        if (navigator.clipboard && navigator.clipboard.writeText) {\r\n            navigator.clipboard.writeText(txt).then(() => showToast(btn));\r\n        } else {\r\n            const ta = document.createElement(\"textarea\");\r\n            ta.value = txt;\r\n            ta.style.cssText = \"position:fixed;top:0;left:0;opacity:0;pointer-events:none;\";\r\n            document.body.appendChild(ta);\r\n            ta.select();\r\n            try { document.execCommand('copy'); showToast(btn); } catch(e) { console.error(e); }\r\n            document.body.removeChild(ta);\r\n        }\r\n    };\r\n\r\n    const showToast = (btn) => {\r\n        if(btn) {\r\n            btn.classList.add('copied');\r\n            btn.innerHTML = '<i class=\"fa-solid fa-check\"><\/i>';\r\n            setTimeout(() => {\r\n                btn.classList.remove('copied');\r\n                btn.innerHTML = '<i class=\"fa-regular fa-copy\"><\/i>';\r\n            }, 1600);\r\n        }\r\n        toast.classList.add('show');\r\n        setTimeout(() => toast.classList.remove('show'), 1600);\r\n    };\r\n\r\n    const transformText = (txt, mode, deco, idx) => {\r\n        if(!txt) return \"\";\r\n        let out = txt;\r\n        \r\n        if(mode === 'Wild') {\r\n            out = Array.from(txt).map((c, i) => {\r\n                if(Math.random() > 0.5) return c.toUpperCase();\r\n                return c.toLowerCase();\r\n            }).join('');\r\n            out = out.split('').map(c => Math.random() > 0.85 ? c + symbols[idx % symbols.length] : c).join('');\r\n        } else if(mode === 'Glitch') {\r\n            const glitchChars = ['\u0338', '\u0336', '\u0337', '\u0335'];\r\n            out = Array.from(txt).map(c => {\r\n                if(c === ' ') return c;\r\n                return c + glitchChars[Math.floor(Math.random() * glitchChars.length)];\r\n            }).join('');\r\n        } else if(mode === 'Zalgo') {\r\n            out = Array.from(txt).map(c => {\r\n                if(c === ' ') return c;\r\n                let z = c;\r\n                const num = Math.floor(Math.random() * 4) + 1;\r\n                for(let i=0; i<num; i++) {\r\n                    z += zalgo[Math.floor(Math.random() * zalgo.length)];\r\n                }\r\n                return z;\r\n            }).join('');\r\n        } else if(mode === 'Gothic') {\r\n            out = Array.from(txt).map(c => {\r\n                const i = baseArr.indexOf(c);\r\n                return i !== -1 ? gothicArr[i] : c;\r\n            }).join('');\r\n        }\r\n\r\n        if(deco === 'Strike') {\r\n            out = Array.from(out).map(c => c !== ' ' ? c + '\\u0336' : c).join('');\r\n        } else if(deco === 'Invert') {\r\n            out = Array.from(out).reverse().map(c => {\r\n                const i = baseArr.indexOf(c);\r\n                return i !== -1 ? flipArr[i] : c;\r\n            }).join('');\r\n        } else if(deco === 'Symbols') {\r\n            const bomb = ['\ud83d\udca5', '\ud83d\udd25', '\u26a1', '\ud83d\udc80', '\ud83d\udc79'];\r\n            out = Array.from(out).map(c => c !== ' ' ? c + bomb[idx % bomb.length] : c).join('');\r\n        }\r\n\r\n        return out;\r\n    };\r\n\r\n    const genMeta = () => {\r\n        const names = [\r\n            'Chaos Mode', 'Glitch Text', 'Zalgo Horror', 'Gothic Dark',\r\n            'Wild Mix', 'Strike Out', 'Upside Down', 'Symbol Bomb',\r\n            'Mad Max', 'Insane Style', 'Crazy Caps', 'Neon Glitch',\r\n            'Shadow Text', 'Void Style', 'Chaos Strike', 'Dark Gothic',\r\n            'Pixel Glitch', 'Retro Chaos', 'Neon Strike', 'Void Mix',\r\n            'Mad Caps', 'Glitch Wave', 'Zalgo Mix', 'Dark Strike'\r\n        ];\r\n        const icons = ['fa-bolt-lightning', 'fa-fire', 'fa-ghost', 'fa-chess', 'fa-bomb', 'fa-skull', 'fa-rotate', 'fa-symbols', 'fa-meteor', 'fa-hat-wizard', 'fa-eye', 'fa-brain', 'fa-mask', 'fa-cloud', 'fa-hammer', 'fa-spider', 'fa-gamepad', 'fa-dragon', 'fa-truck-monster', 'fa-axe', 'fa-hand-fist', 'fa-head-side-cough', 'fa-skull-crossbones', 'fa-biohazard'];\r\n        \r\n        const list = [];\r\n        for(let i=0; i<TOTAL; i++) {\r\n            const times = ['Just now', '1s ago', '3s ago', '5s ago', '10s ago', '30s ago', '1m ago', '2m ago', '5m ago', '10m ago'];\r\n            list.push({\r\n                id: `crazy-${i}`,\r\n                name: `${names[i % names.length]} #${Math.floor(i\/names.length)+1}`,\r\n                time: times[i % times.length],\r\n                icon: icons[i % icons.length]\r\n            });\r\n        }\r\n        return list;\r\n    };\r\n\r\n    const allMeta = genMeta();\r\n\r\n    const render = () => {\r\n        grid.innerHTML = '';\r\n        const raw = input.value || \"GO CRAZY! \ud83d\udd25\";\r\n        const show = allMeta.slice(0, limit);\r\n        \r\n        show.forEach((meta, idx) => {\r\n            const out = transformText(raw, currentMode, currentDeco, idx);\r\n            \r\n            const card = document.createElement('div');\r\n            card.className = 'pg-crazy-card';\r\n            card.innerHTML = `\r\n                <div class=\"pg-crazy-card-header\">\r\n                    <div class=\"pg-crazy-card-profile\">\r\n                        <div class=\"pg-crazy-card-avatar\"><i class=\"fa-solid ${meta.icon}\"><\/i><\/div>\r\n                        <div class=\"pg-crazy-card-meta\">\r\n                            <div class=\"pg-crazy-card-title\">${meta.name}<\/div>\r\n                            <div class=\"pg-crazy-card-time\"><i class=\"fa-solid fa-clock\"><\/i> ${meta.time}<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <button class=\"pg-crazy-copy-btn\" title=\"Copy\"><i class=\"fa-regular fa-copy\"><\/i><\/button>\r\n                <\/div>\r\n                <div class=\"pg-crazy-card-preview\">${out}<\/div>\r\n                <div class=\"pg-crazy-card-footer\">\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-fire\"><\/i> Lit<\/div>\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-skull\"><\/i> Save<\/div>\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-bomb\"><\/i> Share<\/div>\r\n                <\/div>\r\n            `;\r\n            \r\n            const copyBtn = card.querySelector('.pg-crazy-copy-btn');\r\n            copyBtn.addEventListener('click', (e) => {\r\n                e.preventDefault();\r\n                e.stopPropagation();\r\n                copyText(out, copyBtn);\r\n            });\r\n            \r\n            grid.appendChild(card);\r\n        });\r\n        \r\n        const remaining = Math.max(0, TOTAL - limit);\r\n        if(remaining > 0) {\r\n            loadBtn.style.display = 'inline-flex';\r\n            loadBtn.querySelector('span').textContent = `Load More Chaos (${remaining})`;\r\n        } else {\r\n            loadBtn.style.display = 'none';\r\n        }\r\n    };\r\n\r\n    input.addEventListener('input', render);\r\n    \r\n    pasteBtn.addEventListener('click', async (e) => {\r\n        e.preventDefault();\r\n        try {\r\n            const t = await navigator.clipboard.readText();\r\n            input.value = t;\r\n            render();\r\n        } catch {\r\n            input.focus();\r\n        }\r\n    });\r\n\r\n    selectBtn.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        input.select();\r\n    });\r\n\r\n    copyBase.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        if(input.value) copyText(input.value, null);\r\n    });\r\n\r\n    presetSel.addEventListener('change', (e) => {\r\n        if(e.target.value) {\r\n            input.value = e.target.value;\r\n            render();\r\n            e.target.selectedIndex = 0;\r\n        }\r\n    });\r\n\r\n    loadBtn.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        limit += INCREMENT;\r\n        render();\r\n    });\r\n\r\n    wrapper.querySelectorAll('.style-btn').forEach(btn => {\r\n        btn.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            wrapper.querySelectorAll('.style-btn').forEach(b => b.classList.remove('active'));\r\n            btn.classList.add('active');\r\n            currentMode = btn.dataset.mode;\r\n            limit = 9;\r\n            render();\r\n        });\r\n    });\r\n\r\n    wrapper.querySelectorAll('.deco-btn').forEach(btn => {\r\n        btn.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            wrapper.querySelectorAll('.deco-btn').forEach(b => b.classList.remove('active'));\r\n            btn.classList.add('active');\r\n            currentDeco = btn.dataset.deco;\r\n            limit = 9;\r\n            render();\r\n        });\r\n    });\r\n\r\n    render();\r\n});\r\n<\/script>\r\n<!-- END OF FILE Crazy Text Generator -->\r\n\r\n<!-- <conntent section is starting -->\r\n\r\n<div>\r\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n\r\n    <!-- SECTION 1 -->\r\n\r\n\r\n\r\n\r\n\r\n\r\n<section class=\"pg-cztg-section pg-cztg-sec1\">\r\n        <div class=\"pg-cztg-wrap\">\r\n\t\r\n<\/div>\r\n\t<\/section>\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n    <section class=\"pg-cztg-section pg-cztg-sec1\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading\">What Makes This <span class=\"pg-cztg-kw\">Crazy Text Generator<\/span> Different?<\/h2>\r\n            <p class=\"pg-cztg-sub\">Most \"crazy\" text tools just randomly change your font size. Our crazy text generator uses advanced Unicode stacking, Zalgo glitch algorithms, and multi-script mixing to create text that looks genuinely chaotic, unpredictable, and visually explosive.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,60,0.12);color:#ff003c;\"><i class=\"fa-solid fa-burst\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">True Unicode Chaos Engine<\/div>\r\n                    <p class=\"pg-cztg-desc\">Our crazy text generator doesn't just randomize cases \u2014 it injects actual Unicode combining characters, mathematical symbols, and regional indicators to create text that looks like a system malfunction.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(192,255,0,0.12);color:#a3e635;\"><i class=\"fa-solid fa-clone\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Multi-Layer Overlapping Text<\/div>\r\n                    <p class=\"pg-cztg-desc\">Stack multiple versions of your text on top of each other using strikethrough, underline, and overline combining marks \u2014 our crazy text generator creates dense, layered typography that demands attention.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(0,229,255,0.12);color:#00e5ff;\"><i class=\"fa-solid fa-tv\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">VHS Glitch and Static Effects<\/div>\r\n                    <p class=\"pg-cztg-desc\">Simulate VHS tracking errors and digital static with corrupted character blocks \u2014 our crazy text generator makes your words look like they're being broadcast through a broken analog television.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,107,0,0.12);color:#ff6b00;\"><i class=\"fa-solid fa-language\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Cross-Script Mixing<\/div>\r\n                    <p class=\"pg-cztg-desc\">Our crazy text generator randomly substitutes letters with identical-looking characters from Cyrillic, Greek, and Armenian scripts to create text that looks normal at a glance but is completely chaotic under the hood.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(217,70,239,0.12);color:#d946ef;\"><i class=\"fa-solid fa-shuffle\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Insanity Level Slider<\/div>\r\n                    <p class=\"pg-cztg-desc\">Control exactly how unhinged your text gets \u2014 our crazy text generator lets you dial from mildly weird to absolutely unreadable digital vomit with a single precision slider.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(34,197,94,0.12);color:#22c55e;\"><i class=\"fa-solid fa-shield-halved\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Bypasses Spam Filters<\/div>\r\n                    <p class=\"pg-cztg-desc\">Despite looking chaotic, our crazy text generator uses carefully tested character combinations that won't trigger automated spam filters on Discord, Instagram, or TikTok.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 2 -->\r\n    <section class=\"pg-cztg-section pg-cztg-sec2\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading pg-cztg-sec2-heading\">How to Use Our <span class=\"pg-cztg-kw pg-cztg-sec2-kw\">Crazy Text Generator<\/span> Step by Step?<\/h2>\r\n            <p class=\"pg-cztg-sub pg-cztg-sec2-sub\">Unleashing digital chaos takes exactly seconds. No coding or design skills needed \u2014 just follow these steps and generate gloriously unhinged text ready to copy and paste.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(59,130,246,0.12);color:#3b82f6;\"><i class=\"fa-solid fa-keyboard\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 1: Type Your Normal Text<\/div>\r\n                    <p class=\"pg-cztg-desc\">Enter any word, sentence, or paragraph into the input box \u2014 our crazy text generator accepts standard text, numbers, and emojis as the stable base for your chaotic transformation.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(245,158,11,0.12);color:#f59e0b;\"><i class=\"fa-solid fa-swatchbook\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 2: Pick a Chaos Style<\/div>\r\n                    <p class=\"pg-cztg-desc\">Choose from Zalgo stacking, script mixing, VHS glitch, or multi-layer overlap \u2014 our crazy text generator shows all variations instantly so you can pick the perfect flavor of insanity.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(239,68,68,0.12);color:#ef4444;\"><i class=\"fa-solid fa-gauge-high\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 3: Set the Insanity Level<\/div>\r\n                    <p class=\"pg-cztg-desc\">Drag the chaos slider to control the density of glitch marks, symbol injections, and character overlaps \u2014 our crazy text generator calculates the exact Unicode payload for your chosen level.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(20,184,166,0.12);color:#14b8a6;\"><i class=\"fa-solid fa-wand-magic-sparkles\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 4: Toggle Extra Effects<\/div>\r\n                    <p class=\"pg-cztg-desc\">Enable optional strikethroughs, double-underlines, or enclosing boxes around your text \u2014 our crazy text generator layers these effects without breaking the underlying character structure.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(139,92,246,0.12);color:#8b5cf6;\"><i class=\"fa-solid fa-eye\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 5: Preview the Madness<\/div>\r\n                    <p class=\"pg-cztg-desc\">See exactly how your chaotic text renders before copying \u2014 our crazy text generator shows a live preview that guarantees the glitch effects display correctly across all devices and browsers.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(236,72,153,0.12);color:#ec4899;\"><i class=\"fa-solid fa-clipboard\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 6: Copy the Chaos<\/div>\r\n                    <p class=\"pg-cztg-desc\">Hit the copy button to transfer your mangled text to the clipboard \u2014 our crazy text generator preserves every single glitch mark and corrupted symbol through the copy-paste process.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 3 -->\r\n    <section class=\"pg-cztg-section pg-cztg-sec3\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading\">Best Places to Use <span class=\"pg-cztg-kw\">Crazy Text Generator<\/span> Results?<\/h2>\r\n            <p class=\"pg-cztg-sub\">Crazy text is the ultimate tool for breaking visual monotony and demanding attention. Here are the highest-impact places where our crazy text generator output creates maximum disruption and engagement.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,80,0.10);color:#ff0050;\"><i class=\"fa-brands fa-tiktok\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">TikTok Edgy Comments<\/div>\r\n                    <p class=\"pg-cztg-desc\">Glitched text stops scrollers dead in their tracks because the brain tries to decode it \u2014 our crazy text generator creates the exact visual disruption that boosts comment engagement and replies.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(88,101,242,0.12);color:#5865f2;\"><i class=\"fa-brands fa-discord\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Discord Server Names<\/div>\r\n                    <p class=\"pg-cztg-desc\">A corrupted Discord server name instantly signals an underground, chaotic, or meme-focused community \u2014 our crazy text generator creates names that look like they were typed during a system failure.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,0,0.12);color:#ff0000;\"><i class=\"fa-brands fa-youtube\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Gaming Video Thumbnails<\/div>\r\n                    <p class=\"pg-cztg-desc\">Horror, rage-gaming, and glitch-art YouTubers use our crazy text generator for thumbnail titles \u2014 the corrupted lettering perfectly matches high-energy, chaotic video content.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(145,70,255,0.12);color:#9146ff;\"><i class=\"fa-brands fa-twitch\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Twitch Hype Alerts<\/div>\r\n                    <p class=\"pg-cztg-desc\">Trigger chaotic text animations for new followers, donations, or raids \u2014 our crazy text generator provides the raw corrupted strings that make alert overlays feel explosive and high-impact.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(249,115,22,0.12);color:#f97316;\"><i class=\"fa-solid fa-face-grin-squint-tears\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Meme Creation and Reddit<\/div>\r\n                    <p class=\"pg-cztg-desc\">Glitched text is the standard for \"I am losing my mind\" memes on Reddit \u2014 our crazy text generator outputs the exact style of corrupted text that gets upvoted in meme subreddits.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(225,48,108,0.12);color:#e1306c;\"><i class=\"fa-brands fa-instagram\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Instagram Bio Aesthetics<\/div>\r\n                    <p class=\"pg-cztg-desc\">The \"glitchcore\" and \"web-void\" aesthetics on Instagram rely on broken text \u2014 our crazy text generator creates the perfect corrupted bio text for alternative and digital-art focused profiles.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <style>\r\n        *, *::before, *::after {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        :root {\r\n            --cztg-alert: #ff003c;\r\n            --cztg-grad: linear-gradient(135deg, #ff003c, #c0ff00, #00e5ff);\r\n            --cztg-shadow: 0 12px 30px rgba(255, 0, 60, 0.16);\r\n            --cztg-ease: cubic-bezier(0.2, 0.8, 0.2, 1);\r\n            --cztg-speed: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n            --cztg-ff: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        .pg-cztg-section {\r\n            width: 100%;\r\n            padding: clamp(48px, 8vw, 96px) 20px;\r\n            position: relative;\r\n            font-family: var(--cztg-ff);\r\n            color: #0a0a0a;\r\n            line-height: 1.6;\r\n            -webkit-font-smoothing: antialiased;\r\n        }\r\n\r\n        .pg-cztg-wrap {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .pg-cztg-heading {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(1.5rem, 4vw, 2.25rem);\r\n            font-weight: 800;\r\n            text-align: center;\r\n            color: #000000;\r\n            margin-bottom: clamp(8px, 1.5vw, 14px);\r\n            line-height: 1.2;\r\n            letter-spacing: -0.03em;\r\n        }\r\n\r\n        .pg-cztg-kw {\r\n            color: #000000;\r\n            position: relative;\r\n        }\r\n\r\n        .pg-cztg-kw::after {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: -2px;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 3px;\r\n            background: var(--cztg-grad);\r\n            border-radius: 3px;\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s var(--cztg-ease);\r\n        }\r\n\r\n        .pg-cztg-section:hover .pg-cztg-kw::after {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-sub {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.88rem, 1.8vw, 1.02rem);\r\n            font-weight: 400;\r\n            text-align: center;\r\n            color: #1a1a1a;\r\n            max-width: 660px;\r\n            margin: 0 auto clamp(32px, 5vw, 56px);\r\n            line-height: 1.7;\r\n        }\r\n\r\n        .pg-cztg-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(3, 1fr);\r\n            gap: clamp(16px, 2.5vw, 26px);\r\n            align-items: stretch;\r\n        }\r\n\r\n        \/* === CARD BASE === *\/\r\n        .pg-cztg-card {\r\n            border-radius: 16px;\r\n            padding: clamp(22px, 3vw, 32px);\r\n            position: relative;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n            user-select: none;\r\n            transition: var(--cztg-speed);\r\n            border: 1.5px solid #e0e0e8;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        .pg-cztg-card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -1px;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 3px;\r\n            background: var(--cztg-grad);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s var(--cztg-ease);\r\n            z-index: 4;\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-card::after {\r\n            content: '';\r\n            position: absolute;\r\n            top: 50%;\r\n            left: 50%;\r\n            width: 0;\r\n            height: 0;\r\n            border-radius: 50%;\r\n            background: radial-gradient(circle, rgba(255,0,60,0.10) 0%, rgba(192,255,0,0.04) 60%, transparent 100%);\r\n            transform: translate(-50%, -50%);\r\n            transition: width 0.55s ease-out, height 0.55s ease-out, opacity 0.55s ease-out;\r\n            opacity: 0;\r\n            z-index: 0;\r\n            pointer-events: none;\r\n        }\r\n\r\n        .pg-cztg-card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down {\r\n            transform: translateY(-1px) scale(0.985) !important;\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-glow::after {\r\n            width: 320px;\r\n            height: 320px;\r\n            opacity: 1;\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-glow-out::after {\r\n            width: 320px;\r\n            height: 320px;\r\n            opacity: 0;\r\n        }\r\n\r\n        \/* === ICON === *\/\r\n        .pg-cztg-icon {\r\n            width: clamp(46px, 5vw, 58px);\r\n            height: clamp(46px, 5vw, 58px);\r\n            min-width: 46px;\r\n            min-height: 46px;\r\n            border-radius: 14px;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            font-size: clamp(18px, 2.5vw, 24px);\r\n            margin-bottom: clamp(14px, 2vw, 20px);\r\n            transition: var(--cztg-speed);\r\n            position: relative;\r\n            z-index: 3;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .pg-cztg-card:hover .pg-cztg-icon {\r\n            transform: scale(1.12) rotate(-4deg);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down .pg-cztg-icon {\r\n            transform: scale(1.04) rotate(0deg);\r\n        }\r\n\r\n        \/* === TITLE === *\/\r\n        .pg-cztg-title {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.95rem, 2vw, 1.1rem);\r\n            font-weight: 700;\r\n            color: #000000;\r\n            margin-bottom: clamp(6px, 1vw, 10px);\r\n            line-height: 1.35;\r\n            position: relative;\r\n            z-index: 3;\r\n        }\r\n\r\n        \/* === DESC === *\/\r\n        .pg-cztg-desc {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.8rem, 1.5vw, 0.9rem);\r\n            font-weight: 400;\r\n            color: #1a1a1a;\r\n            line-height: 1.65;\r\n            position: relative;\r\n            z-index: 3;\r\n            margin-top: auto;\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 1 \u2014 #fff bg \/ #fff cards\r\n           ============================== *\/\r\n        .pg-cztg-sec1 {\r\n            background: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec1 .pg-cztg-card {\r\n            background: #ffffff;\r\n            border-color: #dcdce5;\r\n            box-shadow: 0 2px 8px rgba(0,0,0,0.04);\r\n        }\r\n\r\n        .pg-cztg-sec1 .pg-cztg-card:hover {\r\n            border-color: var(--cztg-alert);\r\n            box-shadow: var(--cztg-shadow);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 2 \u2014 purple gradient \/ white cards\r\n           ============================== *\/\r\n        .pg-cztg-sec2 {\r\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-heading.pg-cztg-sec2-heading {\r\n            color: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-kw.pg-cztg-sec2-kw {\r\n            color: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-kw.pg-cztg-sec2-kw::after {\r\n            background: linear-gradient(90deg, #ff003c, #c0ff00, #ffffff);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-sub.pg-cztg-sec2-sub {\r\n            color: rgba(255,255,255,0.9);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card {\r\n            background: #ffffff;\r\n            border-color: rgba(255,255,255,0.25);\r\n            box-shadow: 0 4px 20px rgba(0,0,0,0.12);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card::before {\r\n            background: linear-gradient(90deg, #ff003c, #764ba2, #c0ff00);\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card::after {\r\n            background: radial-gradient(circle, rgba(255,0,60,0.08) 0%, rgba(118,75,162,0.04) 60%, transparent 100%);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card:hover {\r\n            border-color: rgba(255,0,60,0.5);\r\n            box-shadow: 0 14px 40px rgba(118,75,162,0.25);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 3 \u2014 digital static gray bg \/ white cards\r\n           ============================== *\/\r\n        .pg-cztg-sec3 {\r\n            background: #f3f4f6;\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card {\r\n            background: #ffffff;\r\n            border-color: #e5e7eb;\r\n            box-shadow: 0 2px 8px rgba(0,0,0,0.04);\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card::before {\r\n            background: linear-gradient(90deg, #ff003c, #c0ff00, #00e5ff);\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card:hover {\r\n            border-color: var(--cztg-alert);\r\n            box-shadow: var(--cztg-shadow);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           RESPONSIVE\r\n           ============================== *\/\r\n        @media (max-width: 820px) {\r\n            .pg-cztg-grid {\r\n                grid-template-columns: repeat(2, 1fr);\r\n                gap: 16px;\r\n            }\r\n            .pg-cztg-section {\r\n                padding: clamp(36px, 6vw, 64px) 16px;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 540px) {\r\n            .pg-cztg-grid {\r\n                grid-template-columns: 1fr;\r\n                gap: 14px;\r\n            }\r\n            .pg-cztg-card {\r\n                padding: 22px;\r\n            }\r\n            .pg-cztg-sub {\r\n                margin-bottom: 28px;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 360px) {\r\n            .pg-cztg-section {\r\n                padding: 32px 12px;\r\n            }\r\n            .pg-cztg-card {\r\n                padding: 18px;\r\n                border-radius: 12px;\r\n            }\r\n        }\r\n    <\/style>\r\n\r\n    <script>\r\n    (function() {\r\n        var cards = document.querySelectorAll('.pg-cztg-card');\r\n        cards.forEach(function(card) {\r\n            function glow(el) {\r\n                el.classList.remove('pg-cztg-glow', 'pg-cztg-glow-out');\r\n                void el.offsetWidth;\r\n                el.classList.add('pg-cztg-glow');\r\n                setTimeout(function() {\r\n                    el.classList.add('pg-cztg-glow-out');\r\n                }, 300);\r\n                setTimeout(function() {\r\n                    el.classList.remove('pg-cztg-glow', 'pg-cztg-glow-out');\r\n                }, 700);\r\n            }\r\n            card.addEventListener('mousedown', function() {\r\n                card.classList.add('pg-cztg-down');\r\n            });\r\n            card.addEventListener('mouseup', function() {\r\n                setTimeout(function() {\r\n                    card.classList.remove('pg-cztg-down');\r\n                }, 120);\r\n                glow(card);\r\n            });\r\n            card.addEventListener('mouseleave', function() {\r\n                card.classList.remove('pg-cztg-down', 'pg-cztg-glow', 'pg-cztg-glow-out');\r\n            });\r\n            card.addEventListener('touchstart', function() {\r\n                card.classList.add('pg-cztg-down');\r\n                glow(card);\r\n            }, { passive: true });\r\n            card.addEventListener('touchend', function() {\r\n                setTimeout(function() {\r\n                    card.classList.remove('pg-cztg-down');\r\n                }, 150);\r\n            });\r\n            card.addEventListener('touchcancel', function() {\r\n                card.classList.remove('pg-cztg-down', 'pg-cztg-glow', 'pg-cztg-glow-out');\r\n            });\r\n        });\r\n    })();\r\n    <\/script>\r\n<\/div>[\/et_pb_fullwidth_code][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<!-- START OF FILE Crazy Text Generator -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n    .pg-crazy-wrapper {\r\n        --primary-font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\r\n        \r\n        --theme-panel: rgba(25, 15, 40, 0.96);\r\n        --theme-panel-hover: rgba(40, 20, 65, 0.98);\r\n        --theme-bg-alt: rgba(15, 8, 25, 0.9);\r\n        --theme-border: rgba(255, 0, 128, 0.25);\r\n        \r\n        --crazy-neon: #ff0080;\r\n        --crazy-green: #00ff88;\r\n        --crazy-yellow: #ffff00;\r\n        --crazy-purple: #8000ff;\r\n        --crazy-cyan: #00ffff;\r\n        --text-bright: #ffddff;\r\n        --text-muted: #c89fd8;\r\n        \r\n        --grad-master: linear-gradient(135deg, #667eea 0%, #361656 100%);\r\n        --grad-crazy: linear-gradient(135deg, #ff0080, #8000ff, #00ff88);\r\n        --grad-shimmer: linear-gradient(90deg, transparent, rgba(255, 0, 128, 0.4), transparent);\r\n        \r\n        --glow-neon: 0 0 30px rgba(255, 0, 128, 0.6);\r\n        --glow-green: 0 0 25px rgba(0, 255, 136, 0.5);\r\n        --shadow-ui: 0 20px 50px rgba(0, 0, 0, 0.75);\r\n        --shadow-card: 0 10px 25px rgba(128, 0, 255, 0.4);\r\n        \r\n        --transition-ui: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        --transition-fast: all 0.2s ease;\r\n        \r\n        font-family: var(--primary-font);\r\n        color: var(--text-bright);\r\n        line-height: 1.5;\r\n        width: 100%;\r\n        overflow-x: hidden;\r\n        text-align: center;\r\n        background: var(--grad-master);\r\n        background-attachment: fixed;\r\n    }\r\n\r\n    .pg-crazy-wrapper * { box-sizing: border-box; }\r\n\r\n    .pg-crazy-container {\r\n        max-width: 1100px !important;\r\n        width: 100% !important;\r\n        margin: 0 auto !important;\r\n        padding: 40px 20px !important;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    .pg-crazy-hero {\r\n        z-index: 2;\r\n        padding-top: 10px;\r\n        width: 100%;\r\n    }\r\n\r\n    .pg-crazy-title {\r\n        font-family: var(--primary-font);\r\n        font-size: 3.2rem;\r\n        font-weight: 900;\r\n        line-height: 1.1;\r\n        margin: 0 auto 12px auto;\r\n        letter-spacing: -1px;\r\n        color: #ffffff !important;\r\n        background: none;\r\n        -webkit-text-fill-color: #ffffff !important;\r\n        max-width: 1000px;\r\n        position: relative;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        flex-wrap: wrap;\r\n        gap: 16px;\r\n        filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.25));\r\n        transition: var(--transition-ui);\r\n    }\r\n    \r\n    .pg-crazy-title i {\r\n        background: linear-gradient(135deg, #ff0080, #00ffff);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        background-clip: text;\r\n        background: transparent;\r\n        border-radius: 16px;\r\n        padding: 12px;\r\n        font-size: 2.2rem;\r\n        filter: drop-shadow(0 0 15px rgba(0, 255, 136, 0.6));\r\n        transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n    }\r\n    \r\n    .pg-crazy-title:hover i {\r\n        animation: crazy-shake 0.6s ease-in-out;\r\n    }\r\n    \r\n    @keyframes crazy-shake {\r\n        0%, 100% { transform: rotate(0deg); }\r\n        20% { transform: rotate(-20deg) scale(1.2); }\r\n        40% { transform: rotate(20deg) scale(1.1); }\r\n        60% { transform: rotate(-15deg) scale(1.15); }\r\n        80% { transform: rotate(10deg) scale(1.05); }\r\n    }\r\n\r\n    .pg-crazy-title::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: -15px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        display: block;\r\n        width: 60px;\r\n        height: 5px;\r\n        background: var(--grad-crazy);\r\n        border-radius: 5px;\r\n        transition: var(--transition-ui);\r\n    }\r\n    \r\n    .pg-crazy-title:hover::after {\r\n        width: 280px;\r\n        box-shadow: var(--glow-neon);\r\n    }\r\n    \r\n    .pg-crazy-subtitle {\r\n        font-family: var(--primary-font);\r\n        font-size: 1.2rem;\r\n        color: rgba(255, 221, 255, 0.9);\r\n        max-width: 850px;\r\n        margin: 25px auto 35px auto;\r\n        padding: 0 10px;\r\n        font-weight: 600;\r\n        text-shadow: 0 2px 10px rgba(0,0,0,0.6);\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .pg-crazy-main-card {\r\n        background: var(--theme-panel);\r\n        backdrop-filter: blur(16px);\r\n        -webkit-backdrop-filter: blur(16px);\r\n        border: 2px solid transparent;\r\n        width: 100%;\r\n        box-shadow: var(--shadow-ui);\r\n        border-radius: 20px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        display: flex;\r\n        flex-direction: column;\r\n        background-clip: padding-box;\r\n    }\r\n    \r\n    .pg-crazy-main-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0; right: 0; bottom: 0;\r\n        background: linear-gradient(135deg, var(--crazy-neon), var(--crazy-purple), var(--crazy-green)) border-box;\r\n        border: 2px solid transparent;\r\n        -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\r\n        -webkit-mask-composite: xor;\r\n        mask-composite: exclude;\r\n        opacity: 0.8;\r\n        z-index: 0;\r\n        animation: border-rotate 4s linear infinite;\r\n    }\r\n    \r\n    @keyframes border-rotate {\r\n        0%, 100% { opacity: 0.8; filter: hue-rotate(0deg); }\r\n        50% { opacity: 1; filter: hue-rotate(90deg); }\r\n    }\r\n    \r\n    .pg-crazy-main-card:hover::before {\r\n        opacity: 1;\r\n    }\r\n\r\n    .pg-crazy-header {\r\n        padding: 20px 24px;\r\n        border-bottom: 2px dashed rgba(255, 0, 128, 0.3);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 18px;\r\n        background: linear-gradient(90deg, rgba(255,0,128,0.1), transparent);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-avatar {\r\n        width: 52px;\r\n        height: 52px;\r\n        border-radius: 14px;\r\n        background: var(--grad-crazy);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 1.6rem;\r\n        color: #fff;\r\n        box-shadow: 0 0 20px rgba(255, 0, 128, 0.5);\r\n        transition: transform 0.3s ease;\r\n        animation: pulse-glow 2s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes pulse-glow {\r\n        0%, 100% { box-shadow: 0 0 20px rgba(255, 0, 128, 0.5); }\r\n        50% { box-shadow: 0 0 35px rgba(0, 255, 136, 0.7); }\r\n    }\r\n    \r\n    .pg-crazy-header:hover .pg-crazy-avatar { \r\n        transform: rotate(720deg) scale(1.1);\r\n    }\r\n\r\n    .pg-crazy-header-text {\r\n        font-weight: 800;\r\n        font-size: 1.3rem;\r\n        color: var(--crazy-neon);\r\n        letter-spacing: 1px;\r\n        text-transform: uppercase;\r\n        text-shadow: 0 0 10px rgba(255, 0, 128, 0.4);\r\n    }\r\n\r\n    .pg-crazy-input-area {\r\n        padding: 28px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 20px;\r\n        background: var(--theme-bg-alt);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-textarea {\r\n        width: 100% !important;\r\n        min-height: 160px !important;\r\n        padding: 24px 24px !important;\r\n        background: rgba(0, 0, 0, 0.4) !important;\r\n        border: 2px dashed var(--crazy-neon) !important;\r\n        color: var(--crazy-green) !important;\r\n        font-family: var(--primary-font) !important;\r\n        font-weight: 700 !important;\r\n        font-size: 1.8rem !important;\r\n        outline: none !important;\r\n        text-align: left !important;\r\n        white-space: pre-wrap !important;\r\n        word-break: break-word !important;\r\n        overflow-wrap: break-word !important;\r\n        resize: vertical;\r\n        border-radius: 16px;\r\n        transition: var(--transition-fast);\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-textarea:focus {\r\n        border-style: solid !important;\r\n        border-color: var(--crazy-cyan) !important;\r\n        box-shadow: 0 0 0 5px rgba(0, 255, 255, 0.2), inset 0 0 30px rgba(0, 255, 255, 0.05) !important;\r\n        animation: glitch-border 0.3s ease;\r\n    }\r\n    \r\n    @keyframes glitch-border {\r\n        0% { transform: translate(0); }\r\n        20% { transform: translate(-3px, 2px); }\r\n        40% { transform: translate(3px, -2px); }\r\n        60% { transform: translate(-2px, -3px); }\r\n        80% { transform: translate(2px, 3px); }\r\n        100% { transform: translate(0); }\r\n    }\r\n    \r\n    .pg-crazy-textarea::placeholder { color: var(--text-muted); opacity: 0.6; }\r\n\r\n    .pg-crazy-toolbar {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n        gap: 14px;\r\n        padding: 16px 20px;\r\n        border: 2px solid var(--crazy-purple);\r\n        border-radius: 14px;\r\n        background: rgba(128, 0, 255, 0.15);\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-toolbar::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: -2px; left: 50%; transform: translateX(-50%);\r\n        width: 80px; height: 2px;\r\n        background: var(--crazy-green);\r\n        box-shadow: var(--glow-green);\r\n    }\r\n\r\n    .pg-crazy-tool-group {\r\n        display: flex;\r\n        gap: 12px;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n    }\r\n\r\n    .pg-crazy-btn {\r\n        background: transparent;\r\n        color: var(--text-muted);\r\n        border: 2px solid var(--crazy-purple);\r\n        padding: 12px 16px;\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 700;\r\n        border-radius: 10px;\r\n        cursor: pointer;\r\n        transition: var(--transition-fast);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-btn::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: -100%;\r\n        width: 100%; height: 100%;\r\n        background: var(--grad-shimmer);\r\n        transition: left 0.4s ease;\r\n    }\r\n    \r\n    .pg-crazy-btn:hover {\r\n        background: rgba(255, 0, 128, 0.2);\r\n        color: var(--crazy-neon);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n        transform: scale(1.05);\r\n    }\r\n    \r\n    .pg-crazy-btn:hover::before { left: 100%; }\r\n\r\n    .pg-crazy-btn.primary-btn {\r\n        color: var(--crazy-green);\r\n        background: rgba(0, 255, 136, 0.15);\r\n        border-color: var(--crazy-green);\r\n    }\r\n    \r\n    .pg-crazy-btn.primary-btn:hover {\r\n        background: rgba(0, 255, 136, 0.3);\r\n        box-shadow: var(--glow-green);\r\n    }\r\n\r\n    .pg-crazy-btn:active { transform: scale(0.95); }\r\n\r\n    .pg-crazy-preset {\r\n        background: rgba(0,0,0,0.4);\r\n        color: var(--crazy-yellow);\r\n        border: 2px solid var(--crazy-yellow);\r\n        padding: 12px 16px;\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 700;\r\n        border-radius: 10px;\r\n        cursor: pointer;\r\n        outline: none;\r\n        transition: var(--transition-fast);\r\n        min-width: 200px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n    \r\n    .pg-crazy-preset:hover, .pg-crazy-preset:focus {\r\n        background: rgba(255, 255, 0, 0.2);\r\n        color: var(--crazy-neon);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n    }\r\n    \r\n    .pg-crazy-preset option {\r\n        background: var(--theme-panel);\r\n        color: var(--text-bright);\r\n    }\r\n\r\n    .pg-crazy-settings {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        gap: 26px;\r\n        padding: 30px 24px;\r\n        background: var(--theme-panel);\r\n        border-top: 2px solid var(--crazy-purple);\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .pg-crazy-label {\r\n        display: flex;\r\n        align-items: center;\r\n        font-family: var(--primary-font);\r\n        font-size: 1rem;\r\n        font-weight: 800;\r\n        color: var(--crazy-neon);\r\n        margin-bottom: 14px;\r\n        gap: 10px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n        text-shadow: 0 0 15px rgba(255, 0, 128, 0.5);\r\n    }\r\n    \r\n    .pg-crazy-label i {\r\n        color: var(--crazy-cyan);\r\n        font-size: 1.2rem;\r\n        animation: icon-bounce 2s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes icon-bounce {\r\n        0%, 100% { transform: translateY(0); }\r\n        50% { transform: translateY(-5px) scale(1.1); }\r\n    }\r\n\r\n    .pg-crazy-options {\r\n        display: grid;\r\n        gap: 12px;\r\n        grid-template-columns: repeat(2, 1fr);\r\n    }\r\n\r\n    .pg-crazy-opt-btn {\r\n        background: rgba(255, 255, 255, 0.04);\r\n        border: 2px solid transparent;\r\n        padding: 16px 12px;\r\n        color: var(--text-bright);\r\n        font-family: var(--primary-font);\r\n        font-size: 0.85rem;\r\n        font-weight: 700;\r\n        cursor: pointer;\r\n        border-radius: 14px;\r\n        transition: var(--transition-fast);\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        gap: 8px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 0.5px;\r\n    }\r\n    \r\n    .pg-crazy-opt-btn i {\r\n        font-size: 1.4rem;\r\n        color: var(--text-muted);\r\n        transition: var(--transition-fast);\r\n    }\r\n    \r\n    .pg-crazy-opt-btn::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; right: 0;\r\n        width: 0; height: 100%;\r\n        background: linear-gradient(90deg, transparent, rgba(255, 0, 128, 0.2), transparent);\r\n        transition: width 0.6s ease;\r\n    }\r\n    \r\n    .pg-crazy-opt-btn:hover::after { width: 100%; }\r\n    \r\n    .pg-crazy-opt-btn:hover {\r\n        background: rgba(255, 0, 128, 0.15);\r\n        transform: translateY(-4px) rotate(-2deg);\r\n        border-color: var(--crazy-purple);\r\n        box-shadow: 0 0 20px rgba(128, 0, 255, 0.4);\r\n    }\r\n\r\n    .pg-crazy-opt-btn:hover i {\r\n        color: var(--crazy-yellow);\r\n        transform: scale(1.3) rotate(10deg);\r\n    }\r\n\r\n    .pg-crazy-opt-btn.active {\r\n        background: rgba(255, 0, 128, 0.4);\r\n        color: #fff;\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: 0 0 25px rgba(255, 0, 128, 0.6), inset 0 0 15px rgba(255, 0, 128, 0.3);\r\n        animation: btn-pulse 1.5s ease-in-out infinite;\r\n    }\r\n    \r\n    @keyframes btn-pulse {\r\n        0%, 100% { box-shadow: 0 0 25px rgba(255, 0, 128, 0.6); }\r\n        50% { box-shadow: 0 0 40px rgba(255, 0, 128, 0.9); }\r\n    }\r\n    \r\n    .pg-crazy-opt-btn.active::after { width: 100%; background: rgba(255, 255, 255, 0.1); }\r\n    \r\n    .pg-crazy-opt-btn.active i {\r\n        color: var(--crazy-green);\r\n        animation: icon-rotate 2s linear infinite;\r\n    }\r\n    \r\n    @keyframes icon-rotate {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    .pg-crazy-results {\r\n        padding: 45px 0;\r\n        width: 100%;\r\n        position: relative;\r\n    }\r\n    \r\n    .pg-crazy-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(3, 1fr);\r\n        gap: 24px;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n\r\n    .pg-crazy-card {\r\n        background: var(--theme-panel);\r\n        border: 2px solid var(--theme-border);\r\n        padding: 22px;\r\n        transition: var(--transition-ui);\r\n        position: relative;\r\n        overflow: hidden;\r\n        border-radius: 16px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        box-shadow: var(--shadow-card);\r\n        clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));\r\n    }\r\n    \r\n    .pg-crazy-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -50%; left: -50%;\r\n        width: 200%; height: 200%;\r\n        background: conic-gradient(from 0deg, transparent, var(--crazy-neon), transparent 40%);\r\n        opacity: 0;\r\n        transition: opacity 0.5s ease;\r\n        animation: spin 4s linear infinite;\r\n    }\r\n    \r\n    @keyframes spin {\r\n        to { transform: rotate(360deg); }\r\n    }\r\n    \r\n    .pg-crazy-card:hover {\r\n        transform: translateY(-8px) scale(1.02);\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: 0 0 30px rgba(255, 0, 128, 0.5), 0 20px 40px rgba(0, 0, 0, 0.7);\r\n    }\r\n    \r\n    .pg-crazy-card:hover::before { opacity: 0.15; }\r\n    \r\n    .pg-crazy-card::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0;\r\n        width: 100%; height: 100%;\r\n        background: linear-gradient(135deg, transparent 40%, rgba(0, 255, 136, 0.05) 100%);\r\n        pointer-events: none;\r\n    }\r\n\r\n    .pg-crazy-card-header {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        width: 100%;\r\n        margin-bottom: 18px;\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n    \r\n    .pg-crazy-card-profile {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 14px;\r\n    }\r\n\r\n    .pg-crazy-card-avatar {\r\n        width: 44px;\r\n        height: 44px;\r\n        border-radius: 12px;\r\n        background: var(--grad-crazy);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        color: #fff;\r\n        font-size: 1.2rem;\r\n        box-shadow: 0 0 15px rgba(255, 0, 128, 0.5);\r\n    }\r\n\r\n    .pg-crazy-card-meta {\r\n        display: flex;\r\n        flex-direction: column;\r\n        text-align: left;\r\n    }\r\n\r\n    .pg-crazy-card-title {\r\n        font-family: var(--primary-font);\r\n        font-size: 0.9rem;\r\n        font-weight: 800;\r\n        color: var(--crazy-neon);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-card-time {\r\n        font-size: 0.75rem;\r\n        color: var(--text-muted);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 5px;\r\n    }\r\n\r\n    .pg-crazy-copy-btn {\r\n        background: rgba(255, 0, 128, 0.15);\r\n        border: 2px solid var(--crazy-purple);\r\n        color: var(--crazy-cyan);\r\n        width: 42px;\r\n        height: 42px;\r\n        border-radius: 12px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        cursor: pointer;\r\n        transition: var(--transition-fast);\r\n        outline: none;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n    \r\n    .pg-crazy-copy-btn i { font-size: 1.1rem; transition: all 0.25s ease; }\r\n    \r\n    .pg-crazy-copy-btn:hover {\r\n        background: var(--crazy-neon);\r\n        color: #fff;\r\n        border-color: var(--crazy-neon);\r\n        box-shadow: var(--glow-neon);\r\n        transform: scale(1.15);\r\n    }\r\n    \r\n    .pg-crazy-copy-btn:hover i { transform: rotate(360deg) scale(1.3); }\r\n    \r\n    .pg-crazy-copy-btn:active { transform: scale(0.85); }\r\n    \r\n    .pg-crazy-copy-btn.copied {\r\n        background: var(--crazy-green) !important;\r\n        color: #000 !important;\r\n        border-color: var(--crazy-green) !important;\r\n        box-shadow: var(--glow-green) !important;\r\n    }\r\n\r\n    .pg-crazy-card-preview {\r\n        font-size: 1.3rem;\r\n        color: var(--crazy-cyan);\r\n        width: 100%;\r\n        text-align: left;\r\n        font-family: var(--primary-font);\r\n        font-weight: 700;\r\n        position: relative;\r\n        z-index: 1;\r\n        padding: 8px 0 18px 0;\r\n        transition: all 0.3s ease;\r\n        white-space: pre-wrap !important;\r\n        word-break: break-word !important;\r\n        overflow-wrap: break-word !important;\r\n        box-sizing: border-box !important;\r\n        line-height: 1.4 !important;\r\n        max-height: 150px;\r\n        overflow: hidden;\r\n        letter-spacing: 0.5px;\r\n    }\r\n    \r\n    .pg-crazy-card:hover .pg-crazy-card-preview {\r\n        color: var(--crazy-neon);\r\n        text-shadow: 0 0 10px rgba(255, 0, 128, 0.4);\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .pg-crazy-card-footer {\r\n        border-top: 2px dashed rgba(128, 0, 255, 0.4);\r\n        padding-top: 15px;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        color: var(--text-muted);\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        flex-wrap: wrap;\r\n        gap: 6px;\r\n        position: relative;\r\n        z-index: 1;\r\n        text-transform: uppercase;\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .pg-crazy-card-action {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n        cursor: pointer;\r\n        transition: all 0.2s ease;\r\n    }\r\n    .pg-crazy-card-action:hover { color: var(--crazy-green); }\r\n    .pg-crazy-card-action:hover i { transform: scale(1.3) rotate(-10deg); }\r\n    .pg-crazy-card-action i { transition: all 0.25s ease; }\r\n\r\n    .pg-crazy-load-btn {\r\n        background: var(--theme-panel);\r\n        color: var(--crazy-neon);\r\n        border: 3px solid var(--crazy-neon);\r\n        padding: 16px 45px;\r\n        font-family: var(--primary-font);\r\n        font-weight: 900;\r\n        font-size: 1.1rem;\r\n        cursor: pointer;\r\n        margin-top: 35px;\r\n        border-radius: 12px;\r\n        transition: var(--transition-fast);\r\n        position: relative;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 14px;\r\n        box-shadow: 0 0 25px rgba(255, 0, 128, 0.4);\r\n        overflow: hidden;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n    }\r\n    \r\n    .pg-crazy-load-btn::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: -100%; width: 100%; height: 100%;\r\n        background: var(--grad-crazy);\r\n        transition: left 0.5s ease;\r\n        z-index: 0;\r\n    }\r\n    \r\n    .pg-crazy-load-btn span, .pg-crazy-load-btn i { position: relative; z-index: 1; }\r\n    \r\n    .pg-crazy-load-btn:hover {\r\n        color: #fff;\r\n        border-color: transparent;\r\n        transform: translateY(-5px);\r\n        box-shadow: 0 0 50px rgba(255, 0, 128, 0.8);\r\n    }\r\n    \r\n    .pg-crazy-load-btn:hover::before { left: 0; }\r\n    .pg-crazy-load-btn:hover i { transform: translateY(8px) rotate(720deg); }\r\n    .pg-crazy-load-btn:active { transform: translateY(0); }\r\n\r\n    .pg-crazy-toast {\r\n        visibility: hidden;\r\n        background: rgba(15, 8, 25, 0.98);\r\n        color: var(--crazy-green);\r\n        padding: 20px 30px;\r\n        position: fixed;\r\n        left: 50%;\r\n        bottom: 50px;\r\n        transform: translateX(-50%) translateY(30px);\r\n        font-family: var(--primary-font);\r\n        font-weight: 800;\r\n        z-index: 10000;\r\n        border-radius: 12px;\r\n        box-shadow: 0 15px 40px rgba(0,0,0,0.8);\r\n        opacity: 0;\r\n        transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 16px;\r\n        border: 2px solid var(--crazy-green);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n    \r\n    .pg-crazy-toast i {\r\n        color: #000;\r\n        background: var(--crazy-green);\r\n        border-radius: 50%;\r\n        padding: 6px;\r\n        font-size: 1.2rem;\r\n        box-shadow: var(--glow-green);\r\n    }\r\n    \r\n    .pg-crazy-toast.show {\r\n        visibility: visible;\r\n        opacity: 1;\r\n        transform: translateX(-50%) translateY(0);\r\n    }\r\n\r\n    @media (max-width: 900px) {\r\n        .pg-crazy-grid { grid-template-columns: repeat(2, 1fr); }\r\n        .pg-crazy-title { font-size: 2.5rem; }\r\n        .pg-crazy-settings { grid-template-columns: 1fr; }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .pg-crazy-grid { grid-template-columns: 1fr; }\r\n        .pg-crazy-container { padding: 30px 15px !important; }\r\n        .pg-crazy-results { padding: 25px 0; }\r\n        .pg-crazy-settings { padding: 20px; gap: 20px; }\r\n        .pg-crazy-textarea { min-height: 140px !important; font-size: 1.4rem !important; }\r\n        \r\n        .pg-crazy-toolbar { flex-direction: column; align-items: stretch; }\r\n        .pg-crazy-tool-group { justify-content: space-between; }\r\n        .pg-crazy-preset { width: 100%; text-align: center; }\r\n        \r\n        .pg-crazy-card { padding: 18px; }\r\n        .pg-crazy-card-preview { font-size: 1.15rem; max-height: 140px; }\r\n        \r\n        .pg-crazy-opt-btn { padding: 14px 10px; font-size: 0.8rem; }\r\n        .pg-crazy-load-btn { padding: 14px 30px; font-size: 0.95rem; width: 100%; justify-content: center; }\r\n        .pg-crazy-title { font-size: 1.9rem; }\r\n        .pg-crazy-subtitle { font-size: 0.95rem; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"pg-crazy-wrapper\" id=\"pg-crazy-tool\">\r\n    <div class=\"pg-crazy-container pg-crazy-hero\">\r\n        <h1 class=\"pg-crazy-title\"><i class=\"fa-solid fa-bolt-lightning\"><\/i> <i class=\"fa-solid fa-wand-magic-sparkles\"><\/i> Crazy Text Generator \u2013 Transform Instantly<\/h1>\r\n        <p class=\"pg-crazy-subtitle\">Unleash chaos! Transform boring text into wild, glitchy, attention-grabbing madness with random case, symbols, strikes, and insane Unicode effects.<\/p>\r\n        \r\n        <div class=\"pg-crazy-main-card\">\r\n            <div class=\"pg-crazy-header\">\r\n                <div class=\"pg-crazy-avatar\"><i class=\"fa-solid fa-skull\"><\/i><\/div>\r\n                <div class=\"pg-crazy-header-text\">\ud83d\udca5 Generate Insanity \ud83d\udca5<\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"pg-crazy-input-area\">\r\n                <textarea class=\"pg-crazy-textarea\" id=\"pgCrazyInput\" placeholder=\"Type something to go CRAZY with!\"><\/textarea>\r\n                \r\n                <div class=\"pg-crazy-toolbar\">\r\n                    <div class=\"pg-crazy-tool-group\">\r\n                        <button class=\"pg-crazy-btn\" id=\"pgCrazyPaste\" title=\"Paste\"><i class=\"fa-solid fa-clipboard\"><\/i> Paste<\/button>\r\n                        <button class=\"pg-crazy-btn\" id=\"pgCrazySelect\" title=\"Select\"><i class=\"fa-solid fa-object-group\"><\/i> Select<\/button>\r\n                        <button class=\"pg-crazy-btn primary-btn\" id=\"pgCrazyCopyBase\" title=\"Copy Original\"><i class=\"fa-regular fa-copy\"><\/i> Copy<\/button>\r\n                    <\/div>\r\n                    \r\n                    <select class=\"pg-crazy-preset\" id=\"pgCrazyPreset\">\r\n                        <option value=\"\" disabled selected>\ud83e\udd2a Crazy Presets<\/option>\r\n                        <option value=\"THIS IS INSANE!\">\ud83d\udd25 Pure Chaos<\/option>\r\n                        <option value=\"Glitch Mode Activated\">\ud83d\udcbb Glitch Text<\/option>\r\n                        <option value=\"S T R E T C H E D\">\ud83d\udccf Spaced Out<\/option>\r\n                        <option value=\"zalgo text is scary\">\ud83d\udc79 Zalgo Horror<\/option>\r\n                        <option value=\"l33t h4x0r\">\ud83c\udfae Leet Speak<\/option>\r\n                        <option value=\"cRiNgE wRiTInG\">\ud83d\ude2c Alternating Caps<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"pg-crazy-settings\">\r\n                <div>\r\n                    <div class=\"pg-crazy-label\"><i class=\"fa-solid fa-text-height\"><\/i> Chaos Style<\/div>\r\n                    <div class=\"pg-crazy-options\">\r\n                        <button class=\"pg-crazy-opt-btn style-btn active\" data-mode=\"Wild\">\r\n                            <i class=\"fa-solid fa-fire\"><\/i> Wild Chaos\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Glitch\">\r\n                            <i class=\"fa-solid fa-bolt\"><\/i> Glitch Mix\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Zalgo\">\r\n                            <i class=\"fa-solid fa-ghost\"><\/i> Zalgo\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn style-btn\" data-mode=\"Gothic\">\r\n                            <i class=\"fa-solid fa-chess\"><\/i> Gothic\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div>\r\n                    <div class=\"pg-crazy-label\"><i class=\"fa-solid fa-wand-magic-sparkles\"><\/i> Crazy Effects<\/div>\r\n                    <div class=\"pg-crazy-options\">\r\n                        <button class=\"pg-crazy-opt-btn deco-btn active\" data-deco=\"Clean\">\r\n                            <i class=\"fa-solid fa-ban\"><\/i> Clean\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Strike\">\r\n                            <i class=\"fa-solid fa-strikethrough\"><\/i> Strike Through\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Invert\">\r\n                            <i class=\"fa-solid fa-arrows-up-down\"><\/i> Upside Down\r\n                        <\/button>\r\n                        <button class=\"pg-crazy-opt-btn deco-btn\" data-deco=\"Symbols\">\r\n                            <i class=\"fa-solid fa-symbols\"><\/i> Symbol Bomb\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"pg-crazy-results\">\r\n            <div class=\"pg-crazy-grid\" id=\"pgCrazyGrid\"><\/div>\r\n            <button class=\"pg-crazy-load-btn\" id=\"pgCrazyLoadBtn\"><span>Load More Chaos<\/span> <i class=\"fa-solid fa-chevron-down\"><\/i><\/button>\r\n        <\/div>\r\n    <\/div>\r\n    <div id=\"pgCrazyToast\" class=\"pg-crazy-toast\"><i class=\"fa-solid fa-check\"><\/i> <span>Copied to Clipboard!<\/span><\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n    const wrapper = document.getElementById('pg-crazy-tool');\r\n    const input = wrapper.querySelector('#pgCrazyInput');\r\n    const grid = wrapper.querySelector('#pgCrazyGrid');\r\n    const loadBtn = wrapper.querySelector('#pgCrazyLoadBtn');\r\n    const toast = wrapper.querySelector('#pgCrazyToast');\r\n    const pasteBtn = wrapper.querySelector('#pgCrazyPaste');\r\n    const selectBtn = wrapper.querySelector('#pgCrazySelect');\r\n    const copyBase = wrapper.querySelector('#pgCrazyCopyBase');\r\n    const presetSel = wrapper.querySelector('#pgCrazyPreset');\r\n\r\n    let currentMode = 'Wild';\r\n    let currentDeco = 'Clean';\r\n    let limit = 9;\r\n    const INCREMENT = 9;\r\n    const TOTAL = 108;\r\n\r\n    const base = \"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    const baseArr = Array.from(base);\r\n\r\n    const zalgo = ['\u0337', '\u0335', '\u0338', '\u0336', '\u0334', '\u0321', '\u0327', '\u0328', '\u031b', '\u0316', '\u0317', '\u0318', '\u0319', '\u031c', '\u031d', '\u031e', '\u031f', '\u0320', '\u0323', '\u0324'];\r\n    const symbols = ['\u26a1', '\ud83d\udc80', '\ud83d\udd25', '\ud83d\udca5', '\ud83d\udc79', '\ud83e\udd2a', '\u2694\ufe0f', '\u2620\ufe0f', '\ud83c\udfad', '\ud83d\udc7b'];\r\n    const flipMap = \"\u0250q\u0254p\u01dd\u025f\u0183\u0265\u1d09\u027e\u029el\u026fuodb\u0279s\u0287u\u028c\u028dx\u028ez\u2200q\u0186p\u018e\u2132\u05e4HI\u017f\u029e\u02e5WNO\u0500Q\u0279S\u2534\u2229\u039bMX\u2144Z0\u0196\u1105\u0190\u3123\u03db9\u312586\";\r\n    const flipArr = Array.from(flipMap);\r\n    \r\n    const gothicMap = \"\ud835\udd1e\ud835\udd1f\ud835\udd20\ud835\udd21\ud835\udd22\ud835\udd23\ud835\udd24\ud835\udd25\ud835\udd26\ud835\udd27\ud835\udd28\ud835\udd29\ud835\udd2a\ud835\udd2b\ud835\udd2c\ud835\udd2d\ud835\udd2e\ud835\udd2f\ud835\udd30\ud835\udd31\ud835\udd32\ud835\udd33\ud835\udd34\ud835\udd35\ud835\udd36\ud835\udd37\ud835\udd04\ud835\udd05\u212d\ud835\udd07\ud835\udd08\ud835\udd09\ud835\udd0a\u210c\u2111\ud835\udd0d\ud835\udd0e\ud835\udd0f\ud835\udd10\ud835\udd11\ud835\udd12\ud835\udd13\ud835\udd14\u211c\ud835\udd16\ud835\udd17\ud835\udd18\ud835\udd19\ud835\udd1a\ud835\udd1b\ud835\udd1c\u2128\ud835\udfce\ud835\udfcf\ud835\udfd0\ud835\udfd1\ud835\udfd2\ud835\udfd3\ud835\udfd4\ud835\udfd5\ud835\udfd6\ud835\udfd7\";\r\n    const gothicArr = Array.from(gothicMap);\r\n\r\n    const copyText = (txt, btn) => {\r\n        if (navigator.clipboard && navigator.clipboard.writeText) {\r\n            navigator.clipboard.writeText(txt).then(() => showToast(btn));\r\n        } else {\r\n            const ta = document.createElement(\"textarea\");\r\n            ta.value = txt;\r\n            ta.style.cssText = \"position:fixed;top:0;left:0;opacity:0;pointer-events:none;\";\r\n            document.body.appendChild(ta);\r\n            ta.select();\r\n            try { document.execCommand('copy'); showToast(btn); } catch(e) { console.error(e); }\r\n            document.body.removeChild(ta);\r\n        }\r\n    };\r\n\r\n    const showToast = (btn) => {\r\n        if(btn) {\r\n            btn.classList.add('copied');\r\n            btn.innerHTML = '<i class=\"fa-solid fa-check\"><\/i>';\r\n            setTimeout(() => {\r\n                btn.classList.remove('copied');\r\n                btn.innerHTML = '<i class=\"fa-regular fa-copy\"><\/i>';\r\n            }, 1600);\r\n        }\r\n        toast.classList.add('show');\r\n        setTimeout(() => toast.classList.remove('show'), 1600);\r\n    };\r\n\r\n    const transformText = (txt, mode, deco, idx) => {\r\n        if(!txt) return \"\";\r\n        let out = txt;\r\n        \r\n        if(mode === 'Wild') {\r\n            out = Array.from(txt).map((c, i) => {\r\n                if(Math.random() > 0.5) return c.toUpperCase();\r\n                return c.toLowerCase();\r\n            }).join('');\r\n            out = out.split('').map(c => Math.random() > 0.85 ? c + symbols[idx % symbols.length] : c).join('');\r\n        } else if(mode === 'Glitch') {\r\n            const glitchChars = ['\u0338', '\u0336', '\u0337', '\u0335'];\r\n            out = Array.from(txt).map(c => {\r\n                if(c === ' ') return c;\r\n                return c + glitchChars[Math.floor(Math.random() * glitchChars.length)];\r\n            }).join('');\r\n        } else if(mode === 'Zalgo') {\r\n            out = Array.from(txt).map(c => {\r\n                if(c === ' ') return c;\r\n                let z = c;\r\n                const num = Math.floor(Math.random() * 4) + 1;\r\n                for(let i=0; i<num; i++) {\r\n                    z += zalgo[Math.floor(Math.random() * zalgo.length)];\r\n                }\r\n                return z;\r\n            }).join('');\r\n        } else if(mode === 'Gothic') {\r\n            out = Array.from(txt).map(c => {\r\n                const i = baseArr.indexOf(c);\r\n                return i !== -1 ? gothicArr[i] : c;\r\n            }).join('');\r\n        }\r\n\r\n        if(deco === 'Strike') {\r\n            out = Array.from(out).map(c => c !== ' ' ? c + '\\u0336' : c).join('');\r\n        } else if(deco === 'Invert') {\r\n            out = Array.from(out).reverse().map(c => {\r\n                const i = baseArr.indexOf(c);\r\n                return i !== -1 ? flipArr[i] : c;\r\n            }).join('');\r\n        } else if(deco === 'Symbols') {\r\n            const bomb = ['\ud83d\udca5', '\ud83d\udd25', '\u26a1', '\ud83d\udc80', '\ud83d\udc79'];\r\n            out = Array.from(out).map(c => c !== ' ' ? c + bomb[idx % bomb.length] : c).join('');\r\n        }\r\n\r\n        return out;\r\n    };\r\n\r\n    const genMeta = () => {\r\n        const names = [\r\n            'Chaos Mode', 'Glitch Text', 'Zalgo Horror', 'Gothic Dark',\r\n            'Wild Mix', 'Strike Out', 'Upside Down', 'Symbol Bomb',\r\n            'Mad Max', 'Insane Style', 'Crazy Caps', 'Neon Glitch',\r\n            'Shadow Text', 'Void Style', 'Chaos Strike', 'Dark Gothic',\r\n            'Pixel Glitch', 'Retro Chaos', 'Neon Strike', 'Void Mix',\r\n            'Mad Caps', 'Glitch Wave', 'Zalgo Mix', 'Dark Strike'\r\n        ];\r\n        const icons = ['fa-bolt-lightning', 'fa-fire', 'fa-ghost', 'fa-chess', 'fa-bomb', 'fa-skull', 'fa-rotate', 'fa-symbols', 'fa-meteor', 'fa-hat-wizard', 'fa-eye', 'fa-brain', 'fa-mask', 'fa-cloud', 'fa-hammer', 'fa-spider', 'fa-gamepad', 'fa-dragon', 'fa-truck-monster', 'fa-axe', 'fa-hand-fist', 'fa-head-side-cough', 'fa-skull-crossbones', 'fa-biohazard'];\r\n        \r\n        const list = [];\r\n        for(let i=0; i<TOTAL; i++) {\r\n            const times = ['Just now', '1s ago', '3s ago', '5s ago', '10s ago', '30s ago', '1m ago', '2m ago', '5m ago', '10m ago'];\r\n            list.push({\r\n                id: `crazy-${i}`,\r\n                name: `${names[i % names.length]} #${Math.floor(i\/names.length)+1}`,\r\n                time: times[i % times.length],\r\n                icon: icons[i % icons.length]\r\n            });\r\n        }\r\n        return list;\r\n    };\r\n\r\n    const allMeta = genMeta();\r\n\r\n    const render = () => {\r\n        grid.innerHTML = '';\r\n        const raw = input.value || \"GO CRAZY! \ud83d\udd25\";\r\n        const show = allMeta.slice(0, limit);\r\n        \r\n        show.forEach((meta, idx) => {\r\n            const out = transformText(raw, currentMode, currentDeco, idx);\r\n            \r\n            const card = document.createElement('div');\r\n            card.className = 'pg-crazy-card';\r\n            card.innerHTML = `\r\n                <div class=\"pg-crazy-card-header\">\r\n                    <div class=\"pg-crazy-card-profile\">\r\n                        <div class=\"pg-crazy-card-avatar\"><i class=\"fa-solid ${meta.icon}\"><\/i><\/div>\r\n                        <div class=\"pg-crazy-card-meta\">\r\n                            <div class=\"pg-crazy-card-title\">${meta.name}<\/div>\r\n                            <div class=\"pg-crazy-card-time\"><i class=\"fa-solid fa-clock\"><\/i> ${meta.time}<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <button class=\"pg-crazy-copy-btn\" title=\"Copy\"><i class=\"fa-regular fa-copy\"><\/i><\/button>\r\n                <\/div>\r\n                <div class=\"pg-crazy-card-preview\">${out}<\/div>\r\n                <div class=\"pg-crazy-card-footer\">\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-fire\"><\/i> Lit<\/div>\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-skull\"><\/i> Save<\/div>\r\n                    <div class=\"pg-crazy-card-action\"><i class=\"fa-solid fa-bomb\"><\/i> Share<\/div>\r\n                <\/div>\r\n            `;\r\n            \r\n            const copyBtn = card.querySelector('.pg-crazy-copy-btn');\r\n            copyBtn.addEventListener('click', (e) => {\r\n                e.preventDefault();\r\n                e.stopPropagation();\r\n                copyText(out, copyBtn);\r\n            });\r\n            \r\n            grid.appendChild(card);\r\n        });\r\n        \r\n        const remaining = Math.max(0, TOTAL - limit);\r\n        if(remaining > 0) {\r\n            loadBtn.style.display = 'inline-flex';\r\n            loadBtn.querySelector('span').textContent = `Load More Chaos (${remaining})`;\r\n        } else {\r\n            loadBtn.style.display = 'none';\r\n        }\r\n    };\r\n\r\n    input.addEventListener('input', render);\r\n    \r\n    pasteBtn.addEventListener('click', async (e) => {\r\n        e.preventDefault();\r\n        try {\r\n            const t = await navigator.clipboard.readText();\r\n            input.value = t;\r\n            render();\r\n        } catch {\r\n            input.focus();\r\n        }\r\n    });\r\n\r\n    selectBtn.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        input.select();\r\n    });\r\n\r\n    copyBase.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        if(input.value) copyText(input.value, null);\r\n    });\r\n\r\n    presetSel.addEventListener('change', (e) => {\r\n        if(e.target.value) {\r\n            input.value = e.target.value;\r\n            render();\r\n            e.target.selectedIndex = 0;\r\n        }\r\n    });\r\n\r\n    loadBtn.addEventListener('click', (e) => {\r\n        e.preventDefault();\r\n        limit += INCREMENT;\r\n        render();\r\n    });\r\n\r\n    wrapper.querySelectorAll('.style-btn').forEach(btn => {\r\n        btn.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            wrapper.querySelectorAll('.style-btn').forEach(b => b.classList.remove('active'));\r\n            btn.classList.add('active');\r\n            currentMode = btn.dataset.mode;\r\n            limit = 9;\r\n            render();\r\n        });\r\n    });\r\n\r\n    wrapper.querySelectorAll('.deco-btn').forEach(btn => {\r\n        btn.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            wrapper.querySelectorAll('.deco-btn').forEach(b => b.classList.remove('active'));\r\n            btn.classList.add('active');\r\n            currentDeco = btn.dataset.deco;\r\n            limit = 9;\r\n            render();\r\n        });\r\n    });\r\n\r\n    render();\r\n});\r\n<\/script>\r\n<!-- END OF FILE Crazy Text Generator -->\r\n\r\n<!-- <conntent section is starting -->\r\n\r\n<div>\r\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n\r\n    <!-- SECTION 1 -->\r\n\r\n\r\n\r\n\r\n\r\n\r\n<section class=\"pg-cztg-section pg-cztg-sec1\">\r\n        <div class=\"pg-cztg-wrap\">\r\n\t\r\n<\/div>\r\n\t<\/section>\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n    <section class=\"pg-cztg-section pg-cztg-sec1\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading\">What Makes This <span class=\"pg-cztg-kw\">Crazy Text Generator<\/span> Different?<\/h2>\r\n            <p class=\"pg-cztg-sub\">Most \"crazy\" text tools just randomly change your font size. Our crazy text generator uses advanced Unicode stacking, Zalgo glitch algorithms, and multi-script mixing to create text that looks genuinely chaotic, unpredictable, and visually explosive.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,60,0.12);color:#ff003c;\"><i class=\"fa-solid fa-burst\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">True Unicode Chaos Engine<\/div>\r\n                    <p class=\"pg-cztg-desc\">Our crazy text generator doesn't just randomize cases \u2014 it injects actual Unicode combining characters, mathematical symbols, and regional indicators to create text that looks like a system malfunction.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(192,255,0,0.12);color:#a3e635;\"><i class=\"fa-solid fa-clone\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Multi-Layer Overlapping Text<\/div>\r\n                    <p class=\"pg-cztg-desc\">Stack multiple versions of your text on top of each other using strikethrough, underline, and overline combining marks \u2014 our crazy text generator creates dense, layered typography that demands attention.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(0,229,255,0.12);color:#00e5ff;\"><i class=\"fa-solid fa-tv\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">VHS Glitch and Static Effects<\/div>\r\n                    <p class=\"pg-cztg-desc\">Simulate VHS tracking errors and digital static with corrupted character blocks \u2014 our crazy text generator makes your words look like they're being broadcast through a broken analog television.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,107,0,0.12);color:#ff6b00;\"><i class=\"fa-solid fa-language\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Cross-Script Mixing<\/div>\r\n                    <p class=\"pg-cztg-desc\">Our crazy text generator randomly substitutes letters with identical-looking characters from Cyrillic, Greek, and Armenian scripts to create text that looks normal at a glance but is completely chaotic under the hood.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(217,70,239,0.12);color:#d946ef;\"><i class=\"fa-solid fa-shuffle\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Insanity Level Slider<\/div>\r\n                    <p class=\"pg-cztg-desc\">Control exactly how unhinged your text gets \u2014 our crazy text generator lets you dial from mildly weird to absolutely unreadable digital vomit with a single precision slider.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(34,197,94,0.12);color:#22c55e;\"><i class=\"fa-solid fa-shield-halved\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Bypasses Spam Filters<\/div>\r\n                    <p class=\"pg-cztg-desc\">Despite looking chaotic, our crazy text generator uses carefully tested character combinations that won't trigger automated spam filters on Discord, Instagram, or TikTok.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 2 -->\r\n    <section class=\"pg-cztg-section pg-cztg-sec2\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading pg-cztg-sec2-heading\">How to Use Our <span class=\"pg-cztg-kw pg-cztg-sec2-kw\">Crazy Text Generator<\/span> Step by Step?<\/h2>\r\n            <p class=\"pg-cztg-sub pg-cztg-sec2-sub\">Unleashing digital chaos takes exactly seconds. No coding or design skills needed \u2014 just follow these steps and generate gloriously unhinged text ready to copy and paste.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(59,130,246,0.12);color:#3b82f6;\"><i class=\"fa-solid fa-keyboard\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 1: Type Your Normal Text<\/div>\r\n                    <p class=\"pg-cztg-desc\">Enter any word, sentence, or paragraph into the input box \u2014 our crazy text generator accepts standard text, numbers, and emojis as the stable base for your chaotic transformation.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(245,158,11,0.12);color:#f59e0b;\"><i class=\"fa-solid fa-swatchbook\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 2: Pick a Chaos Style<\/div>\r\n                    <p class=\"pg-cztg-desc\">Choose from Zalgo stacking, script mixing, VHS glitch, or multi-layer overlap \u2014 our crazy text generator shows all variations instantly so you can pick the perfect flavor of insanity.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(239,68,68,0.12);color:#ef4444;\"><i class=\"fa-solid fa-gauge-high\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 3: Set the Insanity Level<\/div>\r\n                    <p class=\"pg-cztg-desc\">Drag the chaos slider to control the density of glitch marks, symbol injections, and character overlaps \u2014 our crazy text generator calculates the exact Unicode payload for your chosen level.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(20,184,166,0.12);color:#14b8a6;\"><i class=\"fa-solid fa-wand-magic-sparkles\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 4: Toggle Extra Effects<\/div>\r\n                    <p class=\"pg-cztg-desc\">Enable optional strikethroughs, double-underlines, or enclosing boxes around your text \u2014 our crazy text generator layers these effects without breaking the underlying character structure.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(139,92,246,0.12);color:#8b5cf6;\"><i class=\"fa-solid fa-eye\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 5: Preview the Madness<\/div>\r\n                    <p class=\"pg-cztg-desc\">See exactly how your chaotic text renders before copying \u2014 our crazy text generator shows a live preview that guarantees the glitch effects display correctly across all devices and browsers.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec2-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(236,72,153,0.12);color:#ec4899;\"><i class=\"fa-solid fa-clipboard\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Step 6: Copy the Chaos<\/div>\r\n                    <p class=\"pg-cztg-desc\">Hit the copy button to transfer your mangled text to the clipboard \u2014 our crazy text generator preserves every single glitch mark and corrupted symbol through the copy-paste process.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- SECTION 3 -->\r\n    <section class=\"pg-cztg-section pg-cztg-sec3\">\r\n        <div class=\"pg-cztg-wrap\">\r\n            <h2 class=\"pg-cztg-heading\">Best Places to Use <span class=\"pg-cztg-kw\">Crazy Text Generator<\/span> Results?<\/h2>\r\n            <p class=\"pg-cztg-sub\">Crazy text is the ultimate tool for breaking visual monotony and demanding attention. Here are the highest-impact places where our crazy text generator output creates maximum disruption and engagement.<\/p>\r\n            <div class=\"pg-cztg-grid\">\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,80,0.10);color:#ff0050;\"><i class=\"fa-brands fa-tiktok\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">TikTok Edgy Comments<\/div>\r\n                    <p class=\"pg-cztg-desc\">Glitched text stops scrollers dead in their tracks because the brain tries to decode it \u2014 our crazy text generator creates the exact visual disruption that boosts comment engagement and replies.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(88,101,242,0.12);color:#5865f2;\"><i class=\"fa-brands fa-discord\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Discord Server Names<\/div>\r\n                    <p class=\"pg-cztg-desc\">A corrupted Discord server name instantly signals an underground, chaotic, or meme-focused community \u2014 our crazy text generator creates names that look like they were typed during a system failure.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(255,0,0,0.12);color:#ff0000;\"><i class=\"fa-brands fa-youtube\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Gaming Video Thumbnails<\/div>\r\n                    <p class=\"pg-cztg-desc\">Horror, rage-gaming, and glitch-art YouTubers use our crazy text generator for thumbnail titles \u2014 the corrupted lettering perfectly matches high-energy, chaotic video content.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(145,70,255,0.12);color:#9146ff;\"><i class=\"fa-brands fa-twitch\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Twitch Hype Alerts<\/div>\r\n                    <p class=\"pg-cztg-desc\">Trigger chaotic text animations for new followers, donations, or raids \u2014 our crazy text generator provides the raw corrupted strings that make alert overlays feel explosive and high-impact.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(249,115,22,0.12);color:#f97316;\"><i class=\"fa-solid fa-face-grin-squint-tears\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Meme Creation and Reddit<\/div>\r\n                    <p class=\"pg-cztg-desc\">Glitched text is the standard for \"I am losing my mind\" memes on Reddit \u2014 our crazy text generator outputs the exact style of corrupted text that gets upvoted in meme subreddits.<\/p>\r\n                <\/div>\r\n                <div class=\"pg-cztg-card pg-cztg-sec3-card\">\r\n                    <div class=\"pg-cztg-icon\" style=\"background:rgba(225,48,108,0.12);color:#e1306c;\"><i class=\"fa-brands fa-instagram\"><\/i><\/div>\r\n                    <div class=\"pg-cztg-title\">Instagram Bio Aesthetics<\/div>\r\n                    <p class=\"pg-cztg-desc\">The \"glitchcore\" and \"web-void\" aesthetics on Instagram rely on broken text \u2014 our crazy text generator creates the perfect corrupted bio text for alternative and digital-art focused profiles.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <style>\r\n        *, *::before, *::after {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        :root {\r\n            --cztg-alert: #ff003c;\r\n            --cztg-grad: linear-gradient(135deg, #ff003c, #c0ff00, #00e5ff);\r\n            --cztg-shadow: 0 12px 30px rgba(255, 0, 60, 0.16);\r\n            --cztg-ease: cubic-bezier(0.2, 0.8, 0.2, 1);\r\n            --cztg-speed: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n            --cztg-ff: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\r\n        }\r\n\r\n        .pg-cztg-section {\r\n            width: 100%;\r\n            padding: clamp(48px, 8vw, 96px) 20px;\r\n            position: relative;\r\n            font-family: var(--cztg-ff);\r\n            color: #0a0a0a;\r\n            line-height: 1.6;\r\n            -webkit-font-smoothing: antialiased;\r\n        }\r\n\r\n        .pg-cztg-wrap {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .pg-cztg-heading {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(1.5rem, 4vw, 2.25rem);\r\n            font-weight: 800;\r\n            text-align: center;\r\n            color: #000000;\r\n            margin-bottom: clamp(8px, 1.5vw, 14px);\r\n            line-height: 1.2;\r\n            letter-spacing: -0.03em;\r\n        }\r\n\r\n        .pg-cztg-kw {\r\n            color: #000000;\r\n            position: relative;\r\n        }\r\n\r\n        .pg-cztg-kw::after {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: -2px;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 3px;\r\n            background: var(--cztg-grad);\r\n            border-radius: 3px;\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s var(--cztg-ease);\r\n        }\r\n\r\n        .pg-cztg-section:hover .pg-cztg-kw::after {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-sub {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.88rem, 1.8vw, 1.02rem);\r\n            font-weight: 400;\r\n            text-align: center;\r\n            color: #1a1a1a;\r\n            max-width: 660px;\r\n            margin: 0 auto clamp(32px, 5vw, 56px);\r\n            line-height: 1.7;\r\n        }\r\n\r\n        .pg-cztg-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(3, 1fr);\r\n            gap: clamp(16px, 2.5vw, 26px);\r\n            align-items: stretch;\r\n        }\r\n\r\n        \/* === CARD BASE === *\/\r\n        .pg-cztg-card {\r\n            border-radius: 16px;\r\n            padding: clamp(22px, 3vw, 32px);\r\n            position: relative;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n            user-select: none;\r\n            transition: var(--cztg-speed);\r\n            border: 1.5px solid #e0e0e8;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        .pg-cztg-card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -1px;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 3px;\r\n            background: var(--cztg-grad);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s var(--cztg-ease);\r\n            z-index: 4;\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-card::after {\r\n            content: '';\r\n            position: absolute;\r\n            top: 50%;\r\n            left: 50%;\r\n            width: 0;\r\n            height: 0;\r\n            border-radius: 50%;\r\n            background: radial-gradient(circle, rgba(255,0,60,0.10) 0%, rgba(192,255,0,0.04) 60%, transparent 100%);\r\n            transform: translate(-50%, -50%);\r\n            transition: width 0.55s ease-out, height 0.55s ease-out, opacity 0.55s ease-out;\r\n            opacity: 0;\r\n            z-index: 0;\r\n            pointer-events: none;\r\n        }\r\n\r\n        .pg-cztg-card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down {\r\n            transform: translateY(-1px) scale(0.985) !important;\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-glow::after {\r\n            width: 320px;\r\n            height: 320px;\r\n            opacity: 1;\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-glow-out::after {\r\n            width: 320px;\r\n            height: 320px;\r\n            opacity: 0;\r\n        }\r\n\r\n        \/* === ICON === *\/\r\n        .pg-cztg-icon {\r\n            width: clamp(46px, 5vw, 58px);\r\n            height: clamp(46px, 5vw, 58px);\r\n            min-width: 46px;\r\n            min-height: 46px;\r\n            border-radius: 14px;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            font-size: clamp(18px, 2.5vw, 24px);\r\n            margin-bottom: clamp(14px, 2vw, 20px);\r\n            transition: var(--cztg-speed);\r\n            position: relative;\r\n            z-index: 3;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .pg-cztg-card:hover .pg-cztg-icon {\r\n            transform: scale(1.12) rotate(-4deg);\r\n        }\r\n\r\n        .pg-cztg-card.pg-cztg-down .pg-cztg-icon {\r\n            transform: scale(1.04) rotate(0deg);\r\n        }\r\n\r\n        \/* === TITLE === *\/\r\n        .pg-cztg-title {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.95rem, 2vw, 1.1rem);\r\n            font-weight: 700;\r\n            color: #000000;\r\n            margin-bottom: clamp(6px, 1vw, 10px);\r\n            line-height: 1.35;\r\n            position: relative;\r\n            z-index: 3;\r\n        }\r\n\r\n        \/* === DESC === *\/\r\n        .pg-cztg-desc {\r\n            font-family: var(--cztg-ff);\r\n            font-size: clamp(0.8rem, 1.5vw, 0.9rem);\r\n            font-weight: 400;\r\n            color: #1a1a1a;\r\n            line-height: 1.65;\r\n            position: relative;\r\n            z-index: 3;\r\n            margin-top: auto;\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 1 \u2014 #fff bg \/ #fff cards\r\n           ============================== *\/\r\n        .pg-cztg-sec1 {\r\n            background: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec1 .pg-cztg-card {\r\n            background: #ffffff;\r\n            border-color: #dcdce5;\r\n            box-shadow: 0 2px 8px rgba(0,0,0,0.04);\r\n        }\r\n\r\n        .pg-cztg-sec1 .pg-cztg-card:hover {\r\n            border-color: var(--cztg-alert);\r\n            box-shadow: var(--cztg-shadow);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 2 \u2014 purple gradient \/ white cards\r\n           ============================== *\/\r\n        .pg-cztg-sec2 {\r\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-heading.pg-cztg-sec2-heading {\r\n            color: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-kw.pg-cztg-sec2-kw {\r\n            color: #ffffff;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-kw.pg-cztg-sec2-kw::after {\r\n            background: linear-gradient(90deg, #ff003c, #c0ff00, #ffffff);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-sub.pg-cztg-sec2-sub {\r\n            color: rgba(255,255,255,0.9);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card {\r\n            background: #ffffff;\r\n            border-color: rgba(255,255,255,0.25);\r\n            box-shadow: 0 4px 20px rgba(0,0,0,0.12);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card::before {\r\n            background: linear-gradient(90deg, #ff003c, #764ba2, #c0ff00);\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card::after {\r\n            background: radial-gradient(circle, rgba(255,0,60,0.08) 0%, rgba(118,75,162,0.04) 60%, transparent 100%);\r\n        }\r\n\r\n        .pg-cztg-sec2 .pg-cztg-card.pg-cztg-sec2-card:hover {\r\n            border-color: rgba(255,0,60,0.5);\r\n            box-shadow: 0 14px 40px rgba(118,75,162,0.25);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           SECTION 3 \u2014 digital static gray bg \/ white cards\r\n           ============================== *\/\r\n        .pg-cztg-sec3 {\r\n            background: #f3f4f6;\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card {\r\n            background: #ffffff;\r\n            border-color: #e5e7eb;\r\n            box-shadow: 0 2px 8px rgba(0,0,0,0.04);\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card::before {\r\n            background: linear-gradient(90deg, #ff003c, #c0ff00, #00e5ff);\r\n            border-radius: 16px 16px 0 0;\r\n        }\r\n\r\n        .pg-cztg-sec3 .pg-cztg-card.pg-cztg-sec3-card:hover {\r\n            border-color: var(--cztg-alert);\r\n            box-shadow: var(--cztg-shadow);\r\n            transform: translateY(-5px);\r\n        }\r\n\r\n        \/* ==============================\r\n           RESPONSIVE\r\n           ============================== *\/\r\n        @media (max-width: 820px) {\r\n            .pg-cztg-grid {\r\n                grid-template-columns: repeat(2, 1fr);\r\n                gap: 16px;\r\n            }\r\n            .pg-cztg-section {\r\n                padding: clamp(36px, 6vw, 64px) 16px;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 540px) {\r\n            .pg-cztg-grid {\r\n                grid-template-columns: 1fr;\r\n                gap: 14px;\r\n            }\r\n            .pg-cztg-card {\r\n                padding: 22px;\r\n            }\r\n            .pg-cztg-sub {\r\n                margin-bottom: 28px;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 360px) {\r\n            .pg-cztg-section {\r\n                padding: 32px 12px;\r\n            }\r\n            .pg-cztg-card {\r\n                padding: 18px;\r\n                border-radius: 12px;\r\n            }\r\n        }\r\n    <\/style>\r\n\r\n    <script>\r\n    (function() {\r\n        var cards = document.querySelectorAll('.pg-cztg-card');\r\n        cards.forEach(function(card) {\r\n            function glow(el) {\r\n                el.classList.remove('pg-cztg-glow', 'pg-cztg-glow-out');\r\n                void el.offsetWidth;\r\n                el.classList.add('pg-cztg-glow');\r\n                setTimeout(function() {\r\n                    el.classList.add('pg-cztg-glow-out');\r\n                }, 300);\r\n                setTimeout(function() {\r\n                    el.classList.remove('pg-cztg-glow', 'pg-cztg-glow-out');\r\n                }, 700);\r\n            }\r\n            card.addEventListener('mousedown', function() {\r\n                card.classList.add('pg-cztg-down');\r\n            });\r\n            card.addEventListener('mouseup', function() {\r\n                setTimeout(function() {\r\n                    card.classList.remove('pg-cztg-down');\r\n                }, 120);\r\n                glow(card);\r\n            });\r\n            card.addEventListener('mouseleave', function() {\r\n                card.classList.remove('pg-cztg-down', 'pg-cztg-glow', 'pg-cztg-glow-out');\r\n            });\r\n            card.addEventListener('touchstart', function() {\r\n                card.classList.add('pg-cztg-down');\r\n                glow(card);\r\n            }, { passive: true });\r\n            card.addEventListener('touchend', function() {\r\n                setTimeout(function() {\r\n                    card.classList.remove('pg-cztg-down');\r\n                }, 150);\r\n            });\r\n            card.addEventListener('touchcancel', function() {\r\n                card.classList.remove('pg-cztg-down', 'pg-cztg-glow', 'pg-cztg-glow-out');\r\n            });\r\n        });\r\n    })();\r\n    <\/script>\r\n<\/div>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-579","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Generatore di testo pazzesco: trasforma all&#039;istante<\/title>\n<meta name=\"description\" content=\"Crea testi stravaganti e originali con il nostro generatore di testi pazzi gratuito. Trasforma qualsiasi testo in stili bizzarri e accattivanti: copia e incolla in pochi secondi.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/onlinetexteditor.io\/it\/crazy-text-generator\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Crazy Text Generator \u2013 Transform Instantly\" \/>\n<meta property=\"og:description\" content=\"Create wild crazy text with our free Crazy Text Generator. Turn any text into bizarre, eye-catching styles \u2014 copy &amp; paste in seconds.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/onlinetexteditor.io\/crazy-text-generator\/\" \/>\n<meta property=\"og:site_name\" content=\"Online Text Editor\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-06T09:18:24+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/onlinetexteditor.io\\\/crazy-text-generator\\\/\",\"url\":\"https:\\\/\\\/onlinetexteditor.io\\\/crazy-text-generator\\\/\",\"name\":\"Crazy Text Generator \u2013 Transform Instantly\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/onlinetexteditor.io\\\/#website\"},\"datePublished\":\"2026-03-17T00:00:31+00:00\",\"dateModified\":\"2026-04-06T09:18:24+00:00\",\"description\":\"Create wild crazy text with our free Crazy Text Generator. Turn any text into bizarre, eye-catching styles \u2014 copy & paste in seconds.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/onlinetexteditor.io\\\/crazy-text-generator\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/onlinetexteditor.io\\\/crazy-text-generator\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/onlinetexteditor.io\\\/crazy-text-generator\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/onlinetexteditor.io\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Crazy Text Generator \u2013 Transform Instantly\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/onlinetexteditor.io\\\/#website\",\"url\":\"https:\\\/\\\/onlinetexteditor.io\\\/\",\"name\":\"Online Text Editor\",\"description\":\"Free &amp; Secure Rich Text Editing\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/onlinetexteditor.io\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Generatore di testo pazzesco: trasforma all&#39;istante","description":"Crea testi stravaganti e originali con il nostro generatore di testi pazzi gratuito. Trasforma qualsiasi testo in stili bizzarri e accattivanti: copia e incolla in pochi secondi.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/onlinetexteditor.io\/it\/crazy-text-generator\/","og_locale":"en_US","og_type":"article","og_title":"Crazy Text Generator \u2013 Transform Instantly","og_description":"Create wild crazy text with our free Crazy Text Generator. Turn any text into bizarre, eye-catching styles \u2014 copy & paste in seconds.","og_url":"https:\/\/onlinetexteditor.io\/crazy-text-generator\/","og_site_name":"Online Text Editor","article_modified_time":"2026-04-06T09:18:24+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/onlinetexteditor.io\/crazy-text-generator\/","url":"https:\/\/onlinetexteditor.io\/crazy-text-generator\/","name":"Crazy Text Generator \u2013 Transform Instantly","isPartOf":{"@id":"https:\/\/onlinetexteditor.io\/#website"},"datePublished":"2026-03-17T00:00:31+00:00","dateModified":"2026-04-06T09:18:24+00:00","description":"Create wild crazy text with our free Crazy Text Generator. Turn any text into bizarre, eye-catching styles \u2014 copy & paste in seconds.","breadcrumb":{"@id":"https:\/\/onlinetexteditor.io\/crazy-text-generator\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/onlinetexteditor.io\/crazy-text-generator\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/onlinetexteditor.io\/crazy-text-generator\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/onlinetexteditor.io\/"},{"@type":"ListItem","position":2,"name":"Crazy Text Generator \u2013 Transform Instantly"}]},{"@type":"WebSite","@id":"https:\/\/onlinetexteditor.io\/#website","url":"https:\/\/onlinetexteditor.io\/","name":"Online Text Editor","description":"Free &amp; Secure Rich Text Editing","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/onlinetexteditor.io\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/pages\/579","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/comments?post=579"}],"version-history":[{"count":3,"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/pages\/579\/revisions"}],"predecessor-version":[{"id":582,"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/pages\/579\/revisions\/582"}],"wp:attachment":[{"href":"https:\/\/onlinetexteditor.io\/it\/wp-json\/wp\/v2\/media?parent=579"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}