:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}code[class*=language-],pre[class*=language-]{color:#ccc;background:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}:root{--color-primary-900: #0a0e27;--color-primary-800: #1a1f3a;--color-primary-700: #2d3561;--color-primary-600: #4a5490;--gradient-aurora: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%);--gradient-sunset: linear-gradient(135deg, #fa709a 0%, #fee140 50%, #30cfd0 100%);--gradient-ocean: linear-gradient(135deg, #2e3192 0%, #1bffff 100%);--gradient-cyber: linear-gradient(135deg, #0f2027 0%, #203a43 50%, #2c5364 100%);--gradient-neon: linear-gradient(135deg, #ff6ec4 0%, #7873f5 50%, #4bdbdb 100%);--glass-white: rgba(255, 255, 255, .1);--glass-dark: rgba(10, 14, 39, .7);--glass-border: rgba(255, 255, 255, .18);--neon-cyan: #00fff5;--neon-purple: #b24bf3;--neon-pink: #ff2e97;--neon-blue: #4d94ff;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--shadow-glow-cyan: 0 0 40px rgba(0, 255, 245, .3);--shadow-glow-purple: 0 0 40px rgba(178, 75, 243, .3);--shadow-glow-pink: 0 0 40px rgba(255, 46, 151, .3);--shadow-depth-1: 0 4px 20px rgba(0, 0, 0, .15);--shadow-depth-2: 0 8px 40px rgba(0, 0, 0, .2);--shadow-depth-3: 0 16px 60px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;font-family:Inter,SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;background:#0a0e27;color:#e5e7eb;overflow:hidden}main{height:100%;width:100%;padding:1.5rem;display:flex;gap:1.5rem;background:linear-gradient(135deg,#0a0e27,#1a1f3a,#2d3561);position:relative;overflow:hidden}main:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 20% 50%,rgba(102,126,234,.15) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(178,75,243,.15) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(0,255,245,.1) 0%,transparent 50%);animation:mesh-float 20s ease-in-out infinite;pointer-events:none}@keyframes mesh-float{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(5%,5%) rotate(120deg)}66%{transform:translate(-5%,5%) rotate(240deg)}}main .left,main .right{flex:1;display:flex;flex-direction:column;gap:1rem;border-radius:1.5rem;overflow:hidden;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);background:var(--glass-dark);border:1px solid var(--glass-border);box-shadow:var(--shadow-depth-2),inset 0 0 60px #ffffff08;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative}main .left:before,main .right:before{content:"";position:absolute;inset:0;border-radius:1.5rem;padding:2px;background:var(--gradient-aurora);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s ease;pointer-events:none}main .left:hover:before,main .right:hover:before{opacity:.6}main .left:hover,main .right:hover{transform:translateY(-8px);box-shadow:var(--shadow-depth-3),var(--shadow-glow-cyan),inset 0 0 80px #ffffff0d}main .left{background:linear-gradient(135deg,#0a0e27f2,#1a1f3af2);padding:1.5rem;position:relative}main .left:after{content:"";position:absolute;top:0;left:10%;right:10%;height:2px;background:var(--gradient-neon);opacity:.6;filter:blur(2px)}.left .code{flex:1;border-radius:1rem;overflow:auto;background:linear-gradient(135deg,#0f1419,#1a1f2e);box-shadow:inset 0 2px 40px #0009,inset 0 0 2px #00fff51a;padding:1rem;border:1px solid rgba(77,148,255,.1);transition:all .3s ease}.left .code:hover{box-shadow:inset 0 2px 50px #000000b3,inset 0 0 4px #00fff533;border-color:#00fff54d}.left .code::-webkit-scrollbar{width:8px;height:8px}.left .code::-webkit-scrollbar-track{background:#0f141980;border-radius:10px}.left .code::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--neon-cyan) 0%,var(--neon-blue) 100%);border-radius:10px;box-shadow:0 0 10px #00fff580}.left .code::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--neon-pink) 0%,var(--neon-purple) 100%);box-shadow:0 0 15px #ff2e97cc}.left .code pre{height:100%;margin:0;font-family:Fira Code,JetBrains Mono,Cascadia Code,monospace;font-size:14px;font-weight:400;background-color:transparent;color:#e5e7eb;line-height:1.7;letter-spacing:.3px}main .left .review{position:absolute;bottom:1.5rem;right:1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.75rem 2rem;font-weight:600;font-size:.9375rem;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:.75rem;border:none;box-shadow:0 4px 16px #667eea66;transition:all .25s ease;display:flex;align-items:center;gap:.5rem;z-index:10}main .left .review:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #667eea80;background:linear-gradient(135deg,#7689ef,#8559b5)}main .left .review:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px #667eea66}main .left .review:disabled{opacity:.6;cursor:not-allowed}.spinner{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.2);border-top-color:var(--neon-cyan);border-right-color:var(--neon-purple);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}main .right{background:linear-gradient(135deg,#fffffffa,#f8fafcfa);padding:2rem;border-radius:1.5rem;overflow-y:auto;position:relative}main .right:after{content:"";position:absolute;top:0;left:0;right:0;height:150px;background:linear-gradient(180deg,rgba(102,126,234,.03) 0%,transparent 100%);pointer-events:none}main .right::-webkit-scrollbar{width:8px}main .right::-webkit-scrollbar-track{background:#e2e8f080;border-radius:10px}main .right::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--neon-purple) 0%,var(--neon-pink) 100%);border-radius:10px;box-shadow:0 0 10px #b24bf366}main .right::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--neon-cyan) 0%,var(--neon-blue) 100%);box-shadow:0 0 15px #00fff599}main .right .review-content{line-height:1.75;color:#1e293b;font-size:15px;word-wrap:break-word;position:relative;z-index:1}main .right .review-content h1,main .right .review-content h2,main .right .review-content h3,main .right .review-content h4{margin-top:2rem;margin-bottom:1rem;color:#0f172a;font-weight:700;letter-spacing:-.02em;background:var(--gradient-aurora);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}main .right .review-content h1{font-size:2rem;border-bottom:2px solid;border-image:var(--gradient-neon) 1;padding-bottom:.75rem}main .right .review-content h2{font-size:1.625rem;border-bottom:1px solid;border-image:linear-gradient(90deg,rgba(102,126,234,.3) 0%,transparent 100%) 1;padding-bottom:.5rem}main .right .review-content h3{font-size:1.375rem}main .right .review-content p{margin:1rem 0;color:#334155}main .right .review-content code{padding:.25rem .5rem;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);border:1px solid rgba(102,126,234,.2);border-radius:.375rem;font-size:.875em;font-family:Fira Code,monospace;color:var(--neon-purple);font-weight:500}main .right .review-content pre{background:linear-gradient(135deg,#1e293b,#334155);border-radius:.75rem;padding:1.5rem;margin:1.5rem 0;overflow-x:auto;border:1px solid rgba(0,255,245,.2);box-shadow:0 8px 32px #0003,inset 0 0 60px #00fff508}main .right .review-content pre code{background:none;border:none;padding:0;color:#e2e8f0;-webkit-background-clip:unset;-webkit-text-fill-color:unset;background-clip:unset}main .right .review-content ul,main .right .review-content ol{margin:1rem 0;padding-left:2rem}main .right .review-content li{margin:.75rem 0;color:#475569}main .right .review-content li::marker{color:var(--neon-purple)}main .right .review-content blockquote{margin:1.5rem 0;padding:1rem 1.5rem;background:linear-gradient(135deg,#667eea0d,#b24bf30d);border-left:4px solid var(--neon-purple);border-radius:.5rem;color:#475569;font-style:italic;box-shadow:0 4px 16px #667eea14}main .right .review-content strong{font-weight:700;color:#0f172a;background:linear-gradient(135deg,var(--neon-purple) 0%,var(--neon-pink) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.review-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;text-align:center}.loading-spinner-wrapper{position:relative;width:120px;height:120px;margin-bottom:2.5rem}.pulse-ring{position:absolute;width:100%;height:100%;border:3px solid var(--neon-cyan);border-radius:50%;animation:pulse-animation 2s cubic-bezier(.4,0,.6,1) infinite;box-shadow:0 0 20px currentColor}.pulse-ring.delay-1{animation-delay:.4s;border-color:var(--neon-purple)}.pulse-ring.delay-2{animation-delay:.8s;border-color:var(--neon-pink)}@keyframes pulse-animation{0%{transform:scale(.8);opacity:1}to{transform:scale(1.5);opacity:0}}main .right .review-loading{background:var(--gradient-neon);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;font-size:1.25rem;animation:pulse 1.5s infinite ease-in-out;letter-spacing:-.01em}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}.review-error{padding:1.25rem 1.75rem;background:linear-gradient(135deg,#fecacaf2,#fca5a5f2);border:2px solid var(--color-error);border-radius:1rem;color:#991b1b;font-weight:600;font-size:.9375rem;box-shadow:0 8px 32px #ef444440,inset 0 0 40px #ffffff4d}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;text-align:center}.empty-icon{font-size:5rem;margin-bottom:2rem;filter:drop-shadow(0 8px 32px rgba(102,126,234,.4));animation:float 4s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-15px) rotate(5deg)}}.empty-state h3{font-size:1.75rem;margin-bottom:1rem;font-weight:700;background:var(--gradient-aurora);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.empty-state p{font-size:1.0625rem;margin-bottom:2.5rem;color:#64748b}.empty-state .tip{background:linear-gradient(135deg,#ecfefff2,#cffafef2);border:2px solid var(--neon-cyan);border-radius:1rem;padding:1.25rem 2rem;font-size:1rem;color:#0e7490;display:inline-flex;align-items:center;gap:.75rem;box-shadow:0 8px 32px #00fff533,inset 0 0 40px #ffffff80;font-weight:500}.empty-state kbd{padding:.375rem .625rem;background:linear-gradient(135deg,#fff,#f8fafc);border:1px solid var(--neon-purple);border-radius:.375rem;font-size:.8125rem;font-family:Fira Code,monospace;box-shadow:0 4px 12px #b24bf333,inset 0 -2px #0000001a;font-weight:700;color:var(--neon-purple)}@media(max-width:1024px){main{flex-direction:column}main .left,main .right{flex-basis:100%;min-height:450px}main .left .review{position:static;width:100%;margin-top:1rem}}@media(max-width:640px){main{padding:1rem;gap:1rem}main .left,main .right{padding:1rem;border-radius:1rem}.left .code pre{font-size:13px}main .right .review-content{font-size:14px}}*:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:3px;box-shadow:0 0 0 4px #00fff533}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{main{flex-direction:column;background:#fff}main .left .review{display:none}main .right{box-shadow:none;border:1px solid #e2e8f0}}