body{margin:0;padding:0;font-family:Tahoma,sans-serif;visibility:visible;opacity:1;}.navbar,.hero-slider,.grade-grid{opacity:1;}.container{max-width:1300px;margin:0 auto;padding:0 1.5rem;}@font-face {font-family:'CustomFont';src:url('/assets/fonts/font.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap;size-adjust:100%;ascent-override:90%;descent-override:20%;line-gap-override:0%;}:root {--bg-white:#ffffff;--bg-light:#f8fafc;--text-primary:#1e293b;--text-muted:#64748b;--border-color:#e2e8f0;--accent-blue:#3b82f6;--accent-green:#10b981;--accent-pink:#EC4899;--radius-lg:24px;--radius-md:16px;--primary-light:#10b981;--primary-dark:#3b82f6;--primary-soft:#34d399;}body.dark-mode {--bg-white:#1e293b;--bg-light:#0f172a;--text-primary:#e2e8f0;--text-muted:#94a3b8;--border-color:#334155;}*{margin:0;padding:0;box-sizing:border-box;}body {font-family:'CustomFont',Tahoma,sans-serif;background:linear-gradient(145deg,#f5f7fc 0%,#e9eef5 100%);color:#1e293b;line-height:1.6;transition:background 0.3s,color 0.3s;}body.dark-mode {background:#0f172a;color:#e2e8f0;}*:focus-visible {outline:3px solid #3b82f6 !important;outline-offset:2px !important;border-radius:4px;}@media (prefers-reduced-motion:reduce) {*,*::before,*::after {animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-iteration-count:1 !important;scroll-behavior:auto !important;}}.skip-link {position:fixed;top:-100vh;left:50%;transform:translateX(-50%);background:#0a0a0a;color:#ffffff;padding:12px 24px;border-radius:0 0 12px 12px;font-weight:700;z-index:99999;text-decoration:none;}.skip-link:focus-visible {top:0;}.navbar {background:#ffffff;padding:0.7rem 2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;box-shadow:0 4px 12px rgba(0,0,0,0.05);border-bottom:1px solid #e2e8f0;position:sticky;top:0;z-index:1000;}body.dark-mode .navbar {background:#1e293b;border-bottom-color:#334155;box-shadow:0 4px 12px rgba(0,0,0,0.3);}.logo {font-size:1.6rem;font-weight:800;text-decoration:none;background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-flex;align-items:center;gap:6px;}.logo:hover{transform:scale(1.02);}button.mobile-menu-toggle,button.mobile-search-btn {background:none;border:none;font-size:1.4rem;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;transition:none;}button.mobile-menu-toggle i,button.mobile-search-btn i {background:linear-gradient(135deg,#10b981,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.4rem;}body.dark-mode button.mobile-menu-toggle i,body.dark-mode button.mobile-search-btn i {background:linear-gradient(135deg,#6ee7b7,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent;}button.mobile-dark-toggle {display:inline-flex;background:none;border:none;width:44px;height:44px;align-items:center;justify-content:center;font-size:1.5rem;color:var(--primary-dark);cursor:pointer;border-radius:50%;}button.mobile-dark-toggle i {background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;color:transparent;}.right-group a.mobile-cart {display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:linear-gradient(135deg,#6ee7b7,#60a5fa);border:none;border-radius:50%;padding:0;text-decoration:none;font-size:1.2rem;font-weight:bold;transition:none;}.right-group a.mobile-cart i {font-size:1.2rem;color:white;margin:0;}.right-group a.mobile-cart .badge {display:none;}body.dark-mode .right-group a.mobile-cart {background:linear-gradient(135deg,#34d399,#3b82f6);}.mobile-nav {position:fixed;top:0;right:0;left:auto;bottom:0;width:85vw;max-width:85vw;height:100vh;background:#ffffff;z-index:1100;display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(0,0,0,0.15);border-left:1px solid rgba(16,185,129,0.15);transform:translateX(100%);opacity:0;visibility:hidden;transition:transform 0.2s ease,opacity 0.2s ease,visibility 0.2s ease;overflow-y:auto;border-radius:0 0 0 16px;will-change:transform,opacity;}.mobile-nav.show {transform:translateX(0);opacity:1;visibility:visible;}body.dark-mode .mobile-nav {background:#1e293b;box-shadow:-10px 0 40px rgba(0,0,0,0.5);border-left:1px solid rgba(52,211,153,0.2);}.mobile-nav a,.mobile-nav button {display:flex;align-items:center;gap:14px;width:calc(100% - 32px);margin:8px 16px;padding:1rem 1.2rem;text-align:right;font-size:1.05rem;color:#1e293b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;justify-content:flex-start;transition:background-color 0.2s ease;cursor:pointer;text-decoration:none;font-weight:500;letter-spacing:-0.2px;box-shadow:0 2px 4px rgba(0,0,0,0.02);}.mobile-nav a:hover,.mobile-nav button:hover {background:#e2e8f0;color:#1e293b;}body.dark-mode .mobile-nav a,body.dark-mode .mobile-nav button {color:#e2e8f0;background:#0f172a;border-color:#334155;}body.dark-mode .mobile-nav a:hover,body.dark-mode .mobile-nav button:hover {background:#1e293b;color:#e2e8f0;}.mobile-nav a i,.mobile-nav button i {background:linear-gradient(135deg,#10b981,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.2rem;min-width:28px;text-align:center;}body.dark-mode .mobile-nav a i,body.dark-mode .mobile-nav button i {background:linear-gradient(135deg,#6ee7b7,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent;}.mobile-nav::before {content:'';display:block;height:6px;background:linear-gradient(90deg,var(--primary-light),var(--primary-dark),var(--primary-light));border-radius:0 0 10px 10px;margin-bottom:8px;}button.menu-switch-btn {background:linear-gradient(135deg,#10b981,#3b82f6);color:white;border:none;margin:8px 16px;width:calc(100% - 32px);border-radius:30px;justify-content:center;gap:8px;font-weight:bold;cursor:pointer;text-align:center;padding:0.8rem 1rem;}button.menu-switch-btn i {background:linear-gradient(135deg,#10b981,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.1rem;}body.dark-mode button.menu-switch-btn i {background:linear-gradient(135deg,#6ee7b7,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent;}button.menu-switch-btn:hover {transform:scale(0.98);background:linear-gradient(135deg,#0d9668,#2e6ed1);}.menu-general.hide,.menu-admin.hide {opacity:0;transform:scale(0.95);pointer-events:none;position:absolute;width:100%;}.menu-general.show,.menu-admin.show {opacity:1;transform:scale(1);pointer-events:auto;}.mobile-search-form {position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1200;display:none;align-items:center;justify-content:center;padding:1.5rem;}.mobile-search-form.active {display:flex;}.mobile-search-form form {background:#ffffff;padding:2rem 1.5rem;border-radius:24px;width:100%;max-width:400px;box-shadow:0 20px 40px rgba(0,0,0,0.2);display:flex;flex-direction:column;gap:1rem;}.mobile-search-form input {width:100%;padding:0.9rem 1.2rem;border-radius:50px;border:1px solid #cbd5e1;font-size:1rem;font-family:'CustomFont',sans-serif;outline:none;transition:border-color 0.2s,box-shadow 0.2s;}.mobile-search-form input:focus {border-color:var(--primary-light);box-shadow:0 0 0 3px rgba(16,185,129,0.2);}body.dark-mode .mobile-search-form {background:transparent;}body.dark-mode .mobile-search-form form {background:#1e293b;box-shadow:0 20px 40px rgba(0,0,0,0.5);}body.dark-mode .mobile-search-form input {background:#0f172a;border-color:#475569;color:#f1f5f9;}@media (min-width:769px) {.left-group,.right-group,.mobile-cart,.mobile-dark-toggle,.mobile-search-btn,.mobile-menu-toggle,.mobile-search-form,.admin-mobile-btn,.user-mobile-btn,.mobile-cart-hero,.mobile-menu-wrapper,.mobile-nav {display:none;}.navbar {display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:1rem;padding:0.7rem 2rem;}.logo {order:1;font-size:1.8rem;}.desktop-search-form {order:2;flex-grow:1;max-width:500px;margin:0 2rem;}.nav-links {order:3;display:flex;align-items:center;gap:1.5rem;}.cart-btn {order:4;margin-left:0;}.dark-toggle {order:5;margin-left:0.5rem;}.nav-links a,.nav-links button {color:#1e293b;text-decoration:none;font-weight:500;font-size:0.95rem;transition:all 0.2s;display:inline-flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;padding:0.5rem 0.8rem;border-radius:8px;}.nav-links a:hover,.nav-links button:hover {background:#f1f5f9;color:var(--primary-dark);}.nav-links a i,.nav-links button i {background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1rem;}body.dark-mode .nav-links a,body.dark-mode .nav-links button {color:#e2e8f0;}body.dark-mode .nav-links a:hover,body.dark-mode .nav-links button:hover {background:#334155;}body.dark-mode .nav-links a i,body.dark-mode .nav-links button i {background:linear-gradient(135deg,#6ee7b7,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent;}.cart-btn {background:#f8fafc;border:1px solid var(--primary-light);color:#1d4ed8;padding:0.5rem 1.2rem;border-radius:40px;text-decoration:none;font-weight:bold;display:inline-flex;align-items:center;gap:8px;transition:0.2s;}.cart-btn i {color:#1d4ed8;font-size:1rem;}.cart-btn:hover {background:#ecfdf5;border-color:var(--primary-dark);transform:translateY(-1px);}.badge {background:#ef4444;padding:0.15rem 0.5rem;border-radius:30px;font-size:0.7rem;color:white;}.user-dropdown {position:relative;display:inline-block;}.user-btn {background:#f1f5f9;border:1px solid #e2e8f0;border-radius:40px;padding:0.45rem 1rem;display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-weight:500;color:#1e293b;transition:0.2s;}.user-btn:hover{background:#e2e8f0;}.dropdown-menu {position:absolute;top:calc(100% + 8px);left:0;background:rgba(255,255,255,0.95);backdrop-filter:blur(8px);border-radius:24px;min-width:220px;box-shadow:0 20px 35px -8px rgba(0,0,0,0.15);border:1px solid #e2e8f0;z-index:200;padding:0.4rem 0;opacity:0;visibility:hidden;transform:scale(0.96) translateY(-8px);transition:opacity 0.25s ease,visibility 0.25s,transform 0.25s;transform-origin:top right;}.dropdown-menu.show {opacity:1;visibility:visible;transform:scale(1) translateY(0);}.dropdown-menu a {display:flex;align-items:center;gap:8px;padding:0.55rem 1rem;color:#1e293b;text-decoration:none;font-size:0.85rem;transition:all 0.2s;}.dropdown-menu a:hover {background:#f8fafc;color:var(--primary-dark);padding-right:1.2rem;}.desktop-search-form {position:relative;}.desktop-search-form input {width:100%;padding:0.55rem 1rem 0.55rem 2.5rem;border-radius:50px;border:1px solid #cbd5e1;background:#f8fafc;font-family:'CustomFont',sans-serif;font-size:0.9rem;transition:0.2s;}.desktop-search-form input:focus,.desktop-search-form input:hover {outline:none;border-color:var(--primary-light);box-shadow:0 0 0 2px rgba(16,185,129,0.2);background:white;}.desktop-search-form button {position:absolute;left:12px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1rem;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;}.desktop-search-form button i {background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;color:transparent;}.dark-toggle {background:none;border:none;cursor:pointer;font-size:1.2rem;display:inline-flex;align-items:center;justify-content:center;color:var(--text-primary);width:44px;height:44px;border-radius:50%;}.dark-toggle:hover {background:#f1f5f9;}.dark-toggle i {background:linear-gradient(135deg,var(--primary-light),var(--primary-dark));-webkit-background-clip:text;background-clip:text;color:transparent;}}@media (max-width:768px) {.navbar {position:fixed;top:8px;left:8px;right:8px;width:auto;z-index:1000;display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0.6rem 1.2rem;flex-wrap:nowrap;background:rgba(255,255,255,0.7);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-radius:30px;border:1px solid rgba(255,255,255,0.3);box-shadow:0 8px 20px rgba(0,0,0,0.1);}body{padding-top:80px;}.navbar > .cart-btn,.navbar > .desktop-search-form,.navbar > .nav-links,.navbar > .dark-toggle{display:none;}.navbar .logo{font-size:1.3rem;margin:0;order:2;white-space:nowrap;}.left-group{display:flex;align-items:center;gap:0.5rem;order:1;}.right-group{display:flex;align-items:center;gap:0.4rem;order:3;}.mobile-menu-wrapper{display:inline-block;}body.dark-mode .navbar {background:rgba(30,41,59,0.7);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,0.1);}}