:root{--bg-color:#121212;--panel-bg:#1e1e1e;--text-color:#e0e0e0;--border-color:#333;--accent-color:#bb86fc;--accent-hover:#9965f4;--error-color:#cf6679}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-color);height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}#root{flex-direction:column;height:100%;display:flex}.app-container{flex-direction:column;gap:1rem;width:100%;max-width:1400px;height:100%;margin:0 auto;padding:1rem 2rem;display:flex}.app-header{justify-content:space-between;align-items:center;padding:.5rem 1rem;display:flex}.app-title{background:linear-gradient(45deg, var(--accent-color), #ff00c8, var(--accent-color));-webkit-text-fill-color:transparent;letter-spacing:-.5px;background-size:200%;-webkit-background-clip:text;font-size:2.2rem;font-weight:800;animation:6s linear infinite bgRotate}.dropzone{border:2px dashed var(--border-color);text-align:center;background-color:var(--panel-bg);cursor:pointer;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;min-height:120px;padding:2rem;transition:border-color .2s,background-color .2s;display:flex}@keyframes bgRotate{to{filter:hue-rotate(360deg)}}.dropzone.active{background:linear-gradient(#251c30,#251c30) padding-box padding-box,linear-gradient(45deg,red,#ff7300,#fffb00,#48ff00,#00ffd5,#002bff,#7a00ff,#ff00c8) border-box;border:2px solid #0000;animation:3s linear infinite bgRotate}.dropzone p{margin:.5rem 0}.dropzone .error{color:var(--error-color);font-weight:700}.main-content{flex:1;gap:1rem;min-height:0;display:flex}.sidebar{background-color:var(--panel-bg);border:1px solid var(--border-color);border-radius:8px;flex-direction:column;width:250px;padding:1rem;display:flex;overflow-y:auto}.sidebar h2{border-bottom:1px solid var(--border-color);margin-bottom:1rem;padding-bottom:.5rem;font-size:1.2rem}.page-list{list-style:none}.page-item{background-color:var(--bg-color);border-radius:4px;margin-bottom:.5rem;padding:.5rem;font-size:.9rem;transition:background-color .2s}.page-item:hover{background-color:var(--border-color)}.textarea-container{flex-direction:column;flex:1;gap:.5rem;display:flex}textarea.result-area{background-color:var(--panel-bg);width:100%;color:var(--text-color);border:1px solid var(--border-color);resize:none;white-space:pre;border-radius:8px;outline:none;flex:1;padding:1rem;font-family:Courier New,Courier,monospace;font-size:14px;overflow:auto}textarea.result-area:focus{background:linear-gradient(var(--panel-bg), var(--panel-bg)) padding-box, linear-gradient(45deg, red, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8) border-box;border:1px solid #0000;animation:3s linear infinite bgRotate}.loading{color:var(--accent-color);font-weight:700}.actions-bar{justify-content:flex-end;gap:.5rem;padding-bottom:.5rem;display:flex}button{background-color:var(--accent-color);color:#000;cursor:pointer;border:none;border-radius:4px;padding:.5rem 1rem;font-weight:700;transition:background-color .2s}button:hover{background-color:var(--accent-hover)}button:disabled{color:#888;cursor:not-allowed;background-color:#555}.upgrade-btn{color:#000;background-color:#ffb74d}.upgrade-btn:hover{background-color:#ff9800}.modal-overlay{z-index:1000;background-color:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--panel-bg);border:1px solid var(--border-color);border-radius:8px;width:400px;max-width:90%;padding:2rem;position:relative}.modal-close{color:var(--text-color);background:0 0;border:none;justify-content:center;align-items:center;width:30px;height:30px;padding:0;font-size:1.5rem;display:flex;position:absolute;top:10px;right:10px}.modal-close:hover{color:var(--error-color);background-color:#0000}.modal-content h2{margin-bottom:.5rem}.modal-content p{color:#aaa;margin-bottom:1.5rem;font-size:.9rem}.auth-form{flex-direction:column;gap:1rem;display:flex}.auth-input{background-color:var(--bg-color);border:1px solid var(--border-color);color:var(--text-color);border-radius:4px;padding:.75rem;font-size:1rem}.auth-input:focus{border-color:var(--accent-color);outline:none}.auth-button{padding:.75rem}.auth-message{text-align:center;border-radius:4px;margin-top:1rem;padding:.75rem;font-size:.9rem}.auth-message.success{color:#4caf50;background-color:#4caf501a;border:1px solid #4caf50}.auth-message.error{color:var(--error-color);border:1px solid var(--error-color);background-color:#cf66791a}
