:root{--bg-color: #f1f5f9;--card-bg: #ffffff;--sidebar-bg: #ffffff;--accent-color: #6366f1;--text-primary: #1e293b;--text-secondary: #64748b;--border-color: #e2e8f0;--danger: #ef4444;--success: #22c55e;--panel-shadow: 0 10px 25px -5px rgba(0, 0, 0, .05), 0 8px 10px -6px rgba(0, 0, 0, .05)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Outfit,Inter,sans-serif;background-color:var(--bg-color);color:var(--text-primary);overflow:hidden;-webkit-font-smoothing:antialiased}.app-container{display:flex;width:100vw;height:100vh}.app-body{display:flex;flex:1;width:100%;height:100vh}.floating-nav{position:fixed;left:1.5rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:1rem;background:var(--sidebar-bg);padding:1rem;border-radius:2rem;box-shadow:var(--panel-shadow);border:1px solid var(--border-color);z-index:100}.nav-bubble{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:1.5rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;color:var(--text-secondary)}.nav-bubble:hover{background:var(--bg-color);color:var(--accent-color)}.nav-bubble.active{background:var(--accent-color);color:#fff;box-shadow:0 4px 12px #6366f14d}.nav-bubble span{position:absolute;left:100%;margin-left:1rem;background:var(--text-primary);color:#fff;padding:.5rem 1rem;border-radius:.5rem;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s}.nav-bubble:hover span{opacity:1;transform:translate(5px)}main{flex:1;display:flex;align-items:center;justify-content:center;position:relative}.scene{perspective:1500px;display:flex;align-items:center;justify-content:center}.card{width:100%;height:100%;position:relative;transition:transform .8s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d}.card.is-flipped{transform:rotateY(180deg)}.card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:1.5rem;overflow:hidden;box-shadow:0 30px 60px -12px #0000001a,0 18px 36px -18px #0000001a;background:#fff}.card-face-back{transform:rotateY(180deg)}.badge-frame{background-color:#fff;position:relative}.glass{background:#ffffffb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:.75rem;font-weight:600;cursor:pointer;transition:all .2s;border:none;font-size:.875rem}.btn-primary{background:var(--accent-color);color:#fff}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-ghost{background:#f1f5f9;color:var(--text-primary)}.btn-ghost:hover{background:#e2e8f0}@keyframes fadeIn{0%{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}input,select{width:100%;padding:.6rem;background:#fff;border:1px solid var(--border-color);border-radius:10px;color:var(--text-primary);margin-top:.25rem}label{font-size:.75rem;font-weight:700;color:var(--text-secondary);margin-top:.6rem;display:block;text-transform:uppercase;letter-spacing:.025em}[data-tooltip]{position:relative}[data-tooltip]:before{content:attr(data-tooltip);position:absolute;bottom:50%;right:calc(100% + 10px);transform:translateY(50%);background:var(--text-primary);color:#fff;padding:.4rem .8rem;border-radius:.5rem;font-size:.75rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s;pointer-events:none;z-index:1000;box-shadow:0 4px 6px -1px #0000001a}[data-tooltip]:hover:before{opacity:1;visibility:visible;right:calc(100% + 15px)}.floating-nav [data-tooltip]:before{right:auto;left:calc(100% + 10px)}.floating-nav [data-tooltip]:hover:before{left:calc(100% + 15px)}.zoom-controls{position:fixed;bottom:.5rem;left:55%;transform:translate(-50%);display:flex;align-items:center;gap:1.5rem;background:#fff;padding:.5rem 1.5rem;border-radius:2.5rem;border:1px solid var(--border-color);box-shadow:var(--panel-shadow);z-index:1000}.side-label{color:var(--accent-color);font-size:.875rem;font-weight:800;letter-spacing:.2rem;padding:0 1rem;border-right:1px solid var(--border-color);margin-right:.5rem;height:24px;display:flex;align-items:center}.zoom-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--border-color);background:#fff;color:var(--text-secondary);cursor:pointer;transition:all .2s;position:relative;z-index:1}.zoom-btn:hover{border-color:var(--accent-color);color:var(--accent-color);transform:scale(1.1)}.zoom-val{font-size:.9rem;font-weight:800;color:var(--text-primary);min-width:60px;text-align:center}.hover-bg:hover{background:#f1f5f9;color:var(--accent-color)!important}