:root{
            --bg-1:#0B0F14;
            --bg-2:#0E1220;
            --ink:#E2E8F0;
            --muted:#94A3B8;
            --cyan:#22D3EE;
            --blue:#38BDF8;
            --violet:#8B5CF6;
            --lime:#A3E635;
        }
        html,body{ height:100% }
        body { 
            font-family: "Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif;
            box-sizing: border-box;
        }
        /* Dark nebula background with subtle grid */
         .bg-dark {
            position: relative;
            overflow: hidden;
            background-attachment: fixed;
        } 

        .bg-dark::before {
            content: "";
            position: fixed;
            inset: 0;
            z-index: -1;
            background:
            radial-gradient(1200px 800px at 80% -10%, rgba(34,211,238,0.40), transparent 60%),
            radial-gradient(900px 700px at -10% 30%, rgba(56,189,248,0.30), transparent 60%),
            linear-gradient(180deg, var(--bg-1), var(--bg-2));
        }
        @media (max-width: 600px) {
            .bg-dark {
                background-attachment: scroll;
            }
            .bg-dark::before {
                background:
                    radial-gradient(1200px 800px at 80% -10%, rgba(34,211,238,0.20), transparent 60%), 
                    radial-gradient(900px 700px at -5% 50%, rgba(56,189,248,0.20), transparent 60%),
                    linear-gradient(180deg, var(--bg-1), var(--bg-2));
            }
        }
        /* Glossy cyan highlight sweep */
        .glossy::after{
            content:""; position:absolute; inset:-20% -30% auto auto; height:180%; width:60%;
            background: linear-gradient(120deg, transparent 30%, 
            rgba(34,211,238,0.35),
            rgba(255,255,255,0.25),
                transparent 70%);
            transform: rotate(8deg);
            filter: blur(16px);
            pointer-events:none;
        }
        /* Soft drop glow utility */
        .glow-cyan { filter: drop-shadow(0 0 22px rgba(34,211,238,0.35)); }
        /* Smooth transitions */
        .t { transition: all .25s ease; }
        /* Tooltip */
        .tooltip { pointer-events:none; }
        /* Prevent layout shift on number count */
        .tabular-nums { font-variant-numeric: tabular-nums; }
        /* Keyframes for fade-in and rise */
        @keyframes riseFade { from {opacity:0; transform: translateY(8px)} to{ opacity:1; transform:none } }
        .appear { animation: riseFade .4s ease both; }