:root{--chocolate-900:#1a0e0a;--chocolate-800:#2c1810;--chocolate-700:#3e2218;--chocolate-600:#5c3826;--chocolate-500:#7a4e34;--chocolate-400:#a06b4a;--chocolate-300:#c49474;--chocolate-200:#deb89a;--chocolate-100:#f2dbc8;--chocolate-50:#fbf0e6;--gold-500:#d4a844;--gold-400:#e2be5a;--gold-300:#f0d478;--gold-200:#f5e4a8;--gold-100:#fdf6e0;--crimson-700:#8b1a2b;--crimson-600:#a52035;--crimson-500:#c41e3a;--crimson-400:#dc3a52;--crimson-300:#e86b7d;--cream:#fff9f2;--cream-warm:#fff5eb;--primary:var(--crimson-500);--primary-dark:var(--crimson-700);--primary-light:var(--crimson-300);--accent:var(--gold-500);--accent-light:var(--gold-200);--accent-glow:var(--gold-300);--bg:var(--cream);--bg-warm:var(--cream-warm);--surface:#fff;--surface-elevated:#ffffffeb;--border:#5a321e1a;--border-strong:#5a321e33;--text:var(--chocolate-800);--text-secondary:var(--chocolate-500);--text-muted:var(--chocolate-400);--text-on-dark:#fff9f2;--danger:#c62828;--success:#2e7d32;--info:#1565c0;--warning:#e65100;--shadow-sm:0 1px 3px #1a0e0a0f, 0 1px 2px #1a0e0a0a;--shadow-md:0 4px 12px #1a0e0a14, 0 2px 4px #1a0e0a0a;--shadow-lg:0 12px 32px #1a0e0a1f, 0 4px 8px #1a0e0a0f;--shadow-xl:0 20px 48px #1a0e0a29, 0 8px 16px #1a0e0a14;--shadow-gold:0 4px 16px #d4a84440;--shadow-crimson:0 4px 16px #c41e3a33;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-full:100px;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--transition-fast:.15s var(--ease-out);--transition-normal:.25s var(--ease-out);--transition-slow:.4s var(--ease-out);--font-display:"Playfair Display", Georgia, "Times New Roman", serif;--font-body:"Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--safe-bottom:env(safe-area-inset-bottom,0px)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100dvh;font-size:15px;line-height:1.6;overflow-x:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.app-container{background:var(--bg);flex-direction:column;max-width:520px;min-height:100dvh;margin:0 auto;display:flex;position:relative}@media (width>=640px){body{background:linear-gradient(145deg, var(--chocolate-900) 0%, var(--chocolate-800) 50%, var(--chocolate-700) 100%)}.app-container{max-width:520px;min-height:100vh;box-shadow:var(--shadow-xl);border-left:1px solid #ffffff0d;border-right:1px solid #ffffff0d}}.topbar{background:linear-gradient(135deg, var(--chocolate-800) 0%, var(--chocolate-700) 100%);color:var(--text-on-dark);z-index:50;border-bottom:2px solid var(--gold-500);justify-content:space-between;align-items:center;min-height:60px;padding:0 16px;display:flex;position:sticky;top:0;box-shadow:0 2px 12px #0003}.topbar .topbar-brand{align-items:center;gap:10px;display:flex}.topbar .topbar-logo{object-fit:contain;filter:drop-shadow(0 2px 4px #0000004d);border-radius:8px;width:36px;height:36px}.topbar h1{font-family:var(--font-display);letter-spacing:.01em;margin:0;font-size:17px;font-weight:700}.topbar h1 span{font-family:var(--font-body);opacity:.7;letter-spacing:.02em;margin-top:1px;font-size:11px;font-weight:400;display:block}.topbar button{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text-on-dark);border-radius:var(--radius-full);width:auto;transition:all var(--transition-fast);letter-spacing:.02em;text-transform:uppercase;background:#ffffff14;border:1px solid #ffffff26;padding:7px 14px;font-size:12px;font-weight:600}.topbar button:hover{background:#ffffff26;border-color:#ffffff4d}.topbar button:active{transform:scale(.96)}.content{flex:1;padding:16px 16px 24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow var(--transition-normal), transform var(--transition-normal);margin-bottom:14px;padding:20px;position:relative;overflow:hidden}.card:before{content:"";background:linear-gradient(90deg, var(--crimson-500), var(--gold-500), var(--crimson-500));opacity:0;height:3px;transition:opacity var(--transition-normal);position:absolute;top:0;left:0;right:0}.card:hover{box-shadow:var(--shadow-md)}.card:hover:before{opacity:1}.card h2{font-family:var(--font-display);color:var(--chocolate-800);align-items:center;gap:8px;margin:0 0 6px;font-size:17px;font-weight:700;display:flex}.card h2 .card-icon{font-size:20px}.card.card-success{background:linear-gradient(135deg,#f0fdf4 0%,#dcfce7 100%);border-color:#2e7d3226}.card.card-success h2{color:var(--success)}label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;margin-top:14px;margin-bottom:5px;font-size:12px;font-weight:600;display:block}input,select,textarea{border:1.5px solid var(--border-strong);border-radius:var(--radius-md);width:100%;font-size:15px;font-family:var(--font-body);background:var(--surface);color:var(--text);transition:all var(--transition-fast);appearance:none;padding:11px 14px}input:focus,select:focus,textarea:focus{border-color:var(--gold-500);box-shadow:0 0 0 3px var(--gold-100), var(--shadow-sm);outline:none}input::placeholder,textarea::placeholder{color:var(--chocolate-300)}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7a72' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 10px center;background-repeat:no-repeat;background-size:20px;padding-right:36px}textarea{resize:vertical;min-height:80px;line-height:1.5}button{cursor:pointer;border-radius:var(--radius-md);font-size:14.5px;font-weight:700;font-family:var(--font-body);width:100%;transition:all var(--transition-fast);letter-spacing:.02em;background:linear-gradient(135deg, var(--crimson-600) 0%, var(--crimson-500) 50%, var(--crimson-400) 100%);color:#fff;box-shadow:var(--shadow-crimson), inset 0 1px 0 #ffffff26;border:none;padding:13px 20px;position:relative;overflow:hidden}button:after{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff1f 0%,#0000 50%);position:absolute;inset:0}button:hover{transform:translateY(-1px);box-shadow:0 6px 20px #c41e3a4d,inset 0 1px #ffffff26}button:active{box-shadow:var(--shadow-sm);transform:translateY(0)scale(.98)}button.secondary{background:var(--surface);color:var(--crimson-500);border:1.5px solid var(--crimson-500);box-shadow:none}button.secondary:after{display:none}button.secondary:hover{box-shadow:var(--shadow-sm);background:#c41e3a0a;transform:translateY(-1px)}button.gold{background:linear-gradient(135deg, var(--gold-500) 0%, var(--gold-400) 50%, var(--gold-300) 100%);color:var(--chocolate-800);box-shadow:var(--shadow-gold), inset 0 1px 0 #ffffff4d}button.gold:hover{box-shadow:0 6px 20px #d4a84459,inset 0 1px #ffffff4d}button.danger{background:linear-gradient(135deg,#c62828 0%,#e53935 100%);box-shadow:0 4px 12px #c6282833}button.small{width:auto;padding:8px 16px;font-size:13px}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important;transform:none!important}.badge{border-radius:var(--radius-full);letter-spacing:.02em;text-transform:uppercase;align-items:center;gap:5px;padding:4px 12px;font-size:11.5px;font-weight:700;display:inline-flex}.badge.green{color:#2e7d32;background:linear-gradient(135deg,#e8f5e9,#c8e6c9)}.badge.yellow{color:#e65100;background:linear-gradient(135deg,#fff8e1,#ffecb3)}.badge.red{color:#c62828;background:linear-gradient(135deg,#ffebee,#ffcdd2)}.badge.blue{color:#1565c0;background:linear-gradient(135deg,#e3f2fd,#bbdefb)}.error-text{color:var(--danger);align-items:flex-start;gap:6px;margin-top:8px;font-size:13px;font-weight:500;display:flex}.error-text:before{content:"⚠";flex-shrink:0}.muted{color:var(--text-muted);font-size:13px}.login-page{background:linear-gradient(170deg, var(--chocolate-900) 0%, var(--chocolate-800) 40%, var(--chocolate-700) 70%, var(--chocolate-600) 100%);flex-direction:column;min-height:100dvh;display:flex;position:relative;overflow:hidden}.login-page:before{content:"";pointer-events:none;background:radial-gradient(at 20% 0,#d4a84414 0%,#0000 60%),radial-gradient(at 80% 100%,#c41e3a0f 0%,#0000 60%);height:100%;position:absolute;top:0;left:0;right:0}.login-hero{text-align:center;z-index:1;padding:40px 28px 32px;position:relative}.login-hero .brand-logo{object-fit:contain;filter:drop-shadow(0 4px 12px #0000004d);border-radius:16px;width:80px;height:80px;margin:0 auto 16px;animation:4s ease-in-out infinite logoFloat}@keyframes logoFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.login-hero .brand-mark{font-family:var(--font-display);color:var(--gold-400);letter-spacing:.02em;text-shadow:0 2px 8px #d4a8444d;margin-bottom:4px;font-size:24px;font-weight:800}.login-hero .brand-tagline{font-family:var(--font-display);color:var(--gold-200);opacity:.8;margin-bottom:16px;font-size:13px;font-style:italic}.login-hero h1{font-family:var(--font-display);color:#fff;margin:0 0 8px;font-size:22px;font-weight:700}.login-hero p{color:var(--chocolate-200);max-width:320px;margin:0 auto;font-size:13.5px;line-height:1.5}.login-hero-features{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:24px;display:flex}.login-hero-features div{color:var(--chocolate-100);text-align:center;border-radius:var(--radius-md);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);max-width:88px;transition:all var(--transition-normal);background:#ffffff0d;border:1px solid #ffffff0f;padding:12px 8px;font-size:11px}.login-hero-features div:hover{background:#ffffff1a;transform:translateY(-2px)}.login-hero-features .icon{margin-bottom:6px;font-size:24px;display:block}.login-body{z-index:1;flex:1;justify-content:center;align-items:flex-start;padding:24px 20px;display:flex;position:relative}.login-box{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius-xl);background:#ffffff0f;border:1px solid #ffffff1a;width:100%;max-width:360px;padding:28px 24px;box-shadow:0 8px 32px #0000004d}.login-box label{color:var(--chocolate-200)}.login-box input{color:#fff;background:#ffffff14;border:1.5px solid #ffffff1f}.login-box input:focus{border-color:var(--gold-500);background:#ffffff1f;box-shadow:0 0 0 3px #d4a84426}.login-box input::placeholder{color:#ffffff4d}.login-box button{background:linear-gradient(135deg, var(--gold-500) 0%, var(--gold-400) 100%);color:var(--chocolate-800);box-shadow:var(--shadow-gold);text-transform:uppercase;letter-spacing:.06em;margin-top:20px;padding:14px;font-size:15px;font-weight:800}.login-box button:hover{box-shadow:0 8px 28px #d4a84466}.login-about-strip{text-align:center;color:var(--chocolate-300);z-index:1;padding:0 24px 16px;font-size:11.5px;position:relative}.login-about-strip a{color:var(--gold-400);transition:color var(--transition-fast);font-weight:600}.login-about-strip a:hover{color:var(--gold-300)}.nav-bottom{background:var(--surface);z-index:40;padding-bottom:var(--safe-bottom);border-top:1px solid var(--border);display:flex;position:sticky;bottom:0;box-shadow:0 -4px 16px #0000000f}.nav-bottom a{text-align:center;color:var(--text-muted);min-height:58px;transition:all var(--transition-fast);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;padding:8px 2px;font-size:10px;font-weight:500;text-decoration:none;display:flex;position:relative}.nav-bottom a .nav-icon{transition:transform var(--transition-fast);font-size:22px;line-height:1}.nav-bottom a:active .nav-icon{transform:scale(.9)}.nav-bottom a.active{color:var(--crimson-500);font-weight:700}.nav-bottom a.active:before{content:"";background:linear-gradient(90deg, var(--crimson-500), var(--gold-500));border-radius:0 0 4px 4px;width:32px;height:3px;position:absolute;top:0;left:50%;transform:translate(-50%)}.nav-bottom a.active .nav-icon{transform:scale(1.1)}.feedback-banner{background:linear-gradient(135deg, var(--gold-500) 0%, var(--gold-400) 100%);color:var(--chocolate-800);align-items:center;gap:10px;padding:12px 16px;font-size:13px;font-weight:600;text-decoration:none;animation:3s ease-in-out infinite bannerPulse;display:flex;box-shadow:inset 0 -1px #00000014}.feedback-banner-icon{flex-shrink:0;font-size:22px;animation:2s ease-in-out infinite bannerBounce}@keyframes bannerPulse{0%,to{opacity:1}50%{opacity:.92}}@keyframes bannerBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.feedback-title-card{box-shadow:var(--shadow-crimson);background:linear-gradient(135deg, var(--crimson-600) 0%, var(--crimson-500) 100%)!important;color:#fff!important;border:none!important}.feedback-title-card:before{display:none!important}.feedback-title-card h2{color:#fff!important}.feedback-title-card p{margin:0;color:#fffc!important}.feedback-option{color:var(--text);text-transform:none;border-radius:var(--radius-sm);transition:background var(--transition-fast);cursor:pointer;align-items:center;gap:10px;margin-top:8px;padding:8px 12px;font-size:14px;font-weight:400;display:flex}.feedback-option:hover{background:var(--cream-warm)}.feedback-option input{width:auto;accent-color:var(--crimson-500)}.feedback-nudge{background:linear-gradient(135deg, var(--gold-100), var(--gold-200));color:var(--chocolate-600);border-radius:var(--radius-md);border:1px solid #d4a84433;margin:14px 0;padding:12px 16px;font-size:13px;font-weight:600}.product-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 0;display:flex}.qty-input{width:70px}.order-line{border-radius:var(--radius-sm);transition:background var(--transition-fast);justify-content:space-between;align-items:center;margin:4px -4px;padding:10px 12px;font-size:13.5px;display:flex}.order-line:hover{background:var(--cream-warm)}.photo-capture-zone{border-radius:var(--radius-md);margin-top:6px;position:relative;overflow:hidden}.photo-capture-zone .captured{border-radius:var(--radius-md);width:100%;box-shadow:var(--shadow-md);margin-bottom:8px}.photo-capture-zone input[type=file]{border:2px dashed var(--border-strong);border-radius:var(--radius-md);background:var(--cream-warm);cursor:pointer;transition:all var(--transition-fast);color:var(--text-muted);padding:0;font-size:13px}.photo-capture-zone input[type=file]:hover{border-color:var(--gold-500);background:var(--gold-100)}video,img.captured{border-radius:var(--radius-md);width:100%;box-shadow:var(--shadow-md);margin-bottom:8px}table{border-collapse:collapse;width:100%;min-width:480px;font-size:13px}th{text-align:left;border-bottom:2px solid var(--border-strong);color:var(--chocolate-600);text-transform:uppercase;letter-spacing:.04em;padding:10px 8px;font-size:11px;font-weight:700}td{text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 8px}.app-footer{text-align:center;color:var(--text-muted);border-top:1px solid var(--border);background:var(--surface);padding:14px 16px;font-size:11.5px}.app-footer a{color:var(--crimson-500);transition:color var(--transition-fast);font-weight:600;text-decoration:none}.app-footer a:hover{color:var(--crimson-400);text-decoration:underline}.login-page .app-footer{color:var(--chocolate-400);z-index:1;background:0 0;border-top:1px solid #ffffff0f;position:relative}.login-page .app-footer a{color:var(--gold-400)}.section-divider{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;align-items:center;gap:12px;margin:20px 0 14px;font-size:12px;font-weight:700;display:flex}.section-divider:after{content:"";background:linear-gradient(90deg, var(--border-strong), transparent);flex:1;height:1px}.empty-state{text-align:center;color:var(--text-muted);padding:32px 20px}.empty-state .empty-icon{opacity:.6;margin-bottom:12px;font-size:48px}.empty-state p{font-size:14px;line-height:1.5}.loading-text{color:var(--text-muted);align-items:center;gap:8px;padding:24px 0;font-size:14px;display:inline-flex}.loading-text:before{content:"";border:2px solid var(--border-strong);border-top-color:var(--crimson-500);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.card{animation:fadeInUp .35s var(--ease-out) both}.card:first-child{animation-delay:0s}.card:nth-child(2){animation-delay:60ms}.card:nth-child(3){animation-delay:.12s}.card:nth-child(4){animation-delay:.18s}.card:nth-child(5){animation-delay:.24s}@media (width<=360px){.content{padding:12px}.card{padding:16px}.login-hero{padding:28px 20px 24px}.login-hero .brand-mark{font-size:20px}.login-hero h1{font-size:18px}.nav-bottom a{min-height:52px;font-size:9px}.nav-bottom a .nav-icon{font-size:19px}}@media (width>=768px){.content{padding:20px}.card{border-radius:var(--radius-xl);padding:24px}.login-hero{padding:48px 32px 40px}.login-hero .brand-mark{font-size:28px}.login-hero h1{font-size:26px}.login-hero p{font-size:14.5px}.login-box{padding:32px 28px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:focus-visible{outline:2px solid var(--gold-500);outline-offset:2px}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--chocolate-300);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--chocolate-400)}