:root{--primary: #1a5f3f;--primary-dark: #0f3d28;--accent: #d97706;--bg: #f4f6f5;--surface: #ffffff;--border: #dde3e0;--text: #1f2a24;--text-muted: #6b7a72;--danger: #c62828}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}img{max-width:100%}.app-container{max-width:480px;margin:0 auto;min-height:100vh;background:var(--bg);display:flex;flex-direction:column}@media (min-width: 640px){body{background:var(--primary-dark)}.app-container{max-width:560px;min-height:100vh;box-shadow:0 0 0 1px #0000000d,0 20px 60px #00000040}}table{width:100%;min-width:480px;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--border);white-space:nowrap}.topbar{background:var(--primary-dark);color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:5}.topbar h1{font-size:16px;margin:0}.topbar button{background:none;border:1px solid rgba(255,255,255,.4);color:#fff;padding:5px 10px;border-radius:5px;font-size:12px}.content{padding:16px;flex:1}.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:14px;overflow-x:auto}.card h2{margin-top:0;font-size:15px}label{display:block;font-size:12.5px;color:var(--text-muted);margin-bottom:4px;margin-top:10px}input,select,textarea{width:100%;padding:10px;border:1px solid var(--border);border-radius:7px;font-size:15px;background:#fff;color:var(--text)}button{cursor:pointer;border:none;border-radius:8px;padding:12px 16px;font-size:14.5px;font-weight:600;background:var(--primary);color:#fff;width:100%}button.secondary{background:#fff;color:var(--primary);border:1px solid var(--primary)}button.danger{background:var(--danger)}button.small{width:auto;padding:8px 12px;font-size:13px}button:disabled{opacity:.5}.badge{display:inline-block;padding:3px 9px;border-radius:100px;font-size:11.5px;font-weight:700}.badge.green{background:#e3f2e6;color:#2e7d32}.badge.yellow{background:#fef3d6;color:#d97706}.badge.red{background:#fbe4e4;color:#c62828}.badge.blue{background:#e1eefb;color:#1565c0}.error-text{color:var(--danger);font-size:13px;margin-top:8px}.muted{color:var(--text-muted);font-size:12.5px}.login-page{display:flex;flex-direction:column;min-height:100vh}.login-hero{background:linear-gradient(155deg,var(--primary-dark) 0%,#123d2c 60%,#0a2a1c 100%);color:#fff;padding:32px 24px 28px;text-align:center}.login-hero .brand-mark{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#9fd6b6;font-weight:700;margin-bottom:10px}.login-hero h1{font-size:22px;margin:0 0 8px}.login-hero p{font-size:13px;color:#cfe6da;margin:0;line-height:1.5}.login-hero-features{display:flex;justify-content:center;gap:18px;margin-top:18px;flex-wrap:wrap}.login-hero-features div{font-size:11px;color:#e3f1e9;text-align:center;max-width:90px}.login-hero-features .icon{font-size:20px;display:block;margin-bottom:4px}.login-body{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:24px 16px}.login-box{width:100%;max-width:340px;padding:0}.login-about-strip{text-align:center;font-size:11.5px;color:var(--text-muted);padding:0 24px 20px}.login-about-strip a{color:var(--primary);font-weight:600}.nav-bottom{display:flex;border-top:1px solid var(--border);background:#fff;position:sticky;bottom:0}.nav-bottom a{flex:1;text-align:center;padding:10px 0;text-decoration:none;color:var(--text-muted);font-size:11.5px}.nav-bottom a.active{color:var(--primary);font-weight:700}.product-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}.qty-input{width:70px}.order-line{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px}video,img.captured{width:100%;border-radius:8px;margin-bottom:8px}.app-footer{text-align:center;padding:12px 16px;font-size:11.5px;color:var(--text-muted);border-top:1px solid var(--border);background:var(--surface)}.app-footer a{color:var(--primary);font-weight:600;text-decoration:none}.app-footer a:hover{text-decoration:underline}