:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "SF Mono", Consolas, monospace;--brand-orange: #eb5638;--brand-orange-hover: #d94a2e;--brand-black: #2b2b2b;--brand-cream: #ebe5c0;--white: #ebe5c0;--gray-50: #e6e0b8;--gray-100: #ddd7ad;--gray-200: #d4cea3;--gray-300: #b8b38f;--gray-400: #9a9578;--gray-500: #7a7660;--gray-600: #5a574a;--gray-700: #3d3b33;--gray-800: #2b2b2b;--gray-900: #1f1f1f;--primary: var(--brand-black);--primary-hover: #3d3d3d;--accent: var(--brand-orange);--accent-hover: var(--brand-orange-hover);--danger: #c43c2a;--danger-hover: #a33222;--success: #5a8a5a;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--radius-sm: .375rem;--radius: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--transition: .15s cubic-bezier(.4, 0, .2, 1);--bounce: cubic-bezier(.34, 1.56, .64, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-sans);font-size:15px;line-height:1.6;color:var(--brand-black);background:var(--brand-cream);min-height:100vh}a{color:inherit;text-decoration:none}.container{max-width:860px;margin:0 auto;padding:2.5rem 1.5rem;animation:fadeSlideIn .4s ease-out}main,#root>*:not(.navbar):not(nav){max-width:860px;margin:0 auto;padding:2.5rem 1.5rem;animation:fadeSlideIn .4s ease-out}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}h1,h2,h3,h4{font-weight:600;color:var(--gray-900);line-height:1.3;letter-spacing:-.025em}h1{font-size:1.875rem;margin-bottom:1.5rem}h2{font-size:1.5rem;margin-bottom:1rem}h3{font-size:1.25rem;margin-bottom:.75rem}p{color:var(--gray-600);margin-bottom:.5rem}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2rem;background:var(--brand-black);border-bottom:3px solid var(--brand-orange);position:sticky;top:0;z-index:100;max-width:none}.navbar.container{max-width:none;padding:1.25rem 2rem}.nav-brand{font-size:1.25rem;font-weight:700;letter-spacing:-.05em;color:var(--brand-cream);transition:color var(--transition)}.nav-brand:hover{color:var(--brand-orange)}.nav-links{display:flex;align-items:center;gap:1rem}.nav-links a,.nav-links button{font-size:.875rem;font-weight:500;color:var(--brand-cream);background:none;border:none;cursor:pointer;padding:.5rem 1rem;border-radius:var(--radius-sm);transition:all .2s var(--bounce)}.nav-links a:hover,.nav-links button:hover{color:var(--brand-black);background:var(--brand-orange);transform:translateY(-1px)}.nav-links a:active,.nav-links button:active{transform:translateY(0) scale(.97)}.modal-overlay{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--brand-cream);border-radius:var(--radius-xl);padding:2rem;max-width:420px;width:90%;box-shadow:var(--shadow-xl);animation:modalSlideIn .3s var(--bounce);position:relative;border:2px solid var(--brand-black)}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;padding:.5rem;color:var(--gray-400);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.modal-close:hover{color:var(--gray-700);background:var(--gray-100);transform:none;box-shadow:none}.modal-icon{width:64px;height:64px;background:var(--brand-black);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;color:var(--brand-orange)}.modal-content h2{text-align:center;margin-bottom:.5rem;font-size:1.25rem;color:var(--brand-black)}.modal-content .subtitle{text-align:center;color:var(--gray-500);font-size:.9375rem;margin-bottom:1.5rem}.modal-steps{display:flex;flex-direction:column;gap:1rem}.modal-step{display:flex;gap:1rem;align-items:flex-start}.step-number{width:28px;height:28px;background:var(--brand-orange);color:var(--brand-cream);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8125rem;font-weight:600;flex-shrink:0}.step-text{font-size:.9375rem;color:var(--gray-600);line-height:1.5;padding-top:.2rem}.step-text strong{color:var(--brand-black)}.modal-footer{margin-top:1.75rem;text-align:center}.modal-footer button{width:100%;padding:.75rem;background:var(--brand-orange);color:var(--brand-cream);border:none}.modal-footer button:hover{background:var(--accent-hover)}button{font-family:inherit;font-size:.875rem;font-weight:500;padding:.625rem 1rem;border-radius:var(--radius-sm);border:1px solid var(--gray-300);background:var(--white);color:var(--gray-700);cursor:pointer;transition:all .2s var(--bounce);display:inline-flex;align-items:center;justify-content:center;gap:.5rem}button:hover{border-color:var(--gray-400);background:var(--gray-50);transform:translateY(-2px);box-shadow:var(--shadow-md)}button:active{transform:translateY(0) scale(.98);box-shadow:var(--shadow-sm)}button:focus{outline:none;box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--gray-400)}button[type=submit],.btn-primary{background:var(--brand-orange);color:var(--brand-cream);border-color:var(--brand-orange)}button[type=submit]:hover,.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}button[name=delete]{color:var(--danger);border-color:transparent;background:transparent}button[name=delete]:hover{background:#fef2f2;border-color:#fecaca}form{display:flex;flex-direction:column;gap:1.25rem}label{display:block;font-size:.875rem;font-weight:500;color:var(--gray-700);margin-bottom:.375rem}input,select,textarea{width:100%;padding:.75rem 1rem;font-family:inherit;font-size:.9375rem;color:var(--brand-black);background:var(--brand-cream);border:2px solid var(--gray-300);border-radius:var(--radius-sm);transition:all var(--transition)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand-orange);box-shadow:0 0 0 3px #eb563826}input::placeholder,textarea::placeholder{color:var(--gray-400)}textarea{min-height:140px;font-family:var(--font-mono);font-size:.875rem;line-height:1.7;resize:vertical}select{appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .75rem center;background-repeat:no-repeat;background-size:1.25rem;padding-right:2.5rem}.form-group{display:flex;flex-direction:column}.auth-box{max-width:400px;margin:4rem auto;padding:2.5rem;background:var(--brand-cream);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:2px solid var(--brand-black);animation:fadeSlideIn .4s ease-out}.auth-box h2{text-align:center;margin-bottom:2rem}.auth-box form{gap:1rem}.auth-box button[type=submit]{margin-top:.5rem;padding:.875rem}.divider{display:flex;align-items:center;margin:1.5rem 0}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--gray-300)}.divider span{padding:0 1rem;color:var(--gray-400);font-size:.8125rem;text-transform:uppercase;letter-spacing:.05em}.demo-btn{width:100%;padding:.75rem;background:transparent;border:2px dashed var(--brand-orange);color:var(--brand-orange);font-weight:500;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s var(--bounce)}.demo-btn:hover{background:var(--brand-orange);border-style:solid;color:var(--brand-cream);transform:none;box-shadow:var(--shadow-md)}.demo-hint{text-align:center;font-size:.75rem;color:var(--gray-400);margin-top:.5rem;margin-bottom:0}table{width:100%;border-collapse:collapse;background:var(--brand-cream);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:2px solid var(--brand-black);margin-top:1.5rem}thead{background:var(--brand-black);border-bottom:2px solid var(--brand-orange)}th{text-align:left;padding:.875rem 1.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--brand-cream)}td{padding:1rem 1.25rem;border-bottom:1px solid var(--gray-200);color:var(--brand-black);font-size:.9375rem}tr:last-child td{border-bottom:none}tr{transition:all .15s ease}tr:hover td{background:var(--gray-50)}tr:hover{transform:scale(1.005)}td:first-child{font-weight:500;color:var(--brand-black)}.item-btn-menu{display:flex;gap:.5rem;justify-content:flex-end}.item-btn-menu button{padding:.5rem .75rem;font-size:.8125rem}.btn-menu{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem;margin-bottom:2.5rem}.btn-menu button{padding:.75rem 1.25rem;font-weight:500;background:var(--brand-cream);border:2px solid var(--brand-black);box-shadow:var(--shadow-sm);color:var(--brand-black);transition:all .25s var(--bounce);position:relative}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;font-size:.7rem;font-weight:600;background:var(--brand-orange);color:var(--brand-cream);border-radius:10px;margin-left:8px}.btn-menu button:hover .badge{background:var(--brand-cream);color:var(--brand-orange)}.btn-menu button:hover{border-color:var(--brand-orange);background:var(--brand-orange);color:var(--brand-cream);transform:translateY(-3px) scale(1.02);box-shadow:var(--shadow-lg)}.btn-menu button:active{transform:translateY(0) scale(.98)}pre{background:var(--brand-black);color:var(--brand-cream);padding:1.5rem;border-radius:var(--radius);font-family:var(--font-mono);font-size:.875rem;line-height:1.7;overflow-x:auto;margin:1rem 0;border-left:4px solid var(--brand-orange)}.code-view{background:var(--brand-black);color:var(--brand-cream);padding:1.5rem;border-radius:var(--radius);font-family:var(--font-mono);font-size:.875rem;overflow-x:auto;margin:1rem 0;white-space:pre-wrap;border-left:4px solid var(--brand-orange)}h1{display:flex;align-items:center;gap:1rem}h1+a{display:inline-flex;align-items:center;padding:.625rem 1.25rem;font-size:.875rem;font-weight:500;background:var(--brand-orange);color:var(--brand-cream);border-radius:var(--radius-sm);transition:all var(--transition);margin-bottom:1rem}h1+a:hover{background:var(--accent-hover)}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center;padding:2rem}.error-container h1{font-size:4rem;margin-bottom:1rem;color:var(--gray-300)}.error-container p{margin-bottom:.5rem}.error-container i{color:var(--gray-400);font-style:normal}.error-container button{margin-top:2rem}div:only-child:contains("Loading"),div:only-child:contains("LOADING"){display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--gray-500)}.text-center{text-align:center}.text-muted{color:var(--gray-500);font-size:.875rem}.mt-4{margin-top:1.5rem}.meta{font-size:.75rem;color:var(--gray-400);margin:.25rem 0}.copied-badge{color:var(--brand-orange);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.025em}.container>div:first-of-type:not(.btn-menu){font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-500);margin-top:1rem}.no-results-panel,.retro-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;background:var(--brand-cream);border-radius:var(--radius-lg);border:2px dashed var(--gray-300);text-align:center;color:var(--gray-500)}.no-results-panel .icon-wrapper{color:var(--brand-orange);margin-bottom:1rem}.no-results-panel h2,.glitch-error{font-size:1.25rem;color:var(--brand-black);margin-bottom:1rem;font-weight:600}.error-details,.error-content{font-family:var(--font-mono);font-size:.8125rem;color:var(--gray-400)}.error-details p{margin:.25rem 0;color:var(--gray-400)}.scanline-error,.blink-warning{animation:none}@media(max-width:768px){.container{padding:1.5rem 1rem}.navbar{padding:1rem}.auth-box{margin:2rem 1rem;padding:1.5rem}table{display:block;overflow-x:auto}.btn-menu{gap:.5rem}.btn-menu button{padding:.625rem 1rem;font-size:.8125rem}.item-btn-menu{flex-wrap:wrap}}*{transition-property:background-color,border-color,color,box-shadow;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}pre,code,textarea,.code-view{transition:none}