:root{--orange-50:#fff7ed;--orange-100:#ffedd5;--orange-200:#fed7aa;--orange-300:#fdba74;--orange-400:#fb923c;--orange-500:#f97316;--orange-600:#ea580c;--orange-700:#c2410c;--green-50:#f0fdf4;--green-100:#dcfce7;--green-200:#bbf7d0;--green-300:#86efac;--green-400:#4ade80;--green-500:#22c55e;--green-600:#16a34a;--slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;--slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;--slate-600:#475569;--slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;--slate-950:#020617;--bg-primary:#0c0f1a;--bg-secondary:#131729;--bg-card:#ffffff0a;--bg-card-hover:#ffffff14;--glass-bg:#ffffff0f;--glass-border:#ffffff1a;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-gradient:linear-gradient(135deg, var(--orange-500), var(--orange-400));--success-gradient:linear-gradient(135deg, var(--green-500), var(--green-400));--card-gradient:linear-gradient(135deg, #ffffff0d, #ffffff05);--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-glow-orange:0 0 30px #f973164d;--shadow-glow-green:0 0 30px #22c55e4d;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s cubic-bezier(.16, 1, .3, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(60% 50% at 20% 20%,#f9731614,#0000),radial-gradient(50% 40% at 80% 80%,#22c55e0f,#0000);position:fixed;inset:0}#root{z-index:1;min-height:100vh;position:relative}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;outline:none;font-family:inherit}input{outline:none;font-family:inherit}img{max-width:100%;display:block}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--slate-600);border-radius:3px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}.page-container{max-width:1200px;margin:0 auto;padding:100px 24px 40px;animation:.5s fadeInUp}.page-title{background:linear-gradient(135deg, var(--orange-400), var(--orange-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:2rem;font-weight:800}.page-subtitle{color:var(--text-secondary);margin-bottom:32px;font-size:1rem}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--transition-base);padding:24px}.glass-card:hover{background:var(--bg-card-hover);box-shadow:var(--shadow-md);border-color:#ffffff26;transform:translateY(-2px)}.btn{border-radius:var(--radius-full);transition:all var(--transition-base);letter-spacing:.02em;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:.9rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:var(--shadow-glow-orange)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 40px #f9731680}.btn-success{background:var(--success-gradient);color:#fff;box-shadow:var(--shadow-glow-green)}.btn-success:hover{transform:translateY(-2px);box-shadow:0 0 40px #22c55e80}.btn-ghost{color:var(--text-secondary);border:1px solid var(--glass-border);background:0 0}.btn-ghost:hover{background:var(--bg-card-hover);color:var(--text-primary)}.badge{border-radius:var(--radius-full);align-items:center;gap:4px;padding:4px 12px;font-size:.75rem;font-weight:600;display:inline-flex}.badge-orange{color:var(--orange-400);background:#f9731626}.badge-green{color:var(--green-400);background:#22c55e26}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex;position:relative;overflow:hidden}.login-bg-blob{filter:blur(80px);opacity:.5;border-radius:50%;animation:8s ease-in-out infinite float;position:absolute}.blob-1{background:#f9731633;width:350px;height:350px;animation-delay:0s;top:-100px;right:-50px}.blob-2{background:#22c55e26;width:280px;height:280px;animation-delay:2s;bottom:-80px;left:-60px}.blob-3{background:#f973161f;width:200px;height:200px;animation-delay:4s;top:50%;left:50%}.login-card{z-index:2;width:100%;max-width:440px;padding:48px 40px;animation:.6s fadeInUp;position:relative}.login-header{text-align:center;margin-bottom:36px}.login-icon{margin-bottom:8px;font-size:3rem;animation:3s ease-in-out infinite float}.login-title{background:linear-gradient(135deg, var(--orange-400), var(--orange-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:4px;font-size:2.2rem;font-weight:900}.login-subtitle{color:var(--text-secondary);font-size:.95rem;font-weight:400}.login-form{flex-direction:column;gap:20px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:600}.form-group input{border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-primary);transition:all var(--transition-base);background:#ffffff0f;padding:14px 18px;font-size:1rem}.form-group input::placeholder{color:var(--text-muted)}.form-group input:focus{border-color:var(--orange-500);background:#ffffff14;box-shadow:0 0 0 3px #f9731626}.login-error{border-radius:var(--radius-sm);color:#f87171;background:#ef444426;border:1px solid #ef44444d;padding:10px 14px;font-size:.85rem;font-weight:500}.login-btn{width:100%;margin-top:4px;padding:16px;font-size:1rem}.login-demo{border-top:1px solid var(--glass-border);margin-top:28px;padding-top:24px}.login-demo>p{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;font-size:.75rem}.demo-accounts{flex-direction:column;gap:8px;display:flex}.demo-account{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;border:1px solid #ffffff0f;align-items:center;gap:8px;padding:10px 14px;font-size:.8rem;display:flex}.demo-account:hover{color:var(--text-primary);background:#f973161a;border-color:#f973164d}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-6px)}20%,40%,60%,80%{transform:translate(6px)}}.shake{animation:.5s shake}@media (width<=480px){.login-card{padding:32px 24px}}.menu-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.menu-search{min-width:260px;position:relative}.search-icon{font-size:.9rem;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.menu-search input{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-full);width:100%;color:var(--text-primary);transition:all var(--transition-base);padding:12px 16px 12px 44px;font-size:.9rem}.menu-search input::placeholder{color:var(--text-muted)}.menu-search input:focus{border-color:var(--orange-500);box-shadow:0 0 0 3px #f9731626}.category-tabs{scrollbar-width:none;gap:8px;margin-bottom:32px;padding-bottom:4px;display:flex;overflow-x:auto}.category-tabs::-webkit-scrollbar{display:none}.category-tab{border-radius:var(--radius-full);background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary);white-space:nowrap;transition:all var(--transition-base);padding:10px 20px;font-size:.85rem;font-weight:500}.category-tab:hover{background:var(--bg-card-hover);color:var(--text-primary)}.category-tab.active{background:var(--accent-gradient);color:#fff;box-shadow:var(--shadow-glow-orange);border-color:#0000}.menu-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.menu-card{cursor:default;flex-direction:column;animation:.5s both fadeInUp;display:flex;overflow:hidden}.card-emoji{text-align:center;filter:drop-shadow(0 4px 12px #0000004d);padding:24px 0 8px;font-size:3.5rem}.card-body{flex:1;padding:0 24px 16px}.card-category{margin-bottom:8px}.card-title{color:var(--text-primary);margin-bottom:6px;font-size:1.15rem;font-weight:700}.card-description{color:var(--text-secondary);margin-bottom:12px;font-size:.85rem;line-height:1.5}.card-meta{justify-content:space-between;align-items:center;display:flex}.card-calories{color:var(--text-muted);font-size:.8rem}.card-price{background:linear-gradient(135deg, var(--green-400), var(--green-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.3rem;font-weight:800}.card-btn{width:calc(100% - 48px);margin:0 24px 24px}.menu-empty{text-align:center;color:var(--text-muted);padding:80px 24px}.menu-empty span{margin-bottom:16px;font-size:3rem;display:block}@media (width<=600px){.menu-grid{grid-template-columns:1fr}.menu-header{flex-direction:column}.menu-search{min-width:100%}}.back-btn{margin-bottom:24px}.customizer-layout{grid-template-columns:1fr 1.4fr;align-items:start;gap:32px;display:grid}.customizer-preview{text-align:center;padding:40px 28px;position:sticky;top:100px}.preview-emoji{filter:drop-shadow(0 8px 24px #0006);margin-bottom:16px;font-size:5rem;transition:transform .3s}.preview-emoji:hover{transform:scale(1.1)rotate(-5deg)}.added-bounce{animation:.5s pulse}.preview-name{margin-bottom:8px;font-size:1.5rem;font-weight:800}.preview-desc{color:var(--text-secondary);margin-bottom:16px;font-size:.85rem;line-height:1.5}.preview-price{background:linear-gradient(135deg, var(--green-400), var(--green-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:2.2rem;font-weight:900}.preview-selection{text-align:left;border-top:1px solid var(--glass-border);margin-top:16px;padding-top:16px}.preview-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;font-size:.75rem;font-weight:600;display:block}.preview-tags{flex-wrap:wrap;gap:6px;display:flex}.preview-tag{border-radius:var(--radius-full);color:var(--green-400);background:#22c55e1f;padding:4px 10px;font-size:.75rem}.tag-sauce{color:var(--orange-400);background:#f973161f}.step-indicators{gap:8px;margin-bottom:28px;display:flex}.step-indicator{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-muted);transition:all var(--transition-base);flex:1;justify-content:center;align-items:center;gap:8px;padding:12px;font-size:.85rem;font-weight:500;display:flex}.step-indicator.active{border-color:var(--orange-500);color:var(--orange-400);background:#f973161f}.step-indicator.completed{border-color:var(--green-500);color:var(--green-400);background:#22c55e1a}.step-icon{font-size:1.1rem}.builder-step{animation:.35s fadeInUp}.step-title{margin-bottom:6px;font-size:1.3rem;font-weight:700}.step-hint{color:var(--text-secondary);margin-bottom:20px;font-size:.85rem}.options-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:24px;display:grid}.option-chip{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-base);cursor:pointer;text-align:left;align-items:center;gap:8px;padding:14px 16px;font-size:.85rem;font-weight:500;display:flex}.option-chip:hover{background:var(--bg-card-hover);border-color:#fff3}.option-chip.selected{border-color:var(--green-500);color:var(--green-400);background:#22c55e1f;box-shadow:0 0 12px #22c55e26}.sauce-chip.selected{border-color:var(--orange-500);color:var(--orange-400);background:#f973161f;box-shadow:0 0 12px #f9731626}.chip-emoji{flex-shrink:0;font-size:1.2rem}.chip-name{flex:1}.chip-price{opacity:.7;font-size:.7rem}.step-nav{gap:12px;display:flex}.step-nav .btn{flex:1}.step-next{width:100%}.quantity-control{background:var(--glass-bg);border-radius:var(--radius-md);border:1px solid var(--glass-border);align-items:center;gap:16px;margin-bottom:20px;padding:16px;display:flex}.qty-label{flex:1;font-size:.9rem;font-weight:600}.qty-btn{background:var(--bg-card-hover);border:1px solid var(--glass-border);width:36px;height:36px;color:var(--text-primary);transition:all var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;font-size:1.2rem;display:flex}.qty-btn:hover{background:var(--orange-500);border-color:var(--orange-500)}.qty-value{text-align:center;min-width:24px;font-size:1.2rem;font-weight:700}.review-total{background:var(--glass-bg);border-radius:var(--radius-md);border:1px solid var(--glass-border);justify-content:space-between;align-items:center;margin-bottom:16px;padding:20px;font-weight:600;display:flex}.total-amount{background:linear-gradient(135deg, var(--green-400), var(--green-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.8rem;font-weight:900}.add-to-cart-btn{width:100%;padding:16px;font-size:1.05rem}.add-to-cart-btn.added{background:var(--success-gradient);pointer-events:none}.customizer-empty{text-align:center;color:var(--text-muted);padding:80px 24px}.customizer-empty span{margin-bottom:16px;font-size:3rem;display:block}@media (width<=768px){.customizer-layout{grid-template-columns:1fr}.customizer-preview{position:static}}.cart-empty{text-align:center;max-width:400px;margin:0 auto;padding:60px 24px}.empty-icon{opacity:.5;margin-bottom:16px;font-size:3.5rem;display:block}.cart-empty h3{margin-bottom:8px;font-size:1.3rem}.cart-empty p{color:var(--text-secondary);margin-bottom:24px;font-size:.9rem}.cart-content{grid-template-columns:1.5fr 1fr;align-items:start;gap:24px;display:grid}.cart-items{flex-direction:column;gap:12px;display:flex}.cart-item{align-items:flex-start;gap:16px;padding:20px;animation:.4s both fadeInUp;display:flex;position:relative}.cart-item-emoji{filter:drop-shadow(0 4px 8px #0000004d);flex-shrink:0;font-size:2.5rem}.cart-item-details{flex:1;min-width:0}.cart-item-name{margin-bottom:6px;font-size:1.05rem;font-weight:700}.cart-item-extras{color:var(--text-secondary);margin-bottom:4px;font-size:.8rem;line-height:1.4}.extras-label{color:var(--text-muted);font-weight:600}.cart-item-meta{align-items:center;gap:16px;margin-top:8px;display:flex}.cart-item-qty{color:var(--text-muted);background:var(--glass-bg);border-radius:var(--radius-full);padding:3px 10px;font-size:.8rem}.cart-item-price{color:var(--green-400);font-size:1.1rem;font-weight:800}.remove-btn{color:#f87171;width:28px;height:28px;transition:all var(--transition-fast);background:#ef44441a;border:1px solid #ef444433;border-radius:50%;justify-content:center;align-items:center;font-size:.75rem;display:flex;position:absolute;top:12px;right:12px}.remove-btn:hover{background:#ef444440;transform:scale(1.1)}.cart-summary{padding:28px;position:sticky;top:100px}.summary-title{margin-bottom:20px;font-size:1.1rem;font-weight:700}.summary-rows{flex-direction:column;gap:10px;display:flex}.summary-row{color:var(--text-secondary);justify-content:space-between;font-size:.85rem;display:flex}.summary-divider{background:var(--glass-border);height:1px;margin:16px 0}.summary-total{color:var(--text-primary);font-size:1rem;font-weight:700}.grand-total{background:linear-gradient(135deg, var(--green-400), var(--green-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.4rem;font-weight:900}.place-order-btn{width:100%;margin-top:20px;padding:16px;font-size:1rem}.clear-cart-btn{width:100%;margin-top:8px}@media (width<=768px){.cart-content{grid-template-columns:1fr}.cart-summary{position:static}}.orders-empty{text-align:center;max-width:400px;margin:0 auto;padding:60px 24px}.orders-empty h3{margin-bottom:8px;font-size:1.3rem}.orders-empty p{color:var(--text-secondary);margin-bottom:24px;font-size:.9rem}.orders-list{flex-direction:column;gap:16px;max-width:700px;display:flex}.order-card{padding:24px;animation:.4s both fadeInUp}.order-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px;display:flex}.order-id{color:var(--orange-400);margin-right:12px;font-size:.8rem;font-weight:700}.order-date{color:var(--text-muted);font-size:.8rem}.order-status{border-radius:var(--radius-full);padding:6px 14px;font-size:.8rem;font-weight:600}.status-preparing{color:var(--orange-400);background:#f9731626}.status-ready{color:var(--green-400);background:#22c55e26;animation:2s infinite pulse}.status-done{color:var(--slate-400);background:#94a3b826}.order-items{flex-direction:column;gap:10px;margin-bottom:16px;display:flex}.order-item{border-radius:var(--radius-sm);background:#ffffff08;align-items:center;gap:12px;padding:10px 14px;display:flex}.order-item-emoji{flex-shrink:0;font-size:1.5rem}.order-item-info{flex:1;min-width:0}.order-item-name{font-size:.9rem;font-weight:600;display:block}.order-item-extras{color:var(--text-muted);margin-top:2px;font-size:.75rem;display:block}.order-item-price{color:var(--green-400);font-size:.9rem;font-weight:700}.order-footer{border-top:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding-top:16px;display:flex}.order-total-label{color:var(--text-secondary);font-size:.85rem;font-weight:600}.order-total-value{background:linear-gradient(135deg, var(--green-400), var(--green-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.3rem;font-weight:900}.navbar{z-index:1000;-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--glass-border);background:#0c0f1ad9;position:fixed;top:0;left:0;right:0}.navbar-inner{align-items:center;gap:24px;max-width:1200px;height:64px;margin:0 auto;padding:0 24px;display:flex}.navbar-brand{flex-shrink:0;align-items:center;gap:8px;text-decoration:none;display:flex}.brand-icon{font-size:1.5rem;animation:3s ease-in-out infinite float}.brand-text{background:linear-gradient(135deg, var(--orange-400), var(--orange-300));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.4rem;font-weight:800}.navbar-user{align-items:center;gap:8px;margin-left:auto;display:flex}.user-avatar{font-size:1.3rem}.user-name{color:var(--text-primary);font-size:.85rem;font-weight:600}.user-grade{font-size:.7rem}.navbar-links{align-items:center;gap:4px;display:flex}.nav-link{border-radius:var(--radius-full);color:var(--text-secondary);transition:all var(--transition-base);background:0 0;align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:500;text-decoration:none;display:flex;position:relative}.nav-link:hover{color:var(--text-primary);background:var(--bg-card-hover)}.nav-link.active{color:var(--orange-400);background:#f973161a}.cart-link{position:relative}.cart-badge{background:var(--orange-500);color:#fff;border-radius:50%;justify-content:center;align-items:center;min-width:18px;height:18px;font-size:.65rem;font-weight:700;animation:1.5s infinite pulse;display:flex;position:absolute;top:2px;right:4px}.logout-btn{cursor:pointer;border:none;font-family:inherit}@media (width<=768px){.navbar-user .user-name,.navbar-user .user-grade,.nav-link span:last-child{display:none}.nav-link{padding:8px 10px}.navbar-inner{gap:8px;padding:0 12px}}