@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes grainShift{0%,to{transform:translate(0)}10%{transform:translate(-2%,-3%)}30%{transform:translate(3%,2%)}50%{transform:translate(-1%,4%)}70%{transform:translate(2%,-2%)}90%{transform:translate(-3%,1%)}}:root{--bg: #12100E;--bg-elevated: #1C1915;--surface: #231F1A;--surface-hover: #2C2620;--border: #3A322A;--border-light: #4A4038;--text: #F0E6D8;--text-secondary: #9C8E7C;--text-muted: #6B5F52;--amber: #E8943A;--amber-glow: #E8943A40;--amber-hover: #F0A54E;--amber-deep: #C47A2A;--green: #7B9E6B;--green-muted: #5C7A4E;--barrel: #B8965A;--danger: #D4553A;--success: #7B9E6B}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Onest,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden}.grain{position:fixed;top:-50%;right:-50%;bottom:-50%;left:-50%;width:200%;height:200%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:9999;animation:grainShift 8s steps(10) infinite}.app{min-height:100vh;display:flex;flex-direction:column;position:relative}.navbar{display:flex;align-items:center;justify-content:space-between;padding:.8rem 2rem;background:var(--bg-elevated);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:100;animation:fadeIn .4s ease-out}.nav-brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--amber);font-family:Unbounded,sans-serif;font-weight:600;font-size:1rem;transition:opacity .2s}.nav-brand:hover{opacity:.85}.nav-logo{width:36px;height:36px;object-fit:contain}.nav-links{display:flex;gap:.3rem;align-items:center}.nav-links a{color:var(--text-secondary);text-decoration:none;padding:.4rem .7rem;border-radius:6px;font-size:.85rem;font-weight:500;transition:all .2s}.nav-links a:hover{color:var(--text);background:var(--surface)}.nav-links a.router-link-active{color:var(--amber);background:var(--amber-glow)}.nav-logout{background:none;border:1px solid var(--border);color:var(--text-muted);padding:.35rem .7rem;border-radius:6px;cursor:pointer;font-size:.8rem;font-family:Onest,sans-serif;transition:all .2s;margin-left:.3rem}.nav-logout:hover{border-color:var(--danger);color:var(--danger)}.container{max-width:640px;margin:0 auto;padding:2.5rem 1.2rem;flex:1;width:100%;animation:fadeIn .5s ease-out .1s both}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1.4rem;margin-bottom:.8rem;transition:border-color .2s}.card:hover{border-color:var(--border-light)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.65rem 1.4rem;border:none;border-radius:10px;font-size:.9rem;font-weight:600;font-family:Onest,sans-serif;cursor:pointer;transition:all .25s;color:var(--bg);text-align:center}.btn-primary{background:linear-gradient(135deg,var(--amber),var(--amber-deep));box-shadow:0 2px 16px var(--amber-glow)}.btn-primary:hover{background:linear-gradient(135deg,var(--amber-hover),var(--amber));box-shadow:0 4px 24px var(--amber-glow);transform:translateY(-1px)}.btn-success{background:var(--green)}.btn-success:hover{background:var(--green-muted);transform:translateY(-1px)}.btn-danger{background:var(--danger)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}input,select{width:100%;padding:.7rem 1rem;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text);font-size:.9rem;font-family:Onest,sans-serif;margin-bottom:.6rem;transition:border-color .2s,box-shadow .2s;outline:none}input:focus{border-color:var(--amber);box-shadow:0 0 0 3px var(--amber-glow)}h1{font-family:Unbounded,sans-serif;font-weight:800;font-size:1.6rem;margin-bottom:1.2rem;color:var(--text);letter-spacing:-.02em}h2{font-family:Unbounded,sans-serif;font-weight:600;font-size:1.15rem;margin-bottom:.8rem;color:var(--text)}h3{font-family:Onest,sans-serif;font-weight:700;font-size:1rem}.error{color:var(--danger);font-size:.82rem;margin-bottom:.5rem}.footer{padding:1.2rem;border-top:1px solid var(--border);background:var(--bg-elevated);animation:fadeIn .5s ease-out .3s both}.footer-links{display:flex;justify-content:center;align-items:center;gap:1rem}.footer-links a{color:var(--text-muted);text-decoration:none;font-size:.8rem;transition:color .2s}.footer-links a:hover{color:var(--amber)}.footer-dot{width:3px;height:3px;border-radius:50%;background:var(--border)}@media(max-width:640px){.navbar{padding:.7rem 1rem;flex-wrap:wrap;gap:.5rem}.nav-brand{font-size:.9rem}.nav-links{gap:.1rem}.nav-links a{padding:.3rem .5rem;font-size:.8rem}.container{padding:1.5rem 1rem}h1{font-size:1.3rem}}