:root{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;line-height:1.5;color:#17211d;background:#eef1f4;-webkit-text-size-adjust:100%;--ink: #17211d;--ink-soft: #5b6b66;--line: #dbe1e4;--card: #ffffff;--brand: #1a6b5b;--brand-strong: #12564a;--brand-soft: #e6f2ee;--danger: #b3261e;--danger-soft: #fdeceb}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:#eef1f4}button{font:inherit;color:inherit}:where(button,input,a,label):focus-visible{outline:3px solid #0f766e;outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.app{max-width:520px;margin:0 auto;min-height:100vh;background:#f6f8f9;padding-bottom:calc(32px + env(safe-area-inset-bottom))}.view{display:flex;flex-direction:column;gap:16px;padding:calc(20px + env(safe-area-inset-top)) 16px 0}.app-header h1{margin:0;font-size:26px;letter-spacing:.5px}.app-header p{margin:6px 0 0;color:var(--ink-soft);font-size:14px}.banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;font-size:14px;border:1px solid transparent}.banner-success{background:var(--brand-soft);border-color:#b9dace;color:var(--brand-strong)}.banner-error{background:var(--danger-soft);border-color:#f3c3bf;color:var(--danger)}.banner-close{border:0;background:transparent;font-size:20px;line-height:1;padding:0 4px;cursor:pointer}.capture-card{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px}.primary-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:56px;border:0;border-radius:14px;background:var(--brand);color:#fff;font-size:18px;font-weight:600;cursor:pointer;transition:background .15s ease}.primary-button:hover:not(:disabled){background:var(--brand-strong)}.primary-button:disabled{background:#9fb3ad;cursor:not-allowed}.capture-secondary{display:flex;gap:10px}.ghost-button{flex:1;min-height:44px;border:1px solid var(--line);border-radius:12px;background:#fbfcfc;color:var(--ink);font-size:15px;cursor:pointer}.ghost-button:hover:not(:disabled){background:#f1f5f4}.ghost-button-wide{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink-soft);font-size:15px;cursor:pointer}.ghost-button-wide:hover:not(:disabled){background:#f1f5f4}.ghost-button-wide:disabled,.ghost-button:disabled{opacity:.6;cursor:not-allowed}.text-button{border:0;background:transparent;color:var(--brand-strong);font-size:15px;padding:6px 4px;cursor:pointer}.hint-box{background:#f4f7f6;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:13px;color:var(--ink-soft)}.hint-box p{margin:0 0 6px}.hint-box p:last-child{margin-bottom:0}.records{display:flex;flex-direction:column;gap:10px}.records-head{display:flex;align-items:baseline;justify-content:space-between}.records-head h2{margin:0;font-size:17px}.records-count{font-size:13px;color:var(--ink-soft)}.record-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.record-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;cursor:pointer}.record-item:hover{border-color:#b7cdc6}.record-thumb{width:64px;height:64px;border-radius:10px;object-fit:cover;background:#e7ebed;flex:0 0 auto}.record-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.record-count{font-size:22px;font-weight:700;color:var(--brand-strong);line-height:1.1}.record-count small{font-size:12px;font-weight:500;margin-left:2px;color:var(--ink-soft)}.record-meta{font-size:13px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.record-time{font-size:12px;color:var(--ink-soft)}.record-tag{flex:0 0 auto;font-size:11px;padding:3px 8px;border-radius:999px;background:var(--brand-soft);color:var(--brand-strong)}.state-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px 16px;display:flex;flex-direction:column;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-soft)}.state-card p{margin:0}.state-title{font-size:16px;font-weight:600;color:var(--ink)}.state-card.error{border-color:#f3c3bf;background:var(--danger-soft);color:var(--danger)}.state-card.warn{border-color:#f0d9a8;background:#fdf6e7;color:#7a5410}.state-card.warn .state-title{color:#7a5410}.skeleton-list{display:flex;flex-direction:column;gap:10px}.skeleton-row{height:84px;border-radius:14px;background:linear-gradient(90deg,#eef2f3,#e2e8ea,#eef2f3);background-size:200% 100%;animation:shimmer 1.4s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.result-photo-wrap{display:flex;flex-direction:column;gap:8px}.photo{position:relative;width:100%;background:#101614;border-radius:16px;overflow:hidden}.photo img{display:block;width:100%;max-height:52vh;object-fit:contain}.result-photo img{max-height:46vh}.photo-boxes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.photo-boxes rect{fill:#38e0bb1f;stroke:#2ce0b0;stroke-width:2}.overlay-toggle{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft);align-self:flex-start}.overlay-toggle input{width:18px;height:18px;accent-color:var(--brand)}.count-card,.form-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:8px}.count-label{margin:0;font-size:14px;color:var(--ink-soft)}.count-big{margin:0;font-size:56px;font-weight:800;line-height:1;color:var(--brand-strong);letter-spacing:-1px}.count-big small{font-size:18px;font-weight:600;margin-left:6px;color:var(--ink-soft)}.count-hint{margin:0;font-size:13px;color:var(--ink-soft)}.count-time{margin:0;font-size:12px;color:var(--ink-soft)}.form-title{margin:0;font-size:16px}.stepper{display:flex;align-items:center;gap:10px;margin:4px 0}.stepper-button{width:52px;height:52px;border-radius:14px;border:1px solid var(--line);background:#fbfcfc;font-size:24px;line-height:1;cursor:pointer}.stepper-button:hover:not(:disabled){background:#f1f5f4}.stepper-button:disabled{opacity:.5;cursor:not-allowed}.stepper-value{flex:1;display:flex;align-items:baseline;justify-content:center;gap:4px;background:#f4f7f8;border-radius:14px;padding:6px 10px;min-height:52px}.stepper-value input{width:4.6em;border:0;background:transparent;text-align:right;font-size:28px;font-weight:700;color:var(--ink);padding:0;-moz-appearance:textfield}.stepper-value input::-webkit-outer-spin-button,.stepper-value input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.stepper-value span{font-size:14px;color:var(--ink-soft)}.adjust-note{margin:0;font-size:13px;color:var(--brand-strong)}.adjust-note.muted{color:var(--ink-soft)}.field{display:flex;flex-direction:column;gap:6px;position:relative;margin-top:6px}.field-label{font-size:13px;color:var(--ink-soft)}.field input{min-height:46px;border:1px solid var(--line);border-radius:12px;padding:10px 56px 10px 12px;font-size:15px;background:#fbfcfc}.field input:focus{border-color:var(--brand)}.field-counter{position:absolute;right:12px;bottom:14px;font-size:11px;color:#9aa8a4}.inline-error{margin:0;font-size:13px;color:var(--danger)}.inline-success{margin:0;font-size:13px;color:var(--brand-strong)}.view-nav{display:flex;align-items:center;gap:8px}.view-nav-title{font-size:16px;font-weight:600}.danger-zone{border:1px solid #f3c3bf;background:var(--danger-soft);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;font-size:13px;color:var(--danger)}.danger-zone p{margin:0}.danger-actions{display:flex;gap:10px}.danger-button{flex:1;min-height:44px;border:0;border-radius:12px;background:var(--danger);color:#fff;font-size:15px;cursor:pointer}.danger-button:disabled{opacity:.7;cursor:not-allowed}.danger-text{color:var(--danger);border-color:#f3c3bf}.uploading-overlay{position:fixed;inset:0;background:#1018169e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#fff;font-size:15px;z-index:50;padding:24px;text-align:center}.uploading-overlay p{margin:0}.uploading-hint{font-size:12px;opacity:.8}.spinner{width:42px;height:42px;border-radius:50%;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2.4s}.skeleton-row{animation:none}}@media(min-width:620px){.app{margin:24px auto;border-radius:20px;box-shadow:0 18px 40px #14282314;overflow:hidden;min-height:calc(100vh - 48px)}}
