@font-face{font-family:liv4real;src:url(/liv4real.ttf) format("truetype");font-display:swap}:root{--bg: #0a0a0f;--surface: #12121a;--border: #2a2a3a;--accent: #00ff88;--accent2: #ff00aa;--accent3: #00ccff;--text: #e0e0e0;--text-dim: #888;--radius: 12px;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--font-mono);min-height:100vh;overflow-x:hidden}.floating-chars{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.float-char{position:absolute;bottom:-2em;font-family:"liv4real",var(--font-mono);color:#8888a0;will-change:transform;animation:float-up linear infinite;-webkit-user-select:none;user-select:none}@keyframes float-up{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-110vh) rotate(20deg)}}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,255,136,.015) 2px,rgba(0,255,136,.015) 4px);z-index:9999}.container{max-width:960px;margin:0 auto;padding:2rem 1.5rem;position:relative;z-index:1}header{text-align:center;margin-bottom:2.5rem;position:relative}.title{font-size:3.5rem;font-weight:900;letter-spacing:.3em;background:linear-gradient(135deg,var(--accent),var(--accent3),var(--accent2));background-size:300% 300%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:gradient-shift 4s ease infinite;position:relative;display:inline-block}.title:before,.title:after{content:attr(data-text);position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,var(--accent),var(--accent3),var(--accent2));background-size:300% 300%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:gradient-shift 4s ease infinite}.title:before{animation:glitch-1 3s infinite;clip-path:polygon(0 0,100% 0,100% 33%,0 33%)}.title:after{animation:glitch-2 3s infinite;clip-path:polygon(0 66%,100% 66%,100% 100%,0 100%)}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes glitch-1{0%,90%,to{transform:translate(0)}92%{transform:translate(-3px,1px)}94%{transform:translate(3px,-1px)}96%{transform:translate(-2px)}}@keyframes glitch-2{0%,88%,to{transform:translate(0)}90%{transform:translate(3px,-1px)}93%{transform:translate(-3px,1px)}95%{transform:translate(1px)}}.subtitle{color:var(--text-dim);font-size:.85rem;margin-top:.5rem;letter-spacing:.15em}.controls{display:flex;justify-content:flex-end;gap:1rem;margin-bottom:1.5rem;align-items:center;flex-wrap:wrap}.lang-select{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:.4rem .8rem;border-radius:var(--radius);font-family:var(--font-mono);font-size:.8rem;cursor:pointer;outline:none;transition:border-color .2s}.lang-select:hover,.lang-select:focus{border-color:var(--accent)}.font-toggle{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none}.font-toggle input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:36px;height:20px;background:var(--border);border-radius:10px;position:relative;cursor:pointer;transition:background .2s}.font-toggle input[type=checkbox]:after{content:"";position:absolute;width:16px;height:16px;background:var(--text);border-radius:50%;top:2px;left:2px;transition:transform .2s,background .2s}.font-toggle input[type=checkbox]:checked{background:var(--accent)}.font-toggle input[type=checkbox]:checked:after{transform:translate(16px);background:var(--bg)}.panels{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}@media(max-width:640px){.panels{grid-template-columns:1fr}.title{font-size:2.2rem}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;transition:border-color .3s}.panel:hover{border-color:var(--accent)}.panel-title{font-size:1rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.panel-title .icon{font-size:1.2rem}.panel-encode .panel-title{color:var(--accent)}.panel-decode .panel-title{color:var(--accent2)}textarea{width:100%;height:120px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:var(--font-mono);font-size:.85rem;padding:.75rem;resize:vertical;outline:none;transition:border-color .2s;line-height:1.5}textarea.glory-font{font-family:"liv4real",var(--font-mono);font-size:1.1rem;letter-spacing:.2em;color:var(--accent2)}textarea:focus{border-color:var(--accent3)}.output-area{position:relative;margin-top:.75rem}.output-text{width:100%;min-height:80px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:.75rem;font-family:var(--font-mono);font-size:.85rem;font-weight:700;line-height:1.5;word-break:break-all;white-space:pre-wrap;color:var(--accent2);-webkit-user-select:all;user-select:all}.output-text.glory-font{font-family:"liv4real",var(--font-mono);font-size:1.1rem;letter-spacing:.2em}.output-text.has-error{color:#f44;border-color:#f44}.btn-row{display:flex;gap:.5rem;margin-top:.75rem}.btn{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:.35rem .9rem;border-radius:8px;font-family:var(--font-mono);font-size:.75rem;cursor:pointer;transition:all .2s;letter-spacing:.05em}.btn:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 0 12px #00ff8826}.btn.btn-copied{border-color:var(--accent);color:var(--accent);animation:pulse-copy .3s ease}@keyframes pulse-copy{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.stat{font-size:.7rem;color:var(--text-dim);margin-top:.4rem}footer{text-align:center;margin-top:3rem;padding:1.5rem 0;border-top:1px solid var(--border);color:var(--text-dim);font-size:.75rem;letter-spacing:.1em}footer a{color:var(--accent);text-decoration:none}footer a:hover{text-decoration:underline}.contact-section{margin-bottom:1.2rem}.contact-title{font-size:.8rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent3);margin-bottom:.75rem}.contact-grid{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap}.contact-item{display:flex;flex-direction:column;gap:.25rem}.contact-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:var(--text-dim)}.contact-value{font-size:.8rem;color:var(--accent);text-decoration:none;transition:text-shadow .2s}.contact-value:hover{text-shadow:0 0 8px rgba(0,255,136,.4);text-decoration:underline}.footer-tag{margin-top:.6rem;opacity:.6}@keyframes border-glow{0%,to{box-shadow:0 0 5px #00ff880d}50%{box-shadow:0 0 15px #00ff881a}}.panel{animation:border-glow 4s ease infinite}.font-hint{font-size:.7rem;color:var(--text-dim);margin-top:.25rem}