:root{--bg-dark: #0a0e0a;--bg-panel: #141c14;--bg-card: #1e291e;--primary: #8a9a5b;--primary-glow: rgba(138, 154, 91, .4);--accent: #00ff41;--text-main: #e0e6ed;--text-muted: #8b9d8b;--border: #2c3e2c;--danger: #ff4444;--warning: #ffbb33}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--bg-dark);background-image:radial-gradient(circle at 15% 50%,rgba(138,154,91,.05),transparent 25%),radial-gradient(circle at 85% 30%,rgba(0,255,65,.03),transparent 25%);color:var(--text-main);min-height:100vh;overflow-x:hidden}.app-container{max-width:1200px;margin:0 auto;padding:20px;display:flex;flex-direction:column;gap:24px}.header{background:#141c14cc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:16px;padding:20px;position:sticky;top:20px;z-index:100;box-shadow:0 8px 32px #0000004d}.header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.logo-area{display:flex;align-items:center;gap:16px;cursor:pointer}.brand h1{font-size:24px;color:var(--text-main);letter-spacing:1px;margin-bottom:4px}.brand .subtitle{font-size:12px;color:var(--primary);letter-spacing:3px;font-weight:700}.cloud-indicator{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted);background:#0000004d;padding:6px 12px;border-radius:20px;border:1px solid var(--border)}.spin{animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.nav-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}.nav-links{display:flex;gap:8px}.nav-links button{background:transparent;border:none;color:var(--text-muted);padding:10px 16px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:600;transition:all .2s}.nav-links button:hover{color:var(--text-main);background:#ffffff0d}.nav-links button.active{background:var(--primary);color:#000;box-shadow:0 0 15px var(--primary-glow)}.search-box{position:relative;width:250px}.search-box input{width:100%;background:var(--bg-dark);border:1px solid var(--border);color:var(--text-main);padding:10px 16px 10px 40px;border-radius:8px;outline:none;transition:border-color .2s}.search-box input:focus{border-color:var(--primary)}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted)}.main-content{min-height:60vh}.page-header{display:flex;align-items:center;gap:20px;margin-bottom:30px;border-bottom:1px solid var(--border);padding-bottom:20px}.header-img{width:80px;height:80px;border-radius:12px;object-fit:cover;border:2px solid var(--primary)}.fallback-icon{font-size:48px}.page-header h2{font-size:32px;color:var(--text-main)}.hero-banner{position:relative;height:400px;border-radius:20px;overflow:hidden;margin-bottom:40px;border:1px solid var(--border)}.hero-bg{width:100%;height:100%;object-fit:cover}.hero-bg-fallback{width:100%;height:100%;background:#1a2419;display:flex;align-items:center;justify-content:center;font-size:64px}.hero-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to right,#0a0e0ae6,#0a0e0a66);display:flex;flex-direction:column;justify-content:center;padding:60px}.hero-overlay h2{font-size:48px;margin-bottom:16px;color:var(--text-main);text-shadow:0 2px 10px rgba(0,0,0,.5)}.hero-overlay p{font-size:18px;color:var(--text-muted);max-width:500px;margin-bottom:32px;line-height:1.6}.cta-btn{background:var(--accent);color:#000;border:none;padding:16px 32px;font-size:18px;font-weight:700;border-radius:8px;cursor:pointer;width:fit-content;box-shadow:0 0 20px #00ff4166;transition:transform .2s}.cta-btn:hover{transform:translateY(-2px)}.quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.stat-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:16px;padding:30px;text-align:center;cursor:pointer;transition:all .3s}.stat-card:hover{transform:translateY(-5px);border-color:var(--primary);background:var(--bg-card)}.stat-card svg{color:var(--primary);margin-bottom:16px}.stat-card h3{font-size:36px;margin-bottom:8px}.stat-card p{color:var(--text-muted)}.grid-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px}.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:16px;padding:24px;transition:all .3s;position:relative;overflow:hidden}.tactic-card{cursor:pointer}.tactic-card:hover{border-color:var(--primary)}.tactic-card.expanded{background:var(--bg-card);border-color:var(--accent)}.card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.card-header h3{font-size:20px;padding-right:40px}.fav-btn{background:#0000004d;border:1px solid var(--border);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:all .2s}.fav-btn:hover{background:#ff44441a;color:var(--danger)}.fav-btn.active{color:var(--danger);border-color:#ff44444d}.tags{display:flex;gap:8px;margin-bottom:16px}.tag{padding:4px 10px;border-radius:4px;font-size:12px;font-weight:700}.diff-easy{background:#00ff411a;color:var(--accent)}.diff-medium{background:#ffbb331a;color:var(--warning)}.diff-hard{background:#ff44441a;color:var(--danger)}.likes{background:#ffffff0d;color:var(--text-muted)}.summary{color:var(--text-muted);line-height:1.5;font-size:14px}.card-details{overflow:hidden}.divider{height:1px;background:var(--border);margin:16px 0}.card-details p{color:var(--text-main);line-height:1.6;font-size:15px}.map-list{display:flex;flex-direction:column;gap:20px}.map-row{background:var(--bg-panel);border:1px solid var(--border);border-radius:16px;padding:24px;display:flex;justify-content:space-between;align-items:center;gap:24px}.map-info h3{font-size:24px;margin-bottom:8px;display:flex;align-items:center;gap:12px}.map-type{font-size:12px;padding:4px 8px;background:var(--primary);color:#000;border-radius:4px}.map-info p{color:var(--text-muted);margin-bottom:16px}.hotspots{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.hotspot-tag{background:#ff44441a;color:#f88;padding:4px 12px;border-radius:20px;font-size:13px;border:1px solid rgba(255,68,68,.2)}.danger-meter{text-align:right;min-width:120px}.danger-meter span{display:block;font-size:12px;color:var(--text-muted);margin-bottom:8px}.meter-bar{height:6px;background:var(--border);border-radius:3px;margin-bottom:8px;position:relative;overflow:hidden}.meter-bar:after{content:"";position:absolute;left:0;top:0;height:100%;border-radius:3px}.level-1:after{width:33%;background:var(--accent)}.level-2:after{width:66%;background:var(--warning)}.level-3:after{width:100%;background:var(--danger)}.gear-card{display:flex;flex-direction:column}.gear-type-icon{width:48px;height:48px;background:#8a9a5b1a;border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--primary);margin-bottom:16px}.gear-card h3{font-size:20px;margin-bottom:8px}.rating{display:flex;gap:4px;margin-bottom:16px;color:var(--border)}.star{width:16px;height:16px}.star.filled{color:var(--warning);fill:var(--warning)}.gear-desc{color:var(--text-muted);font-size:14px;margin-bottom:20px;flex-grow:1}.gear-meta{background:#0003;padding:12px;border-radius:8px;font-size:13px;display:flex;flex-direction:column;gap:8px}.gear-meta strong{color:var(--primary)}.tips-list{display:flex;flex-direction:column;gap:16px}.tip-item{display:flex;background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;overflow:hidden}.tip-cat{background:var(--primary);color:#000;font-weight:700;padding:20px;writing-mode:vertical-rl;text-orientation:mixed;display:flex;align-items:center;justify-content:center;letter-spacing:2px}.tip-content{padding:24px;flex-grow:1}.tip-content h4{font-size:18px;margin-bottom:8px;color:var(--text-main)}.tip-content p{color:var(--text-muted);line-height:1.6}.toast{position:fixed;bottom:40px;left:50%;transform:translate(-50%);background:var(--primary);color:#000;padding:12px 24px;border-radius:30px;font-weight:700;box-shadow:0 10px 30px #8a9a5b66;z-index:1000}.back-to-top{position:fixed;bottom:40px;right:40px;width:50px;height:50px;border-radius:25px;background:var(--bg-panel);border:2px solid var(--primary);color:var(--primary);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #00000080;z-index:90;transition:all .2s}.back-to-top:hover{background:var(--primary);color:#000}.empty-state{grid-column:1 / -1;text-align:center;padding:60px;color:var(--text-muted);font-size:18px}@media (max-width: 768px){.nav-bar{flex-direction:column;align-items:stretch}.search-box{width:100%}.hero-overlay{padding:30px}.hero-overlay h2{font-size:32px}.quick-stats{grid-template-columns:1fr}.map-row{flex-direction:column;align-items:flex-start}.danger-meter{text-align:left;width:100%}}