:root{--bg: #f0f2f5;--surface: #ffffff;--surface-alt: #f7f8fa;--primary: #4f46e5;--primary-light: #6366f1;--primary-dark: #4338ca;--primary-bg: #eef2ff;--ink: #1e293b;--muted: #94a3b8;--muted-dark: #64748b;--border: #e2e8f0;--ok: #10b981;--ok-bg: #ecfdf5;--err: #ef4444;--err-bg: #fef2f2;--warn: #f59e0b;--warn-bg: #fffbeb;--nav-h: 60px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--shadow-sm: 0 1px 3px rgba(0,0,0,.06);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--shadow-lg: 0 8px 24px rgba(0,0,0,.12)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}.app{min-height:100%}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--radius-sm);padding:12px 20px;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;color:var(--ink);background:var(--surface);transition:all .2s ease;-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{padding:8px 14px;font-size:13px}.btn-block{width:100%;margin-top:8px}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 100%);color:#fff;box-shadow:0 2px 8px #4f46e540}.btn-primary:active{background:linear-gradient(135deg,var(--primary-dark) 0%,var(--primary) 100%)}.btn-outline{background:transparent;border:1.5px solid var(--primary);color:var(--primary)}.btn-outline:active{background:var(--primary-bg)}.btn-ghost{background:var(--surface-alt);color:var(--muted-dark)}.btn-ghost:active{background:var(--border)}.muted{color:var(--muted);font-size:13px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.field>span{font-size:13px;color:var(--muted-dark);font-weight:600}.field input,.field textarea{width:100%;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;font-family:inherit;background:var(--surface);color:var(--ink);outline:none;transition:border-color .2s}.field input:focus,.field textarea:focus{border-color:var(--primary)}.alert{border-radius:var(--radius-sm);padding:12px 14px;font-size:14px;margin-top:4px;display:flex;align-items:center;gap:8px}.alert-error{background:var(--err-bg);color:var(--err);border:1px solid #fecaca}.alert-ok{background:var(--ok-bg);color:var(--ok);border:1px solid #a7f3d0}.login-screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(160deg,#1e1b4b,#312e81 40%,#4f46e5);position:relative;overflow:hidden}.login-screen:before{content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle,rgba(99,102,241,.3) 0%,transparent 70%);border-radius:50%}.login-screen:after{content:"";position:absolute;bottom:-80px;left:-80px;width:250px;height:250px;background:radial-gradient(circle,rgba(139,92,246,.2) 0%,transparent 70%);border-radius:50%}.login-card{width:100%;max-width:360px;background:var(--surface);border-radius:var(--radius-lg);padding:32px 24px;box-shadow:0 20px 60px #0000004d;text-align:center;position:relative;z-index:1;animation:card-in .4s ease}@keyframes card-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.login-logo{width:64px;height:64px;margin:0 auto 16px;border-radius:18px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 100%);display:flex;align-items:center;justify-content:center;font-size:32px;box-shadow:0 4px 16px #4f46e54d}.login-title{margin:0 0 4px;font-size:22px;font-weight:700;color:var(--ink)}.login-subtitle{margin:0 0 24px;font-size:13px;color:var(--muted)}.login-form{margin-top:20px;text-align:left}.page{max-width:720px;margin:0 auto;padding:16px 16px calc(var(--nav-h) + 24px);min-height:100vh}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.page-header h2{margin:0;font-size:22px;font-weight:700;color:var(--ink)}.page-header .header-sub{font-size:13px;color:var(--muted);margin-top:2px}.center-screen{min-height:50vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:60px 20px;color:var(--muted)}.empty-ico{font-size:56px;margin-bottom:12px;opacity:.6}.image-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.image-card{background:var(--surface);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s}.image-card:active{transform:scale(.98);box-shadow:var(--shadow-md)}.thumb{position:relative;aspect-ratio:1 / 1;background:var(--surface-alt)}.thumb img{width:100%;height:100%;object-fit:cover;display:block}.thumb-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;background:var(--surface-alt)}.badge{position:absolute;left:8px;bottom:8px;font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;background:#1e293bbf;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.badge-reviewed{background:#10b981d9}.badge-rejected{background:#ef4444d9}.badge-uploaded{background:#4f46e5d9}.image-meta{padding:10px 12px 12px}.meta-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}.meta-sub{margin-top:3px;font-size:11px;color:var(--muted)}.meta-remark{margin-top:6px;font-size:12px;color:var(--muted-dark);background:var(--surface-alt);border-radius:6px;padding:4px 8px}.upload-form{background:var(--surface);border-radius:var(--radius-md);padding:20px;box-shadow:var(--shadow-sm)}.dropzone{border:2px dashed var(--border);border-radius:var(--radius-md);aspect-ratio:4 / 3;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;background:var(--surface-alt);transition:all .2s;position:relative}.dropzone:active{border-color:var(--primary);background:var(--primary-bg)}.dropzone.has-image{border-style:solid;border-color:var(--border)}.dropzone-hint{text-align:center;color:var(--muted)}.dropzone-ico{font-size:44px;margin-bottom:8px}.preview-img{width:100%;height:100%;object-fit:contain}.upload-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px}.progress{position:relative;height:24px;background:var(--border);border-radius:20px;overflow:hidden;margin-top:8px}.progress-bar{height:100%;background:linear-gradient(90deg,var(--primary) 0%,var(--primary-light) 100%);transition:width .3s;border-radius:20px}.progress-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}.offline-box{margin-top:16px;background:var(--warn-bg);border:1px solid #fde68a;border-radius:var(--radius-md);padding:14px 16px}.offline-head{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:600;color:#92400e}.navbar{position:fixed;left:0;right:0;bottom:0;height:var(--nav-h);background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -2px 12px #0000000a;padding-bottom:env(safe-area-inset-bottom);z-index:100}.navbar-inner{max-width:720px;margin:0 auto;height:100%;display:flex;align-items:center;justify-content:space-around;padding:0 8px}.nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--muted);text-decoration:none;padding:6px 14px;border-radius:var(--radius-sm);transition:color .2s;font-weight:500}.nav-item.active{color:var(--primary);font-weight:700}.nav-item.active .nav-ico{transform:scale(1.1)}.nav-ico{font-size:22px;transition:transform .2s}.nav-user{display:flex;align-items:center;gap:6px}.nav-username{font-size:12px;color:var(--muted-dark);max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-logout{background:none;border:1px solid var(--border);color:var(--muted-dark);padding:5px 12px;border-radius:6px;font-size:12px;cursor:pointer;font-weight:500;transition:all .2s}.nav-logout:active{background:var(--err-bg);color:var(--err);border-color:#fecaca}.stats-bar{display:flex;gap:10px;margin-bottom:16px}.stat-card{flex:1;background:var(--surface);border-radius:var(--radius-md);padding:12px 14px;box-shadow:var(--shadow-sm);text-align:center}.stat-num{font-size:22px;font-weight:700;color:var(--primary)}.stat-label{font-size:11px;color:var(--muted);margin-top:2px}@media (min-width: 480px){.image-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 640px){.image-grid{grid-template-columns:repeat(4,1fr)}}