:root{--color-primary:#6366f1;--color-primary-dark:#4f46e5;--color-primary-bg:#6366f11a;--color-background:#0f0f23;--color-bg:#0f0f23;--color-bg-secondary:#1a1a2e;--color-surface:#1a1a2e;--color-surface-hover:#252539;--color-text:#e2e8f0;--color-text-secondary:#94a3b8;--color-text-muted:#64748b;--color-text-tertiary:#475569;--color-border:#2d3748;--color-success:#10b981;--color-danger:#ef4444;--color-danger-dark:#dc2626;--color-danger-bg:#ef44441a;--color-warning:#f59e0b;--color-error:#ef4444;--color-error-bg:#ef44441a;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--font-sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Monaco, monospace;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.2s ease;font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.5}:root.theme-light{--color-background:#f8fafc;--color-bg:#f8fafc;--color-bg-secondary:#fff;--color-surface:#fff;--color-surface-hover:#f1f5f9;--color-text:#1e293b;--color-text-secondary:#475569;--color-text-muted:#94a3b8;--color-text-tertiary:#cbd5e1;--color-border:#e2e8f0}@media (prefers-color-scheme:light){:root:not(.theme-dark){--color-background:#f8fafc;--color-bg:#f8fafc;--color-bg-secondary:#fff;--color-surface:#fff;--color-surface-hover:#f1f5f9;--color-text:#1e293b;--color-text-secondary:#475569;--color-text-muted:#94a3b8;--color-text-tertiary:#cbd5e1;--color-border:#e2e8f0}}*{box-sizing:border-box}body{background:var(--color-background);min-width:320px;min-height:100vh;color:var(--color-text);transition:background var(--transition-normal), color var(--transition-normal);margin:0;padding:0}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600;line-height:1.2}p{margin:0}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.bottom-nav{background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-sm) env(safe-area-inset-right) max(var(--space-sm), env(safe-area-inset-bottom)) env(safe-area-inset-left);z-index:100;justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateZ(0)}.nav-item{align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);cursor:pointer;color:var(--color-text-muted);transition:color var(--transition-fast);background:0 0;border:none;flex-direction:column;flex:1;max-width:100px;display:flex}.nav-item:hover{color:var(--color-text)}.nav-item--active{color:var(--color-primary)}.nav-icon{font-size:1.5rem}.nav-label{font-size:.75rem;font-weight:500}.app-layout{background:var(--color-background);flex-direction:column;min-height:100vh;display:flex}.main-content{padding-bottom:calc(80px + env(safe-area-inset-bottom));overscroll-behavior-y:contain;flex:1;width:100%}@media (max-width:768px){.main-content{padding-bottom:calc(70px + env(safe-area-inset-bottom))}}.barcode-container{border-radius:var(--radius-md);background:#fff;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.barcode-canvas{object-fit:contain;width:90%;height:90%;display:block}.card-item-wrapper{cursor:pointer;transition:transform .3s cubic-bezier(.4,0,.2,1)}.card-item-card{padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);align-items:center;gap:var(--space-md);border-radius:12px;flex-direction:row;min-height:160px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 2px 8px #00000014}.card-item-wrapper:hover{transform:translateY(-4px)}.card-item-wrapper:hover .card-item-card{border-color:var(--card-color);box-shadow:0 8px 16px #0000001f}.card-item-wrapper:active{transform:translateY(-2px)scale(.98)}.card-item-bg-pattern{background:radial-gradient(circle at 20% 20%, var(--card-color-light) 0%, transparent 50%), radial-gradient(circle at 80% 80%, var(--card-color-light) 0%, transparent 50%);opacity:.4;pointer-events:none;position:absolute;inset:0}.card-item-gradient{background:linear-gradient(135deg, var(--card-color-light) 0%, transparent 100%);pointer-events:none;position:absolute;inset:0}.card-item-shine{pointer-events:none;background:linear-gradient(90deg,#fff0 0%,#ffffff1a 50%,#fff0 100%);width:200%;height:200%;transition:transform .6s cubic-bezier(.4,0,.2,1);position:absolute;top:-50%;left:-50%;transform:translate(-100%)rotate(45deg)}.card-item-wrapper:hover .card-item-shine{transform:translate(100%)rotate(45deg)}.card-item-content{gap:var(--space-sm);z-index:1;flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.card-item-header{gap:var(--space-sm);flex-direction:column;display:flex}.card-item-header-text{flex:1;min-width:0}.card-item-name{color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;margin:0 0 4px;font-size:1.25rem;font-weight:700;line-height:1.3;overflow:hidden}.card-item-store{color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:1rem;font-weight:500;overflow:hidden}.card-item-format{background:var(--card-color-light);color:var(--card-color);border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;align-self:flex-start;padding:4px 10px;font-size:.75rem;font-weight:700}.card-item-barcode-wrapper{z-index:1;border-radius:var(--radius-md);border:1px solid var(--color-border);background:#fff;flex-shrink:0;justify-content:center;align-items:center;width:180px;height:180px;display:flex;position:relative;overflow:hidden;transform:translateZ(0)}.card-item-footer{align-items:center;gap:var(--space-xs);margin-top:auto;display:flex}.card-item-tags{gap:var(--space-xs);flex-wrap:wrap;display:flex}.card-item-tag{background:var(--color-surface-hover);color:var(--color-text-muted);border-radius:var(--radius-sm);border:1px solid var(--color-border);padding:4px 10px;font-size:.75rem;font-weight:600}.card-item-tag-more{background:var(--card-color-light);color:var(--card-color);border-radius:var(--radius-sm);padding:4px 10px;font-size:.75rem;font-weight:700}@media (max-width:768px){.card-item-card{padding:var(--space-sm);min-height:160px}.card-item-barcode-wrapper{width:160px;height:160px}.card-item-name{font-size:1.125rem}.card-item-store{font-size:.875rem}}@media (prefers-color-scheme:dark){.card-item-card{box-shadow:0 2px 8px #0000004d}.card-item-wrapper:hover .card-item-card{box-shadow:0 8px 16px #0006}.card-item-barcode-wrapper{background:#fff}}.input-wrapper{gap:var(--space-xs);flex-direction:column;display:flex}.input-wrapper--full{width:100%}.input-label{color:var(--color-text);font-size:.875rem;font-weight:500}.input{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);transition:all var(--transition-fast);font-family:inherit;font-size:1rem}.input:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6366f11a}.input--error{border-color:var(--color-danger)}.input--error:focus{box-shadow:0 0 0 3px #ef44441a}.input-error{color:var(--color-danger);font-size:.75rem}.card-list{padding:0}.card-list-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-lg);padding-top:max(var(--space-lg), env(safe-area-inset-top));padding-left:max(var(--space-lg), env(safe-area-inset-left));padding-right:max(var(--space-lg), env(safe-area-inset-right));z-index:100;width:100%;position:sticky;top:0}.card-list-title{color:var(--color-text);margin:0;margin-bottom:var(--space-xs);font-size:1.75rem;font-weight:700}.card-list-subtitle{color:var(--color-text-muted);margin:0;font-size:.875rem}.card-list-search{margin:var(--space-lg);margin-bottom:var(--space-md);max-width:600px;margin-left:auto;margin-right:auto}.card-list-tags{gap:var(--space-xs);margin:0 var(--space-lg) var(--space-lg);padding:var(--space-sm);background:var(--color-surface-hover);border-radius:var(--radius-md);flex-wrap:wrap;max-width:600px;margin-left:auto;margin-right:auto;display:flex}.card-list-tag{padding:var(--space-xs) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;font-size:.875rem;font-weight:500;transition:all .2s}.card-list-tag:hover,.card-list-tag--active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.card-list-grid{gap:var(--space-md);padding:0 var(--space-lg) var(--space-lg);flex-direction:column;max-width:600px;margin:0 auto;display:flex}.card-list-empty{text-align:center;padding:var(--space-xl);color:var(--color-text-muted);max-width:600px;margin:0 auto}.card-list-empty-hint{margin-top:var(--space-sm);font-size:.875rem}@media (max-width:768px){.card-list-header{padding:var(--space-md);padding-top:max(var(--space-md), env(safe-area-inset-top));padding-left:max(var(--space-md), env(safe-area-inset-left));padding-right:max(var(--space-md), env(safe-area-inset-right))}.card-list-title{font-size:1.5rem}.card-list-search{margin:var(--space-md);margin-bottom:var(--space-sm);max-width:600px;margin-left:auto;margin-right:auto}.card-list-tags{margin:0 var(--space-md) var(--space-md);max-width:600px;margin-left:auto;margin-right:auto}.card-list-grid{gap:var(--space-sm);padding:0 var(--space-md) var(--space-md)}.card-list-empty{padding-left:var(--space-md);padding-right:var(--space-md);max-width:600px;margin:0 auto}}.header{background:var(--color-surface);border-bottom:1px solid var(--color-border);z-index:100;padding-top:env(safe-area-inset-top);position:sticky;top:0}.header-content{align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);padding-left:max(var(--space-lg), env(safe-area-inset-left));padding-right:max(var(--space-lg), env(safe-area-inset-right));display:flex}.header-back{cursor:pointer;color:var(--color-text);padding:var(--space-xs);transition:color var(--transition-fast);background:0 0;border:none;font-size:1.5rem}.header-back:hover{color:var(--color-primary)}.header-title{color:var(--color-text);flex:1;margin:0;font-size:1.25rem;font-weight:600}.header-actions{gap:var(--space-sm);display:flex}.btn{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;gap:var(--space-sm);border:none;font-family:inherit;font-weight:600;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--small{padding:var(--space-xs) var(--space-md);font-size:.875rem}.btn--medium{padding:var(--space-sm) var(--space-lg);font-size:1rem}.btn--large{padding:var(--space-md) var(--space-xl);font-size:1.125rem}.btn--full{width:100%}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn--secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn--secondary:hover:not(:disabled){background:var(--color-surface-hover)}.btn--ghost{color:var(--color-text);background:0 0}.btn--ghost:hover:not(:disabled){background:var(--color-surface-hover)}.btn--danger{background:var(--color-danger);color:#fff}.btn--danger:hover:not(:disabled){background:var(--color-danger-dark)}.btn__spinner{border:2.5px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:14px;height:14px;animation:.6s linear infinite btn-spin}.btn--secondary .btn__spinner,.btn--ghost .btn__spinner{border-color:var(--color-border);border-top-color:var(--color-text)}@keyframes btn-spin{to{transform:rotate(360deg)}}.modal-backdrop{z-index:1000;padding:max(var(--space-lg), env(safe-area-inset-top)) max(var(--space-lg), env(safe-area-inset-right)) max(var(--space-lg), env(safe-area-inset-bottom)) max(var(--space-lg), env(safe-area-inset-left));background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--color-surface);border-radius:var(--radius-lg);width:100%;max-width:500px;max-height:90vh;overflow:auto;box-shadow:0 20px 25px #0000004d}.modal-header{padding:var(--space-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.modal-title{color:var(--color-text);margin:0;font-size:1.25rem;font-weight:600}.modal-close{cursor:pointer;color:var(--color-text-muted);transition:color var(--transition-fast);background:0 0;border:none;font-size:2rem;line-height:1}.modal-close:hover{color:var(--color-text)}.modal-content{padding:var(--space-lg)}.modal-footer{padding:var(--space-lg);border-top:1px solid var(--color-border);gap:var(--space-md);justify-content:flex-end;display:flex}.share-url-modal{flex-direction:column;gap:1.5rem;display:flex}.share-url-modal-info{text-align:center}.share-url-modal-description{color:var(--color-text-secondary);margin:0;font-size:.875rem;line-height:1.5}.share-url-modal-field{flex-direction:column;gap:.5rem;display:flex}.share-url-modal-label{color:var(--color-text);font-size:.875rem;font-weight:600}.share-url-modal-password{background:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:.5rem;align-items:center;gap:.5rem;padding:.75rem;display:flex}.share-url-modal-password-text{letter-spacing:.25em;text-align:center;color:var(--color-primary);-webkit-user-select:all;user-select:all;flex:1;font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace;font-size:1.25rem;font-weight:700}.share-url-modal-url{align-items:stretch;gap:.5rem;display:flex}.share-url-modal-url-input{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace;font-size:.75rem}.share-url-modal-hint{color:var(--color-text-tertiary);margin:0;font-size:.75rem}.share-url-modal-qr{flex-direction:column;gap:.5rem;display:flex}.share-url-modal-qr-container{background:var(--color-bg-secondary);border-radius:8px;justify-content:center;align-items:center;padding:1rem;display:flex}.share-url-modal-qr-canvas{max-width:100%;height:auto;display:block}.share-url-modal-qr-hint{color:var(--color-text-secondary);text-align:center;margin:0;font-size:.75rem}.card-detail{background:var(--color-background);min-height:100vh}.card-detail-content{padding:var(--space-xl);gap:var(--space-xl);flex-direction:column;max-width:600px;margin:0 auto;display:flex}.card-detail-card-container{perspective:2000px;width:100%;max-width:600px;margin:0 auto}.card-detail-card-flip{aspect-ratio:1.586;width:100%;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition:-webkit-transform .8s cubic-bezier(.4,0,.2,1);cursor:pointer;transition:transform .8s cubic-bezier(.4,0,.2,1);position:relative}.card-detail-card-flip--flipped{transform:rotateY(180deg)}.card-detail-card-face{backface-visibility:hidden;width:100%;height:100%;padding:var(--space-xl);background:linear-gradient(135deg, var(--card-color) 0%, var(--card-color-dark) 100%);border-radius:20px;position:absolute;overflow:hidden;-webkit-transform:translateZ(0);box-shadow:0 10px 40px #0003,inset 0 0 0 1px #ffffff1a}.card-detail-card-back{transform:rotateY(180deg)}.card-detail-card-bg-pattern{opacity:.7;pointer-events:none;background:radial-gradient(circle at 30% 40%,#ffffff1f 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff1a 0%,#0000 50%),repeating-linear-gradient(45deg,#0000,#0000 15px,#ffffff08 15px 30px);position:absolute;inset:0}.card-detail-card-gradient{pointer-events:none;background:linear-gradient(135deg,#fff3 0%,#ffffff0d 50%,#0000 100%);position:absolute;inset:0}.card-detail-card-shine{pointer-events:none;background:linear-gradient(90deg,#fff0 0%,#ffffff4d 50%,#fff0 100%);width:50%;height:200%;animation:8s ease-in-out infinite cardShine;position:absolute;top:-50%;left:-100%;transform:rotate(45deg)}@keyframes cardShine{0%,to{left:-100%}50%{left:150%}}.card-detail-chip{top:var(--space-xl);left:var(--space-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff59,#ffffff26);border-radius:8px;flex-direction:column;gap:6px;width:56px;height:44px;padding:12px 8px;display:flex;position:absolute;transform:translateZ(0);box-shadow:0 4px 12px #0003,inset 0 1px #ffffff80}.card-detail-chip-line{background:linear-gradient(90deg,#ffffffb3,#fff6);border-radius:2px;height:3px}.card-detail-card-content{z-index:1;color:#fff;flex-direction:column;justify-content:space-between;height:100%;display:flex;position:relative}.card-detail-card-header{justify-content:space-between;align-items:flex-start;display:flex}.card-detail-logo{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff4d;border-radius:12px;justify-content:center;align-items:center;width:60px;height:60px;display:flex;transform:translateZ(0);box-shadow:0 6px 16px #0003,inset 0 1px #fff6}.card-detail-logo-text{color:#fff;text-shadow:0 2px 4px #0000004d;font-size:1.75rem;font-weight:900}.card-detail-type{padding:var(--space-sm) var(--space-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-full);background:#ffffff40;border:1px solid #fff6;transform:translateZ(0)}.card-detail-type-text{text-transform:uppercase;letter-spacing:.1em;color:#fff;text-shadow:0 1px 2px #0003;font-size:.8rem;font-weight:700}.card-detail-card-main{justify-content:center;gap:var(--space-sm);flex-direction:column;flex:1;display:flex}.card-detail-card-name{color:#fff;text-shadow:0 4px 8px #0006,0 2px 4px #0000004d;margin:0;font-size:2rem;font-weight:900;line-height:1.2}.card-detail-card-store{color:#fffffff2;text-shadow:0 2px 4px #0000004d;margin:0;font-size:1.125rem;font-weight:600}.card-detail-card-footer{justify-content:space-between;align-items:flex-end;display:flex}.card-detail-card-meta{gap:var(--space-lg);display:flex}.card-detail-meta-item{flex-direction:column;gap:4px;display:flex}.card-detail-meta-label{text-transform:uppercase;letter-spacing:.05em;color:#fffc;text-shadow:0 1px 2px #0003;font-size:.7rem;font-weight:600}.card-detail-meta-value{color:#fff;text-shadow:0 1px 2px #0003;font-size:.875rem;font-weight:700}.card-detail-barcode-section{justify-content:center;align-items:center;gap:var(--space-sm);z-index:1;flex-direction:column;display:flex;position:absolute;inset:5%;transform:translateZ(0)}.card-detail-barcode-container{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;padding-block:8px;display:flex}.card-detail-barcode-data{color:#fff;text-shadow:0 1px 2px #0000004d;word-break:break-all;text-align:center;margin:0;font-family:Courier New,monospace;font-size:1rem;font-weight:700}.card-detail-flip-hint{bottom:var(--space-sm);text-transform:uppercase;letter-spacing:.05em;color:#ffffffb3;text-shadow:0 1px 2px #0003;z-index:10;font-size:.75rem;font-weight:600;animation:2s ease-in-out infinite flipHintPulse;position:absolute;left:50%;transform:translate(-50%)}.card-detail-flip-hint--top{top:var(--space-sm);bottom:auto}@keyframes flipHintPulse{0%,to{opacity:.7}50%{opacity:1}}.card-detail-tags-container{gap:var(--space-md);padding:var(--space-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);flex-direction:column;display:flex}.card-detail-section-title{color:var(--color-text);margin:0;font-size:1.125rem;font-weight:700}.card-detail-tags{gap:var(--space-sm);flex-wrap:wrap;display:flex}.card-detail-tag{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);background:#ffffff0d;border:2px solid;font-size:.875rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1)}.card-detail-tag:hover{background:currentColor;transform:scale(1.05);color:#fff!important}.card-detail-notes-container{gap:var(--space-md);padding:var(--space-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);flex-direction:column;display:flex}.card-detail-notes-text{color:var(--color-text);white-space:pre-wrap;word-wrap:break-word;margin:0;font-size:.9375rem;line-height:1.6}.card-detail-actions{gap:var(--space-md);display:flex}@media (max-width:768px){.card-detail-content,.card-detail-card-face{padding:var(--space-lg)}.card-detail-chip{width:48px;height:38px;top:var(--space-lg);left:var(--space-lg)}.card-detail-logo{width:52px;height:52px}.card-detail-logo-text,.card-detail-card-name{font-size:1.5rem}.card-detail-card-store{font-size:1rem}.card-detail-barcode-data{font-size:.875rem}.card-detail-actions{flex-direction:column}}@media (max-width:480px){.card-detail-content,.card-detail-card-face{padding:var(--space-md)}.card-detail-chip{width:44px;height:34px;top:var(--space-md);left:var(--space-md)}.card-detail-logo{width:48px;height:48px}.card-detail-card-name{font-size:1.25rem}.card-detail-card-meta{gap:var(--space-md)}.card-detail-meta-label{font-size:.65rem}.card-detail-meta-value,.card-detail-barcode-data{font-size:.75rem}}@media (prefers-color-scheme:dark){.card-detail-card-face{box-shadow:0 10px 40px #00000080,inset 0 0 0 1px #ffffff14}}.color-picker{gap:var(--space-md);flex-direction:column;display:flex}.color-picker-label{color:var(--color-text);letter-spacing:.025em;font-size:.875rem;font-weight:600}.color-picker-hint{color:var(--color-text-muted);padding:var(--space-xs) 0;text-align:center;margin:0;font-size:.75rem;font-weight:500}.color-picker-container{align-items:flex-start;gap:var(--space-md);padding:var(--space-lg);background:var(--color-surface-hover);border-radius:var(--radius-lg);border:1px solid var(--color-border);display:flex}.color-picker-grouped{gap:var(--space-md);flex-direction:column;flex:1;display:flex}.color-group{gap:var(--space-xs);flex-direction:column;display:flex}.color-group-name{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.color-group-items{gap:var(--space-sm);flex-wrap:wrap;display:flex}.color-picker-presets{gap:var(--space-sm);flex-wrap:wrap;flex:1;display:flex}.color-preset{border-radius:var(--radius-full);cursor:pointer;border:3px solid #0000;justify-content:center;align-items:center;width:48px;height:48px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 2px 8px #00000026,inset 0 1px #ffffff1a}.color-preset:hover{transform:scale(1.15)translateY(-2px);box-shadow:0 8px 16px #00000040,inset 0 1px #fff3}.color-preset:active{transform:scale(1.05)}.color-preset--active{border-color:var(--color-text);box-shadow:0 0 0 3px var(--color-surface), 0 8px 16px #0003, inset 0 1px 0 #fff3;transform:scale(1.1)}.color-preset--active:hover{transform:scale(1.15)translateY(-2px)}.color-preset-check{filter:drop-shadow(0 2px 4px #0000004d);animation:.3s cubic-bezier(.68,-.55,.265,1.55) checkIn}@keyframes checkIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.color-preset--custom{color:#fff;background:linear-gradient(135deg,red 0%,#ff7f00 16.67%,#ff0 33.33%,#0f0 50%,#00f 66.67%,indigo 83.33%,#9400d3 100%);position:relative;box-shadow:0 4px 12px #0003}.color-preset--custom:before{content:"";border-radius:var(--radius-full);background:inherit;opacity:.5;animation:2s ease-in-out infinite customColorPulse;position:absolute;inset:0}@keyframes customColorPulse{0%,to{opacity:0;transform:scale(1)}50%{opacity:.3;transform:scale(1.2)}}.color-preset--custom svg{filter:drop-shadow(0 2px 4px #00000080)}.color-preset--custom:hover{box-shadow:0 8px 20px #0000004d}.color-picker-custom{gap:var(--space-md);padding:var(--space-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);align-items:center;animation:.3s slideDown;display:flex}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.color-picker-input{border:3px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;appearance:none;background:0 0;width:60px;height:48px;box-shadow:0 2px 8px #0000001a}.color-picker-input::-webkit-color-swatch-wrapper{border-radius:var(--radius-md);padding:0}.color-picker-input::-webkit-color-swatch{border-radius:var(--radius-md);border:none}.color-picker-input::-moz-color-swatch{border-radius:var(--radius-md);border:none}.color-picker-text{padding:var(--space-md);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-hover);color:var(--color-text);font-size:.875rem;font-family:var(--font-mono);text-transform:uppercase;transition:all var(--transition-fast);flex:1;font-weight:600}.color-picker-text:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 4px #6366f11a}.color-picker-preview{border-radius:var(--radius-lg);border:2px solid var(--color-border);position:relative;overflow:hidden;box-shadow:0 4px 12px #0000001a}.color-picker-preview-gradient{padding:var(--space-lg);justify-content:center;align-items:center;min-height:80px;display:flex;position:relative;overflow:hidden}.color-picker-preview-gradient:before{content:"";pointer-events:none;background:radial-gradient(circle at 20%,#fff3 0%,#0000 50%),radial-gradient(circle at 80%,#0000001a 0%,#0000 50%);position:absolute;inset:0}.color-picker-preview-text{font-size:1rem;font-weight:700;font-family:var(--font-mono);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);color:#000;z-index:1;letter-spacing:.05em;background:#fffffff2;position:relative;box-shadow:0 4px 12px #00000026}.color-picker--compact .color-picker-container{padding:var(--space-md);gap:var(--space-sm)}.color-picker--compact .color-preset{border-width:2px;width:36px;height:36px}.color-picker--compact .color-group-name{font-size:.7rem}.color-picker--compact .color-group-items{gap:var(--space-xs)}.color-picker--compact .color-picker-preview-gradient{min-height:60px;padding:var(--space-md)}.color-picker--compact .color-picker-preview-text{padding:var(--space-xs) var(--space-md);font-size:.875rem}@media (max-width:768px){.color-picker-hint{background:var(--color-surface-hover);padding:var(--space-sm);border-radius:var(--radius-md);border:1px solid var(--color-border);font-size:.8rem;animation:3s ease-in-out infinite hintPulse}@keyframes hintPulse{0%,to{opacity:1}50%{opacity:.7}}.color-picker-container{padding:var(--space-md)}.color-preset{width:44px;min-width:44px;height:44px;min-height:44px}.color-picker-custom{align-items:stretch;gap:var(--space-sm);flex-direction:column}.color-picker-input{border-width:3px;width:100%;height:60px}.color-picker-text{padding:var(--space-lg);min-height:52px;font-size:1rem}.color-group-items,.color-picker-presets{gap:var(--space-xs)}}.tag-input{gap:var(--space-sm);flex-direction:column;display:flex}.tag-input-label{color:var(--color-text);font-size:.875rem;font-weight:500}.tag-input-container{position:relative}.tag-input-tags{gap:var(--space-xs);padding:var(--space-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);cursor:text;flex-wrap:wrap;min-height:44px;display:flex}.tag-input-tags:focus-within{border-color:var(--color-primary);outline:none}.tag{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;display:inline-flex}.tag-remove{color:#fff;cursor:pointer;opacity:.8;background:0 0;border:none;justify-content:center;align-items:center;width:16px;height:16px;margin:0;padding:0;font-size:1.25rem;line-height:1;transition:opacity .2s;display:flex}.tag-remove:hover{opacity:1}.tag-input-field{min-width:120px;color:var(--color-text);padding:var(--space-xs) 0;background:0 0;border:none;outline:none;flex:1;font-size:.875rem}.tag-input-field::placeholder{color:var(--color-text-muted)}.tag-suggestions{margin-top:var(--space-xs);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);z-index:10;scrollbar-width:thin;scrollbar-color:var(--color-border) transparent;max-height:280px;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 4px 6px #0000001a}.tag-suggestions::-webkit-scrollbar{width:8px}.tag-suggestions::-webkit-scrollbar-track{background:0 0}.tag-suggestions::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:4px}.tag-suggestions::-webkit-scrollbar-thumb:hover{background-color:var(--color-text-muted)}.tag-suggestion-item{width:100%;padding:var(--space-sm) var(--space-md);color:var(--color-text);text-align:left;cursor:pointer;background:0 0;border:none;font-size:.875rem;transition:background-color .2s;display:block}.tag-suggestion-item:hover,.tag-suggestion-item--selected{background:var(--color-surface-hover)}.tag-input-limit{color:var(--color-text-muted);margin:0;font-size:.75rem}.tag-popular-suggestions{gap:var(--space-xs);padding:var(--space-sm);background:var(--color-surface-hover);border-radius:var(--radius-md);border:1px solid var(--color-border);flex-direction:column;display:flex}.tag-popular-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.tag-popular-items{gap:var(--space-xs);flex-wrap:wrap;display:flex}.tag-popular-item{padding:var(--space-xs) var(--space-sm);background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);align-items:center;font-size:.75rem;font-weight:500;display:inline-flex}.tag-popular-item:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.tag-popular-item:active{transform:translateY(0)}@media (max-width:768px){.tag-input-tags{min-height:40px}.tag{font-size:.8125rem}.tag-popular-suggestions{padding:var(--space-sm)}.tag-popular-items{gap:var(--space-xs)}}.card{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-lg);transition:all var(--transition-normal)}.card--low{box-shadow:0 1px 2px #0000001a}.card--medium{box-shadow:0 4px 6px #0000001a}.card--high{box-shadow:0 10px 15px #00000026}.card-form{gap:var(--space-lg);flex-direction:column;display:flex}.form-field{gap:var(--space-xs);flex-direction:column;display:flex}.form-label{color:var(--color-text);font-size:.875rem;font-weight:500}.form-select,.form-textarea{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);transition:all var(--transition-fast);font-family:inherit;font-size:1rem}.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6366f11a}.form-textarea{resize:vertical}.color-picker{gap:var(--space-sm);flex-wrap:wrap;display:flex}.color-option{border-radius:var(--radius-md);cursor:pointer;width:40px;height:40px;transition:all var(--transition-fast);border:2px solid #0000}.color-option:hover{transform:scale(1.1)}.color-option--active{border-color:var(--color-text);box-shadow:0 0 0 2px var(--color-surface)}.form-error{color:var(--color-danger);font-size:.875rem}.form-actions{gap:var(--space-md);justify-content:flex-end;display:flex}.form-field-with-suggestions{position:relative}.store-suggestions{z-index:10;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-top:var(--space-xs);max-height:200px;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 4px 6px #0000001a}.store-suggestion-item{width:100%;padding:var(--space-sm) var(--space-md);text-align:left;cursor:pointer;color:var(--color-text);transition:background var(--transition-fast);gap:var(--space-xs);background:0 0;border:none;flex-direction:column;display:flex}.store-suggestion-item:hover,.store-suggestion-item--selected{background:var(--color-surface-hover)}.store-suggestion-name{font-size:.95rem;font-weight:500}.store-suggestion-tags{color:var(--color-text-muted);font-size:.8rem;font-style:italic}.store-suggestion-item:first-child{border-radius:var(--radius-md) var(--radius-md) 0 0}.store-suggestion-item:last-child{border-radius:0 0 var(--radius-md) var(--radius-md)}.barcode-preview-section{gap:var(--space-xs);flex-direction:column;display:flex}.barcode-preview-card{align-items:center;gap:var(--space-md);padding:var(--space-xl);background:var(--color-surface);border:2px dashed var(--color-border);flex-direction:column;animation:.3s fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.barcode-preview-hint{color:var(--color-text-muted);text-align:center;font-size:.875rem;font-style:italic}.add-card-page{min-height:100vh}.add-card-content{padding:var(--space-lg);max-width:600px;margin:0 auto}.add-card-error{background:var(--color-danger);color:#fff;padding:var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-lg);font-size:.875rem}@media (max-width:768px){.add-card-content{padding:var(--space-md)}}.scanner{background:var(--color-background);min-height:100vh}.scanner-content{min-height:calc(100vh - 60px);padding:var(--space-lg);flex-direction:column;justify-content:center;align-items:center;display:flex}.scanner-prompt,.scanner-error{text-align:center;max-width:400px}.scanner-prompt p,.scanner-error p{margin-bottom:var(--space-lg);color:var(--color-text-muted)}.scanner-error-hint{margin-top:var(--space-sm);font-size:.875rem}.scanner-view{flex-direction:column;justify-content:center;align-items:center;width:100%;height:calc(100vh - 60px);display:flex;position:relative}.scanner-video{object-fit:cover;background:#000;width:100%;height:100%;position:absolute;top:0;left:0}.scanner-overlay{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.scanner-frame{border:3px solid var(--color-primary);border-radius:var(--radius-md);width:250px;height:250px;box-shadow:0 0 0 9999px #00000080}.scanner-camera-overlay{top:max(var(--space-md), env(safe-area-inset-top));z-index:10;pointer-events:auto;position:absolute;left:50%;transform:translate(-50%)}.camera-select-overlay{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;cursor:pointer;text-align:center;background:#000000b3;border:2px solid #ffffff4d;min-width:200px;font-family:inherit;font-size:.875rem}.camera-select-overlay:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6366f14d}.scanner-stop{bottom:max(var(--space-xl), calc(80px + env(safe-area-inset-bottom)));z-index:10;pointer-events:auto;animation:2s ease-in-out infinite pulse;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 0 20px #ef444480}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.scanner-error-message{margin-top:var(--space-md);color:var(--color-danger);text-align:center}.scanner-camera-select{gap:var(--space-sm);width:100%;max-width:400px;margin-bottom:var(--space-lg);flex-direction:column;display:flex}.scanner-camera-select label{color:var(--color-text);font-size:.875rem;font-weight:500}.camera-select-dropdown{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);cursor:pointer;font-family:inherit;font-size:1rem}.camera-select-dropdown:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6366f11a}@media (max-width:768px){.scanner-content{padding:var(--space-md)}.scanner-frame{width:200px;height:200px}}.settings-page{min-height:100vh}.settings-content{padding:var(--space-md);gap:var(--space-md);flex-direction:column;max-width:600px;margin:0 auto;display:flex}.settings-section-title{margin-bottom:var(--space-sm);color:var(--color-text);font-size:1.25rem;font-weight:600}.settings-section-description{color:var(--color-text-muted);margin-bottom:var(--space-md);font-size:.875rem}.settings-actions{gap:var(--space-md);flex-direction:column;display:flex}.settings-message{padding:var(--space-md);border-radius:var(--radius-md);font-size:.875rem}.settings-message--success{color:#fff;background:#10b981}.settings-message--error{background:var(--color-danger);color:#fff}.encryption-status{margin:var(--space-md) 0;align-items:center;display:flex}.encryption-status-badge{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-hover);border-radius:var(--radius-md);border:1px solid var(--color-border);display:inline-flex}.encryption-status-indicator{background:var(--color-text-muted);border-radius:50%;width:12px;height:12px;animation:2s ease-in-out infinite pulse}.encryption-status-indicator--enabled{background:var(--color-success)}.encryption-status-text{color:var(--color-text);font-size:.875rem;font-weight:600}.settings-theme-selector{gap:var(--space-md);margin-top:var(--space-md);display:flex}.settings-theme-option{align-items:center;gap:var(--space-sm);padding:var(--space-md);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-secondary);cursor:pointer;flex-direction:column;flex:1;transition:all .2s;display:flex}.settings-theme-option:hover{border-color:var(--color-primary);background:var(--color-bg)}.settings-theme-option--active{border-color:var(--color-primary);background:var(--color-primary-bg)}.settings-theme-icon{font-size:1.5rem}.settings-theme-label{color:var(--color-text);font-size:.875rem;font-weight:500}.encryption-modal-content{gap:var(--space-md);flex-direction:column;display:flex}.encryption-modal-content p{color:var(--color-text);margin:0;line-height:1.6}.encryption-modal-content strong{color:var(--color-text);font-weight:600}.help-section{overflow:visible}.help-section-header{align-items:center;gap:var(--space-sm);cursor:pointer;text-align:left;width:100%;color:var(--color-text);background:0 0;border:none;padding:0;display:flex}.help-section-header:hover{opacity:.8}.help-icon{font-size:1.5rem}.help-section-title{color:var(--color-text);flex:1;font-size:1.25rem;font-weight:600}.help-arrow{color:var(--color-text-muted);margin-left:auto;font-size:.875rem}.help-section-content{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border)}.help-highlight{padding:var(--space-sm);border-radius:var(--radius-md);border-left:4px solid var(--color-primary);margin-bottom:var(--space-md);background:#6366f11a}.help-platform{margin-bottom:var(--space-md)}.help-platform h3{margin-bottom:var(--space-sm);color:var(--color-text);font-size:1.125rem}.help-platform ol{padding-left:var(--space-xl);margin:0}.help-platform li{margin-bottom:var(--space-xs);line-height:1.6}.help-info{background:var(--color-surface-hover);padding:var(--space-sm);border-radius:var(--radius-md);margin-top:var(--space-md)}.help-info h4{margin-bottom:var(--space-xs);color:var(--color-text);font-size:1rem}.help-info ul{margin:var(--space-xs) 0 0 0;padding-left:var(--space-xl)}.help-info li{margin-bottom:var(--space-xs);line-height:1.5}.help-step{margin-bottom:var(--space-md)}.help-step:last-child{margin-bottom:0}.help-step h4{margin-bottom:var(--space-xs);color:var(--color-text);font-size:1rem}.help-step p{color:var(--color-text-muted);margin:0;line-height:1.6}.help-faq{margin-bottom:var(--space-md)}.help-faq:last-child{margin-bottom:0}.help-faq h4{margin-bottom:var(--space-xs);color:var(--color-text);font-size:1rem}.help-faq p{color:var(--color-text-muted);margin:0;line-height:1.6}.settings-version{text-align:center;padding:var(--space-xl) var(--space-md);margin-top:var(--space-lg);border-top:1px solid var(--color-border)}.settings-version-text{color:var(--color-text-secondary);margin:0 0 var(--space-xs) 0;font-size:.875rem;font-weight:600;font-family:var(--font-mono)}.settings-version-build{color:var(--color-text-muted);margin:0;font-size:.75rem}@media (max-width:768px){.settings-content{padding:var(--space-sm);gap:var(--space-sm)}.help-icon{font-size:1.25rem}}.toast-container{bottom:max(var(--space-xl), env(safe-area-inset-bottom));right:max(var(--space-xl), env(safe-area-inset-right));z-index:9999;gap:var(--space-md);flex-direction:column;display:flex;position:fixed}.toast{min-width:300px;padding:var(--space-md);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:var(--space-md);animation:.3s slideIn;display:flex;box-shadow:0 4px 6px #0000001a}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.toast--success{color:#fff;background:#10b981}.toast--error{background:var(--color-danger);color:#fff}.toast--info{background:var(--color-primary);color:#fff}.toast--warning{color:#fff;background:#f59e0b}.toast-message{flex:1;font-size:.875rem}.toast-close{cursor:pointer;color:inherit;opacity:.8;transition:opacity var(--transition-fast);background:0 0;border:none;font-size:1.5rem;line-height:1}.toast-close:hover{opacity:1}@media (max-width:768px){.toast-container{left:max(var(--space-md), env(safe-area-inset-left));right:max(var(--space-md), env(safe-area-inset-right));bottom:max(var(--space-md), env(safe-area-inset-bottom))}.toast{min-width:unset;width:100%}}.share-page{background:var(--color-bg);flex-direction:column;height:100%;display:flex}.share-page-content{flex:1;width:100%;max-width:600px;margin:0 auto;padding:1rem;overflow-y:auto}.share-page-decrypt{flex-direction:column;gap:1.5rem;display:flex}.share-page-title{color:var(--color-text);margin:0;font-size:1.5rem;font-weight:600}.share-page-description{color:var(--color-text-secondary);margin:0;font-size:.875rem;line-height:1.5}.share-page-error{background:var(--color-error-bg);border:1px solid var(--color-error);color:var(--color-error);border-radius:.5rem;padding:.75rem;font-size:.875rem}.share-page-header{margin-bottom:1rem}.share-page-selection-actions{gap:.5rem;margin-bottom:1rem;display:flex}.share-page-cards{flex-direction:column;gap:.75rem;margin-bottom:1.5rem;display:flex}.share-page-card{border:2px solid var(--color-border);cursor:pointer;background:var(--color-bg-secondary);border-radius:.75rem;align-items:center;gap:.75rem;padding:.75rem;transition:all .2s;display:flex}.share-page-card:hover{border-color:var(--color-primary);background:var(--color-bg)}.share-page-card--selected{border-color:var(--color-primary);background:var(--color-primary-bg)}.share-page-card-checkbox input{cursor:pointer;width:1.25rem;height:1.25rem;accent-color:var(--color-primary)}.share-page-card-info{flex:1;align-items:center;gap:.75rem;display:flex}.share-page-card-color{border-radius:.5rem;flex-shrink:0;width:3rem;height:3rem}.share-page-card-details{flex:1;min-width:0}.share-page-card-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1rem;font-weight:600;overflow:hidden}.share-page-card-store{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;margin:.25rem 0 0;font-size:.875rem;overflow:hidden}.share-page-card-barcode{color:var(--color-text-tertiary);margin:.25rem 0 0;font-size:.75rem}.share-page-actions{flex-direction:column;gap:.75rem;display:flex}@media (max-width:640px){.share-page-content{padding:.75rem}.share-page-card-color{width:2.5rem;height:2.5rem}}.app-loading{background:var(--color-background);justify-content:center;align-items:center;min-height:100vh;display:flex}.spinner{border:4px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.page-error{text-align:center;min-height:50vh;color:var(--color-text-muted);padding:var(--space-xl);justify-content:center;align-items:center;display:flex}