:root{--bg: #f6f4ee;--surface: #ffffff;--surface-2: #eceae1;--ink: #0c1310;--ink-2: #384440;--ink-soft: #6a7571;--ink-faint: #98a09c;--border: #dcd9cf;--border-strong: #c4c0b3;--primary: #0f766e;--primary-hover: #0b5e58;--primary-soft: #d1faf2;--primary-ink: #064e48;--success: #047857;--success-soft: #d1fae5;--warn: #b45309;--warn-soft: #fef3c7;--danger: #b91c1c;--danger-soft: #fee2e2;--offline: #c2410c;--offline-soft: #ffedd5;--muted: #6a7571;--muted-soft: #e6e4dd;--shadow-sm: 0 1px 2px rgba(12, 19, 16, .05);--shadow: 0 2px 10px rgba(12, 19, 16, .08);--shadow-lg: 0 12px 32px rgba(12, 19, 16, .15);--radius-sm: 6px;--radius: 10px;--radius-lg: 14px;--tap: 48px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", system-ui, sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;height:100dvh;overflow:hidden}body{font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer;background:none;border:none}#root{display:flex;flex-direction:column;height:100%}.screen{display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--bg)}.loading-screen{display:flex;align-items:center;justify-content:center;height:100%;background:var(--bg)}.loading-dot{width:14px;height:14px;border-radius:50%;background:var(--primary);animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;position:relative;z-index:10}.top-left{display:flex;align-items:center;gap:12px}.top-right{position:relative}.top-title{font-size:16px;font-weight:600;letter-spacing:-.01em}.top-spacer{width:40px}.brand-dot{width:10px;height:10px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 3px #0f766e26}.top-user{line-height:1.2}.user-name{font-weight:600;font-size:15px;letter-spacing:-.01em}.user-role{font-size:11px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.08em;font-weight:500}.icon-btn{width:40px;height:40px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--ink-2);transition:background .15s}.icon-btn:active{background:var(--surface-2)}.menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20}.menu-pop{position:absolute;top:calc(100% + 4px);right:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);min-width:180px;padding:6px;z-index:30}.menu-pop button{display:block;width:100%;text-align:left;padding:12px 14px;border-radius:var(--radius-sm);font-size:14px;color:var(--ink)}.menu-pop button:active{background:var(--surface-2)}.tabs{display:flex;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.tab{flex:1;padding:14px 16px;font-size:14px;font-weight:500;color:var(--ink-soft);border-bottom:2px solid transparent;transition:all .15s}.tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.sync-bar{display:flex;align-items:center;gap:10px;padding:10px 16px;font-size:13px;font-weight:500;border-bottom:1px solid transparent;flex-shrink:0}.sync-bar.offline{background:var(--offline-soft);color:var(--offline);border-bottom-color:#c2410c33}.sync-bar.syncing{background:var(--primary-soft);color:var(--primary-ink);border-bottom-color:#0f766e33}.sync-bar.pending{background:var(--warn-soft);color:var(--warn);border-bottom-color:#b4530933}.sync-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.sync-bar.syncing .sync-dot{animation:pulse 1s ease-in-out infinite}.sync-bar.offline .sync-dot{background:var(--offline)}.refresh-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--bg);flex-shrink:0}.last-sync{font-size:12px;color:var(--ink-faint);font-weight:500}.btn-refresh{display:flex;align-items:center;gap:6px;padding:8px 14px;background:var(--surface);border:1px solid var(--border-strong);border-radius:999px;font-size:13px;font-weight:600;color:var(--ink);transition:all .15s;min-height:36px}.btn-refresh:active:not(:disabled){background:var(--surface-2);transform:scale(.97)}.btn-refresh:disabled{opacity:.6;cursor:not-allowed}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.status-banner{padding:10px 16px;font-size:13px;font-weight:500;flex-shrink:0;animation:slideDown .2s ease-out}.status-banner.ok{background:var(--success-soft);color:var(--success)}.status-banner.warn{background:var(--warn-soft);color:var(--warn)}.status-banner.err{background:var(--danger-soft);color:var(--danger)}@keyframes slideDown{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.task-list{flex:1;overflow-y:auto;padding:12px 16px 80px;-webkit-overflow-scrolling:touch}.task-card{width:100%;display:flex;align-items:center;gap:12px;padding:16px;margin-bottom:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:left;transition:all .15s;box-shadow:var(--shadow-sm)}.task-card:active{background:var(--surface-2);transform:scale(.98)}.task-card-main{flex:1;min-width:0}.task-card-chev{color:var(--ink-faint);flex-shrink:0}.task-name{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:6px;letter-spacing:-.01em}.task-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.pill{padding:3px 8px;background:var(--primary-soft);color:var(--primary-ink);font-size:11px;font-weight:600;border-radius:4px;letter-spacing:.02em;text-transform:uppercase}.pill.subtle{background:var(--surface-2);color:var(--ink-soft)}.task-desc{font-size:13px;color:var(--ink-soft);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.empty{text-align:center;padding:60px 20px;color:var(--ink-faint)}.empty-icon{font-size:48px;margin-bottom:12px;opacity:.4;font-family:var(--font-mono)}.empty-title{font-size:16px;font-weight:600;color:var(--ink-2);margin-bottom:4px}.empty-hint{font-size:13px}.login-screen{display:flex;align-items:center;justify-content:center;padding:24px;height:100%;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(15,118,110,.08),transparent 70%),var(--bg)}.login-card{width:100%;max-width:380px}.login-brand{text-align:center;margin-bottom:36px}.brand-mark{width:56px;height:56px;margin:0 auto 20px;background:var(--primary);border-radius:var(--radius);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:12px 14px;box-shadow:0 6px 20px #0f766e4d}.brand-mark-line{display:block;height:2px;background:#fff;border-radius:1px}.brand-mark-line:nth-child(1){width:100%}.brand-mark-line:nth-child(2){width:70%}.brand-mark-line:nth-child(3){width:85%}.login-brand h1{font-size:26px;font-weight:700;letter-spacing:-.03em;margin-bottom:4px}.login-brand p{font-size:14px;color:var(--ink-soft)}.login-form{display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field-label,.field>span{font-size:12px;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em}.field input[type=text],.field input[type=password],.field input[type=number],.field textarea,.field select{width:100%;padding:12px 14px;background:var(--surface);border:1.5px solid var(--border-strong);border-radius:var(--radius);font-size:16px;color:var(--ink);transition:border-color .15s,box-shadow .15s;min-height:var(--tap);-webkit-appearance:none;-moz-appearance:none;appearance:none}.field textarea{resize:vertical;min-height:90px;line-height:1.5}.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0f766e26}.error-msg{padding:10px 12px;background:var(--danger-soft);color:var(--danger);border-radius:var(--radius-sm);font-size:13px;font-weight:500}.btn-primary{padding:12px 16px;background:var(--primary);color:#fff;border-radius:var(--radius);font-size:15px;font-weight:600;transition:all .15s;min-height:var(--tap);letter-spacing:-.01em}.btn-primary:active:not(:disabled){background:var(--primary-hover);transform:scale(.98)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-lg{font-size:16px;padding:14px 20px;min-height:52px}.btn-primary-sm{padding:8px 14px;background:var(--primary);color:#fff;border-radius:var(--radius-sm);font-size:13px;font-weight:600}.btn-secondary{padding:10px 14px;background:var(--surface);color:var(--ink);border:1px solid var(--border-strong);border-radius:var(--radius);font-size:13px;font-weight:600;min-height:40px}.btn-secondary:active{background:var(--surface-2)}.btn-danger-outline{padding:10px 14px;background:var(--surface);color:var(--danger);border:1px solid var(--danger-soft);border-radius:var(--radius);font-size:13px;font-weight:600;min-height:40px}.btn-danger-outline:active{background:var(--danger-soft)}.btn-ghost{padding:8px 14px;background:transparent;color:var(--ink-soft);border:1px solid var(--border-strong);border-radius:var(--radius);font-size:13px;font-weight:500}.btn-ghost:active{background:var(--surface-2)}.btn-ghost.danger{color:var(--danger);border-color:var(--danger-soft)}.btn-ghost-dark{padding:8px 14px;background:#ffffff1a;color:#fff;border-radius:var(--radius-sm);font-size:13px}.flex-1{flex:1}.detail-content{flex:1;overflow-y:auto;padding:20px 16px 40px;-webkit-overflow-scrolling:touch}.task-header{margin-bottom:28px}.task-id{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);font-weight:500;margin-bottom:6px}.task-name-lg{font-size:22px;font-weight:700;color:var(--ink);line-height:1.25;letter-spacing:-.02em;margin-bottom:10px}.task-desc-lg{font-size:14px;color:var(--ink-soft);line-height:1.55;margin-top:10px}.update-form{display:flex;flex-direction:column;gap:20px}.status-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.status-btn{padding:14px 12px;background:var(--surface);border:1.5px solid var(--border-strong);border-radius:var(--radius);font-size:14px;font-weight:600;color:var(--ink-2);transition:all .15s;min-height:var(--tap)}.status-btn:active{transform:scale(.97)}.status-btn.active.tone-ok{background:var(--success-soft);border-color:var(--success);color:var(--success)}.status-btn.active.tone-warn{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}.status-btn.active.tone-err{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}.status-btn.active.tone-muted{background:var(--muted-soft);border-color:var(--muted);color:var(--muted)}.photo-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;padding:28px;background:var(--surface);border:1.5px dashed var(--border-strong);border-radius:var(--radius);color:var(--ink-soft);font-size:14px;font-weight:500;transition:all .15s}.photo-btn:active{background:var(--surface-2);border-color:var(--primary);color:var(--primary)}.photo-preview{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--surface-2);border:1px solid var(--border)}.photo-preview img{width:100%;max-height:300px;object-fit:cover;display:block}.photo-actions{display:flex;gap:8px;padding:10px;background:var(--surface);border-top:1px solid var(--border)}.photo-actions button{flex:1}.hint-text{font-size:12px;color:var(--ink-faint);text-align:center;margin-top:-4px;line-height:1.5}.done-screen{display:flex;align-items:center;justify-content:center;padding:40px}.done-card{text-align:center}.done-icon{width:72px;height:72px;margin:0 auto 20px;background:var(--success);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:700;box-shadow:0 8px 24px #0478574d;animation:successPop .4s cubic-bezier(.34,1.56,.64,1)}@keyframes successPop{0%{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}.done-title{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px}.done-sub{font-size:14px;color:var(--ink-soft)}.log-toolbar{display:flex;gap:8px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.log-toolbar select{flex:1;min-height:40px;padding:8px 10px;background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13px;font-weight:500}.log-count{padding:8px 16px;font-size:12px;color:var(--ink-faint);font-weight:500;background:var(--bg);border-bottom:1px solid var(--border);flex-shrink:0}.log-list{flex:1;overflow-y:auto;padding:8px 16px 40px;-webkit-overflow-scrolling:touch}.log-entry{padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:6px}.log-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}.log-action{font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--ink);letter-spacing:.01em}.log-status{padding:2px 7px;border-radius:4px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.log-status.status-SUCCESS{background:var(--success-soft);color:var(--success)}.log-status.status-FAIL{background:var(--danger-soft);color:var(--danger)}.log-status.status-OFFLINE{background:var(--offline-soft);color:var(--offline)}.log-status.status-PENDING,.log-status.status-RETRY{background:var(--warn-soft);color:var(--warn)}.log-meta{font-size:11px;color:var(--ink-faint);margin-bottom:4px}.log-user{font-weight:600;color:var(--ink-soft)}.log-phone{font-family:var(--font-mono)}.log-details{font-size:11px;color:var(--ink-soft);font-family:var(--font-mono);padding:6px 8px;background:var(--bg);border-radius:4px;margin-top:4px;word-break:break-all;line-height:1.5}.update-banner{position:fixed;bottom:16px;left:16px;right:16px;padding:14px 16px;background:var(--ink);color:#fff;border-radius:var(--radius);box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:100;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.update-msg{font-size:14px;font-weight:500}.update-actions{display:flex;gap:8px}@supports (padding: max(0px)){.task-list,.detail-content,.log-list{padding-bottom:max(40px,env(safe-area-inset-bottom))}}@media (min-width: 600px){#root{max-width:480px;margin:0 auto;box-shadow:var(--shadow-lg)}}