:root{--primary:#2563EB;--primary-dark:#1D4ED8;--primary-light:#DBEAFE;--bg:#F8FAFC;--surface:#fff;--border:#E2E8F0;--text:#0F172A;--secondary:#475569;--muted:#94A3B8;--success:#16A34A;--warning:#F59E0B;--danger:#DC2626;--pending:#64748B;}
*{box-sizing:border-box}body{margin:0;background:#e5e7eb;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--text)}
.app-shell{max-width:480px;min-height:100vh;margin:auto;background:var(--bg);position:relative;padding-bottom:82px;box-shadow:0 0 40px rgba(15,23,42,.14)}
.page{display:none;padding:18px 16px 24px}.page.active{display:block}.center{min-height:calc(100vh - 82px);display:none;align-items:center}.center.active{display:flex}
h1{font-size:24px;line-height:1.15;margin:4px 0;font-weight:700}h2{font-size:18px;margin:0 0 12px}.eyebrow{font-size:12px;color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:0}.muted{color:var(--secondary);margin:4px 0 0}.page-header,.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.topbar{justify-content:flex-start}.topbar button,.icon-btn{border:1px solid var(--border);background:var(--surface);border-radius:14px;width:44px;height:44px;font-size:18px}.search-box{height:52px;border:1px solid var(--border);border-radius:16px;background:#fff;display:flex;align-items:center;gap:8px;padding:0 14px;box-shadow:0 4px 12px rgba(15,23,42,.06)}.search-box input{border:0;outline:0;width:100%;font-size:15px;background:transparent}.section{margin-top:22px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips button{height:34px;border:0;border-radius:999px;background:#EFF6FF;color:#1D4ED8;padding:0 14px;font-weight:700}.chips.small{margin:12px 0 16px}.list.compact{display:grid;gap:10px}.list button{height:44px;text-align:left;border:1px solid var(--border);background:#fff;border-radius:14px;padding:0 14px;color:var(--text)}.cards{display:grid;gap:12px}.item-card,.request-card,.form-card,.success-card,.mini-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:16px;box-shadow:0 4px 12px rgba(15,23,42,.06)}.item-card{display:grid;grid-template-columns:82px 1fr;gap:14px;align-items:center}.thumb{width:82px;height:82px;border-radius:14px;background:linear-gradient(135deg,#DBEAFE,#F1F5F9);display:flex;align-items:center;justify-content:center;font-size:32px}.item-card h3{margin:0 0 4px;font-size:16px}.item-card p{margin:3px 0;color:var(--secondary);font-size:14px}.stock{font-weight:700;color:var(--success)}.low{color:var(--warning)}.out{color:var(--danger)}button{cursor:pointer}.primary,.secondary,.danger{width:100%;height:48px;border-radius:14px;font-size:15px;font-weight:700;margin-top:12px}.primary{background:var(--primary);border:0;color:#fff}.primary:active{background:var(--primary-dark)}.secondary{background:#fff;border:1px solid #CBD5E1;color:var(--text)}.danger{background:var(--danger);border:0;color:#fff}.detail-image{height:210px;border-radius:16px;background:linear-gradient(135deg,#DBEAFE,#F8FAFC);display:flex;align-items:center;justify-content:center;font-size:72px;margin-bottom:16px}.meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.meta{background:#F8FAFC;border:1px solid var(--border);border-radius:14px;padding:12px}.meta span{display:block;color:var(--secondary);font-size:12px}.meta strong{font-size:16px}.qty-row{display:flex;align-items:center;justify-content:center;gap:18px;margin:18px 0}.qty-row button{width:44px;height:44px;border-radius:14px;border:1px solid var(--border);background:#fff;font-size:18px}.cart-line{display:flex;justify-content:space-between;gap:8px;align-items:center}.cart-controls{display:flex;align-items:center;gap:8px}.cart-controls button{width:36px;height:36px;border:1px solid var(--border);background:#fff;border-radius:12px}.form-card{display:grid;gap:14px}label{display:grid;gap:6px;font-weight:700;font-size:14px}input,select,textarea{width:100%;border:1px solid #CBD5E1;border-radius:14px;padding:12px 14px;font-size:15px;background:#fff}textarea{min-height:96px;resize:vertical}.summary,.timeline{background:#F8FAFC;border:1px solid var(--border);border-radius:14px;padding:14px;color:var(--secondary)}.success-card{text-align:center;width:100%}.success-icon{font-size:48px}.badge{display:inline-flex;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700;margin:6px 0}.badge.pending{background:#F1F5F9;color:var(--pending)}.badge.success{background:#DCFCE7;color:var(--success)}.badge.info{background:#DBEAFE;color:var(--primary)}.tabs{display:flex;gap:8px;margin-bottom:14px}.tabs button{flex:1;height:38px;border-radius:999px;border:1px solid var(--border);background:#fff}.tabs .active{background:var(--primary);color:#fff;border-color:var(--primary)}.check{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:10px;background:#F8FAFC;padding:12px;border-radius:14px}.check input{width:auto}.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);max-width:480px;width:100%;height:70px;background:#fff;border-top:1px solid var(--border);display:grid;grid-template-columns:repeat(5,1fr)}.bottom-nav button{border:0;background:#fff;font-size:20px;color:var(--secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-nav span{font-size:11px}.empty{text-align:center;color:var(--secondary);padding:28px 10px;background:#fff;border:1px dashed var(--border);border-radius:16px}