:root{--color-primary:#1976d2;--color-primary-dark:#1565c0;--color-background:#f5f5f5;--color-surface:#fff;--color-border:#e0e0e0;--color-text-primary:#111827;--color-text-secondary:#6b7280;--color-text-label:#000;--color-status-reserved:#f59e0b;--color-status-ready:#16a34a;--color-status-collected:#6b7280;--color-status-expired:#dc2626;--color-status-dropbox:#1976d2;--radius-card:8px;--radius-button:6px}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--color-background);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;overscroll-behavior-y:contain;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}input,textarea,button{font-family:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}.app-shell{background:var(--color-background);flex-direction:column;max-width:480px;height:100%;margin:0 auto;display:flex;position:relative;box-shadow:0 0 24px #0000000f}.top-header{background:var(--color-primary);color:#fff;text-align:center;flex-shrink:0;justify-content:center;align-items:center;padding:14px 16px;font-size:16px;font-weight:700;display:flex;position:relative}.top-header .back-btn{color:#fff;background:0 0;border:none;padding:4px;font-size:20px;font-weight:700;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.top-header .header-right{position:absolute;top:50%;right:12px;transform:translateY(-50%)}.app-content{-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.tab-bar{border-top:1px solid var(--color-border);background:#fff;flex-shrink:0;height:60px;padding-bottom:6px;display:flex}.tab-item{color:var(--color-text-secondary);background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;padding-top:6px;font-size:11px;display:flex}.tab-item.active{color:var(--color-primary)}.tab-icon{font-size:20px}.card{border-radius:var(--radius-card);border:1px solid var(--color-border);background:#fff;margin-bottom:12px;padding:16px;box-shadow:0 1px 3px #0000000f}.row{margin-bottom:6px}.row-label{color:var(--color-text-label);font-size:13px;font-weight:700}.row-value{color:var(--color-text-primary);font-size:15px}.search-wrapper{border-bottom:1px solid var(--color-border);background:#fff;padding:12px}.search-input{border:1px solid var(--color-border);width:100%;color:var(--color-text-primary);background:#fff;border-radius:6px;padding:8px 12px;font-size:15px}.search-input::placeholder{color:#9ca3af}.list-padding{padding:12px}.empty-card{border:1px solid var(--color-border);text-align:center;background:#fff;border-radius:6px;padding:24px}.empty-text{color:var(--color-text-secondary);font-size:15px}.centered{flex:1;justify-content:center;align-items:center;padding:32px;display:flex}.btn-primary{background:var(--color-primary);color:#fff;border-radius:var(--radius-button);letter-spacing:.5px;text-align:center;border:none;width:100%;padding:14px;font-size:14px;font-weight:700}.btn-primary:disabled{background:var(--color-border);cursor:default}.btn-grey{color:#fff;border-radius:var(--radius-button);background:#9ca3af;border:none;padding:14px;font-size:14px;font-weight:700}.btn-row{gap:10px;display:flex}.btn-row>*{flex:1}.spinner{border:3px solid #1976d233;border-top-color:var(--color-primary);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}.spinner.white{border:3px solid #ffffff59;border-top-color:#fff}@keyframes spin{to{transform:rotate(360deg)}}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-box{background:#fff;border-radius:12px;flex-direction:column;gap:16px;width:100%;max-width:340px;padding:24px;display:flex}.modal-title{text-align:center;letter-spacing:.5px;font-size:15px;font-weight:700}.avatar-circle{color:#fff;background:#ffffff40;border:none;border-radius:17px;justify-content:center;align-items:center;width:34px;height:34px;font-size:13px;font-weight:700;display:flex}.avatar-large{background:var(--color-primary);color:#fff;border-radius:32px;justify-content:center;align-items:center;width:64px;height:64px;margin-bottom:8px;font-size:24px;font-weight:700;display:flex}.user-item{text-align:center;cursor:pointer;background:#eee;border-radius:8px;margin:4px 8px;padding:12px}.user-item.selected{background:var(--color-primary);color:#fff}.user-name{font-size:14px;font-weight:700}.user-email{color:var(--color-text-secondary);font-size:13px}.user-item.selected .user-email{color:#fff}.login-screen{background:var(--color-background);flex:1;justify-content:center;align-items:center;padding:24px;display:flex}.login-card{background:#fff;border-radius:12px;flex-direction:column;align-items:center;width:100%;max-width:400px;padding:32px;display:flex;box-shadow:0 2px 8px #00000014}.login-logo{margin-bottom:8px;font-size:56px}.login-app-name{color:var(--color-primary);letter-spacing:1px;font-size:26px;font-weight:700}.login-app-sub{color:var(--color-text-secondary);margin-top:4px;margin-bottom:32px;font-size:13px}.login-form{flex-direction:column;gap:12px;width:100%;display:flex}.login-input{border:1px solid var(--color-border);color:var(--color-text-primary);background:#fafafa;border-radius:8px;width:100%;padding:12px 14px;font-size:15px}.login-input::placeholder{color:#9ca3af}.login-error{color:var(--color-status-expired);text-align:center;font-size:13px}.login-button{background:var(--color-primary);color:#fff;letter-spacing:.5px;border:none;border-radius:8px;justify-content:center;align-items:center;margin-top:4px;padding:14px;font-size:15px;font-weight:700;display:flex}.login-button:disabled{opacity:.6}.switch{flex-shrink:0;width:44px;height:26px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.switch-slider{cursor:pointer;background:#e0e0e0;border-radius:26px;transition:all .2s;position:absolute;inset:0}.switch-slider:before{content:"";background:#fff;border-radius:50%;width:20px;height:20px;transition:all .2s;position:absolute;bottom:3px;left:3px;box-shadow:0 1px 2px #0003}.switch input:checked+.switch-slider{background:var(--color-primary)}.switch input:checked+.switch-slider:before{transform:translate(18px)}.text-white{color:#fff}.gap-12{flex-direction:column;gap:12px;display:flex}
