.toast-container{z-index:9999;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:16px;right:16px}.toast{background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;pointer-events:auto;border-radius:10px;align-items:center;gap:10px;max-width:380px;padding:12px 18px;animation:.25s toastIn;display:flex;box-shadow:0 4px 16px #0000004d}.toast--error{background:#2d1515;border-color:#e53935}.toast--success{background:#152d15;border-color:#43a047}.toast--warning{background:#2d2015;border-color:#fb8c00}.toast--info{background:#15202d;border-color:#1e88e5}.toast-icon{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-size:.75rem;font-weight:700;display:flex}.toast--error .toast-icon{color:#fff;background:#e53935}.toast--success .toast-icon{color:#fff;background:#43a047}.toast--warning .toast-icon{color:#fff;background:#fb8c00}.toast--info .toast-icon{color:#fff;background:#1e88e5}.toast-msg{color:var(--text);font-size:.9rem;line-height:1.4}@keyframes toastIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@media (width<=768px){.toast-container{top:12px;left:12px;right:12px}.toast{max-width:100%}}*{box-sizing:border-box}:root{--bg-primary:#000;--bg-secondary:#111;--bg-card:#1a1a1a;--bg-hover:#222;--text-primary:#fff;--text-secondary:#ccc;--text-muted:#888;--accent:#d32f2f;--accent-hover:#b71c1c;--danger:#c0392b;--danger-hover:#e74c3c;--success:#27ae60;--border:#333;--shadow:0 4px 12px #0009;--radius:8px;--font-heading:"Georgia", "Times New Roman", serif;--font-body:"Segoe UI", system-ui, sans-serif;--hamburger-gap:5px;--hamburger-line-height:2px}body{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;padding:0}.layout{flex-direction:column;min-height:100vh;display:flex;overflow-x:hidden}.navbar{background:var(--bg-secondary);border-bottom:2px solid var(--accent);z-index:100;position:sticky;top:0}.navbar-inner{justify-content:space-between;align-items:center;max-width:1200px;height:60px;margin:0 auto;padding:0 24px;display:flex}.navbar-brand{font-family:var(--font-heading);color:var(--accent);flex-shrink:0;align-items:center;gap:8px;font-size:1.4rem;font-weight:700;text-decoration:none;display:flex}.brand-icon{font-size:1.6rem}.hamburger{gap:var(--hamburger-gap);cursor:pointer;z-index:110;background:0 0;border:none;flex-direction:column;padding:6px;display:none}.hamburger-line{width:24px;height:var(--hamburger-line-height);background:var(--accent);border-radius:2px;transition:all .3s;display:block}.hamburger-line.open:first-child{transform:translateY(calc(var(--hamburger-gap) + var(--hamburger-line-height))) rotate(45deg)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:translateY(calc(-1 * (var(--hamburger-gap) + var(--hamburger-line-height)))) rotate(-45deg)}.navbar-links{align-items:center;gap:4px;display:flex}.nav-link{color:var(--text-secondary);border-radius:var(--radius);white-space:nowrap;padding:8px 12px;font-size:.95rem;text-decoration:none;transition:all .2s}.nav-link:hover{color:var(--accent);background:#b222221a}.nav-link.active{color:var(--accent);background:#b2222226;font-weight:600}.nav-link-create{background:var(--accent);color:#fff;font-weight:700}.nav-link-create:hover{background:var(--accent-hover);color:#fff}.nav-user{color:var(--accent);padding:0 8px;font-size:.9rem;font-weight:600}.nav-link-logout{color:var(--text-muted);cursor:pointer;border:1px solid var(--border);border-radius:var(--radius);font-size:.85rem;font-family:var(--font-body);background:0 0;padding:4px 12px;transition:all .2s}.nav-link-logout:hover{color:var(--danger);border-color:var(--danger)}.nav-dropdown{position:relative}.nav-dropdown-trigger{border-radius:var(--radius);color:var(--text-secondary);font-size:.95rem;font-family:var(--font-body);cursor:pointer;white-space:nowrap;background:0 0;border:none;align-items:center;gap:4px;padding:8px 14px;transition:all .2s;display:inline-flex}.nav-dropdown-trigger:hover,.nav-dropdown.open .nav-dropdown-trigger{color:var(--accent);background:#b222221a}.nav-dropdown-arrow{font-size:.7rem;transition:transform .2s}.nav-dropdown.open .nav-dropdown-arrow{transform:rotate(180deg)}.nav-dropdown-menu{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);z-index:200;flex-direction:column;min-width:200px;margin-top:4px;padding:6px;display:none;position:absolute;top:100%;left:0;box-shadow:0 8px 24px #000000b3}.nav-dropdown.open .nav-dropdown-menu{display:flex}.nav-dropdown-link{color:var(--text-secondary);white-space:nowrap;border-radius:4px;padding:8px 14px;font-size:.9rem;text-decoration:none;transition:all .15s;display:block}.nav-dropdown-link:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-dropdown-divider{color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;border-top:1px solid var(--border);margin-top:4px;padding:8px 14px 4px;font-size:.72rem}.nav-dropdown-divider:first-child{border-top:none;margin-top:0}.main-content{flex:1;width:100%;min-width:0;max-width:1200px;margin:0 auto;padding:32px 24px;overflow-x:hidden}.footer{background:var(--bg-secondary);border-top:1px solid var(--border);text-align:center;padding:20px}.footer p{color:var(--text-muted);margin:0;font-size:.85rem}.btn{border-radius:var(--radius);cursor:pointer;font-size:.95rem;font-family:var(--font-body);border:none;align-items:center;gap:6px;padding:10px 20px;text-decoration:none;transition:all .2s;display:inline-flex}.btn-primary{background:var(--accent);color:var(--bg-primary);font-weight:700}.btn-primary:hover{background:var(--accent-hover)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:var(--danger-hover)}.btn-secondary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.btn-sm{padding:6px 12px;font-size:.85rem}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.section-title{font-family:var(--font-heading);color:var(--accent);border-bottom:2px solid var(--accent);margin:0 0 24px;padding-bottom:12px;font-size:1.8rem}.form-group{margin-bottom:16px}.form-label{color:var(--text-secondary);margin-bottom:6px;font-size:.9rem;font-weight:600;display:block}.form-input,.form-select{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-primary);font-size:1rem;font-family:var(--font-body);padding:10px 14px;transition:border-color .2s}.form-input:focus,.form-select:focus{border-color:var(--accent);outline:none}.form-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23b22222' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:36px}@media (width<=1024px){.navbar-inner{padding:0 16px}.nav-link{padding:6px 10px;font-size:.9rem}.main-content{padding:24px 16px}.section-title{font-size:1.5rem}.card{padding:20px}}@media (width<=768px){.hamburger{display:flex}.navbar-links{background:var(--bg-secondary);border-left:2px solid var(--accent);z-index:105;flex-direction:column;gap:4px;width:260px;max-width:85vw;height:100vh;padding:80px 24px 24px;transition:right .3s;position:fixed;top:0;right:-100%;box-shadow:-8px 0 24px #00000080}.navbar-links.open{right:0}.navbar-links .nav-link{justify-content:flex-start;width:100%;padding:12px 16px;font-size:1rem}.navbar-links .nav-link-create{text-align:center;justify-content:center;margin-top:8px}.navbar-links .nav-dropdown{width:100%}.navbar-links .nav-dropdown-trigger{justify-content:space-between;width:100%;padding:12px 16px;font-size:1rem}.navbar-links .nav-dropdown-menu{box-shadow:none;min-width:unset;background:0 0;border:none;margin-top:0;padding-left:16px;position:static}.navbar-links .nav-dropdown-link{padding:10px 16px;font-size:.95rem}.navbar-links .nav-dropdown-divider{padding:8px 16px 4px}.navbar-links.open:before{content:"";z-index:-1;background:#00000080;height:100%;position:fixed;top:0;left:0;right:260px}.navbar-inner{height:48px;padding:0 10px}.navbar-brand{font-size:1rem}.brand-icon{font-size:1.2rem}.main-content{max-width:100%;padding:10px 8px}.section-title{margin-bottom:12px;padding-bottom:6px;font-size:1.2rem}.card{padding:12px}.btn{padding:7px 12px;font-size:.85rem}.footer{padding:10px 8px}.footer p{font-size:.7rem}}@media (width<=400px){.navbar-inner{height:44px;padding:0 6px}.navbar-brand{gap:4px;font-size:.95rem}.brand-icon{font-size:1rem}.main-content{max-width:100%;padding:8px 4px}.section-title{font-size:1.1rem}.card{padding:10px}.btn{padding:6px 10px;font-size:.82rem}.form-input,.form-select{padding:7px 10px;font-size:.85rem}}.loading-container{flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:48px 24px;display:flex}.loading-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-message{color:var(--text-secondary);margin:0;font-size:.95rem}.character-tabs{background:var(--bg-secondary);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:24px;padding:20px 24px 0}.character-tabs-header{margin-bottom:16px}.character-tabs-name{font-family:var(--font-heading);color:var(--accent);margin:0 0 4px;font-size:1.5rem}.character-tabs-meta{color:var(--text-secondary);font-size:.9rem}.character-tabs-nav{-webkit-overflow-scrolling:touch;gap:4px;display:flex;overflow-x:auto}.character-tab{border-radius:var(--radius) var(--radius) 0 0;color:var(--text-secondary);white-space:nowrap;border-bottom:2px solid #0000;align-items:center;gap:6px;padding:10px 20px;font-size:.9rem;text-decoration:none;transition:all .2s;display:flex}.character-tab:hover{color:var(--text-primary);background:var(--bg-hover)}.character-tab--active{color:var(--accent);border-bottom-color:var(--accent);background:var(--bg-primary)}.character-tab-icon{font-size:1.1rem}.character-tab-label{font-weight:500}.error-state{flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:48px 24px;display:flex}.error-icon{font-size:2rem}.error-message{color:var(--danger);text-align:center;margin:0;font-size:.95rem}