:root{--primary: #00f2ff;--danger: #ff4757;--safe: #2ed573;--bg-dark: #0a0f1d;--panel-bg: rgba(16, 24, 48, .9);--border: rgba(0, 242, 255, .2);--text: #e2e8f0}.app-container{height:100vh;background:var(--bg-dark);background-image:radial-gradient(circle at 50% 50%,#1a2a4a,#0a0f1d);color:var(--text);display:flex;flex-direction:column;overflow:hidden;font-family:Segoe UI,Roboto,sans-serif}.top-nav{padding:15px 30px;background:#0006;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logo{display:flex;align-items:center;gap:12px}.logo h1{font-size:1.2rem;margin:0;letter-spacing:2px;font-weight:300}.logo span{color:var(--primary);font-weight:800}.neon-icon{color:var(--primary);filter:drop-shadow(0 0 5px var(--primary))}.cloud-status{font-size:.75rem;color:var(--primary);background:#00f2ff1a;padding:4px 12px;border-radius:20px;display:flex;align-items:center;gap:6px}.main-layout{flex:1;display:flex;overflow:hidden}.sidebar{width:300px;border-right:1px solid var(--border);background:#0003;padding:20px;overflow-y:auto}.sidebar-label{font-size:.7rem;color:#64748b;text-transform:uppercase;letter-spacing:2px;margin-bottom:20px}.ship-item{display:flex;align-items:center;gap:15px;padding:12px;border-radius:12px;cursor:pointer;margin-bottom:10px;border:1px solid transparent;transition:all .3s}.ship-item:hover{background:#ffffff0d}.ship-item.active{background:#00f2ff1a;border-color:var(--primary);box-shadow:inset 0 0 15px #00f2ff1a}.ship-thumb{width:50px;height:50px;background:#000;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid var(--border)}.ship-thumb img{width:100%;height:100%;object-fit:cover}.ship-meta{display:flex;flex-direction:column}.ship-meta .name{font-weight:600;font-size:.95rem}.ship-meta .tier{font-size:.75rem;color:#94a3b8}.content{flex:1;overflow-y:auto;padding:40px}.detail-view{max-width:900px;margin:0 auto}.hero-section{display:grid;grid-template-columns:1.5fr 1fr;gap:30px;margin-bottom:40px}.hero-image{height:300px;background:#000;border-radius:20px;overflow:hidden;position:relative;border:1px solid var(--border)}.hero-image img{width:100%;height:100%;object-fit:cover}.image-loading{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:#64748b}.scan-line{position:absolute;top:0;left:0;right:0;height:2px;background:var(--primary);opacity:.3;box-shadow:0 0 10px var(--primary);animation:scan 4s linear infinite}@keyframes scan{0%{top:0}to{top:100%}}.hero-info .badge{background:var(--primary);color:#000;font-weight:800;font-size:.7rem;padding:4px 12px;border-radius:4px;display:inline-block;margin-bottom:15px}.hero-info h2{font-size:2.5rem;margin:0 0 15px}.hero-info p{color:#94a3b8;line-height:1.6}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:40px}.stat-card{background:var(--panel-bg);padding:20px;border-radius:16px;border:1px solid var(--border)}.stat-label{font-size:.8rem;color:#94a3b8;display:flex;align-items:center;gap:8px;margin-bottom:10px}.stat-value{font-size:1.8rem;font-weight:700;margin-bottom:10px}.stat-bar{height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden}.fill{height:100%;background:var(--primary);box-shadow:0 0 10px var(--primary)}.fill.red{background:var(--danger);box-shadow:0 0 10px var(--danger)}.fill.blue{background:#3b82f6;box-shadow:0 0 10px #3b82f6}.weapon-section h3{margin-bottom:20px;display:flex;align-items:center;gap:10px}.weapon-tags{display:flex;flex-wrap:wrap;gap:10px}.weapon-tag{background:#ffffff0d;border:1px solid var(--border);padding:8px 16px;border-radius:8px;font-size:.9rem;display:flex;align-items:center;gap:8px}.tactics-card{margin-top:40px;background:linear-gradient(135deg,#00f2ff1a,#0000);border:1px solid var(--border);border-radius:16px;padding:25px}.tactics-header{display:flex;align-items:center;gap:10px;font-weight:700;margin-bottom:15px;color:var(--primary)}.tactics-content{font-size:1rem;line-height:1.7;color:#cbd5e1}.spin{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}