/* Cyberpunk Globe Button Styles Dock stack: uses --ainna-dock-* from ainna-design-tokens.css (same center/bottom as cookie card + footer cutout) */ #cyber-network-container, html body #cyber-network-container{ position:fixed !important; bottom:var(--ainna-dock-bottom, 20px) !important; left:var(--ainna-dock-x, 50%) !important; top:auto !important; right:auto !important; transform:translateX(-50%) !important; -webkit-transform:translateX(-50%) !important; z-index:2147483647 !important; pointer-events:auto !important; } .cyber-globe-btn{pointer-events:auto!important} #cyber-network-root{pointer-events:none;z-index:2147483647} #cyber-network-root #cyber-network-container, #cyber-network-root .cyber-panel{pointer-events:auto} /* Never let globe root kill page chrome if a page nests footer/scripts by mistake */ #cyber-network-root .ainna-page-footer, #cyber-network-root .ainna-page-footer-strip, #cyber-network-root .ainna-page-footer-links, #cyber-network-root .ainna-page-footer-links a, #cyber-network-root .ainna-page-footer a, #cyber-network-root footer, #cyber-network-root footer a, #cyber-network-root [data-ainna-theme-toggle], #cyber-network-root .ainna-theme-switch, #cyber-network-root .theme-toggle, #cyber-network-root .ainna-nav-controls, #cyber-network-root nav [data-ainna-theme-toggle]{ pointer-events:auto!important; } /* Crawl-only static index so search engines can discover every globe menu link */ .cyber-network-crawl-index { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; white-space: nowrap; } .cyber-network-crawl-group { display: block; } .cyber-network-crawl-label { display: block; } .cyber-network-crawl-link { display: inline-block; } /* Game pages: top-right, offset below day/night toggle */ /* NOTE: JS reparents the globe to to escape stacking contexts, so the rule must also match when the container is no longer inside . */ html.ainna-game-page #cyber-network-container, html.ainna-game-page body.ainna-game-page #cyber-network-container, body.ainna-game-page #cyber-network-container { top: max(78px, calc(72px + env(safe-area-inset-top, 0px))) !important; right: max(12px, env(safe-area-inset-right, 0px)) !important; bottom: auto !important; left: auto !important; transform: none !important; -webkit-transform: none !important; } body.ainna-game-page #cyber-network-container .cyber-globe-wrapper { width: 52px; height: 52px; } body.ainna-game-page #cyber-network-container .cyber-globe-btn svg { width: 26px; height: 26px; } body.ainna-game-page .cyber-panel { top: calc(max(78px, calc(72px + env(safe-area-inset-top, 0px))) + 68px); bottom: auto; left: auto; right: max(12px, env(safe-area-inset-right, 0px)); margin-left: 0; width: min(420px, calc(100vw - 24px)); transform: none; } body.ainna-game-page { padding-bottom: 24px !important; } /* Mobile: force floating always, follow scroll (for pages with heavy transforms/perspective) */ @media (max-width: 768px) { html body #cyber-network-container, body > #cyber-network-container, #cyber-network-container { position: fixed !important; bottom: var(--ainna-dock-bottom, 20px) !important; left: var(--ainna-dock-x, 50%) !important; top: auto !important; right: auto !important; transform: translateX(-50%) !important; -webkit-transform: translateX(-50%) !important; z-index: 2147483647 !important; pointer-events: auto !important; display: block !important; } #cyber-network-container .cyber-globe-wrapper, #cyber-network-container .cyber-globe-btn { pointer-events: auto !important; } } .cyber-globe-wrapper{ position:relative; display:inline-block; width:var(--ainna-dock-globe, 60px); height:var(--ainna-dock-globe, 60px); pointer-events:auto; } .cyber-globe-btn{ width:100%;height:100%;border-radius:50%; background:linear-gradient(135deg,#667eea,#7553ec); border:2px solid rgba(255,255,255,0.3); display:flex;align-items:center;justify-content:center; cursor:pointer;box-shadow:0 0 20px rgba(102,126,234,0.6); animation:cyberPulse 2s ease-in-out infinite;transition:all 0.3s ease; position:relative;z-index:2; } .cyber-globe-btn:hover{transform:scale(1.1);box-shadow:0 0 30px rgba(102,126,234,0.9)} .cyber-globe-btn svg{width:30px;height:30px;fill:#ffffff} @keyframes cyberPulse{0%,100%{box-shadow:0 0 20px rgba(102,126,234,0.6)}50%{box-shadow:0 0 30px rgba(102,126,234,0.9)}} /* Rotating AINNA Text Ring - BIGGER than globe button, ON TOP (z-index:3) */ .cyber-orbit-ring{position:absolute;top:0;left:0;width:100%;height:100%;animation:spinOrbit 8s linear infinite;pointer-events:none!important;z-index:5}.cyber-orbit-ring *{pointer-events:none!important} .cyber-orbit-ring--outer{animation:spinOrbitReverse 8s linear infinite;z-index:4} .cyber-orbit-ring--outer text{font-size:22px;font-weight:900;letter-spacing:2px;fill:#ff8a8a;text-transform:uppercase} @keyframes spinOrbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}} @keyframes spinOrbitReverse{from{transform:rotate(0deg)}to{transform:rotate(-360deg)}} .cyber-curved-text{position:absolute;top:0;left:0;width:100%;height:100%;overflow:visible} .cyber-orbit-text{font-size:22px;font-weight:900;letter-spacing:4px;fill:silver;text-transform:uppercase} /* Cyberpunk Grid Panel */ .cyber-panel{pointer-events:auto; display:none;position:fixed;bottom:90px;left:50%;margin-left:-240px;width:480px;max-height:75vh;overflow-y:auto; -webkit-overflow-scrolling:touch;overscroll-behavior:contain; background:rgba(15,23,42,0.98);backdrop-filter:blur(10px); border-radius:12px;border:1px solid rgba(102,126,234,0.5); box-shadow:0 10px 50px rgba(0,0,0,0.5),0 0 30px rgba(102,126,234,0.3); padding:18px;opacity:0;visibility:hidden;transition:opacity 0.3s ease,visibility 0.3s ease; transform:none;z-index:2147483647; } .cyber-panel.active,.cyber-panel.show{display:block;opacity:1;visibility:visible} /* Cyberpunk Grid Layout */ .cyber-menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px} .cyber-group-label{grid-column:1/-1;font-size:11px;font-weight:600;letter-spacing:0.02em;text-transform:none;color:#a5b4fc !important;padding:4px 2px 2px;margin-top:4px;border-top:1px solid rgba(102,126,234,0.2);display:flex;align-items:center;justify-content:space-between} .cyber-group-count{font-size:10px;font-weight:500;color:#64748b;letter-spacing:0} .cyber-group-label:first-child{border-top:none;margin-top:0;padding-top:0} .cyber-group-label::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#667eea;margin-right:6px;vertical-align:middle;opacity:0.85} .cyber-site-card{ position:relative;display:flex;flex-direction:column;padding:8px; background:rgba(30,41,59,0.8);border:1px solid rgba(102,126,234,0.3); border-radius:8px;text-decoration:none;transition:all 0.3s ease; overflow:hidden;cursor:pointer;pointer-events:auto; color:inherit; } .cyber-site-card:hover{ border-color:#667eea;box-shadow:0 0 20px rgba(102,126,234,0.4); transform:translateY(-2px); } .cyber-site-card.active{ background:rgba(102,126,234,0.22);border-color:#818cf8; border-left:3px solid #818cf8;padding-left:9px; box-shadow:0 0 18px rgba(102,126,234,0.35),inset 0 0 0 1px rgba(129,140,248,0.15); } .cyber-site-card.active::after{ content:'You are here';position:absolute;top:8px;right:8px; font-size:9px;font-weight:600;letter-spacing:0.02em;text-transform:none; color:#c7d2fe;background:rgba(99,102,241,0.35); padding:2px 6px;border-radius:4px;line-height:1.3; } .cyber-site-card--hub{ grid-column:1/-1; display:grid; grid-template-columns:44px minmax(0,1fr); grid-template-rows:auto auto; column-gap:12px; row-gap:2px; align-items:center; min-height:0; padding:14px; border-radius:12px; background:linear-gradient(145deg, rgba(102,126,234,0.22), rgba(30,41,59,0.88)); border-color:rgba(129,140,248,0.58); box-shadow:0 0 22px rgba(102,126,234,0.24), inset 0 0 0 1px rgba(129,140,248,0.14); } .cyber-site-card--hub:hover{transform:translateY(-2px);box-shadow:0 0 26px rgba(102,126,234,0.34),0 10px 24px rgba(0,0,0,0.18)} .cyber-site-card--hub .cyber-site-icon{grid-row:1/3;width:44px;height:44px;margin-bottom:0;border-radius:12px;background:rgba(15,23,42,0.9)} .cyber-site-card--hub .cyber-site-name{font-size:14px;font-weight:700;margin-bottom:0;color:#f8fbff !important} .cyber-site-card--hub .cyber-site-desc{font-size:12px;color:#dbe4ff !important} .cyber-site-name{font-size:11px;font-weight:600;margin-bottom:1px;color:#e2e8f0 !important;line-height:1.2} .cyber-site-desc{font-size:10px;color:#94a3b8 !important;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cyber-site-card--hub .cyber-site-badge{top:10px;right:10px} .cyber-site-card--hub.active .cyber-site-badge{top:10px} .cyber-site-badge{ position:absolute;top:8px;right:8px;z-index:2; font-size:9px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase; padding:2px 6px;border-radius:4px;line-height:1.3; } .cyber-site-card.active .cyber-site-badge{top:26px} .cyber-badge-new{color:#ecfdf5;background:rgba(16,185,129,0.85)} .cyber-badge-beta{color:#fffbeb;background:rgba(245,158,11,0.85)} .cyber-badge-hot{color:#fdf2f8;background:rgba(236,72,153,0.88)} .cyber-badge-red{color:#fef2f2;background:rgba(220,38,38,0.85)} .cyber-site-icon{width:24px;height:24px;margin-bottom:4px} .cyber-site-icon svg,.cyber-site-icon picture,.cyber-site-icon img{display:block;width:100%;height:100%} .cyber-site-icon svg{fill:#667eea;transition:all 0.3s ease} .cyber-site-icon--photo{padding:4px;border-radius:50%;overflow:hidden;background:rgba(15,23,42,0.85);border:1px solid rgba(102,126,234,0.35);box-sizing:border-box} .cyber-site-icon--photo picture,.cyber-site-icon--photo img{border-radius:50%;object-fit:cover} .cyber-site-icon--photo img{width:100%;height:100%;filter:grayscale(100%) contrast(0.95) brightness(1.02) opacity(0.96)} .cyber-site-card[data-site="smart-farming"] .cyber-site-icon svg{fill:none;overflow:visible} .cyber-site-card[data-site="smart-farming"] .icon-tone-primary{fill:none;stroke:#22c55e;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .cyber-site-card[data-site="smart-farming"] .icon-tone-secondary{fill:none;stroke:#f59e0b;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round} html[data-theme="dark"] .cyber-site-card[data-site="smart-farming"] .icon-tone-primary{stroke:#86efac} html[data-theme="dark"] .cyber-site-card[data-site="smart-farming"] .icon-tone-secondary{stroke:#fbbf24} .cyber-site-card[data-site="smart-farming"]:hover .cyber-site-icon svg{filter:drop-shadow(0 0 8px rgba(34,197,94,0.75))} .cyber-site-card[data-site="sme-bank-statement-compiler"] .cyber-site-icon svg{fill:#fca5a5} .cyber-site-card[data-site="sme-bank-statement-compiler"]:hover{border-color:#fb7185;box-shadow:0 0 20px rgba(248,113,113,0.35)} .cyber-site-card[data-site="sme-bank-statement-compiler"].active{background:rgba(248,113,113,0.16);border-color:#fb7185;box-shadow:0 0 18px rgba(248,113,113,0.25),inset 0 0 0 1px rgba(251,113,133,0.18)} .cyber-site-card[data-site="sme-bank-statement-compiler"].active .cyber-site-name{color:#fecaca !important} .cyber-site-card[data-site="sme-bank-statement-compiler"].active .cyber-site-desc{color:#fee2e2 !important} .cyber-site-card[data-site="sme-bank-statement-compiler"] .cyber-site-badge{background:rgba(251,113,133,0.85);color:#fff1f2} /* Bursa Saham — mint/cyan market accent */ .cyber-site-card[data-site="bursa-saham"]{border-color:rgba(95,227,193,0.35);background:linear-gradient(165deg,rgba(95,227,193,0.10),rgba(99,102,241,0.06))} .cyber-site-card[data-site="bursa-saham"] .cyber-site-icon svg{fill:#5fe3c1} .cyber-site-card[data-site="bursa-saham"]:hover{border-color:#5fe3c1;box-shadow:0 0 20px rgba(95,227,193,0.35)} .cyber-site-card[data-site="bursa-saham"]:hover .cyber-site-icon svg{filter:drop-shadow(0 0 10px rgba(95,227,193,0.85))} .cyber-site-card[data-site="bursa-saham"] .cyber-site-name{color:#a7f3d0 !important} .cyber-site-card[data-site="bursa-saham"] .cyber-site-desc{color:#c7d2fe !important} .cyber-site-card[data-site="bursa-saham"].active{background:rgba(95,227,193,0.16);border-color:#5fe3c1;box-shadow:0 0 18px rgba(95,227,193,0.25),inset 0 0 0 1px rgba(99,102,241,0.18)} .cyber-site-card[data-site="bursa-saham"].active .cyber-site-name{color:#d1fae5 !important} .cyber-site-card[data-site="bursa-saham"].active .cyber-site-desc{color:#e0e7ff !important} .cyber-site-card[data-site="bursa-saham"] .cyber-site-badge{background:rgba(95,227,193,0.9);color:#042f2e} /* Brent Intelligence — gold/cyan commodity accent */ .cyber-site-card[data-site="brent-intelligence"]{border-color:rgba(245,185,66,0.35);background:linear-gradient(165deg,rgba(245,185,66,0.10),rgba(106,217,255,0.06))} .cyber-site-card[data-site="brent-intelligence"] .cyber-site-icon svg{fill:#f5b942} .cyber-site-card[data-site="brent-intelligence"]:hover{border-color:#f5b942;box-shadow:0 0 20px rgba(245,185,66,0.35)} .cyber-site-card[data-site="brent-intelligence"]:hover .cyber-site-icon svg{filter:drop-shadow(0 0 10px rgba(245,185,66,0.85))} .cyber-site-card[data-site="brent-intelligence"] .cyber-site-name{color:#fde68a !important} .cyber-site-card[data-site="brent-intelligence"] .cyber-site-desc{color:#93c5fd !important} .cyber-site-card[data-site="brent-intelligence"].active{background:rgba(245,185,66,0.16);border-color:#f5b942;box-shadow:0 0 18px rgba(245,185,66,0.25),inset 0 0 0 1px rgba(106,217,255,0.18)} .cyber-site-card[data-site="brent-intelligence"].active .cyber-site-name{color:#fef3c7 !important} .cyber-site-card[data-site="brent-intelligence"].active .cyber-site-desc{color:#bae6fd !important} .cyber-site-card[data-site="brent-intelligence"] .cyber-site-badge{background:rgba(245,185,66,0.9);color:#1a1307} /* Industry group — compact directory mode */ .cyber-site-card[data-group="Industry"], .cyber-site-card[data-group="Tools"], .cyber-site-card[data-group="Games"], .cyber-site-card[data-group="Scientific & Models"]{ min-height:0; display:grid; grid-template-columns:24px minmax(0,1fr); grid-template-rows:auto auto; column-gap:8px; row-gap:1px; align-items:center; padding:8px 9px; border-radius:9px; background:linear-gradient(145deg,rgba(15,23,42,0.88),rgba(30,41,59,0.74)); border-color:rgba(129,140,248,0.24); } .cyber-site-card[data-group="Industry"]:hover, .cyber-site-card[data-group="Tools"]:hover, .cyber-site-card[data-group="Games"]:hover, .cyber-site-card[data-group="Scientific & Models"]:hover{ transform:translateY(-1px); border-color:rgba(129,140,248,0.62); box-shadow:0 0 14px rgba(102,126,234,0.28); } .cyber-site-card[data-group="Industry"].active, .cyber-site-card[data-group="Tools"].active, .cyber-site-card[data-group="Games"].active, .cyber-site-card[data-group="Scientific & Models"].active{ padding-left:8px; border-left:2px solid #818cf8; } .cyber-site-card[data-group="Industry"].active::after, .cyber-site-card[data-group="Tools"].active::after, .cyber-site-card[data-group="Games"].active::after, .cyber-site-card[data-group="Scientific & Models"].active::after{display:none} .cyber-site-card[data-group="Industry"] .cyber-site-icon, .cyber-site-card[data-group="Tools"] .cyber-site-icon, .cyber-site-card[data-group="Games"] .cyber-site-icon, .cyber-site-card[data-group="Scientific & Models"] .cyber-site-icon{ grid-row:1/3; width:22px; height:22px; margin:0; opacity:0.95; } .cyber-site-card[data-group="Industry"] .cyber-site-icon svg{fill:#8fb7ff} .cyber-site-card[data-group="Tools"] .cyber-site-icon svg{fill:#f5b942} .cyber-site-card[data-group="Games"] .cyber-site-icon svg{fill:#ff7b9c} .cyber-site-card[data-group="Scientific & Models"] .cyber-site-icon svg{fill:#5fe3c1} .cyber-site-card[data-group="Industry"]:nth-of-type(odd) .cyber-site-icon svg{fill:#5fe3c1} .cyber-site-card[data-group="Industry"] .cyber-site-name, .cyber-site-card[data-group="Tools"] .cyber-site-name, .cyber-site-card[data-group="Games"] .cyber-site-name, .cyber-site-card[data-group="Scientific & Models"] .cyber-site-name{ min-width:0; margin:0; font-size:11.5px; line-height:1.18; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .cyber-site-card[data-group="Industry"] .cyber-site-desc, .cyber-site-card[data-group="Tools"] .cyber-site-desc, .cyber-site-card[data-group="Games"] .cyber-site-desc, .cyber-site-card[data-group="Scientific & Models"] .cyber-site-desc{ min-width:0; margin:0; font-size:9.5px; line-height:1.18; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:0.72; } .cyber-site-card[data-group="Industry"] .cyber-site-badge, .cyber-site-card[data-group="Tools"] .cyber-site-badge, .cyber-site-card[data-group="Games"] .cyber-site-badge, .cyber-site-card[data-group="Scientific & Models"] .cyber-site-badge{ top:4px; right:4px; padding:1px 4px; font-size:7px; opacity:0.78; } .cyber-site-card--hub[data-group="Industry"]{ grid-column:1/-1; display:grid; grid-template-columns:44px minmax(0,1fr); grid-template-rows:auto auto; column-gap:12px; row-gap:2px; align-items:center; min-height:0; padding:14px; border-radius:12px; background:linear-gradient(145deg, rgba(102,126,234,0.22), rgba(30,41,59,0.88)); border-color:rgba(129,140,248,0.58); box-shadow:0 0 22px rgba(102,126,234,0.24), inset 0 0 0 1px rgba(129,140,248,0.14); } .cyber-site-card--hub[data-group="Industry"]:hover{transform:translateY(-2px);box-shadow:0 0 26px rgba(102,126,234,0.34),0 10px 24px rgba(0,0,0,0.18)} .cyber-site-card--hub[data-group="Industry"] .cyber-site-icon{grid-row:1/3;width:44px;height:44px;margin-bottom:0;border-radius:12px;background:rgba(15,23,42,0.9)} .cyber-site-card--hub[data-group="Industry"] .cyber-site-name{font-size:14px;font-weight:700;margin-bottom:0;color:#f8fbff !important} .cyber-site-card--hub[data-group="Industry"] .cyber-site-desc{font-size:12px;color:#dbe4ff !important} .cyber-site-card--hub[data-group="Industry"] .cyber-site-badge{top:10px;right:10px} .cyber-site-card--hub[data-group="Industry"].active .cyber-site-badge{top:10px} .cyber-site-card[data-group="Industry"].active .cyber-site-badge, .cyber-site-card[data-group="Tools"].active .cyber-site-badge, .cyber-site-card[data-group="Games"].active .cyber-site-badge, .cyber-site-card[data-group="Scientific & Models"].active .cyber-site-badge{top:4px} .cyber-site-name{font-size:13px;font-weight:600;color:#f8fafc !important;margin-bottom:3px;line-height:1.3;text-transform:none;letter-spacing:0.01em} .cyber-site-desc{font-size:11px;color:#94a3b8 !important;line-height:1.35;text-transform:none} .cyber-site-card.active .cyber-site-name{color:#667eea !important} .cyber-site-card.active .cyber-site-desc{color:#a5b4fc !important} /* Panel Header */ .cyber-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(102,126,234,0.3)} .cyber-panel-header h3{font-size:14px;font-weight:700;color:#ffffff !important;margin:0;display:flex;align-items:center;gap:8px} .cyber-panel-header h3 svg{width:18px;height:18px;fill:#667eea} .cyber-close{background:none;border:none;color:#667eea;font-size:24px;cursor:pointer;padding:0;line-height:1;transition:all 0.3s ease} .cyber-close:hover{color:#ffffff;text-shadow:0 0 10px rgba(102,126,234,0.8)} /* Search Bar */ .cyber-search{margin-bottom:12px} .cyber-search input{ width:100%;padding:10px 12px;background:rgba(15,23,42,0.8); border:1px solid rgba(102,126,234,0.3);border-radius:6px; font-size:13px;color:#ffffff;transition:all 0.3s ease; } .cyber-search input:focus{outline:none;border-color:#667eea;box-shadow:0 0 10px rgba(102,126,234,0.3)} .cyber-search input::placeholder{color:#64748b} /* Footer */ .cyber-footer{display:flex;justify-content:center;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid rgba(102,126,234,0.3)} .cyber-footer-link,.cyber-cache-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;background:rgba(30,41,59,0.8);border:1px solid rgba(102,126,234,0.3);border-radius:6px;text-decoration:none;font-size:11px;font-weight:500;color:#94a3b8 !important;text-transform:none;transition:all 0.3s ease} .cyber-footer-link:hover{background:rgba(102,126,234,0.2);border-color:#667eea;color:#667eea !important} .cyber-cache-btn:hover{background:rgba(102,126,234,0.2);border-color:#667eea;color:#667eea !important} .cyber-footer-link svg,.cyber-cache-btn svg{fill:currentColor;width:14px;height:14px;flex-shrink:0} .cyber-ext-icon{width:11px!important;height:11px!important;opacity:0.65;margin-left:1px} .cyber-footer-link--home{background:rgba(102,126,234,0.15);border-color:rgba(129,140,248,0.45);color:#c7d2fe!important} .cyber-footer-link--home:hover{color:#fff!important;background:rgba(102,126,234,0.35)} .cyber-footer-link--model{background:rgba(15,23,42,0.94);border-color:rgba(129,140,248,0.34);color:#e0e7ff!important;font-weight:600;min-width:108px} .cyber-footer-link--model:hover{background:rgba(30,41,59,0.96);border-color:rgba(129,140,248,0.52);color:#fff!important} .cyber-footer-link--model .cyber-ext-icon{opacity:0.5} .cyber-general-title{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#94a3b8!important;text-transform:none;letter-spacing:0.02em;margin-bottom:4px} .cyber-general-title svg{width:14px;height:14px;fill:#94a3b8;flex-shrink:0} .cyber-general-links{display:flex;gap:6px;flex-wrap:wrap} .cyber-investor-kits-card{width:100%;display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:rgba(15,23,42,0.86);border:1px solid rgba(148,163,184,0.22);border-radius:10px;box-shadow:0 8px 22px rgba(0,0,0,0.16),inset 0 1px 0 rgba(255,255,255,0.04)} .cyber-investor-kits-title{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#c7d2fe!important;text-transform:none;letter-spacing:0.02em} .cyber-investor-kits-title svg{width:14px;height:14px;fill:#818cf8;flex-shrink:0} .cyber-investor-kits-links{display:flex;gap:6px;flex-wrap:wrap} /* Globe footer alignment only — keeps page footers/cards untouched */ #cyber-network-root .cyber-footer{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; width:min(100%,640px); margin:12px auto 0; pointer-events:auto !important; } #cyber-network-root .cyber-general-card, #cyber-network-root .cyber-investor-kits-card{ width:min(100%,640px); max-width:640px; align-items:center; text-align:center; padding:12px 14px; border-radius:12px; box-sizing:border-box; } #cyber-network-root .cyber-general-title, #cyber-network-root .cyber-investor-kits-title{ justify-content:center; width:100%; } #cyber-network-root .cyber-general-links, #cyber-network-root .cyber-investor-kits-links{ justify-content:center; align-items:center; width:100%; } #cyber-network-root .cyber-cache-btn, #cyber-network-root .cyber-footer-link{ justify-content:center; text-align:center; pointer-events:auto !important; } .cyber-footer-link--investor{background:rgba(99,102,241,0.14);border-color:rgba(129,140,248,0.42);color:#c7d2fe!important;position:relative} .cyber-footer-link--investor:hover{background:rgba(99,102,241,0.3);border-color:#818cf8;color:#fff!important} .cyber-footer-link--investor[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:rgba(15,23,42,0.97);color:#c7d2fe;font-size:10px;font-weight:400;white-space:nowrap;padding:4px 8px;border-radius:5px;border:1px solid rgba(129,140,248,0.35);box-shadow:0 4px 12px rgba(0,0,0,0.4);z-index:2147483647;pointer-events:none;letter-spacing:0.01em} /* Scrollbar */ .cyber-menu-grid::-webkit-scrollbar{width:6px} .cyber-menu-grid::-webkit-scrollbar-track{background:rgba(15,23,42,0.5)} .cyber-menu-grid::-webkit-scrollbar-thumb{background:#667eea;border-radius:3px} /* Mobile Responsive */ @media(max-width:480px){ .cyber-panel{position:fixed;pointer-events:auto;left:16px;right:16px;width:auto;transform:none;margin-left:0;bottom:65px;max-height:80vh} body.ainna-game-page .cyber-panel{ top:calc(max(12px, env(safe-area-inset-top, 0px)) + 64px); bottom:auto;left:12px;right:12px;width:auto; max-height:calc(100vh - 100px); } body.ainna-game-page #cyber-network-container .cyber-globe-wrapper{width:48px;height:48px} .cyber-menu-grid{grid-template-columns:repeat(2,1fr)} .cyber-globe-wrapper{ width:var(--ainna-dock-globe, 45px); height:var(--ainna-dock-globe, 45px); } .cyber-globe-btn svg{width:24px;height:24px} } .cyber-sections-overlay { display: none !important; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.85); z-index: 2147483648 !important; justify-content: center; align-items: center; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); } .ainna-sections-modal-open #cyber-network-root, .ainna-sections-modal-open #cyber-network-container, .ainna-sections-modal-open #cyberPanel { display: none !important; } .cyber-sections-overlay.active { display: flex !important; } .cyber-sections-modal { position: relative; max-width: 600px; width: 90vw; max-height: 85vh; background: rgba(15,23,42,0.98); border-radius: 16px; border: 1px solid rgba(102,126,234,0.5); box-shadow: 0 10px 50px rgba(0,0,0,0.5), 0 0 30px rgba(102,126,234,0.3); overflow: hidden; animation: cyberModalIn 0.3s ease-out; } @keyframes cyberModalIn { from { opacity: 0; transform: translateY(-30px) scale(0.95); } to { opacity: 1; transform: translateY(0) scale(1); } } .cyber-sections-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid rgba(102,126,234,0.3); } .cyber-sections-header h3 { font-size: 14px; font-weight: 700; color: #ffffff !important; margin: 0; display: flex; align-items: center; gap: 8px; } .cyber-sections-close { background: none; border: none; color: #667eea; font-size: 24px; cursor: pointer; padding: 0; line-height: 1; transition: all 0.3s ease; } .cyber-sections-close:hover { color: #ffffff; text-shadow: 0 0 10px rgba(102,126,234,0.8); } .cyber-sections-body { padding: 16px 20px; overflow-y: auto; max-height: calc(85vh - 60px); } .cyber-sections-site { margin-bottom: 20px; padding: 14px; background: rgba(30,41,59,0.8); border: 1px solid rgba(102,126,234,0.3); border-radius: 10px; } .cyber-sections-site:last-child { margin-bottom: 0; } .cyber-sections-site-name { font-size: 13px; font-weight: 600; color: #f8fafc !important; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; } .cyber-sections-site-name svg { width: 14px; height: 14px; fill: #667eea; flex-shrink: 0; } .cyber-sections-grid { display: flex; flex-wrap: wrap; gap: 6px; } .cyber-section-badge { padding: 4px 10px; background: rgba(102,126,234,0.15); border: 1px solid rgba(102,126,234,0.25); border-radius: 6px; font-size: 11px; font-weight: 500; color: #c7d2fe !important; } .cyber-sections-empty { text-align: center; padding: 40px 20px; color: #64748b; font-size: 13px; line-height: 1.6; } .cyber-sections-empty svg { width: 40px; height: 40px; fill: #64748b; margin-bottom: 12px; opacity: 0.5; } @media (max-width: 480px) { .cyber-sections-modal { max-width: 95vw; max-height: 80vh; } } /* Time Core animated atomic clock icon */ .ntc-atomic-icon { width: 22px; height: 22px; color: #00d4ff; overflow: visible; } .ntc-orbit-outer { transform-origin: center; animation: ntcOrbitOuter 12s linear infinite; } .ntc-orbit-tilt { transform-origin: center; animation: ntcOrbitTilt 8s linear infinite; } .ntc-orbit-tilt2 { transform-origin: center; animation: ntcOrbitTilt2 10s linear infinite; } .ntc-nucleus { transform-origin: center; animation: ntcNucleusPulse 2s ease-in-out infinite; } @keyframes ntcOrbitOuter { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes ntcOrbitTilt { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } @keyframes ntcOrbitTilt2 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes ntcNucleusPulse { 0%, 100% { opacity: 0.7; transform: scale(1); } 50% { opacity: 1; transform: scale(1.3); } } .cyber-site-card:hover .ntc-atomic-icon { color: #ffffff; filter: drop-shadow(0 0 6px #00d4ff); } @media (prefers-reduced-motion: reduce) { .ntc-orbit-outer, .ntc-orbit-tilt, .ntc-orbit-tilt2, .ntc-nucleus { animation: none; } }