@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=JetBrains+Mono:wght@300;400&display=swap";:root{--bg-deep: #050505;--bg-surface: #0a0a0a;--bg-glass: rgba(15, 15, 15, .7);--accent-violet: #5B2EFF;--accent-violet-glow: rgba(91, 46, 255, .4);--accent-alert: #D32F2F;--accent-success: #2E7D32;--text-primary: #EDEDED;--text-secondary: #B0B0B0;--border-dim: rgba(255, 255, 255, .08);--border-accent: rgba(91, 46, 255, .3);--sidebar-width: 260px;--header-height: 70px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1)}.ropex-technical{font-family:JetBrains Mono,monospace;text-transform:uppercase;letter-spacing:.1em}.ropex-card{background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-dim);border-radius:var(--radius-md);padding:24px;position:relative;overflow:hidden;transition:var(--transition-smooth)}.ropex-card:hover{border-color:var(--border-accent)}.ropex-btn-primary{background:var(--accent-violet);color:#fff;border:none;padding:10px 20px;border-radius:var(--radius-sm);font-family:JetBrains Mono,monospace;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition-smooth);box-shadow:0 4px 15px #5b2eff33}:root{--bg-deep: #050505;--bg-surface: #0a0a0a;--bg-glass: rgba(15, 15, 15, .7);--accent-violet: #5B2EFF;--accent-violet-glow: rgba(91, 46, 255, .4);--text-primary: #EDEDED;--text-secondary: #B0B0B0;--border-dim: rgba(255, 255, 255, .08);--border-accent: rgba(91, 46, 255, .3);--sidebar-width: 260px;--header-height: 70px;--radius-sm: 4px;--radius-md: 8px;--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--bg-deep);color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.app-container{display:flex;height:100vh;width:100vw}.sidebar{width:var(--sidebar-width);background-color:var(--bg-surface);border-right:1px solid var(--border-dim);display:flex;flex-direction:column;padding:24px 16px;z-index:100}.logo-section{padding:0 8px 32px}.logo{font-family:JetBrains Mono,monospace;font-weight:700;font-size:20px;display:flex;align-items:center;gap:12px}.logo-accent{background:var(--accent-violet);width:12px;height:12px;border-radius:2px;box-shadow:0 0 10px var(--accent-violet-glow)}nav{flex:1}.nav-group{margin-bottom:24px}.nav-label{font-size:10px;color:var(--text-secondary);letter-spacing:.12em;margin-bottom:12px;padding-left:12px;text-transform:uppercase}.nav-item{display:flex;align-items:center;gap:12px;padding:12px;color:var(--text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:var(--transition-smooth);margin-bottom:4px;cursor:pointer;border:1px solid transparent;font-size:14px}.nav-item:hover{background:#ffffff08;color:var(--text-primary)}.nav-item.active{background:#5b2eff1a;color:var(--accent-violet);border:1px solid var(--border-accent)}.main-stage{flex:1;display:flex;flex-direction:column;background-image:radial-gradient(circle at 50% 50%,rgba(91,46,255,.04) 0%,transparent 80%),linear-gradient(rgba(255,255,255,.01) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.01) 1px,transparent 1px);background-size:100% 100%,40px 40px,40px 40px;position:relative}header{height:var(--header-height);border-bottom:1px solid var(--border-dim);display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.content-viewport{flex:1;padding:32px;overflow-y:auto}.card{background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-dim);border-radius:var(--radius-md);padding:24px;position:relative;overflow:hidden;transition:var(--transition-smooth)}.card:hover{border-color:var(--border-accent)}.technical{font-family:JetBrains Mono,monospace;text-transform:uppercase;letter-spacing:.1em}.btn-primary{background:var(--accent-violet);color:#fff;border:none;padding:10px 20px;border-radius:var(--radius-sm);font-family:JetBrains Mono,monospace;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition-smooth);box-shadow:0 4px 15px #5b2eff33}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px)}.filter-input{background:#ffffff0a;border:1px solid var(--border-dim);border-radius:var(--radius-sm);color:var(--text-primary);font-size:12px;padding:8px 12px;outline:none;transition:var(--transition-smooth);font-family:inherit}.filter-input:focus{border-color:var(--border-accent)}.filter-input::placeholder{color:var(--text-secondary);opacity:.7}:root{--color-black: #0a0a0f;--violet-primary: #4c1d95;--violet-hover: #6d28d9;--gray-dark: #2d2d44;--gray-light: #d9dce8;--transition-base: .12s ease-in-out;--glass-blur: 12px;--scroll-y: 0;--bg-color: var(--color-black);--text-main: var(--gray-light);--glass-bg: rgba(45, 45, 68, .4)}[data-theme=light]{--bg-color: #f8fafc;--text-main: var(--color-black);--glass-bg: rgba(255, 255, 255, .8)}body{margin:0;background-color:var(--bg-color);color:var(--text-main);transition:background-color .3s ease,color .3s ease;min-height:100vh;position:relative}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 50% 0%,var(--violet-primary) 0%,transparent 60%);opacity:calc(.15 + (var(--scroll-y) * .0005));z-index:-1;pointer-events:none}.glass-card{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:2rem;border:1px solid var(--violet-primary);padding:1.5rem;box-shadow:0 4px 30px #0000001a}.btn{transition:all var(--transition-base);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:8px;padding:.5rem 1rem;font-weight:500;border:none;background:var(--violet-primary);color:#fff}.btn:hover{background:var(--violet-hover);transform:scale(1.02)}.btn:active{transform:scale(.96)}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-up{opacity:0}.fade-up.is-visible{animation:fade-up .6s ease-out forwards}