:root{--bg-primary: hsl(222, 30%, 5%);--bg-secondary: hsl(222, 10%, 30%);--bg-tertiary: hsl(222, 10%, 38%);--bg-elevated: hsl(222, 10%, 45%);--bg-hover: hsl(222, 10%, 28%);--accent: hsl(165, 80%, 42%);--accent-hover: hsl(165, 80%, 48%);--accent-subtle: hsla(165, 80%, 42%, .15);--accent-glow: hsla(165, 80%, 42%, .3);--secondary: hsl(215, 100%, 70%);--secondary-hover: hsl(215, 100%, 75%);--secondary-subtle: hsla(215, 100%, 70%, .2);--urgency-normal: hsl(165, 80%, 42%);--urgency-normal-bg: hsla(165, 80%, 42%, .1);--urgency-priority: hsl(42, 100%, 50%);--urgency-priority-bg: hsla(42, 100%, 50%, .1);--urgency-urgent: hsl(355, 85%, 55%);--urgency-urgent-bg: hsla(355, 85%, 55%, .1);--purchased: hsl(220, 10%, 60%);--purchased-bg: hsla(220, 10%, 60%, .1);--danger: hsl(0, 80%, 55%);--danger-hover: hsl(0, 80%, 62%);--danger-subtle: hsla(0, 80%, 55%, .1);--success: hsl(150, 75%, 45%);--success-subtle: hsla(150, 75%, 45%, .1);--text-primary: hsl(0, 0%, 100%);--text-secondary: hsl(220, 20%, 90%);--text-muted: hsl(220, 15%, 80%);--text-inverse: hsl(222, 25%, 6%);--border: hsla(222, 20%, 75%, .6);--border-light: hsla(222, 20%, 75%, .35);--border-focus: var(--accent);--shadow-sm: 0 1px 3px hsla(0, 0%, 0%, .4);--shadow-md: 0 4px 12px hsla(0, 0%, 0%, .5);--shadow-lg: 0 8px 24px hsla(0, 0%, 0%, .6);--shadow-glow: 0 0 15px var(--accent-glow);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .85rem;--font-size-base: .95rem;--font-size-md: 1.05rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 1.9rem;--font-size-3xl: 2.5rem;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--space-2xl: 32px;--space-3xl: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 999px;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .4s ease;--transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);--max-width: 600px;--nav-height: 64px;--bottom-nav-height: 68px}.theme-urgent{--accent: hsl(20, 100%, 55%);--accent-hover: hsl(20, 100%, 60%);--accent-subtle: hsla(20, 100%, 55%, .15);--accent-glow: hsla(20, 100%, 55%, .3);--border-focus: var(--accent)}.theme-purchased{--accent: hsl(210, 100%, 70%);--accent-hover: hsl(210, 100%, 80%);--accent-subtle: hsla(210, 100%, 70%, .2);--accent-glow: hsla(210, 100%, 70%, .4);--border-focus: var(--accent);--border: hsla(210, 100%, 70%, .4)}.light-theme{--bg-primary: hsl(210, 15%, 90%);--bg-secondary: hsl(0, 0%, 100%);--bg-tertiary: hsl(210, 15%, 94%);--bg-elevated: hsl(0, 0%, 100%);--bg-hover: hsl(210, 15%, 92%);--text-primary: hsl(222, 30%, 12%);--text-secondary: hsl(222, 15%, 35%);--text-muted: hsl(222, 10%, 55%);--text-inverse: hsl(0, 0%, 100%);--border: hsla(222, 20%, 20%, .15);--border-light: hsla(222, 20%, 20%, .08);--shadow-sm: 0 2px 4px hsla(0, 0%, 0%, .06);--shadow-md: 0 4px 16px hsla(0, 0%, 0%, .12);--shadow-lg: 0 8px 32px hsla(0, 0%, 0%, .15);--accent: hsl(165, 80%, 35%);--urgency-urgent: hsl(355, 80%, 45%)}.light-theme .theme-urgent{--accent: hsl(15, 90%, 45%);--accent-subtle: hsla(15, 90%, 45%, .1)}.light-theme .theme-purchased{--accent: hsl(215, 80%, 45%);--accent-subtle: hsla(215, 80%, 45%, .1);--bg-primary: hsl(210, 25%, 96%);--bg-secondary: hsl(0, 0%, 100%);--bg-tertiary: hsl(210, 15%, 90%);--border: hsla(215, 80%, 45%, .2)}.light-theme .bottom-nav{background:#ffffffe6;border-top-color:var(--border-light)}.light-theme .need-item.purchased .need-name{color:var(--text-primary);opacity:.7}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--text-primary);background-color:var(--bg-primary);line-height:1.6;min-height:100dvh;overflow-x:hidden}#root{min-height:100dvh;display:flex;flex-direction:column}a{color:var(--accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-hover)}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit;color:inherit}input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:transparent;border:none;outline:none}ul,ol{list-style:none}img{max-width:100%;display:block}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}::selection{background:var(--accent-subtle);color:var(--accent)}.app-layout{display:flex;flex-direction:column;min-height:100dvh}.app-content{flex:1;padding-bottom:calc(var(--bottom-nav-height) + var(--space-lg));padding-top:var(--space-md)}.page{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-lg);width:100%}.page-header{margin-bottom:var(--space-xl)}.page-title{font-size:var(--font-size-2xl);font-weight:800;letter-spacing:-.02em;background:linear-gradient(135deg,var(--text-primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.page-subtitle{color:var(--text-secondary);font-size:var(--font-size-sm);margin-top:var(--space-xs)}.toast-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10000;display:flex;flex-direction:column;gap:var(--space-sm);max-width:280px;width:auto;pointer-events:none}.toast{background:#14171fd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--accent);border-radius:var(--radius-lg);padding:var(--space-lg) var(--space-xl);box-shadow:0 10px 40px #0006;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-md);animation:popIn .3s var(--transition-spring);pointer-events:all;font-size:var(--font-size-md);font-weight:600;color:#fff}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.toast.success{border-color:var(--success)}.toast.error{border-color:var(--danger)}.toast.info{border-color:var(--secondary)}.toast-icon{font-size:24px}.toast.success .toast-icon{color:var(--success)}.toast.error .toast-icon{color:var(--danger)}.toast.info .toast-icon{color:var(--secondary)}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;gap:var(--space-lg)}.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-3xl) var(--space-lg);text-align:center}.empty-state-icon{width:64px;height:64px;color:var(--text-muted);margin-bottom:var(--space-lg);opacity:.5}.empty-state-title{font-size:var(--font-size-lg);font-weight:600;color:var(--text-secondary);margin-bottom:var(--space-sm)}.empty-state-text{color:var(--text-muted);font-size:var(--font-size-sm);max-width:280px}.clickable{cursor:pointer;transition:opacity var(--transition-fast)}.clickable:hover{opacity:.7}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md) var(--space-xl);border-radius:var(--radius-md);font-weight:600;font-size:var(--font-size-sm);transition:all var(--transition-fast);white-space:normal;text-align:center;line-height:1.3;position:relative;overflow:hidden;border:1px solid transparent}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--text-inverse);box-shadow:var(--shadow-sm),0 0 0 0 var(--accent-glow)}.btn-primary:hover{box-shadow:var(--shadow-md),0 8px 25px var(--accent-glow);transform:translateY(-3px) scale(1.02)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--border)}.btn-secondary:hover{background:var(--bg-hover);border-color:var(--text-muted)}.btn-danger{background:var(--danger-subtle);color:var(--danger);border-color:transparent}.btn-danger:hover{background:var(--danger);color:#fff}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-tertiary);color:var(--text-primary)}.btn-icon{padding:var(--space-md);border-radius:var(--radius-md)}.btn-sm{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-xs);border-radius:var(--radius-sm)}.btn-lg{padding:var(--space-lg) var(--space-2xl);font-size:var(--font-size-md);border-radius:var(--radius-lg)}.btn-full{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.input-group{display:flex;flex-direction:column;gap:var(--space-sm)}.input-label{font-size:var(--font-size-sm);font-weight:500;color:var(--text-secondary)}.input-field{width:100%;padding:var(--space-md) var(--space-lg);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--font-size-base);transition:all var(--transition-fast)}.input-field:-webkit-autofill,.input-field:-webkit-autofill:hover,.input-field:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px var(--bg-tertiary) inset!important;-webkit-text-fill-color:var(--text-primary)!important;transition:background-color 5000s ease-in-out 0s}.input-field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-subtle);background:var(--bg-secondary)}.input-field::placeholder{color:var(--text-muted)}.input-field.error{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-subtle)}.input-error{font-size:var(--font-size-xs);color:var(--danger)}.search-box{position:relative}.search-box .search-icon{position:absolute;left:var(--space-lg);top:50%;transform:translateY(-50%);color:var(--text-muted);width:18px;height:18px;pointer-events:none}.search-box .input-field{padding-left:calc(var(--space-lg) + 26px);height:48px}.card{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-lg);transition:all var(--transition-fast)}.card:hover{border-color:var(--border)}.card-interactive{cursor:pointer}.card-interactive:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.badge{display:inline-flex;align-items:center;gap:var(--space-xs);padding:3px var(--space-md);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:600;letter-spacing:.02em;text-transform:uppercase}.badge-normal{background:var(--urgency-normal-bg);color:var(--urgency-normal)}.badge-priority{background:var(--urgency-priority-bg);color:var(--urgency-priority)}.badge-urgent{background:var(--urgency-urgent-bg);color:var(--urgency-urgent);animation:pulse-badge 2s ease-in-out infinite}.badge-purchased{background:var(--purchased-bg);color:var(--purchased)}.badge-category{background:var(--secondary-subtle);color:var(--secondary);text-transform:none;font-weight:500}.badge-user{background:var(--secondary-subtle);color:#b3d2ff;border:1px solid hsla(215,100%,70%,.3);text-transform:none;font-weight:600}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.checkbox-container{display:flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.checkbox{width:34px;height:34px;border-radius:50%;border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);flex-shrink:0;background:transparent;color:var(--accent);cursor:pointer}.checkbox:hover{background:var(--accent-subtle);transform:scale(1.1);box-shadow:0 0 12px var(--accent-glow)}.checkbox:active{background:var(--accent);color:var(--text-inverse);transform:scale(.9)}.checkbox.checked{background:transparent;border-color:var(--accent);color:var(--accent)}.checkbox-icon-hint{opacity:1;transition:opacity var(--transition-fast)}.checkbox:hover .checkbox-icon-hint{opacity:1}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .2s ease}.modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:var(--max-width);max-height:90dvh;overflow-y:auto;animation:slideUp .3s var(--transition-spring);padding:var(--space-xl)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-xl)}.modal-title{font-size:var(--font-size-lg);font-weight:700}.modal-close{padding:var(--space-sm);border-radius:var(--radius-sm);color:var(--text-muted);transition:all var(--transition-fast)}.modal-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.modal-body{display:flex;flex-direction:column;gap:var(--space-lg)}.modal-footer{display:flex;gap:var(--space-md);margin-top:var(--space-xl)}.modal-footer .btn{flex:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:var(--bottom-nav-height);background:var(--bg-secondary);border-top:1px solid var(--border-light);display:flex;justify-content:space-around;align-items:center;z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b0e13eb;padding-bottom:env(safe-area-inset-bottom,0)}.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--text-muted);font-size:10px;font-weight:500;transition:all var(--transition-fast);text-decoration:none;position:relative;-webkit-tap-highlight-color:transparent}.nav-item:hover{color:var(--text-secondary)}.nav-item.active{color:var(--accent)}.nav-item.active:before{content:"";position:absolute;top:-1px;left:50%;transform:translate(-50%);width:20px;height:2px;background:var(--accent);border-radius:var(--radius-full)}.nav-item svg{width:22px;height:22px}.nav-badge{position:absolute;top:2px;right:4px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;background:var(--urgency-urgent);color:#fff;font-size:9px;font-weight:700;border-radius:var(--radius-full);padding:0 4px}.qty-selector{display:flex;align-items:center;gap:var(--space-xs);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-md);padding:2px}.qty-btn{width:36px;height:36px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all var(--transition-fast)}.qty-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.qty-btn:active{transform:scale(.9)}.qty-value{min-width:40px;text-align:center;font-weight:700;font-size:var(--font-size-md);color:var(--text-primary)}.select-field{width:100%;padding:var(--space-md) var(--space-lg);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--font-size-base);transition:all var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.select-field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-subtle)}.select-field option{background:var(--bg-secondary);color:var(--text-primary)}.filters-bar{display:flex;gap:var(--space-sm);overflow-x:auto;padding-bottom:var(--space-sm);scrollbar-width:thin;scrollbar-color:var(--border) transparent;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;flex-shrink:0}.filters-bar::-webkit-scrollbar{height:5px}.filters-bar::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}.filter-chip{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:600;white-space:nowrap;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);transition:all var(--transition-fast);cursor:pointer}.filter-chip:hover{background:var(--bg-hover);border-color:var(--text-secondary)}.filter-chip.active{background:var(--accent);border-color:var(--accent);color:var(--bg-primary);box-shadow:0 0 12px var(--accent-glow)}.filter-chip:disabled{opacity:.8;cursor:default}.filter-chip.active:disabled{opacity:1;cursor:default}.filter-chip:not(.active):disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.5)}.toggle{width:44px;height:24px;border-radius:var(--radius-full);background:var(--bg-hover);border:1px solid var(--border);position:relative;cursor:pointer;transition:all var(--transition-fast)}.toggle.active{background:var(--accent);border-color:var(--accent)}.toggle:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:2px;left:2px;transition:transform var(--transition-fast)}.toggle.active:after{transform:translate(20px)}.divider{height:1px;background:var(--border-light);margin:var(--space-lg) 0}.disabled{opacity:.4!important;cursor:not-allowed!important;pointer-events:none!important;filter:grayscale(.5)}.checkbox-container.disabled{opacity:.3}.avatar{width:36px;height:36px;border-radius:50%;background:var(--accent-subtle);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--font-size-sm);flex-shrink:0}.tabs{display:flex;gap:2px;background:var(--bg-tertiary);padding:3px;border-radius:var(--radius-md)}.tab{flex:1;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:500;text-align:center;color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer}.tab.active{background:var(--bg-elevated);color:var(--text-primary);box-shadow:var(--shadow-sm)}.tab:hover:not(.active){color:var(--text-primary)}.fab{position:fixed;bottom:calc(var(--bottom-nav-height) + var(--space-xl));right:var(--space-xl);width:56px;height:56px;border-radius:28px;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px var(--accent-glow);z-index:100;transition:all var(--transition-normal);border:none;cursor:pointer}@media(min-width:600px){.fab{right:calc(50% - 280px)}}.fab:hover{transform:scale(1.08) translateY(-2px);box-shadow:0 6px 28px var(--accent-glow),var(--shadow-lg)}.fab:active{transform:scale(.95)}.add-panel{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:var(--max-width);max-height:92vh;display:flex;flex-direction:column;animation:slideUp .35s var(--transition-spring);overflow:hidden}.add-panel-handle{width:40px;height:4px;border-radius:var(--radius-full);background:var(--border);margin:0 auto}.add-panel-header{padding:var(--space-lg) var(--space-xl) var(--space-md);border-bottom:1px solid var(--border-light);flex-shrink:0}.add-panel-search{display:flex;flex-direction:column;flex:1;padding:var(--space-md) var(--space-xl) var(--space-lg);overflow:hidden;min-height:0}.add-panel-detail{padding:var(--space-lg) var(--space-xl) var(--space-xl);overflow-y:auto}.panel-product-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;min-height:0;padding-bottom:var(--space-lg)}@media(max-width:480px){.add-panel{height:92vh}.add-panel-header{padding:var(--space-md) var(--space-lg) var(--space-sm)}.add-panel-search{padding:var(--space-sm) var(--space-lg)}.add-panel-detail{padding:var(--space-sm) var(--space-lg) var(--space-lg)}}.notification-prompt-overlay{position:fixed;top:10px;left:0;right:0;padding:0 var(--space-lg);z-index:10001;display:flex;justify-content:center;pointer-events:none}.notification-prompt{background:#1d2230d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid hsla(215,100%,70%,.3);border-radius:var(--radius-xl);padding:var(--space-lg);width:100%;max-width:450px;display:flex;align-items:center;gap:var(--space-lg);box-shadow:0 10px 40px #00000080;animation:slideDown .4s var(--transition-spring);pointer-events:all;position:relative}.notification-prompt-icon{width:44px;height:44px;border-radius:50%;background:var(--accent-subtle);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0}.notification-prompt-content{flex:1}.notification-prompt-content h3{font-size:var(--font-size-md);font-weight:700;margin-bottom:2px;color:#fff}.notification-prompt-content p{font-size:var(--font-size-xs);color:var(--text-muted);line-height:1.4;margin-bottom:var(--space-md)}.notification-prompt-actions{display:flex;gap:var(--space-sm)}.notification-prompt-close{position:absolute;top:var(--space-sm);right:var(--space-sm);color:var(--text-muted);padding:4px;border-radius:50%}.notification-prompt-close:hover{background:#ffffff1a;color:#fff}.toast-container{position:fixed;top:var(--space-xl);left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;gap:var(--space-sm);width:auto;min-width:280px;max-width:90vw;pointer-events:none}.toast{background:#1a1f2ef2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;padding:var(--space-md) var(--space-lg);border-radius:var(--radius-lg);box-shadow:0 10px 25px #0000004d;display:flex;align-items:center;gap:var(--space-md);animation:toast-slide-in .4s cubic-bezier(.175,.885,.32,1.275);border-left:4px solid var(--primary);pointer-events:auto;font-weight:500;font-size:var(--font-size-sm)}.toast.success{border-left-color:var(--success)}.toast.error{border-left-color:var(--danger)}.toast.info{border-left-color:var(--accent)}.toast-icon{background:#ffffff1a;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-style:normal;font-weight:700}@keyframes toast-slide-in{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;padding:var(--space-xl);background:var(--bg-primary)}.login-card{width:100%;max-width:400px}.login-logo{text-align:center;margin-bottom:var(--space-3xl)}.login-logo-icon{width:72px;height:72px;background:linear-gradient(135deg,var(--accent),hsl(180,60%,40%));border-radius:var(--radius-xl);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-lg);box-shadow:var(--shadow-glow)}.login-logo-icon svg{width:36px;height:36px;color:#fff}.login-logo h1{font-size:var(--font-size-2xl);font-weight:800;letter-spacing:-.02em}.login-logo p{color:var(--text-secondary);font-size:var(--font-size-sm);margin-top:var(--space-xs)}.login-form{display:flex;flex-direction:column;gap:var(--space-lg)}.login-toggle{text-align:center;margin-top:var(--space-xl);color:var(--text-secondary);font-size:var(--font-size-sm)}.login-toggle button{color:var(--accent);font-weight:600}.login-toggle button:hover{text-decoration:underline}.setup-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;padding:var(--space-xl)}.setup-card{width:100%;max-width:400px}.setup-options{display:flex;flex-direction:column;gap:var(--space-lg);margin-top:var(--space-xl)}.setup-option{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);cursor:pointer;transition:all var(--transition-fast)}.setup-option:hover{border-color:var(--accent);background:var(--bg-tertiary)}.setup-option h3{font-weight:600;margin-bottom:var(--space-sm);display:flex;align-items:center;gap:var(--space-md)}.setup-option p{color:var(--text-secondary);font-size:var(--font-size-sm)}.shopping-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg)}.shopping-stats{display:flex;gap:var(--space-lg);margin-bottom:var(--space-xl)}.stat-card{flex:1;background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-md);text-align:center}.stat-value{font-size:var(--font-size-xl);font-weight:800;color:var(--accent)}.stat-label{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}.purchased-actions-group{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-lg)}.shopping-list{display:flex;flex-direction:column;gap:var(--space-sm)}.need-item{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);display:flex;align-items:flex-start;gap:var(--space-md);transition:all var(--transition-normal);animation:fadeInUp .3s ease;overflow:hidden;position:relative}.need-item.purchased{border-color:var(--border)}.need-item.purchased .need-name{text-decoration:line-through;color:var(--text-primary);opacity:.9}.need-item.urgent-border{border-left:3px solid var(--urgency-urgent)}.need-item.priority-border{border-left:3px solid var(--urgency-priority)}.need-info{flex:1;min-width:0}.need-name-row{display:flex;align-items:baseline;width:100%;overflow:hidden;margin-bottom:2px}.need-name{font-weight:700;font-size:var(--font-size-md);color:var(--text-primary);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1}.need-category-inline{font-size:var(--font-size-xs);color:var(--text-muted);font-weight:400;margin-left:6px;flex-shrink:0;white-space:nowrap}.urgency-toggle{color:var(--text-muted);transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center}.urgency-toggle:hover{color:#ff9800;background:#ff98001a!important}.urgency-toggle.urgent{color:#ff5722}.need-category-inline{font-size:var(--font-size-xs);color:var(--text-muted);font-weight:500}.need-meta-row{display:flex;align-items:center;gap:var(--space-md);margin-top:4px}.need-category-row{display:flex;align-items:center;justify-content:space-between;margin-top:2px}.trash-btn-inline-meta{opacity:.6;transition:all var(--transition-fast);color:var(--text-muted);margin-left:var(--space-md)}.trash-btn-inline-meta:hover{opacity:1;color:var(--danger);transform:scale(1.1)}.need-badges{display:flex;align-items:center;gap:var(--space-xs)}.badge-user{background:var(--secondary-subtle);color:#b3d2ff;border:1px solid hsla(215,100%,70%,.3);font-weight:700;text-transform:none}.need-qty{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:600}.need-comment{font-size:1rem;color:var(--text-primary);font-style:italic;font-weight:600}.need-days{font-size:var(--font-size-xs);color:var(--text-muted);font-weight:500}.need-actions{display:flex;gap:var(--space-xs)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.add-need-page .product-grid{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:var(--space-lg)}.product-select-item{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all var(--transition-fast)}.product-select-item:hover{border-color:var(--accent);background:var(--bg-tertiary)}.product-select-item.selected{border-color:var(--accent);background:var(--accent-subtle)}.product-select-name{font-weight:500}.product-select-meta{font-size:var(--font-size-xs);color:var(--text-muted)}.add-need-form{margin-top:var(--space-xl);display:flex;flex-direction:column;gap:var(--space-lg);padding:var(--space-xl);background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg)}.urgency-options{display:flex;gap:var(--space-sm)}.urgency-option{flex:1;padding:var(--space-md);border-radius:var(--radius-md);border:1px solid var(--border);text-align:center;font-size:var(--font-size-xs);font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.urgency-option:hover{border-color:var(--text-muted)}.urgency-option.normal.active{border-color:var(--urgency-normal);background:var(--urgency-normal-bg);color:var(--urgency-normal)}.urgency-option.priority.active{border-color:var(--urgency-priority);background:var(--urgency-priority-bg);color:var(--urgency-priority)}.urgency-option.urgent.active{border-color:var(--urgency-urgent);background:var(--urgency-urgent-bg);color:var(--urgency-urgent)}.products-list{display:flex;flex-direction:column;gap:var(--space-sm)}.product-item{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);display:flex;align-items:center;justify-content:space-between;transition:all var(--transition-fast)}.product-item:hover{border-color:var(--border)}.product-item.inactive{opacity:.5}.product-item-info{flex:1;min-width:0}.product-item-name{font-weight:600;display:flex;align-items:center;gap:var(--space-sm)}.product-item-details{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}.fav-star{color:var(--urgency-priority)}.settings-sections{display:flex;flex-direction:column;gap:var(--space-xl)}.settings-section{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-xl)}.settings-section-title{font-size:var(--font-size-md);font-weight:700;margin-bottom:var(--space-lg);display:flex;align-items:center;gap:var(--space-md)}.settings-section-title svg{color:var(--accent);width:20px;height:20px}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) 0;border-bottom:1px solid var(--border-light)}.settings-row:last-child{border-bottom:none}.settings-row-label{font-size:var(--font-size-sm);color:var(--text-secondary)}.settings-row-value{font-weight:600;font-size:var(--font-size-sm)}.member-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) 0;border-bottom:1px solid var(--border-light)}.member-item:last-child{border-bottom:none}.member-info{flex:1}.member-name{font-weight:600;font-size:var(--font-size-sm)}.member-role{font-size:var(--font-size-xs);color:var(--text-muted)}.invite-code{display:flex;align-items:center;gap:var(--space-md);background:var(--bg-tertiary);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);font-family:monospace;font-size:var(--font-size-lg);font-weight:700;letter-spacing:.15em;color:var(--accent)}.history-list{display:flex;flex-direction:column;gap:var(--space-sm)}.history-item{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);display:flex;align-items:start;gap:var(--space-md)}.history-icon{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}.history-icon.create{background:var(--success-subtle);color:var(--success)}.history-icon.purchase{background:var(--accent-subtle);color:var(--accent)}.history-icon.update{background:var(--secondary-subtle);color:var(--secondary)}.history-icon.delete{background:var(--danger-subtle);color:var(--danger)}.history-content{flex:1}.history-text{font-size:var(--font-size-sm)}.history-time{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}@media(min-width:768px){.modal{border-radius:var(--radius-xl);max-width:480px;margin:auto}.modal-overlay{align-items:center}.shopping-stats{gap:var(--space-xl)}.bottom-nav{max-width:var(--max-width);left:50%;transform:translate(-50%);border-radius:var(--radius-xl) var(--radius-xl) 0 0;border:1px solid var(--border-light);border-bottom:none}}