:root{--color-midnight:#0d1b2a;--color-navy:#132238;--color-ocean:#1b4965;--color-cyan:#62b6cb;--color-cyan-glow:#62b6cb59;--color-gold:#e0a96d;--color-gold-glow:#e0a96d4d;--color-ivory:#f4f1de;--color-muted:#94a3b8;--color-border:#62b6cb2e;--color-border-hover:#62b6cb73;--color-card-bg:#132238bf;--color-card-solid:#132238;--font-body:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-display:"Space Grotesk", system-ui, sans-serif;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-full:9999px;--shadow-subtle:0 4px 20px #00000059;--shadow-glow:0 0 25px var(--color-cyan-glow);--shadow-gold-glow:0 0 25px var(--color-gold-glow)}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-body);background-color:var(--color-midnight);scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body,html{color:var(--color-ivory)}body{background:radial-gradient(circle at 50% 0,#173252,#0d1b2a 70%);min-height:100vh;line-height:1.6;overflow-x:hidden}a{color:inherit;text-decoration:none;transition:color .2s}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.font-display{font-family:var(--font-display)}.text-cyan{color:var(--color-cyan)}.text-gold{color:var(--color-gold)}.text-muted{color:var(--color-muted)}.container{width:100%;max-width:1240px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}.btn{border-radius:var(--radius-full);letter-spacing:.02em;justify-content:center;align-items:center;gap:10px;padding:12px 24px;font-size:.95rem;font-weight:600;transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex}.btn-primary{color:#06111e;background:linear-gradient(135deg,#62b6cb,#3a889b);box-shadow:0 4px 18px #62b6cb59}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 25px #62b6cb8c}.btn-gold{color:#1a0f02;background:linear-gradient(135deg,#e0a96d,#c18847);box-shadow:0 4px 18px #e0a96d59}.btn-gold:hover{transform:translateY(-2px);box-shadow:0 6px 25px #e0a96d8c}.btn-secondary{color:var(--color-ivory);border:1px solid var(--color-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1b496559}.btn-secondary:hover{border-color:var(--color-cyan);background:#1b496599;transform:translateY(-2px)}.badge{letter-spacing:.08em;text-transform:uppercase;border-radius:var(--radius-full);color:var(--color-cyan);background:#62b6cb1f;border:1px solid #62b6cb4d;align-items:center;gap:6px;padding:4px 12px;font-size:.75rem;font-weight:700;display:inline-flex}.badge-gold{color:var(--color-gold);background:#e0a96d1f;border-color:#e0a96d59}.glass-card{background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(16px);transition:all .3s}.glass-card:hover{border-color:var(--color-border-hover);transform:translateY(-3px);box-shadow:0 12px 35px #0006,0 0 20px #62b6cb26}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.grid-2,.grid-3,.grid-4{display:grid}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}@media (width<=992px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}dialog:not([open]){display:none!important}dialog:modal{border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-ivory);width:720px;max-width:90vw;max-height:85vh;box-shadow:0 25px 60px #000000bf,0 0 40px var(--color-cyan-glow);-webkit-backdrop-filter:blur(24px);overscroll-behavior:contain;background:#0d1b2af0;margin:auto;padding:0}dialog::backdrop{overscroll-behavior:contain;-webkit-backdrop-filter:blur(10px);background:#040910d1;overflow:hidden}.dialog-header{border-bottom:1px solid var(--color-border);background:#1b496533;justify-content:space-between;align-items:center;padding:24px 28px;display:flex}.dialog-body{max-height:calc(85vh - 160px);padding:28px;overflow-y:auto}.dialog-footer{border-top:1px solid var(--color-border);background:#0a142099;justify-content:flex-end;align-items:center;gap:14px;padding:20px 28px;display:flex}.btn-close{border-radius:var(--radius-full);width:38px;height:38px;color:var(--color-ivory);border:1px solid var(--color-border);background:#ffffff14;justify-content:center;align-items:center;transition:all .2s;display:inline-flex}.btn-close:hover{border-color:var(--color-cyan);background:#62b6cb33;transform:rotate(90deg)}.world-viewport{background:#08111c;width:100vw;height:100vh;position:relative;overflow:hidden}.world-canvas{z-index:1}.hud-layer,.world-canvas{width:100%;height:100%;position:absolute;top:0;left:0}.hud-layer{z-index:10;pointer-events:none}.hud-interactive{pointer-events:auto}.hud-top-bar{z-index:30;pointer-events:none;justify-content:space-between;width:100%;padding:16px 24px;position:absolute;top:0;left:0}.brand-badge,.brand-logo-gem,.hud-top-bar,.interaction-prompt{align-items:center;display:flex}.brand-badge{border:1px solid var(--color-border);border-radius:var(--radius-full);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0d1b2abf;gap:12px;padding:8px 16px}.brand-logo-gem{color:#fff;width:28px;height:28px;box-shadow:0 0 12px var(--color-cyan-glow);background:linear-gradient(135deg,#62b6cb,#1b4965);border-radius:8px;justify-content:center;font-size:.85rem;font-weight:800}.interaction-prompt{border:1px solid var(--color-cyan);border-radius:var(--radius-full);box-shadow:0 8px 30px #0009,0 0 25px var(--color-cyan-glow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:auto;background:#0d1b2ae6;gap:14px;padding:14px 28px;animation:2s ease-in-out infinite promptPulse;position:absolute;bottom:110px;left:50%;transform:translate(-50%)}.key-badge{min-width:32px;height:32px;font-family:var(--font-display);color:#06111e;background:#62b6cb;border-radius:6px;justify-content:center;align-items:center;padding:0 8px;font-size:.9rem;font-weight:700;display:inline-flex;box-shadow:0 2px 8px #0006}@keyframes promptPulse{0%,to{box-shadow:0 8px 30px #0009,0 0 20px var(--color-cyan-glow);transform:translate(-50%)scale(1)}50%{transform:translate(-50%)scale(1.03);box-shadow:0 8px 30px #0009,0 0 35px #62b6cbb3}}.mobile-controls-layer{pointer-events:none;width:100%;height:100%;position:absolute;bottom:0;left:0}.virtual-joystick-zone{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;touch-action:none;background:#1b496540;border:2px dashed #62b6cb59;border-radius:50%;width:140px;height:140px;position:absolute;bottom:30px;left:30px}.joystick-thumb{width:50px;height:50px;box-shadow:0 0 15px var(--color-cyan-glow);background:radial-gradient(circle,#62b6cb,#1b4965);border-radius:50%;margin-top:-25px;margin-left:-25px;transition:transform 50ms linear;position:absolute;top:50%;left:50%}.mobile-action-buttons{pointer-events:auto;flex-direction:column;gap:16px;display:flex;position:absolute;bottom:35px;right:30px}.mobile-action-btn{border:1px solid var(--color-cyan);width:60px;height:60px;color:var(--color-cyan);box-shadow:0 4px 15px #00000080,0 0 15px var(--color-cyan-glow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0d1b2ad9;border-radius:50%;justify-content:center;align-items:center;font-size:.95rem;font-weight:700;display:flex}