/* Shared site shell. Tool-specific styles stay with their workspaces. */
.hidden, [hidden], [x-cloak] { display: none !important; }
        body { font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; margin: 0; }
        @media (min-width: 768px) {
            .md\:flex { display: flex !important; }
            .md\:hidden { display: none !important; }
        }
        @media (min-width: 1024px) {
            .lg\:flex { display: flex !important; }
            .lg\:hidden { display: none !important; }
        }
::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #f1f5f9; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
        
        .glass-panel {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
        }
        .tool-card {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .tool-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
        }
        
        .logo-text { font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
        
        /* 🚀 Mega Menu Styles */
        .menu-link {
            display: block;
            padding: .55rem .65rem;
            border-radius: .65rem;
            color: #475569;
            font-size: .76rem;
            font-weight: 700;
            text-transform: none;
            transition: background .15s ease, color .15s ease;
        }
        .menu-link:hover { background:#f8fafc; color:#2563eb; }
        .menu-heading {
            font-size: .65rem;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .08em;
            margin-bottom: .5rem;
        }
        .menu-heading.blue { color:#2563eb; }
        .menu-heading.amber { color:#d97706; }
        .menu-heading.emerald { color:#059669; }
        .menu-heading.purple { color:#9333ea; }
        .mobile-tool {
            display:block;
            padding:.8rem .7rem;
            border-radius:.8rem;
            text-align:center;
            font-size:.8rem;
            font-weight:800;
        }
        .mobile-tool.blue { background:#eff6ff; color:#2563eb; }
        .mobile-tool.amber { background:#fffbeb; color:#d97706; }
        .mobile-tool.emerald { background:#ecfdf5; color:#059669; }
        .mobile-tool.purple { background:#faf5ff; color:#9333ea; }
        .mobile-group { border-top:1px solid #f1f5f9; padding:.7rem 0; }
        .mobile-group summary {
            cursor:pointer;
            list-style:none;
            padding:.55rem .75rem;
            font-size:.75rem;
            font-weight:900;
            color:#64748b;
            text-transform:uppercase;
            letter-spacing:.07em;
        }
        .mobile-group summary::-webkit-details-marker { display:none; }
        .mobile-links {
            display:grid;
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:.35rem;
            padding:.3rem .35rem .15rem;
        }
        .mobile-links a {
            display:block;
            padding:.65rem .7rem;
            border-radius:.65rem;
            background:#f8fafc;
            color:#334155;
            font-size:.77rem;
            font-weight:700;
        }
        .mobile-links a:hover { background:#eff6ff; color:#2563eb; }