:root { color-scheme: light; --green:#176b52; --light:#eff8f4; --line:#d8e2de; --text:#17231f; }
* { box-sizing:border-box; }
body { margin:0; background:#f6f8f7; color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; }
.container { max-width:720px; margin:auto; padding:22px 16px 48px; }
h1 { margin:0; font-size:28px; } h2 { font-size:20px; margin:28px 0 12px; }
header p { margin:7px 0 20px; color:#53635d; }
button,.file-label { min-height:48px; border:1px solid #aebdb7; border-radius:9px; background:#fff; color:var(--text); font:inherit; font-weight:600; padding:10px 14px; cursor:pointer; text-align:center; }
button:focus-visible,.file-label:focus-within,input:focus,textarea:focus { outline:3px solid #9cd9c1; outline-offset:2px; }
button.primary { border-color:var(--green); background:var(--green); color:white; }
.actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.backup { display:flex; flex-wrap:wrap; gap:12px; margin-top:14px; }
.text-button { min-height:auto; border:0; background:transparent; color:var(--green); text-decoration:underline; padding:5px 0; font-weight:500; }.file-label input { display:none; }
.status { min-height:24px; color:#8b370e; margin:16px 0 0; }.item-list { display:grid; gap:12px; }
.empty { color:#53635d; text-align:center; background:var(--light); padding:28px 12px; border-radius:10px; }
.card { background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; box-shadow:0 1px 2px #00000009; }.card h3 { font-size:19px; margin:0 0 12px; overflow-wrap:anywhere; }
.details { display:grid; grid-template-columns:78px 1fr; gap:7px 12px; margin:0; }.details dt { color:#587066; }.details dd { margin:0; overflow-wrap:anywhere; white-space:pre-wrap; }
.registered { color:#687871; font-size:14px; margin:14px 0 0; }.card-actions { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-top:15px; }.delete { color:#a12d2d; }
dialog { width:min(100% - 24px,520px); border:0; border-radius:13px; padding:20px; box-shadow:0 12px 35px #0005; } dialog::backdrop { background:#17231f88; }.dialog-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; }.dialog-head button { min-height:36px; padding:2px 11px; font-size:24px; line-height:1; border:0; }
#itemForm,#purchaseForm { display:grid; gap:14px; } #itemForm label,#purchaseForm label { display:grid; gap:6px; font-weight:600; } input,textarea { width:100%; border:1px solid #aebdb7; border-radius:8px; padding:11px; font:inherit; background:#fff; } textarea { resize:vertical; } #scannerVideo { width:100%; max-height:55vh; background:#111; border-radius:8px; } #scannerMessage { min-height:24px; color:#53635d; }.history-toggle { min-height:40px; margin-bottom:12px; }
.product-preview { display:flex; align-items:center; gap:12px; padding:8px; background:var(--light); border-radius:8px; }.product-preview img,.card-image { width:64px; height:64px; object-fit:contain; border-radius:7px; background:#fff; border:1px solid var(--line); }.product-preview p { margin:0; color:#53635d; }.card-heading { display:flex; align-items:flex-start; gap:12px; }.card-heading h3 { flex:1; }
.title-row { display:flex; align-items:center; gap:10px; }.mode-badge { padding:3px 8px; border:1px solid #8b9b95; border-radius:999px; color:#52625c; font-size:13px; font-weight:700; }.affiliate-notice { margin:0 0 18px; padding:11px 13px; border-left:3px solid #176b52; background:#edf7f2; color:#40554b; font-size:14px; line-height:1.55; }
.price-candidate { display:grid; gap:4px; margin-top:13px; padding:10px; border-radius:8px; background:#fff8e7; color:#5d4818; }.price-candidate strong { font-size:15px; }.price-candidate span { font-size:16px; font-weight:700; }.price-candidate small { font-size:12px; line-height:1.45; font-weight:400; }
@media (max-width:390px) { .actions { grid-template-columns:1fr; }.card-actions { grid-template-columns:1fr; } }