:root{--bg-root: #f0f2f5;--bg-card: #ffffff;--bg-card-hover: #f5f6f8;--bg-secondary: #e8ebf0;--bg-header: rgba(24, 24, 27, .92);--bg-overlay: rgba(0, 0, 0, .04);--bg-overlay-strong: rgba(0, 0, 0, .35);--text-main: #1a1a2e;--text-muted: #64748b;--text-inverse: #ffffff;--border-color: #dce0e8;--border-dashed: rgba(0, 0, 0, .15);--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-danger: #ef4444;--color-danger-bg: rgba(239, 68, 68, .08);--color-online: #22c55e;--flow-accent-blue: #3b82f6;--flow-accent-teal: #14b8a6;--flow-accent-green: #22c55e;--flow-accent-amber: #f59e0b;--flow-accent-orange: #f97316;--flow-accent-rose: #f43f5e;--flow-accent-purple: #a855f7;--flow-accent-slate: #64748b;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08), 0 2px 4px rgba(0, 0, 0, .04);--shadow-lg: 0 12px 28px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);--font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px}:root[data-theme=dark]{--bg-root: #242424;--bg-card: #2a2a2a;--bg-card-hover: #2f2f2f;--bg-secondary: #1a1a1a;--bg-header: rgba(30, 30, 30, .8);--bg-overlay: rgba(255, 255, 255, .05);--bg-overlay-strong: rgba(0, 0, 0, .45);--text-main: rgba(255, 255, 255, .87);--text-muted: rgba(255, 255, 255, .6);--border-color: #444444;--border-dashed: rgba(255, 255, 255, .2);--color-primary: #4e9af1;--color-primary-hover: #747bff;--flow-accent-blue: #4e9af1;--flow-accent-teal: #2dd4bf;--flow-accent-green: #22c55e;--flow-accent-amber: #fbbf24;--flow-accent-orange: #fb923c;--flow-accent-rose: #fb7185;--flow-accent-purple: #c084fc;--flow-accent-slate: rgba(255, 255, 255, .6);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 2px 8px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 20px rgba(0, 0, 0, .6)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){--bg-root: #242424;--bg-card: #2a2a2a;--bg-card-hover: #2f2f2f;--bg-secondary: #1a1a1a;--bg-header: rgba(30, 30, 30, .8);--bg-overlay: rgba(255, 255, 255, .05);--bg-overlay-strong: rgba(0, 0, 0, .45);--text-main: rgba(255, 255, 255, .87);--text-muted: rgba(255, 255, 255, .6);--border-color: #444444;--border-dashed: rgba(255, 255, 255, .2);--color-primary: #4e9af1;--color-primary-hover: #747bff;--flow-accent-blue: #4e9af1;--flow-accent-teal: #2dd4bf;--flow-accent-green: #22c55e;--flow-accent-amber: #fbbf24;--flow-accent-orange: #fb923c;--flow-accent-rose: #fb7185;--flow-accent-purple: #c084fc;--flow-accent-slate: rgba(255, 255, 255, .6);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 2px 8px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 20px rgba(0, 0, 0, .6)}}:root{font-family:var(--font-family);line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--text-main);background-color:var(--bg-root);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}html{width:100%;overflow-x:hidden}*,*:before,*:after{box-sizing:border-box}a{font-weight:500;color:var(--color-primary);text-decoration:inherit}a:hover{color:var(--color-primary-hover)}html,body{width:100%;height:100%;overflow-x:hidden;overscroll-behavior-y:contain;margin:0;padding:0}h1{font-size:3.2em;line-height:1.1}button{border-radius:var(--radius-md);border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--bg-card);color:var(--text-main);cursor:pointer;transition:border-color .25s,background-color .25s}button:hover{border-color:var(--color-primary)}button:focus{outline:none}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.header-content{display:flex!important;align-items:center;justify-content:space-between;position:relative;padding:0 1rem}.scenario-title-wrapper{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;width:auto;max-width:50%;gap:.5rem}.scenario-title{margin:0;font-size:1.5rem;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-inverse)}.menu-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.2);font-size:1.25rem;color:#fff;cursor:pointer;padding:0;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;width:36px;height:36px;line-height:1}.menu-btn:hover{background:#ffffff40;transform:translateY(-1px);box-shadow:0 2px 5px #0000001a}.menu-dropdown{position:absolute;top:100%;right:0;margin-top:.75rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);min-width:200px;z-index:1000;overflow:hidden;animation:menu-fade-in .2s cubic-bezier(.16,1,.3,1);transform-origin:top right}.menu-dropdown:before{content:"";position:absolute;top:-6px;right:12px;width:12px;height:12px;background:var(--bg-card);transform:rotate(45deg);border-left:1px solid var(--border-color);border-top:1px solid var(--border-color)}.menu-item{display:flex;align-items:center;width:100%;padding:12px 16px;text-align:left;background:transparent;border:none;color:var(--text-main);cursor:pointer;font-size:.95rem;font-weight:500;transition:all .2s;gap:10px}.menu-divider{height:1px;background-color:var(--border-color);margin:4px 0}.menu-item.delete-item:hover{background:var(--color-danger-bg);color:var(--color-danger)}.back-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.5rem 1rem;border-radius:8px;font-weight:500;transition:all .2s;display:flex;align-items:center;gap:.5rem}.back-btn:hover{background:#ffffff40;transform:translate(-2px)}.delete-btn-inline-wrapper{display:block;padding:1rem 1rem .75rem;border-bottom:1px solid var(--border-color)}.delete-btn-inline{background:var(--color-danger-bg);color:var(--color-danger);border:1px solid rgba(239,68,68,.3);padding:.5rem .75rem;border-radius:6px;cursor:pointer;font-weight:600;font-size:.875rem;display:flex;align-items:center;justify-content:center;gap:.375rem;width:auto;max-width:200px;transition:all .2s ease}.delete-btn-inline:hover{background:#ef444440}.delete-btn-inline:active{background:#ef44444d;transform:scale(.98)}.delete-btn-inline span{font-size:1.1rem}.meta-items-title-short{display:none}.meta-items-title{font-size:1.3rem;color:var(--text-main)}@media(max-width:768px){.delete-btn-inline-wrapper{padding:.5rem 1rem}.delete-btn-inline{font-size:.875rem;width:100%;max-width:none}.delete-btn-inline:hover{background:#ef444426}.meta-items-title-full{display:none}.meta-items-title-short{display:inline}.meta-items-title{font-size:1.1rem}.meta-items-main{padding:0!important}.meta-items-card{border-radius:0!important;border:none!important;background:transparent!important}.meta-items-card>div{padding:.5rem!important}.meta-items-card .items-table th,.meta-items-card .items-table td{padding:8px 4px!important;font-size:.875rem}.meta-items-card .items-table th:first-child,.meta-items-card .items-table td:first-child{padding-left:.5rem!important}.meta-items-card .items-table th:last-child,.meta-items-card .items-table td:last-child{padding-right:.5rem!important}}.scenario-syncing-badge{display:inline-block;font-size:.75rem;color:var(--text-muted);background-color:var(--bg-secondary);padding:.1rem .4rem;border-radius:4px;margin-left:.5rem;font-weight:400;vertical-align:middle;animation:pulse 2s infinite}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.status-pill{display:flex;align-items:center;gap:.5rem;padding:4px 8px;border-radius:6px;cursor:pointer;background:transparent!important;transition:all .2s ease;-webkit-user-select:none;user-select:none;outline:none}.status-pill:focus-visible{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.status-pill:hover{background:#ffffff1a!important;transform:scale(1.05)}.status-pill .icon{font-size:1.5rem;line-height:1;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.status-pill .dot{width:14px;height:14px;border-radius:50%;background-color:currentColor!important;box-shadow:0 0 3px #4ade8059}.status-pill .sync-icon{width:18px;height:18px;display:inline-block;color:currentColor}.status-pill.syncing .sync-icon{animation:spin 1s linear infinite;transform-origin:50% 50%}.status-pill .label{font-size:.9rem;font-weight:500;white-space:nowrap}.status-pill.online{color:#4ade80!important}.status-pill.syncing{color:#fbbf24!important}.status-pill.offline{color:#9ca3af!important}.status-pill.error{color:#ef4444!important}.status-pill.warning{color:#f59e0b!important}@media(max-width:600px){.status-pill .label{display:none}}.connection-status-banner{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;border-radius:8px;background:#ffffff0d;margin-bottom:1.5rem}.connection-status-banner .banner-icon{display:flex;align-items:center;flex-shrink:0}.connection-status-banner .banner-icon .dot{width:14px;height:14px;border-radius:50%;background-color:#4ade80;box-shadow:0 0 3px #4ade8059}.connection-status-banner .banner-icon .icon{font-size:1.5rem;line-height:1}.connection-status-banner .banner-icon .sync-icon{width:18px;height:18px;display:inline-block}.connection-status-banner .banner-icon .label{display:none}.connection-status-banner .banner-description{color:#ffffffd9;font-size:.9rem;line-height:1.4;margin:0}.connection-status-banner.online .banner-icon{color:#4ade80}.connection-status-banner.syncing .banner-icon{color:#fbbf24}.connection-status-banner.syncing .sync-icon{animation:spin 1s linear infinite;transform-origin:50% 50%}.connection-status-banner.offline .banner-icon{color:#9ca3af}.connection-status-banner.error .banner-icon{color:#ef4444}.sync-section{margin-bottom:2rem}.sync-section h4{margin:0 0 1rem;color:#fff;font-size:1rem;font-weight:600}.sync-section.failed-section h4{color:#ef4444}.sync-items-list{display:flex;flex-direction:column;gap:.5rem}.sync-item{background:#ffffff0d;border-radius:6px;padding:.75rem;cursor:pointer;transition:background .2s}.sync-item:hover{background:#ffffff14}.sync-item-header{display:flex;align-items:center;gap:.75rem}.sync-item .status-icon{font-size:1.25rem;line-height:1}.sync-item .status-icon.failed{color:#ef4444}.sync-item .status-icon.pending{color:#fbbf24}.sync-item .status-icon.success{color:#4ade80}.sync-item .description{flex:1;color:#ffffffe6;font-size:.9rem}.sync-item .chevron{color:#ffffff80;font-size:.75rem}.sync-item-details{margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:.5rem}.detail-row{display:flex;gap:.5rem;font-size:.85rem}.detail-row .label{color:#fff9;min-width:60px}.detail-row .value{color:#ffffffe6}.detail-row .value.mono{font-family:monospace;font-size:.8rem}.sync-error{background:#ef44441a;border-left:3px solid #ef4444;padding:.5rem;border-radius:4px;color:#ffffffe6;font-size:.85rem;margin-top:.5rem}.sync-item-actions{display:flex;gap:.5rem;margin-top:.75rem}.retry-btn,.discard-btn{padding:.375rem .75rem;border:none;border-radius:4px;font-size:.85rem;cursor:pointer;transition:all .2s}.retry-btn{background:#4ade80;color:#000}.retry-btn:hover{background:#22c55e}.discard-btn{background:#ffffff1a;color:#fff}.discard-btn:hover{background:#ffffff26}.no-items{color:#ffffff80;font-style:italic;margin:0}.discarded-note{color:#ffffff80;font-size:.85rem}:root[data-theme=light] .status-pill:hover{background:#0000000f!important}:root[data-theme=light] .connection-status-banner{background:var(--bg-secondary)}:root[data-theme=light] .connection-status-banner .banner-description{color:var(--text-main)}:root[data-theme=light] .sync-section h4{color:var(--text-main)}:root[data-theme=light] .sync-item{background:var(--bg-secondary)}:root[data-theme=light] .sync-item:hover{background:var(--bg-card-hover)}:root[data-theme=light] .sync-item .description{color:var(--text-main)}:root[data-theme=light] .sync-item .chevron{color:var(--text-muted)}:root[data-theme=light] .sync-item-details{border-top-color:var(--border-color)}:root[data-theme=light] .detail-row .label{color:var(--text-muted)}:root[data-theme=light] .detail-row .value{color:var(--text-main)}:root[data-theme=light] .sync-error{background:var(--color-danger-bg);color:var(--text-main)}:root[data-theme=light] .discard-btn{background:var(--bg-secondary);color:var(--text-main)}:root[data-theme=light] .discard-btn:hover{background:var(--border-color)}:root[data-theme=light] .no-items{color:var(--text-muted)}:root[data-theme=light] .discarded-note{color:var(--text-muted)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .status-pill:hover{background:#0000000f!important}:root:not([data-theme=dark]) .connection-status-banner{background:var(--bg-secondary)}:root:not([data-theme=dark]) .connection-status-banner .banner-description{color:var(--text-main)}:root:not([data-theme=dark]) .sync-section h4{color:var(--text-main)}:root:not([data-theme=dark]) .sync-item{background:var(--bg-secondary)}:root:not([data-theme=dark]) .sync-item:hover{background:var(--bg-card-hover)}:root:not([data-theme=dark]) .sync-item .description{color:var(--text-main)}:root:not([data-theme=dark]) .sync-item .chevron{color:var(--text-muted)}:root:not([data-theme=dark]) .sync-item-details{border-top-color:var(--border-color)}:root:not([data-theme=dark]) .detail-row .label{color:var(--text-muted)}:root:not([data-theme=dark]) .detail-row .value{color:var(--text-main)}:root:not([data-theme=dark]) .sync-error{background:var(--color-danger-bg);color:var(--text-main)}:root:not([data-theme=dark]) .discard-btn{background:var(--bg-secondary);color:var(--text-main)}:root:not([data-theme=dark]) .discard-btn:hover{background:var(--border-color)}:root:not([data-theme=dark]) .no-items{color:var(--text-muted)}:root:not([data-theme=dark]) .discarded-note{color:var(--text-muted)}}.modal-overlay{position:fixed;inset:0;background:var(--bg-overlay-strong);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1100;padding:1rem;overflow:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(1rem + env(safe-area-inset-bottom,0));animation:modalBackdropFadeIn .2s ease-out}.modal-content{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);max-height:90vh;width:100%;animation:modalSlideIn .25s ease-out;display:flex;flex-direction:column;overflow:hidden}@media(max-width:480px){.modal-overlay{align-items:flex-start;justify-content:center;padding:.75rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0))}.modal-content{max-height:calc(100dvh - 1.5rem)}@supports not (height: 100dvh){.modal-content{max-height:calc(100vh - 1.5rem)}}.modal-header,.modal-body,.modal-footer{padding:1rem}.modal-footer{flex-direction:column-reverse;align-items:stretch}.modal-footer .cancel-btn,.modal-footer .submit-btn{width:100%}}.modal-small{max-width:400px}.modal-medium{max-width:500px}.modal-large{max-width:700px}.modal-header h3{margin:0;font-size:1.15rem;font-weight:600;color:var(--text-main)}.modal-header .close-btn{background:none;border:none;color:var(--text-muted);font-size:1.75rem;cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:background .15s ease,color .15s ease;line-height:1}.modal-header .close-btn:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-main)}.modal-header .close-btn:disabled{opacity:.5;cursor:not-allowed}.access-denied-banner{background:linear-gradient(135deg,#f093fb,#f5576c);border-left:4px solid #d32f2f;padding:16px 20px;margin-bottom:20px;border-radius:8px;box-shadow:0 2px 8px #00000026;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.access-denied-content{display:flex;align-items:flex-start;gap:16px;color:#fff}.access-denied-icon{width:32px;height:32px;flex-shrink:0;opacity:.95}.access-denied-text{flex:1}.access-denied-text strong{display:block;font-size:16px;font-weight:600;margin-bottom:4px}.access-denied-text p{margin:0;font-size:14px;line-height:1.5;opacity:.95}.access-denied-dismiss{background:none;border:none;color:#fff;font-size:28px;line-height:1;cursor:pointer;padding:0 4px;opacity:.8;transition:opacity .2s;flex-shrink:0}.access-denied-dismiss:hover{opacity:1}.access-denied-dismiss:focus{outline:2px solid white;outline-offset:2px;border-radius:4px}.share-modal{max-width:480px;width:90%}.invite-section{margin-bottom:1.5rem}.invite-form{display:flex;gap:.5rem}.invite-form .form-input{flex:1;padding:.625rem .875rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.875rem;transition:border-color .15s ease,box-shadow .15s ease;background:var(--bg-secondary);color:var(--text-main)}.invite-form .form-input::placeholder{color:var(--text-muted)}.invite-form .form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #3b82f626}.primary-btn{padding:.625rem 1rem;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:.875rem;font-weight:500;cursor:pointer;transition:background .15s ease;white-space:nowrap}.primary-btn:hover:not(:disabled){background:var(--color-primary-hover)}.primary-btn:active:not(:disabled){background:var(--color-primary-hover)}.primary-btn:disabled{opacity:.5;cursor:not-allowed}.users-section h4,.invites-section h4{margin:0 0 .625rem;font-size:.75rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em}.invites-section{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.loading-users,.no-users{text-align:center;padding:1.25rem;color:var(--text-muted);font-size:.8125rem}.users-list{display:flex;flex-direction:column;gap:.5rem;max-height:300px;overflow-y:auto}.invites-list{display:flex;flex-direction:column;gap:.5rem;max-height:200px;overflow-y:auto}.user-item,.invite-item{display:flex;align-items:center;gap:.625rem;padding:.5rem .625rem;background:transparent;border:none;border-bottom:1px solid var(--border-color);border-radius:0;transition:background .15s ease}.user-item:last-child,.invite-item:last-child{border-bottom:none}.user-item:hover,.invite-item:hover{background:var(--bg-card-hover)}.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:.875rem;flex-shrink:0}.invite-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0;color:var(--text-muted)}.user-details,.invite-details{flex:1;min-width:0}.user-name{font-weight:500;color:var(--text-main);font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-email,.invite-email{font-size:.8125rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.125rem}.invite-status{font-size:.75rem;color:var(--text-muted);margin-top:.125rem}.user-role{padding:.3125rem .625rem;background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;white-space:nowrap;text-transform:capitalize}.remove-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);font-size:1.125rem;font-weight:400;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease;line-height:1;padding:0;flex-shrink:0}.remove-btn:hover{background:var(--color-danger-bg);color:var(--color-danger)}.revoke-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);font-size:1.125rem;font-weight:400;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease;line-height:1;padding:0;flex-shrink:0}.revoke-btn:hover{background:#f59e0b1a;color:#f59e0b}.error-banner{padding:.75rem .875rem;background:var(--color-danger-bg);border-left:3px solid var(--color-danger);border-radius:var(--radius-sm);color:var(--color-danger);font-size:.8125rem;margin-bottom:1rem;line-height:1.5}.offline-message{padding:.75rem .875rem;background:#f59e0b1a;border-left:3px solid rgba(245,158,11,.9);border-radius:var(--radius-sm);color:#f59e0be6;font-size:.8125rem;margin-bottom:1rem;line-height:1.5}@media(max-width:600px){.invite-form{flex-direction:column}.primary-btn{width:100%}.user-item{flex-wrap:wrap}}.access-list-section h4{margin:0 0 .5rem;font-size:.75rem;color:#fff9;font-weight:600;text-transform:uppercase;letter-spacing:.08em}.access-list-section.invites-section{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e5e7eb}.loading-items,.no-items{text-align:center;padding:1rem;color:#ffffff80;font-size:.8125rem}.access-list{display:flex;flex-direction:column;max-height:300px;overflow-y:auto}.access-list-item{display:flex;align-items:center;gap:.625rem;padding:.5rem 0;background:transparent;border:none;border-bottom:1px solid #404040;border-radius:0;transition:all .2s ease}.access-list-item:last-child{border-bottom:none}.access-list-item:hover{background:#ffffff0d}.access-list-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.access-list-details{flex:1;min-width:0}.access-list-primary{font-weight:500;color:#ffffffde;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.access-list-secondary{font-size:.75rem;color:#ffffff80;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.125rem}:root[data-theme=light] .access-list-section h4{color:var(--text-muted)}:root[data-theme=light] .access-list-section.invites-section{border-top-color:var(--border-color)}:root[data-theme=light] .loading-items,:root[data-theme=light] .no-items{color:var(--text-muted)}:root[data-theme=light] .access-list-item{border-bottom-color:var(--border-color)}:root[data-theme=light] .access-list-item:hover{background:var(--bg-secondary)}:root[data-theme=light] .access-list-primary{color:var(--text-main)}:root[data-theme=light] .access-list-secondary{color:var(--text-muted)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .access-list-section h4{color:var(--text-muted)}:root:not([data-theme=dark]) .access-list-section.invites-section{border-top-color:var(--border-color)}:root:not([data-theme=dark]) .loading-items,:root:not([data-theme=dark]) .no-items{color:var(--text-muted)}:root:not([data-theme=dark]) .access-list-item{border-bottom-color:var(--border-color)}:root:not([data-theme=dark]) .access-list-item:hover{background:var(--bg-secondary)}:root:not([data-theme=dark]) .access-list-primary{color:var(--text-main)}:root:not([data-theme=dark]) .access-list-secondary{color:var(--text-muted)}}.user-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;cursor:pointer;transition:transform .2s}.user-avatar.clickable:hover{transform:scale(1.1)}.user-avatar.small{width:32px;height:32px;font-size:14px}.user-avatar.medium{width:40px;height:40px;font-size:16px}.user-avatar.large{width:56px;height:56px;font-size:24px}.avatar-image{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}.avatar-spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}.toast{position:fixed;top:32px;left:50%;transform:translate(-50%);min-width:300px;max-width:90vw;background:#1f1f1f;color:#fff;padding:12px 20px;border-radius:50px;box-shadow:0 8px 24px #0006,0 2px 4px #0000001a;font-size:.95rem;z-index:2000;display:flex;align-items:center;gap:12px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid rgba(255,255,255,.1);transition:transform .3s cubic-bezier(.2,.9,.3,1),opacity .3s ease;animation:toast-slide-down .35s cubic-bezier(.2,.9,.3,1) forwards}@keyframes toast-slide-down{0%{transform:translate(-50%) translateY(-150%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}@keyframes toast-slide-up{0%{transform:translate(-50%) translateY(150%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.toast--error{background:#2a1010;border-color:#ef44444d}.toast__message{flex:1;font-weight:500;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#ffffffe6}.toast__message strong{color:#fff;font-weight:600}.toast__close{background:transparent;border:none;color:#fff6;font-size:1.25rem;line-height:1;cursor:pointer;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0;transition:all .2s;flex-shrink:0;margin-left:4px}.toast__close:hover{color:#fff;background:#ffffff1a}.toast--swiping{opacity:.8;transform:translate(calc(-50% + var(--swipe-offset, 0px)));transition:none}.toast--dismissed{opacity:0;pointer-events:none;transform:translate(-50%) translateY(-20px) scale(.95)}@media(max-width:640px){.toast{inset:16px 16px auto auto;min-width:0;width:auto;max-width:calc(100vw - 32px);border-radius:50px;transform:none;animation:toast-slide-in-top-right .35s cubic-bezier(.2,.9,.3,1) forwards}.toast--dismissed{transform:translateY(-20px) scale(.95)}.toast--swiping{transform:translate(var(--swipe-offset, 0px))}}@keyframes toast-slide-in-top-right{0%{transform:translateY(-150%);opacity:0}to{transform:translateY(0);opacity:1}}.toast__action{background:transparent;border:none;color:#818cf8;padding:6px 12px;border-radius:4px;font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;margin-left:4px;transition:background .2s ease,transform .1s ease;white-space:nowrap}.toast__action:hover{background:#818cf81a}.toast__action:active{transform:scale(.96)}.toast--error .toast__action{color:#fca5a5}.toast--error .toast__action:hover{background:#fca5a51a}.empty-state-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;color:#ffffffe6;animation:fade-in .3s ease-out}.empty-state-icon{font-size:4rem;margin-bottom:1.5rem;opacity:.5;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.empty-state-title{font-size:1.75rem;font-weight:600;margin-bottom:1rem;color:#fff}.empty-state-description{max-width:400px;margin-bottom:2rem;line-height:1.6;color:#fff9;font-size:1rem}.empty-state-context{margin-bottom:2rem;padding:.75rem 1.25rem;background:#ffffff0d;border-radius:8px;font-size:.9rem;border:1px solid rgba(255,255,255,.1)}.empty-state-actions{display:flex;gap:1rem;flex-direction:column;width:100%;max-width:300px}.empty-state-primary-btn{background:#646cff;color:#fff;border:none;padding:.8rem;font-weight:500;cursor:pointer;border-radius:8px;transition:all .2s ease;font-size:1rem}.empty-state-primary-btn:hover{background:#535bf2;transform:translateY(-1px);box-shadow:0 4px 12px #535bf24d}.empty-state-secondary-btn{background:transparent;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.8rem;cursor:pointer;border-radius:8px;transition:all .2s ease;font-size:1rem}.empty-state-secondary-btn:hover{background:#ffffff0d;border-color:#fff6}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}:root[data-theme=light] .empty-state-container{color:var(--text-main)}:root[data-theme=light] .empty-state-title{color:var(--text-main)}:root[data-theme=light] .empty-state-description{color:var(--text-muted)}:root[data-theme=light] .empty-state-context{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-main)}:root[data-theme=light] .empty-state-primary-btn{background:var(--color-primary)}:root[data-theme=light] .empty-state-primary-btn:hover{background:var(--color-primary-hover);box-shadow:0 4px 12px #3b82f640}:root[data-theme=light] .empty-state-secondary-btn{border-color:var(--border-color);color:var(--text-main)}:root[data-theme=light] .empty-state-secondary-btn:hover{background:var(--bg-secondary);border-color:var(--color-primary)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .empty-state-container{color:var(--text-main)}:root:not([data-theme=dark]) .empty-state-title{color:var(--text-main)}:root:not([data-theme=dark]) .empty-state-description{color:var(--text-muted)}:root:not([data-theme=dark]) .empty-state-context{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-main)}:root:not([data-theme=dark]) .empty-state-primary-btn{background:var(--color-primary)}:root:not([data-theme=dark]) .empty-state-primary-btn:hover{background:var(--color-primary-hover);box-shadow:0 4px 12px #3b82f640}:root:not([data-theme=dark]) .empty-state-secondary-btn{border-color:var(--border-color);color:var(--text-main)}:root:not([data-theme=dark]) .empty-state-secondary-btn:hover{background:var(--bg-secondary);border-color:var(--color-primary)}}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.loading-spinner p{color:#ffffffb3;margin:0}.spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.1);border-top-color:#4caf50;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .loading-spinner p{color:var(--text-muted)}:root:not([data-theme=dark]) .spinner{border-color:var(--border-color);border-top-color:var(--color-primary)}}.page-header{--page-accent: rgba(255, 255, 255, .35);box-shadow:inset 0 -3px 0 var(--page-accent)}.page-header--scenario{--page-accent: rgba(139, 92, 246, .95)}.page-header--list{--page-accent: rgba(16, 185, 129, .95)}.page-header--flow{--page-accent: rgba(59, 130, 246, .95)}.page-header--neutral{--page-accent: rgba(255, 255, 255, .35)}.page-title-wrapper{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;gap:.75rem;max-width:60%}.page-kind-icon{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;background:transparent;border:none;color:var(--page-accent)}.page-kind-icon svg{width:24px;height:24px;display:block}.page-kind-label{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#ffffffbf;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.page-title{font-size:1.5rem;font-weight:600;margin:0;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-subtitle{margin-left:1rem;color:#ffffffb3;font-size:.9rem}.page-badge{font-size:.75rem;padding:.25rem .5rem;background:#0000002e;color:var(--page-accent);border:1px solid rgba(255,255,255,.18);border-radius:4px;white-space:nowrap;font-weight:500}@media(max-width:768px){.page-title{font-size:1.25rem}.page-subtitle{display:none}}.menu-btn{background:none;border:none;color:#ffffffb3;cursor:pointer;font-size:1.5rem;padding:.25rem .5rem;border-radius:4px;transition:all .2s;line-height:1}.menu-btn svg{width:20px;height:20px;display:block}.menu-btn:hover{background:#ffffff1a;color:#fff}.menu-dropdown{position:absolute;top:100%;right:0;background:#2a2a2a;border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 4px 12px #0000004d;min-width:200px;z-index:100;margin-top:.5rem;overflow:hidden}.menu-item{display:flex;align-items:center;width:100%;padding:.75rem 1rem;background:none;border:none;color:#fff;text-align:left;cursor:pointer;transition:background .2s;font-size:.95rem}.menu-item:hover{background:#ffffff1a}.menu-item.delete-item{color:#e74c3c}.menu-item.delete-item:hover{background:#e74c3c1a}.menu-divider{height:1px;background:#ffffff1a;margin:.25rem 0}.menu-item-icon{display:inline-flex;align-items:center;margin-right:.5rem}.menu-item-icon svg{width:16px;height:16px}:root[data-theme=light] .menu-dropdown{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root[data-theme=light] .menu-btn{color:var(--text-muted)}:root[data-theme=light] .menu-btn:hover{background:var(--bg-secondary);color:var(--text-main)}:root[data-theme=light] .menu-item{color:var(--text-main)}:root[data-theme=light] .menu-item:hover{background:var(--bg-secondary)}:root[data-theme=light] .menu-divider{background:var(--border-color)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .menu-dropdown{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root:not([data-theme=dark]) .menu-btn{color:var(--text-muted)}:root:not([data-theme=dark]) .menu-btn:hover{background:var(--bg-secondary);color:var(--text-main)}:root:not([data-theme=dark]) .menu-item{color:var(--text-main)}:root:not([data-theme=dark]) .menu-item:hover{background:var(--bg-secondary)}:root:not([data-theme=dark]) .menu-divider{background:var(--border-color)}}.theme-menu-btn{background:none;border:none;color:#fffc;cursor:pointer;font-size:.95rem;padding:.35rem .6rem;border-radius:6px;transition:all .2s;line-height:1;white-space:nowrap}.theme-menu-btn:hover{background:#ffffff1a;color:#fffffff2}.update-banner{--update-banner-height: 36px;height:var(--update-banner-height);background:var(--bg-card);color:var(--text-main);display:flex;align-items:center;justify-content:center;gap:12px;font-size:.85rem;border-bottom:1px solid var(--border-color);box-shadow:var(--shadow-sm)}.update-banner__text{font-weight:500}.update-banner__action{background:var(--color-primary);color:var(--text-inverse);border:1px solid var(--color-primary);padding:3px 12px;border-radius:var(--radius-sm, 4px);cursor:pointer;font-size:.8rem;font-weight:600;transition:background .15s}.update-banner__action:hover{background:var(--color-primary-hover)}.header-content{display:flex;align-items:center;justify-content:space-between;position:relative;padding:0 1rem}.list-title-wrapper{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;max-width:50%;gap:.5rem}.list-title{margin:0;font-size:1.5rem;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-inverse)}.header-actions{display:flex;align-items:center;gap:1rem;margin-left:auto}.menu-container{position:relative}.menu-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:var(--bg-overlay);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-inverse);font-size:1.25rem;line-height:1;cursor:pointer;transition:background-color .2s ease,transform .2s ease}.menu-btn:hover{background:#fff3;transform:translateY(-1px)}.menu-dropdown{position:absolute;top:100%;right:0;margin-top:.75rem;min-width:200px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;z-index:1000;animation:menu-fade-in .2s cubic-bezier(.16,1,.3,1);transform-origin:top right}.menu-dropdown:before{content:"";position:absolute;top:-6px;right:12px;width:12px;height:12px;background:var(--bg-card);border-left:1px solid var(--border-color);border-top:1px solid var(--border-color);transform:rotate(45deg)}@keyframes menu-fade-in{0%{opacity:0;transform:translateY(-8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.menu-item{display:flex;align-items:center;gap:.625rem;width:100%;padding:.75rem 1rem;background:transparent;border:none;color:var(--text-main);font-size:.95rem;font-weight:500;text-align:left;cursor:pointer;transition:background-color .2s ease,color .2s ease}.menu-item:hover{background:var(--bg-secondary);color:var(--color-primary)}.menu-divider{height:1px;margin:.25rem 0;background-color:var(--border-color)}.menu-item.delete-item{color:var(--color-danger)}.menu-item.delete-item:hover{background:var(--color-danger-bg)}.back-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--bg-overlay);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-inverse);font-weight:500;transition:background-color .2s ease,transform .2s ease}.back-btn:hover{background:#fff3;transform:translate(-2px)}.back-btn-text{font-size:.9rem}.list-content{max-width:800px;margin:0 auto;padding:1.25rem .75rem}.list-description{margin-bottom:1.5rem;padding:0;background:transparent;border-radius:0;border:none}.list-description p{margin:0;color:#ffffffb3;font-size:.95rem;line-height:1.5}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .list-description p{color:var(--text-muted)}}.list-content .items-section{margin-top:.5rem}.list-content .active-items,.list-content .completed-items{display:flex;flex-direction:column;gap:.35rem;padding:0 3px}.list-content .item-card{position:relative;display:flex;align-items:center;gap:.5rem;padding:.5rem;margin:0;background:var(--bg-card);border:1px solid var(--list-item-border-color, var(--border-color));border-radius:var(--radius-md);box-shadow:var(--shadow-sm);touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;transition:border-color .2s ease,box-shadow .2s ease,opacity .18s ease,transform .18s cubic-bezier(.2,.9,.3,1)}.list-content .item-card:focus{outline:none;background:var(--bg-card)}.list-content .item-card.just-added{animation:item-highlight-fade 2s ease-out}@keyframes item-highlight-fade{0%{box-shadow:0 0 0 2px var(--color-primary, #10b981);background:#10b9811f}70%{box-shadow:0 0 0 2px var(--color-primary, #10b981);background:#10b98114}to{box-shadow:var(--shadow-sm);background:var(--bg-card)}}.list-content .item-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(hover:hover)and (pointer:fine){.list-content .item-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md)}}.list-content .item-card.selected{border-color:var(--color-primary);background:var(--bg-card-hover)}.list-content .item-card.completing{opacity:0;transform:translateY(8px) scale(.99);pointer-events:none}.list-content .item-checkbox{display:flex;align-items:center;justify-content:center;flex-shrink:0}.list-content .item-checkbox input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:0;background:var(--bg-card);border:2px solid var(--border-color);border-radius:4px;cursor:pointer;transition:border-color .2s ease,background-color .2s ease}.list-content .item-checkbox input[type=checkbox]:hover{border-color:var(--color-primary)}.list-content .item-checkbox input[type=checkbox]:checked{background-color:var(--color-primary);border-color:var(--color-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-size:12px;background-position:center;background-repeat:no-repeat}.list-content .item-name{flex:1;font-size:.9rem;font-weight:500;line-height:1.35;color:var(--text-main);word-break:break-word;transition:color .2s ease,opacity .2s ease}.item-container{width:100%}.list-content .item-expand-btn{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:transparent;border:none;color:var(--text-muted);cursor:pointer;transition:color .2s ease,background .2s ease;border-radius:var(--radius-sm)}.list-content .item-expand-btn svg{width:13px;height:13px}@media(hover:hover)and (pointer:fine){.list-content .item-expand-btn:hover{background:var(--bg-secondary);color:var(--text-main)}}.list-content .item-expand-btn .expand-icon{display:inline-flex;transition:transform .2s ease}.list-content .item-expand-btn .expand-icon.expanded{transform:rotate(180deg)}.list-content .item-card.expanded{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-color:transparent}.list-content .item-options-panel{display:grid;grid-template-rows:0fr;opacity:0;transform:translateY(-4px);pointer-events:none;will-change:opacity,transform;transition:grid-template-rows .2s ease,opacity .2s ease,transform .2s ease}.list-content .item-options-panel.is-open{grid-template-rows:1fr;opacity:1;transform:translateY(0);pointer-events:auto}.list-content .item-options-panel-inner{min-height:0;overflow:hidden;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:0;background:transparent;border:0;border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.list-content .item-options-panel.is-open .item-options-panel-inner{padding:.4rem .4rem .4rem .6rem;background:var(--bg-card);border:1px solid var(--list-item-border-color, var(--border-color));border-top:none}.list-content .item-options-left{display:flex;flex-direction:column;align-items:flex-start;gap:.4rem}.list-content .item-flows-list{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.4rem}.list-content .item-flow-switch{--switch-accent: var(--color-primary);display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.15rem 0;cursor:pointer}.list-content .item-flow-switch-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--switch-accent)}.list-content .item-flow-switch-label{flex:1;min-width:0;font-size:.8rem;color:var(--text-muted);transition:color .2s ease;-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-content .item-flow-switch.active .item-flow-switch-label{color:var(--text-main);font-weight:500}.list-content .item-flow-switch-track{position:relative;width:36px;height:20px;flex-shrink:0;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:999px;padding:0;cursor:pointer;transition:background .2s ease,border-color .2s ease}.list-content .item-flow-switch.active .item-flow-switch-track{background:var(--switch-accent);border-color:var(--switch-accent)}.list-content .item-flow-switch-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .2s ease;box-shadow:0 1px 3px #0003}.list-content .item-flow-switch.active .item-flow-switch-thumb{transform:translate(16px)}.list-content .item-flow-switch.viewing{background:color-mix(in srgb,var(--switch-accent) 8%,transparent);border-radius:var(--radius-sm);padding:.15rem .35rem;margin:0 -.35rem}.list-content .item-flow-switch-viewing{font-size:.65rem;font-weight:400;color:var(--text-muted);margin-left:.35rem;opacity:.7}.list-content .item-flow-dots{display:inline-flex;align-items:center;gap:3px;margin-left:8px;vertical-align:middle}.list-content .item-flow-dot{width:6px;height:6px;border-radius:50%;display:inline-block}.list-content .item-options-right{display:flex;flex-direction:column;align-items:flex-end;gap:.4rem}.list-content .item-quantity-row{display:flex;align-items:center;gap:.4rem}.list-content .item-quantity-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.list-content .item-quantity-stepper{display:flex;align-items:center;gap:.35rem}.list-content .item-quantity-btn{width:26px;height:26px;padding:0;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);cursor:pointer;transition:background .2s ease,color .2s ease}.list-content .item-quantity-btn svg{width:13px;height:13px}@media(hover:hover)and (pointer:fine){.list-content .item-quantity-btn:hover{background:var(--bg-secondary)}}.list-content .item-quantity-btn:disabled{opacity:.5;cursor:not-allowed}.list-content .item-quantity-input{width:48px;height:26px;padding:0 .35rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);text-align:center}.list-content .item-quantity-scope{display:flex;align-items:center;justify-content:flex-end;gap:.4rem}.list-content .item-quantity-scope-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap;margin-right:.15rem}.list-content .item-quantity-scope-btn{height:28px;padding:0 .6rem;border:1px solid #2d8a4e;border-radius:var(--radius-sm);background-color:#2d8a4e;color:#fff;font-size:.75rem;font-weight:500;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease,opacity .15s ease;white-space:nowrap}.list-content .item-quantity-scope-btn:focus{outline:none;background-color:#2d8a4e}.list-content .item-quantity-scope-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}.list-content .item-quantity-scope-btn:hover:not(:disabled){background-color:#267a44;border-color:#267a44}.list-content .item-quantity-scope-btn:disabled{opacity:1;cursor:default;pointer-events:none;background-color:transparent;border-color:var(--border-color);color:var(--text-muted)}.list-content .item-quantity-scope-btn.scope-btn-remember{border-color:#22703c;background-color:#22703c;color:#fff}.list-content .item-quantity-scope-btn.scope-btn-remember:focus{outline:none;background-color:#22703c}.list-content .item-quantity-scope-btn.scope-btn-remember:hover:not(:disabled){background-color:#1c6033;border-color:#1c6033}.list-content .item-quantity-scope-btn.scope-btn-remember:disabled{background-color:transparent;border-color:var(--border-color);color:var(--text-muted)}.list-content .item-quantity-scope-cancel{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);cursor:pointer;transition:color .15s ease,background .15s ease;flex-shrink:0}.list-content .item-quantity-scope-cancel svg{width:14px;height:14px}.list-content .item-quantity-scope-cancel:hover{color:var(--text-main);background:var(--bg-secondary)}@keyframes options-panel-expand{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.list-content .item-options-panel{transition:none}}.list-content .item-option-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;background:transparent;border:none;color:var(--text-main);cursor:pointer;transition:background .2s ease,color .2s ease,transform .1s ease;border-radius:var(--radius-sm)}.list-content .item-option-btn svg{width:18px;height:18px}@media(hover:hover)and (pointer:fine){.list-content .item-option-btn:hover{background:var(--bg-secondary);transform:scale(1.1)}}.list-content .item-option-btn.delete{color:var(--color-danger)}@media(hover:hover)and (pointer:fine){.list-content .item-option-btn.delete:hover{background:var(--color-danger-bg)}}.list-content .completed-items{margin-top:.75rem}.list-content .completed-header-heading{margin:0 0 .2rem}.list-content .completed-header{display:flex;align-items:center;gap:.35rem;width:100%;min-height:30px;margin:0;padding:.2rem .25rem;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease;background:transparent;border:none;text-align:left;border-radius:var(--radius-sm)}@media(hover:hover)and (pointer:fine){.list-content .completed-header:hover{background:var(--bg-overlay)}}.list-content .completed-header .chevron{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;opacity:.7;transition:transform .2s ease}.list-content .completed-header .chevron svg{width:12px;height:12px}.list-content .completed-header .chevron.expanded{transform:rotate(90deg)}.list-content .item-card.completed{opacity:.6;background:var(--bg-secondary);border-color:var(--border-color);animation:completed-item-enter .18s cubic-bezier(.2,.9,.3,1);will-change:opacity,transform}.list-content .item-card.completed .item-name{text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:var(--text-muted);color:var(--text-muted)}.list-content .item-card.completed:hover{opacity:.7;border-color:var(--border-color)}@keyframes completed-item-enter{0%{opacity:0;transform:translateY(-6px)}to{opacity:.6;transform:translateY(0)}}.list-content .item-card.add-item-row{border:none;border-top:1px solid var(--border-color);border-radius:0;background:transparent;margin-top:0}.list-content .item-card.add-item-row:focus-within{background:var(--bg-overlay);border-bottom:1px solid var(--color-primary)}.sortable-item-wrapper{width:100%}.sortable-item-wrapper.sortable-placeholder .item-card{background:transparent;border:2px dashed var(--border-dashed);border-radius:var(--radius-md);box-shadow:none;opacity:1}.sortable-item-wrapper.sortable-placeholder .item-card>*{opacity:0;visibility:hidden}.item-card.dragging{background:var(--bg-card);box-shadow:var(--shadow-lg);opacity:.95;z-index:9999}.item-card.dragging-source{opacity:.3;background:var(--bg-secondary);border:1px dashed var(--border-color)}.drag-placeholder{height:50px;margin-bottom:.35rem;background:#4299e11a;border:2px dashed rgba(66,153,225,.4);border-radius:var(--radius-md);box-sizing:border-box;animation:drag-placeholder-open .2s ease-out forwards}@keyframes drag-placeholder-open{0%{height:0;margin-bottom:0;opacity:0}to{height:50px;margin-bottom:.35rem;opacity:1}}.list-flow-toolbar{display:flex;align-items:center;gap:.5rem;padding:.35rem 0;margin-bottom:.5rem}.list-flow-toolbar-header{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.list-flow-label{flex-shrink:0;font-size:.9rem;font-weight:600;color:var(--text-muted)}@media(max-width:480px){.list-flow-label{display:none}}.flow-action-buttons{display:flex;align-items:center;gap:.25rem;margin-left:auto;flex-shrink:0}.flow-chips-container{display:flex;align-items:center;gap:.5rem;flex:1;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;padding:.25rem 0;flex-wrap:nowrap}.flow-chips-container::-webkit-scrollbar{display:none}.flow-chips-container .chip{flex-shrink:0}.flow-action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-main);cursor:pointer;transition:background .15s,border-color .15s,color .15s}.flow-action-btn svg{width:18px;height:18px}.flow-action-btn:hover:not(:disabled){background:var(--bg-secondary);border-color:var(--color-primary);color:var(--color-primary)}.flow-action-btn:disabled{opacity:.4;cursor:not-allowed}.flow-add-text-btn{display:flex;align-items:center;padding:.4rem .75rem;background:var(--bg-card);border:1px dashed var(--border-color);border-radius:var(--radius-md);color:var(--text-muted);font-size:.85rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}.flow-add-text-btn:hover{background:var(--bg-secondary);border-color:var(--color-primary);color:var(--color-primary)}.flow-empty-state{display:flex;align-items:center;gap:.75rem}.flow-empty-icon{color:var(--text-muted);flex-shrink:0}.flow-empty-hint{font-size:.9rem;color:var(--text-muted)}.flow-chip{--flow-accent: var(--color-primary);flex-shrink:0;padding:.5rem 1rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:20px;color:var(--text-main);font-size:.9rem;font-weight:500;white-space:nowrap;cursor:pointer;box-shadow:var(--shadow-sm);transition:background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;display:inline-flex;align-items:center;gap:.5rem}.flow-chip[data-flow-color=blue]{--flow-accent: var(--flow-accent-blue)}.flow-chip[data-flow-color=teal]{--flow-accent: var(--flow-accent-teal)}.flow-chip[data-flow-color=green]{--flow-accent: var(--flow-accent-green)}.flow-chip[data-flow-color=amber]{--flow-accent: var(--flow-accent-amber)}.flow-chip[data-flow-color=orange]{--flow-accent: var(--flow-accent-orange)}.flow-chip[data-flow-color=rose]{--flow-accent: var(--flow-accent-rose)}.flow-chip[data-flow-color=purple]{--flow-accent: var(--flow-accent-purple)}.flow-chip[data-flow-color=slate]{--flow-accent: var(--flow-accent-slate)}.flow-chip:before{content:"";width:.5rem;height:.5rem;border-radius:999px;background:var(--flow-accent);flex-shrink:0}.flow-chip:hover{background:var(--bg-secondary);border-color:var(--flow-accent);transform:translateY(-1px);box-shadow:var(--shadow-md)}.flow-chip:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.flow-chip-active{background:var(--flow-accent);border-color:var(--flow-accent);color:var(--text-inverse);font-weight:600;box-shadow:var(--shadow-md)}.flow-chip-active:before{background:var(--text-inverse);opacity:.9}.flow-chip-active:hover{background:color-mix(in srgb,var(--flow-accent) 85%,black);border-color:color-mix(in srgb,var(--flow-accent) 85%,black);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.flow-chip-add{padding:.5rem .875rem;background:transparent;border:1px dashed var(--border-color);color:var(--text-muted);font-size:1rem;font-weight:400}.flow-chip-add:hover{background:var(--bg-secondary);border-color:var(--color-primary);border-style:solid;color:var(--color-primary)}.list-flow-section{margin-bottom:.75rem}.list-flow-section-title{margin:.5rem 0 .35rem;padding-bottom:.2rem;border-bottom:1px solid var(--border-color);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.list-flow-separator{margin-top:.5rem}.list-flow-boundary-hint{margin:-.15rem 0 .35rem;font-size:.75rem;font-weight:400;color:var(--text-muted);font-style:italic;line-height:1.25}.list-flow-items{display:flex;flex-direction:column;gap:.35rem;padding:0 3px}.drag-scroll-spacer{width:100%;flex:0 0 auto}.flow-popup-hint{margin:0 0 .75rem;color:var(--text-muted);font-size:.85rem;line-height:1.3}.flow-popup-flow-list{display:flex;flex-direction:column;gap:0}.flow-popup-flow-row{display:flex;align-items:center;gap:.5rem;padding:.6rem 0;border-bottom:1px solid var(--border-color)}.flow-popup-flow-row:last-child{border-bottom:none}.flow-popup-flow-name{flex:1;min-width:0;text-align:left;padding:0;background:none;border:none;color:var(--text-main);font-size:1rem;cursor:pointer}.flow-popup-flow-name:hover{color:var(--color-primary)}.flow-popup-flow-name.active{color:var(--color-primary);font-weight:600}.flow-popup-edit-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;background:none;border:none;border-radius:var(--radius-md);color:var(--text-muted);cursor:pointer}.flow-popup-edit-btn svg{width:18px;height:18px}.flow-popup-edit-btn:hover{color:var(--color-primary);background:var(--bg-secondary)}.flow-popup-add-row{display:flex;align-items:center;gap:.5rem;padding:.6rem 0;margin-top:.25rem;border-top:1px solid var(--border-color);opacity:.7}.flow-popup-add-row:focus-within{opacity:1}.flow-popup-add-icon{color:var(--text-muted);flex-shrink:0}.flow-popup-add-icon svg{width:18px;height:18px}.flow-popup-add-input{flex:1;min-width:0;padding:.25rem 0;background:transparent;border:none;border-bottom:1px solid transparent;color:var(--text-main);font-size:1rem;font-family:inherit}.flow-popup-add-input:focus{outline:none;border-bottom-color:var(--color-primary)}.flow-popup-add-input::placeholder{color:var(--text-muted)}.flow-popup-color-row{display:flex;align-items:center;gap:.5rem;padding-top:.35rem}.flow-popup-flow-dot{width:.55rem;height:.55rem;border-radius:999px;flex-shrink:0}.list-flow-scroll-container{max-height:calc(100vh - 250px);overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;display:flex;flex-direction:column;gap:.75rem}.list-flow-empty{padding:1rem;background:var(--bg-overlay);border:1px dashed var(--border-dashed);border-radius:var(--radius-md);color:var(--text-muted);text-align:center}.item-card.list-flow-unordered{background:var(--bg-secondary);cursor:grab;-webkit-user-select:none;user-select:none}.item-card.list-flow-unordered:active{cursor:grabbing}.item-card.list-flow-unavailable{opacity:.6;background:var(--bg-secondary)}.item-card.list-flow-unavailable .item-name{text-decoration:none;color:var(--text-muted)}.list-flow-unavailable-badge{display:inline-flex;align-items:center;gap:.35rem;flex-shrink:0;padding:.15rem .45rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--bg-overlay);color:var(--text-muted);font-size:.75rem;line-height:1}.list-flow-unavailable-badge svg{width:14px;height:14px}.list-flow-unavailable-badge-text{white-space:nowrap}.item-card.list-flow-ghost{opacity:.4;background:transparent;border:1px dashed var(--border-color);pointer-events:none;-webkit-user-select:none;user-select:none;animation:ghostFadeIn .15s ease-out}@keyframes ghostFadeIn{0%{opacity:0}to{opacity:.4}}.item-card.list-flow-ghost .item-name{color:var(--text-muted);font-style:italic}.item-card.list-flow-ghost .item-checkbox input[type=checkbox]{opacity:.4;cursor:default}.list-flow-ghost-hint{font-size:.8rem;font-weight:400;color:var(--text-muted);font-style:italic}.item-card.list-flow-dragging{opacity:0}.item-card.list-flow-dragging>*{opacity:0}.item-card.flow-mode-drop-placeholder{background:#4299e114;border:2px dashed rgba(66,153,225,.5);border-radius:var(--radius-md);box-shadow:none;min-height:54px}.item-card.flow-mode-drop-placeholder>*{opacity:0}@media(prefers-reduced-motion:reduce){.list-content .item-card.completing{transition:none;transform:none}.list-content .item-card.completed{animation:none}.drag-placeholder{animation:none;height:58px;margin-bottom:.5rem;opacity:1}}.list-view-container{--list-footer-clearance: calc( 5rem + env(safe-area-inset-bottom, 0px) + var(--visual-viewport-bottom-offset, 0px) );--list-item-border-color: rgba(0, 0, 0, .12);height:100vh;height:100dvh;min-height:0;overflow:hidden}:root[data-theme=dark] .list-view-container{--list-item-border-color: rgba(255, 255, 255, .12)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .list-view-container{--list-item-border-color: rgba(255, 255, 255, .12)}}.list-view-container .app-main{position:relative;display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:0;padding-top:1rem;padding-left:0;padding-right:0;max-width:900px;margin:0 auto;width:100%}.list-view-container .list-content{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;max-width:100%;margin:0;padding:0 1rem;width:100%}.list-view-container .items-section{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;margin-top:0}.list-view-container .items-list{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.list-view-container .active-items{flex:1;display:flex;flex-direction:column;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;scroll-padding-bottom:var(--list-footer-clearance)}.list-view-container .active-items.mode-flow{overflow-y:auto}.active-items.flow-switch-pending{opacity:.6;transition:opacity .1s ease-out;pointer-events:none}.list-view-container .list-flow-scroll-container{max-height:none!important;flex:1;overflow:visible;padding-bottom:var(--list-footer-clearance)}.list-content .add-item-row{opacity:.7;border-style:none;background:transparent;cursor:text;position:relative;border-top:1px solid var(--border-color)}@media(hover:hover)and (pointer:fine){.list-content .add-item-row:hover{opacity:.9;background:var(--bg-overlay)}}.list-content .add-item-row:focus-within{opacity:1;background:var(--bg-overlay);border-bottom:1px solid var(--color-primary)}.list-content .add-item-row .item-checkbox.placeholder{display:flex;align-items:center;justify-content:center;width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:var(--bg-overlay)}.list-content .add-item-row .plus-icon{width:auto;height:auto;border-radius:0;background:transparent;display:block;line-height:1;color:var(--text-muted);transform:none}.list-content .add-item-row .plus-icon svg{width:16px;height:16px;display:block}.item-name-input{flex:1}.item-name-input .item-input{width:100%;padding:.25rem 0;background:transparent;border:none;border-bottom:1px solid var(--border-color);border-radius:0;color:var(--text-main);box-shadow:none}.item-name-input .item-input:focus{border-bottom-color:var(--color-primary);box-shadow:none;outline:none}.item-name-input .item-input::placeholder{color:var(--text-muted)}.item-name-input .input-hint{display:none}.add-item-error{margin:.5rem 0 0;padding-left:1rem;font-size:.85rem;color:var(--color-danger)}.item-name-input .item-suggestions{top:auto;bottom:100%;margin-top:0;margin-bottom:.5rem;background:var(--bg-card);border-color:var(--border-color);color:var(--text-main);box-shadow:var(--shadow-lg)}.item-name-input .suggestion-item{color:var(--text-main)}.item-name-input .suggestion-item:hover,.item-name-input .suggestion-item.selected{background-color:var(--bg-secondary)}.item-name-input .suggestion-item .usage-badge{background:var(--bg-overlay);color:var(--text-muted)}.item-name-input .suggestion-item .last-used{color:var(--text-muted)}.item-name-input .no-suggestions{background:var(--bg-card);color:var(--text-muted)}.list-footer{position:fixed;bottom:var(--visual-viewport-bottom-offset, 0px);left:0;right:0;z-index:100;background:var(--bg-card);border-top:1px solid var(--border-color);padding-bottom:env(safe-area-inset-bottom,0)}.list-footer-content{max-width:900px;margin:0 auto;padding:0 1rem}.list-footer .add-item-row{display:flex;align-items:center;gap:.75rem;padding:.75rem .5rem;opacity:.7;border-style:none;background:transparent;cursor:text;position:relative;border-radius:0;box-shadow:none;margin:0}.list-footer .add-item-row.add-item-row--prominent{opacity:1;background:transparent;border:none;border-radius:0;box-shadow:none}.list-footer .add-item-row.add-item-row--prominent:hover{background:var(--bg-card)}.list-footer .add-item-row.add-item-row--prominent:focus-within{box-shadow:var(--shadow-md)}.list-footer .add-item-row:hover{opacity:.9;background:var(--bg-overlay)}.list-footer .add-item-row:focus-within{opacity:1;background:var(--bg-overlay)}.list-footer .add-item-row .item-checkbox.placeholder{display:flex;align-items:center;justify-content:center;width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:var(--bg-overlay)}.list-footer .add-item-row .plus-icon{width:auto;height:auto;border-radius:0;background:transparent;display:block;font-size:1.1rem;font-weight:600;line-height:1;color:var(--text-muted);transform:none}.list-footer .add-item-row .plus-icon svg{width:16px;height:16px;display:block}.list-footer .add-item-row.add-item-row--prominent .plus-icon{color:var(--color-primary)}.item-suggestions{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:#fff;border:1px solid #ddd;border-radius:6px;box-shadow:0 4px 12px #00000026;max-height:200px;overflow-y:auto;z-index:1000}.item-suggestions.position-below{top:100%;bottom:auto;margin-top:4px;margin-bottom:0}.item-suggestions.position-above{top:auto;bottom:100%;margin-top:0;margin-bottom:4px}.suggestions-loading{padding:12px 16px;text-align:center;color:#666;font-size:14px}.suggestions-list{list-style:none;margin:0;padding:4px 0}.suggestion-item{padding:10px 16px;cursor:pointer;transition:background-color .15s ease;border-left:3px solid transparent}.suggestion-item:hover,.suggestion-item.selected{background-color:#f5f5f5;border-left-color:#007bff}.suggestion-item.selected{background-color:#e8f4fd}.suggestion-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.suggestion-name{flex:1;font-size:14px;font-weight:500;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.suggestion-meta{display:flex;align-items:center;gap:8px;flex-shrink:0}.usage-badge{display:inline-flex;align-items:center;justify-content:center;background:#e3f2fd;color:#1976d2;font-size:11px;font-weight:600;padding:2px 6px;border-radius:10px;min-width:28px}.last-used{font-size:11px;color:#999;white-space:nowrap}.no-suggestions{padding:16px;text-align:center;color:#999;font-size:13px}:root[data-theme=dark] .item-suggestions{background:#2a2a2a;border-color:#444;box-shadow:0 4px 12px #0006}:root[data-theme=dark] .suggestion-item:hover,:root[data-theme=dark] .suggestion-item.selected{background-color:#3a3a3a}:root[data-theme=dark] .suggestion-item.selected{background-color:#2d4a6d}:root[data-theme=dark] .suggestion-name{color:#e0e0e0}:root[data-theme=dark] .usage-badge{background:#1e3a5f;color:#64b5f6}:root[data-theme=dark] .last-used,:root[data-theme=dark] .no-suggestions,:root[data-theme=dark] .suggestions-loading{color:#888}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .item-suggestions{background:#2a2a2a;border-color:#444;box-shadow:0 4px 12px #0006}:root:not([data-theme=light]) .suggestion-item:hover,:root:not([data-theme=light]) .suggestion-item.selected{background-color:#3a3a3a}:root:not([data-theme=light]) .suggestion-item.selected{background-color:#2d4a6d}:root:not([data-theme=light]) .suggestion-name{color:#e0e0e0}:root:not([data-theme=light]) .usage-badge{background:#1e3a5f;color:#64b5f6}:root:not([data-theme=light]) .last-used,:root:not([data-theme=light]) .no-suggestions,:root:not([data-theme=light]) .suggestions-loading{color:#888}}.item-input-container{position:relative;width:100%}.item-input-container.focused{z-index:100}.item-input{width:100%;padding:10px 12px;border:2px solid #ddd;border-radius:6px;font-size:14px;font-family:inherit;transition:border-color .2s ease,box-shadow .2s ease}.item-input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.item-input::placeholder{color:#999}.input-hint{margin-top:6px;font-size:11px;color:#666;display:flex;align-items:center;gap:4px;height:18px;min-height:18px;max-height:18px;overflow:hidden}.input-hint kbd{display:inline-block;padding:2px 6px;background:#f5f5f5;border:1px solid #ddd;border-radius:3px;font-size:10px;font-family:Courier New,monospace;font-weight:600;color:#333;box-shadow:0 1px 1px #0000001a}:root[data-theme=dark] .item-input{background:#2a2a2a;border-color:#444;color:#e0e0e0}:root[data-theme=dark] .item-input:focus{border-color:#4a9eff;box-shadow:0 0 0 3px #4a9eff33}:root[data-theme=dark] .item-input::placeholder{color:#666}:root[data-theme=dark] .input-hint{color:#888}:root[data-theme=dark] .input-hint kbd{background:#3a3a3a;border-color:#555;color:#e0e0e0}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .item-input{background:#2a2a2a;border-color:#444;color:#e0e0e0}:root:not([data-theme=light]) .item-input:focus{border-color:#4a9eff;box-shadow:0 0 0 3px #4a9eff33}:root:not([data-theme=light]) .item-input::placeholder{color:#666}:root:not([data-theme=light]) .input-hint{color:#888}:root:not([data-theme=light]) .input-hint kbd{background:#3a3a3a;border-color:#555;color:#e0e0e0}}.flow-order-popup-overlay-root{position:fixed;inset:0;z-index:1100;display:flex;justify-content:center;align-items:stretch}.flow-order-popup-backdrop{position:absolute;inset:0;background:var(--bg-overlay-strong);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:flowOrderBackdropFadeIn .2s ease-out}@keyframes flowOrderBackdropFadeIn{0%{opacity:0}to{opacity:1}}.flow-order-popup-container{position:relative;width:100%;max-width:800px;display:flex;flex-direction:column;background:var(--bg-root);animation:flowOrderPopupSlideIn .25s ease-out}@keyframes flowOrderPopupSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.flow-order-popup-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--bg-card);border-bottom:1px solid var(--border-color);flex-shrink:0}.flow-order-popup-title{flex:1;margin:0;font-size:1.1rem;font-weight:600;color:var(--text-main)}.flow-order-popup-close{padding:.5rem 1.15rem;min-height:40px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:.95rem;font-weight:600;cursor:pointer;transition:background .15s ease}.flow-order-popup-close:hover{background:var(--color-primary-hover)}.flow-order-popup-footer{display:none;padding:.75rem 1rem;background:var(--bg-card);border-top:1px solid var(--border-color);flex-shrink:0;padding-bottom:calc(.75rem + env(safe-area-inset-bottom))}.flow-order-popup-description{padding:.5rem 1rem 0;font-size:.9rem;color:var(--text-muted)}.flow-order-popup-close-mobile{width:100%}.flow-order-popup-list{--flow-order-popup-item-inset: .5rem;flex:1;overflow-y:auto;overflow-x:hidden;padding:.5rem 1rem 1rem;display:flex;flex-direction:column;gap:.4rem}.flow-order-popup-neighbor{display:flex;align-items:center;padding:.6rem 1rem;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border-color);min-height:40px}.flow-order-popup-neighbor-name{font-size:.95rem;font-weight:500;color:var(--text-muted);word-break:break-word}.flow-order-popup-edge-label{font-size:.85rem;font-style:italic;color:var(--text-muted)}.flow-order-popup-item{display:flex;align-items:center;gap:.65rem;margin:0 var(--flow-order-popup-item-inset);padding:.7rem .75rem;border-radius:var(--radius-md);border:2px solid var(--border-color);background:var(--bg-card);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:manipulation;transition:border-color .15s ease,box-shadow .15s ease}.flow-order-popup-item:active{cursor:grabbing}.flow-order-popup-real{border-color:var(--color-primary);background:var(--bg-card)}.flow-order-popup-ghost{opacity:.55;border-style:dashed;border-color:var(--border-color);background:transparent}.flow-order-popup-dragging{opacity:.3}.flow-order-popup-overlay{box-shadow:var(--shadow-lg);opacity:1}.flow-order-popup-grip{flex-shrink:0;display:flex;align-items:center;color:var(--text-muted);line-height:1}.flow-order-popup-name{flex:1;min-width:0;font-size:1rem;font-weight:500;color:var(--text-main);word-break:break-word}.flow-order-popup-ghost .flow-order-popup-name{color:var(--text-muted);font-style:italic}@media(max-width:640px){.flow-order-popup-header{padding:.6rem .75rem}.flow-order-popup-close-desktop{display:none}.flow-order-popup-footer{display:block;padding:.6rem .75rem;padding-bottom:calc(.6rem + env(safe-area-inset-bottom))}.flow-order-popup-list{--flow-order-popup-item-inset: .35rem;padding:.5rem .75rem 1rem}.flow-order-popup-description{padding:.45rem .75rem 0}.flow-order-popup-item{padding:.65rem .6rem}.flow-order-popup-neighbor{padding:.5rem .75rem}}.flow-color-picker{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.flow-color-picker--compact{gap:.4rem}.flow-color-swatch{--swatch-color: var(--color-primary);width:1.5rem;height:1.5rem;border-radius:999px;border:2px solid transparent;background:var(--swatch-color);cursor:pointer;padding:0;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;position:relative;flex-shrink:0}.flow-color-picker--compact .flow-color-swatch{width:1.25rem;height:1.25rem}.flow-color-swatch:hover{transform:scale(1.15);box-shadow:0 0 0 2px var(--bg-card),0 0 0 4px var(--swatch-color)}.flow-color-swatch--selected{border-color:var(--bg-card);box-shadow:0 0 0 2px var(--swatch-color);transform:scale(1.1)}.flow-color-swatch--selected:hover{transform:scale(1.15)}.flow-color-swatch--selected:after{content:"";position:absolute;top:50%;left:50%;width:.45rem;height:.25rem;border-left:2px solid white;border-bottom:2px solid white;transform:translate(-50%,-60%) rotate(-45deg)}.list-builder-page{min-height:100vh;background:var(--bg-root);padding-bottom:80px}.list-builder-content{max-width:1200px;margin:0 auto;padding:0 1.5rem}.list-name-section{background:var(--bg-card);padding:1.5rem;margin:1.5rem 0;border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.list-name-input{width:100%;padding:.75rem 1rem;font-size:1rem;border:1px solid var(--border-color);border-radius:var(--radius-md);transition:border-color .15s ease;background:var(--bg-card);color:var(--text-main)}.list-name-input:focus{outline:none;border-color:var(--color-primary)}.selection-toolbar{background:var(--bg-card);padding:1rem 1.5rem;margin:1.5rem 0;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);display:flex;justify-content:space-between;align-items:center;gap:1rem}.selection-info{display:flex;align-items:center;gap:.75rem}.sort-controls{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.sort-controls label{color:var(--text-muted);font-weight:500}.sort-select{padding:.5rem .75rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-main);font-size:.9rem;cursor:pointer;transition:border-color .15s ease}.sort-select:focus{outline:none;border-color:var(--color-primary)}.selection-info input[type=checkbox]{width:18px;height:18px;cursor:pointer}.selection-info label{font-weight:500;color:var(--text-main);cursor:pointer;-webkit-user-select:none;user-select:none}.selection-info .count{margin-left:auto;color:var(--text-muted);font-size:.9rem}.items-grid{display:grid;grid-template-columns:1fr;gap:.75rem}@media(min-width:768px){.items-grid{grid-template-columns:repeat(2,1fr)}}.item-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.75rem;display:flex;align-items:center;gap:.75rem;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.list-builder-page .item-expand-btn{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin-left:.25rem;background:transparent;border:none;color:var(--text-muted);cursor:pointer;transition:color .2s ease,background .2s ease;border-radius:var(--radius-sm)}.list-builder-page .item-expand-btn svg{width:13px;height:13px}@media(hover:hover)and (pointer:fine){.list-builder-page .item-expand-btn:hover{background:var(--bg-secondary);color:var(--text-main)}}.list-builder-page .item-expand-btn .expand-icon{display:inline-flex;transition:transform .2s ease}.list-builder-page .item-expand-btn .expand-icon.expanded{transform:rotate(180deg)}.list-builder-page .item-card.expanded{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-color:transparent}.list-builder-page .item-options-panel{display:none;background:var(--bg-card);border:1px solid var(--border-color);border-top:none;border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);padding:.5rem .75rem}.list-builder-page .item-options-panel.is-open{display:block}.list-builder-page .item-options-panel-inner{display:flex;justify-content:flex-end}.list-builder-page .item-options-right{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.list-builder-page .item-quantity-row{display:flex;align-items:center;gap:.4rem}.list-builder-page .item-quantity-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.list-builder-page .item-quantity-stepper{display:flex;align-items:center;gap:.35rem}.list-builder-page .item-quantity-btn{width:26px;height:26px;padding:0;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);cursor:pointer}.list-builder-page .item-quantity-btn svg{width:13px;height:13px}.list-builder-page .item-quantity-btn:disabled{opacity:.5;cursor:not-allowed}.list-builder-page .item-quantity-input{width:48px;height:26px;padding:0 .35rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);text-align:center}.list-builder-page .item-quantity-scope{display:flex;align-items:center;justify-content:flex-end;gap:.4rem}.list-builder-page .item-quantity-scope-btn{height:28px;padding:0 .6rem;border:1px solid var(--color-primary);border-radius:var(--radius-sm);background:var(--color-primary);color:#fff;font-size:.75rem;font-weight:500;cursor:pointer;white-space:nowrap}.list-builder-page .item-quantity-scope-btn.scope-btn-remember{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.list-builder-page .item-quantity-scope-btn:disabled,.list-builder-page .item-quantity-scope-btn.scope-btn-remember:disabled{opacity:1;cursor:default;pointer-events:none;background-color:transparent;border-color:var(--border-color);color:var(--text-muted)}.item-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.item-card.selected{border-color:var(--color-primary);background:var(--bg-card-hover);box-shadow:var(--shadow-sm)}.item-card.existing{opacity:.6}.item-card.existing.selected{opacity:1}.item-checkbox{width:20px;height:20px;cursor:pointer;flex-shrink:0}.item-name{flex:1;font-weight:500;font-size:.95rem;color:var(--text-main);word-break:break-word}.existing-badge{display:inline-block;background:var(--bg-secondary);color:var(--color-primary);font-size:.7rem;padding:2px 6px;border-radius:10px;white-space:nowrap;flex-shrink:0}.action-bar{position:fixed;bottom:0;left:0;right:0;background:var(--bg-card);border-top:1px solid var(--border-color);box-shadow:0 -4px 12px #00000014;z-index:100;padding-bottom:env(safe-area-inset-bottom)}.action-bar-content{max-width:1200px;margin:0 auto;padding:.75rem 1.5rem;display:flex;gap:.75rem;justify-content:flex-end}.cancel-btn{padding:.65rem 1.25rem;min-height:40px;font-size:.95rem;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-main);border-radius:var(--radius-md);cursor:pointer;transition:background .15s ease;font-weight:500}.cancel-btn:hover:not(:disabled){background:var(--bg-card-hover)}.submit-btn{padding:.65rem 1.25rem;min-height:40px;font-size:.95rem;border:none;background:var(--color-primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:background .15s ease;font-weight:600}.submit-btn:disabled,.cancel-btn:disabled{opacity:.5;cursor:not-allowed}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-muted)}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:1rem}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top:3px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@media(max-width:640px){.list-builder-page{padding-bottom:90px}.list-builder-page .page-header{padding:1rem}.list-builder-page .header-content h1{font-size:1.25rem}.list-builder-page .subtitle{font-size:.85rem}.list-name-section{margin:.75rem;padding:0;background:transparent;box-shadow:none}.list-name-input{font-size:16px;background:var(--bg-card);border-color:var(--border-color)}.selection-toolbar{margin:0 .75rem .75rem;padding:.75rem 0;flex-wrap:wrap;gap:.75rem;background:transparent;box-shadow:none}.selection-info{width:100%;flex-wrap:wrap;gap:.625rem}.selection-info .count{margin-left:0;font-size:.85rem}.sort-controls{width:100%;gap:.625rem}.sort-controls label{flex-shrink:0}.sort-select{flex:1;font-size:16px}.suggestions-list{padding:0 .75rem}.items-grid{grid-template-columns:1fr;gap:.5rem}.item-card{padding:.75rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-md)}.item-card:hover{background:var(--bg-overlay)}.item-card.selected{background:var(--bg-card-hover);border-color:var(--color-primary)}.item-name{font-size:1rem}.action-bar-content{padding:.75rem}.cancel-btn,.submit-btn{flex:1;min-width:0}}@media(min-width:641px)and (max-width:768px){.items-grid{grid-template-columns:repeat(2,1fr)}.action-bar{gap:.875rem}}@media(max-width:640px){:root[data-theme=dark] .list-name-input{background:var(--bg-card);border-color:var(--border-color)}}@media(max-width:640px)and (prefers-color-scheme:dark){:root:not([data-theme=light]) .list-name-input{background:var(--bg-card);border-color:var(--border-color)}}.flows-container{display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--bg-root)}.flows-content{flex:1;overflow-y:auto;padding:1rem;max-width:800px;margin:0 auto;width:100%}.flows-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center;color:var(--text-muted)}.flows-empty p{margin-bottom:1.5rem}.flows-actions{display:flex;justify-content:flex-end;margin-bottom:1rem}.flows-list{display:flex;flex-direction:column;gap:1rem}.flow-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-card);border:1px solid var(--border-color);border-left:4px solid var(--flow-accent-blue);border-radius:var(--radius-md);transition:all .2s ease;box-shadow:var(--shadow-sm)}.flow-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.flow-card-content{flex:1;cursor:pointer}.flow-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.flow-name{margin:0;font-size:1.1rem;font-weight:600;color:var(--text-main);display:flex;align-items:center;gap:.5rem}.flow-badge{display:inline-block;padding:.2rem .6rem;font-size:.75rem;font-weight:500;background:var(--color-primary);color:#fff;border-radius:12px}.flow-description{margin:.5rem 0 0;color:var(--text-muted);font-size:.9rem}.flow-stats{margin-top:.5rem;font-size:.85rem;color:var(--text-muted)}.flow-card-actions{display:flex;gap:.5rem}.btn-icon{padding:.5rem;background:transparent;border:none;cursor:pointer;font-size:1.2rem;border-radius:4px;color:var(--text-muted);transition:background-color .2s ease,color .2s ease}.btn-icon:hover{background:var(--bg-secondary);color:var(--color-primary)}.btn-icon.btn-danger:hover{background:var(--color-danger-bg);color:var(--color-danger)}.checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-main)}.checkbox-label input[type=checkbox]{cursor:pointer}@media(max-width:768px){.flows-content{padding:.5rem}.flow-card{padding:.75rem}.flow-name{font-size:1rem}}.flow-editor-container{display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--bg-root)}.flow-editor-content{flex:1;overflow-y:auto;padding:1rem;max-width:800px;margin:0 auto;width:100%}.flow-section{margin-bottom:2rem}.flow-section-title{font-size:1.1rem;font-weight:600;color:var(--text-main);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.flow-section-empty{padding:2rem 1rem;text-align:center;color:var(--text-muted);background:var(--bg-overlay);border:1px dashed var(--border-dashed);border-radius:var(--radius-md)}.flow-items-list{display:flex;flex-direction:column;gap:.75rem}.flow-unordered-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem;flex-wrap:wrap}.flow-unordered-toolbar-actions{display:flex;gap:.5rem;flex-wrap:wrap}.flow-unordered-selected-count{color:var(--text-muted);font-size:.9rem}.flow-editor-content .btn{padding:.5rem .85rem;min-height:36px;font-size:.875rem;font-weight:500;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-main);cursor:pointer;transition:background .15s ease,border-color .15s ease;white-space:nowrap}.flow-editor-content .btn:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--text-muted)}.flow-editor-content .btn:disabled{opacity:.45;cursor:not-allowed}.flow-editor-content .btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.flow-editor-content .btn-primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.sortable-item-wrapper{position:relative}.item-card.sortable-placeholder{background:transparent;border:2px dashed var(--border-dashed);box-shadow:none;opacity:1}.item-card.sortable-placeholder>*{opacity:0}.flow-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.75rem;margin:0;gap:.75rem;transition:border-color .15s ease,box-shadow .15s ease,opacity .18s ease;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:space-between}.flow-item-selected{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.flow-item-select{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding-right:.5rem}.flow-item-select input{width:1rem;height:1rem}.sortable-item-wrapper .flow-item{cursor:grab;-webkit-user-select:none;user-select:none}.sortable-item-wrapper .flow-item:active{cursor:grabbing}.flow-item:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.flow-item-overlay{background:var(--bg-card)!important;border:2px solid var(--color-primary)!important;color:var(--text-main);box-shadow:var(--shadow-lg);cursor:grabbing;opacity:.9;z-index:9999;border-radius:var(--radius-md)}.flow-item-overlay .item-name{color:var(--text-main)}.flow-item .item-name{flex:1;color:var(--text-main);font-size:.95rem;font-weight:500;line-height:1.5;word-break:break-word}.flow-item-action-btn{width:32px;height:32px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;font-size:1.1rem;color:var(--text-muted);transition:background .15s ease,border-color .15s ease,color .15s ease;flex-shrink:0}.flow-item-action-btn:hover{background:var(--color-danger-bg);border-color:var(--color-danger);color:var(--color-danger)}.flow-item-unavailable{opacity:.6;background:var(--bg-secondary)}.flow-item-unavailable .item-name{text-decoration:line-through;color:var(--text-muted)}.flow-item-unordered{cursor:grab;-webkit-user-select:none;user-select:none;background:var(--bg-secondary)}.flow-item-unordered:active{cursor:grabbing}.flow-item-dragging{opacity:.5}@media(max-width:768px){.flow-editor-content{padding:.5rem}.flow-item{padding:.6rem}.flow-section-title{font-size:1rem}.flow-unordered-toolbar{flex-direction:column;align-items:stretch;gap:.5rem}.flow-unordered-toolbar-actions{justify-content:stretch}.flow-editor-content .btn{flex:1;text-align:center}}#root{width:100%;min-height:100vh;overflow-x:hidden}.app-container{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}.app-header{background:var(--bg-header);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);color:var(--text-inverse);padding:.75rem 0;position:sticky;top:0;z-index:100}.header-content{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.header-right{display:flex;align-items:center;gap:1rem}.app-title{margin:0;font-size:1.5rem;font-weight:700;background:linear-gradient(45deg,#fff,#f0f0f0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.app-logo{height:40px;width:auto;display:block}.user-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#ff6b6b,#4ecdc4);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;flex-shrink:0;cursor:pointer}.avatar-spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}.user-info{display:flex;align-items:center;gap:.5rem;background:#ffffff1a;padding:.4rem .75rem;border-radius:25px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative}.user-details{position:absolute;top:100%;right:0;background:#1e1e2e;color:#cdd6f4;padding:.5rem;border-radius:12px;box-shadow:0 8px 24px #00000059;min-width:220px;z-index:1000;margin-top:.5rem;border:1px solid rgba(255,255,255,.08);animation:userDetailsIn .15s ease-out}@keyframes userDetailsIn{0%{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.user-details-header{display:flex;flex-direction:column;gap:.15rem;padding:.5rem .65rem}.user-details-name{font-weight:600;font-size:.9rem;color:#fff}.user-details-email{font-size:.78rem;color:#a6adc8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-details-divider{height:1px;background:#ffffff14;margin:.35rem 0}.user-details-item{display:flex;align-items:center;gap:.6rem;width:100%;padding:.55rem .65rem;border:none;border-radius:8px;background:transparent;color:#cdd6f4;font-size:.85rem;cursor:pointer;transition:background .15s ease;text-align:left}.user-details-item:hover{background:#ffffff14}.user-details-item--danger{color:#f38ba8}.user-details-item--danger:hover{background:#f38ba81a}.user-name{font-weight:600;font-size:.9rem}.login-btn,.logout-btn{background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);padding:.4rem .85rem;border-radius:20px;cursor:pointer;font-size:.85rem;transition:all .3s ease;white-space:nowrap}.login-btn:hover,.logout-btn:hover{background-color:#ffffff4d;transform:translateY(-1px)}.app-main{flex:1;padding:2rem;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box;overflow-x:hidden}.hero-section{position:relative;text-align:center;margin-bottom:3rem;padding:clamp(2rem,4vw,3.5rem);border-radius:24px;background:radial-gradient(1200px 600px at 20% -20%,rgba(99,102,241,.25),transparent 60%),radial-gradient(900px 500px at 110% 10%,rgba(16,185,129,.18),transparent 55%),linear-gradient(180deg,#ffffffe6,#ffffffbf);border:1px solid rgba(15,23,42,.08);box-shadow:0 20px 60px #0f172a1f,0 2px 10px #0f172a0f;overflow:hidden}:root[data-theme=dark] .hero-section{background:radial-gradient(1200px 600px at 20% -20%,rgba(99,102,241,.15),transparent 60%),radial-gradient(900px 500px at 110% 10%,rgba(16,185,129,.12),transparent 55%),linear-gradient(180deg,#2a2a2af2,#1e1e1ed9);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #0006,0 2px 10px #0000004d}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .hero-section{background:radial-gradient(1200px 600px at 20% -20%,rgba(99,102,241,.15),transparent 60%),radial-gradient(900px 500px at 110% 10%,rgba(16,185,129,.12),transparent 55%),linear-gradient(180deg,#2a2a2af2,#1e1e1ed9);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #0006,0 2px 10px #0000004d}}.hero-section:before{content:"";position:absolute;inset:-2px;background:linear-gradient(135deg,#6366f138,#10b9812e,#3b82f62e);filter:blur(40px);opacity:.7;pointer-events:none}.welcome-content{position:relative;max-width:960px;margin:0 auto}.welcome-logo{width:88px;height:88px;margin:0 auto 1.25rem;display:block;filter:drop-shadow(0 10px 20px rgba(15,23,42,.18))}.welcome-title{margin:.25rem 0 .75rem;font-size:clamp(2.2rem,4vw,3.2rem);font-weight:800;letter-spacing:-.03em;color:#0f172a}:root[data-theme=dark] .welcome-title{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .welcome-title{color:#fffffff2}}.welcome-description{margin:0 auto 2.25rem;max-width:70ch;font-size:1.1rem;line-height:1.7;color:#0f172abf}:root[data-theme=dark] .welcome-description{color:#ffffffb3}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .welcome-description{color:#ffffffb3}}.features-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0 auto 2.25rem}.feature-card{text-align:left;padding:1.25rem 1.25rem 1.1rem;border-radius:16px;background:#ffffffb8;border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 30px #0f172a14;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .16s ease,box-shadow .16s ease}:root[data-theme=dark] .feature-card{background:#2a2a2acc;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px #0000004d}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feature-card{background:#2a2a2acc;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px #0000004d}}.feature-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px #0f172a1f}:root[data-theme=dark] .feature-card:hover{box-shadow:0 18px 40px #00000080}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feature-card:hover{box-shadow:0 18px 40px #00000080}}.feature-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.35rem;background:linear-gradient(135deg,#6366f12e,#10b98129);border:1px solid rgba(15,23,42,.08);margin-bottom:.9rem}:root[data-theme=dark] .feature-icon{background:linear-gradient(135deg,#6366f140,#10b98138);border:1px solid rgba(255,255,255,.15)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feature-icon{background:linear-gradient(135deg,#6366f140,#10b98138);border:1px solid rgba(255,255,255,.15)}}.feature-card h3{margin:0 0 .35rem;font-size:1.05rem;font-weight:700;color:#0f172a}:root[data-theme=dark] .feature-card h3{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feature-card h3{color:#fffffff2}}.feature-card p{margin:0;font-size:.95rem;line-height:1.55;color:#0f172ab3}:root[data-theme=dark] .feature-card p{color:#ffffffb3}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feature-card p{color:#ffffffb3}}.cta-button{appearance:none;border:none;border-radius:999px;padding:.9rem 1.4rem;font-size:1rem;font-weight:700;letter-spacing:.01em;color:#fff;cursor:pointer;background:linear-gradient(135deg,#4f46e5,#2563eb);box-shadow:0 16px 40px #2563eb38;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}.cta-button:hover{transform:translateY(-2px);box-shadow:0 22px 55px #2563eb47;filter:brightness(1.02)}.cta-button:active{transform:translateY(0)}.cta-button:focus-visible{outline:3px solid rgba(99,102,241,.35);outline-offset:3px}@media(max-width:820px){.features-grid{grid-template-columns:1fr}.feature-card{text-align:center}.feature-icon{margin-left:auto;margin-right:auto}}@media(prefers-reduced-motion:reduce){.feature-card,.cta-button{transition:none}.feature-card:hover,.cta-button:hover{transform:none}}.card{background:#1e1e1e99;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;padding:2rem;box-shadow:0 4px 20px #0003;border:1px solid rgba(255,255,255,.08);color:#ffffffde}.card h3{margin-top:0;color:#fff;font-size:1.5rem}@media(max-width:768px){.header-content{padding:0 .75rem}.app-logo{height:32px}.user-info{padding:.3rem .6rem;gap:.4rem}.user-avatar{width:32px;height:32px;font-size:.9rem}.user-name{font-size:.85rem}.login-btn,.logout-btn{padding:.35rem .75rem;font-size:.8rem}.app-main{padding:1rem}.scenarios-grid,.lists-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.back-btn{padding:.4rem .65rem;font-size:1rem}}@media(max-width:480px){.app-logo{height:28px}.user-avatar{width:30px;height:30px;font-size:.85rem}.user-info{padding:.25rem .5rem}.login-btn,.logout-btn{padding:.3rem .6rem;font-size:.75rem}.user-name{display:none}.scenarios-grid{grid-template-columns:1fr;padding:0 .75rem;gap:1rem}.lists-grid{grid-template-columns:1fr;gap:1rem}.scenario-tile{padding:1rem}.scenarios-header{flex-direction:column;align-items:flex-start;gap:1rem;padding:0 .75rem}.scenarios-header h2{font-size:1.5rem}.back-btn{padding:.4rem;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:1.2rem}.back-btn-text{display:none}}.scenarios-section{padding:2rem 0}.scenarios-header{display:flex;justify-content:space-between;align-items:center;width:100%;margin:0 auto 2rem;padding:0 1rem;box-sizing:border-box}.scenarios-header h2{margin:0;color:#ffffffde;font-size:2rem;font-weight:600}.create-btn{background:#667eea26;color:#a3b8ff;border:1px solid rgba(102,126,234,.3);padding:.6rem 1.25rem;border-radius:12px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .2s ease;display:flex;align-items:center;gap:.5rem}.create-btn:hover{background:#667eea40;color:#fff;border-color:#667eea80;transform:translateY(-1px);box-shadow:0 4px 12px #667eea26}.create-btn:hover{transform:translateY(-2px)}.secondary-btn{background:var(--bg-secondary);color:var(--text-main);border:1px solid var(--border-color);padding:.65rem 1.25rem;min-height:40px;border-radius:var(--radius-md);cursor:pointer;font-size:.95rem;font-weight:500;transition:background .15s ease}.secondary-btn:hover{background:var(--bg-card-hover)}.modal-overlay{position:fixed;inset:0;background:var(--bg-overlay-strong);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1100;overflow:hidden;animation:modalBackdropFadeIn .2s ease-out}.modal-content{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);max-width:500px;width:90%;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;animation:modalSlideIn .25s ease-out}@keyframes modalBackdropFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.modal-overlay{align-items:flex-start;padding-top:2rem}.modal-content{max-height:calc(100dvh - 4rem)}@supports not (height: 100dvh){.modal-content{max-height:calc(100vh - 4rem)}}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border-color)}.modal-header h3{margin:0;color:var(--text-main);font-size:1.15rem;font-weight:600}.close-btn{background:none;border:none;font-size:1.75rem;cursor:pointer;color:var(--text-muted);padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:background .15s ease,color .15s ease;line-height:1}.close-btn:hover{background:var(--bg-secondary);color:var(--text-main)}.modal-body{padding:1.5rem;overflow-y:auto;flex:1;min-height:0}.form-group{margin-bottom:1.5rem;overflow:visible}.form-group label{display:block;margin-bottom:.5rem;color:var(--text-main);font-weight:500}.form-input,.form-textarea{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:1rem;font-family:inherit;transition:border-color .15s ease,box-shadow .15s ease;box-sizing:border-box;background-color:var(--bg-secondary);color:var(--text-main)}.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #3b82f633}.form-textarea{min-height:100px;resize:vertical}.modal-footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1.25rem 1.5rem;border-top:1px solid var(--border-color)}.cancel-btn{background:var(--bg-secondary);color:var(--text-main);border:1px solid var(--border-color);padding:.65rem 1.25rem;min-height:40px;border-radius:var(--radius-md);cursor:pointer;font-size:.95rem;font-weight:500;transition:background .15s ease}.cancel-btn:hover{background:var(--bg-card-hover)}.submit-btn{background:var(--color-primary);color:#fff;border:none;padding:.65rem 1.25rem;min-height:40px;border-radius:var(--radius-md);cursor:pointer;font-size:.95rem;font-weight:600;transition:background .15s ease}.submit-btn:hover:not(:disabled){background:var(--color-primary-hover)}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.scenarios-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;width:100%;margin:0 auto;padding:0 1rem;box-sizing:border-box}.scenario-tile{background:#ffffff08;border-radius:16px;padding:1.5rem;box-shadow:0 4px 6px #0003;border:1px solid rgba(255,255,255,.08);transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;gap:1rem;position:relative;overflow:hidden}.scenario-tile:not(.create-tile){border-left:4px solid rgba(139,92,246,.7)}.scenario-tile:hover{transform:translateY(-4px);background:#ffffff0d;border-color:#ffffff26;box-shadow:0 12px 30px #0006}.create-tile{justify-content:center;align-items:center;border:2px dashed rgba(255,255,255,.15);background:transparent;cursor:pointer;min-height:160px}.create-tile:hover{border-color:#667eea;background:#667eea0d}.create-content{display:flex;flex-direction:column;align-items:center;gap:1rem}.plus-icon{width:48px;height:48px;border-radius:50%;background:#ffffff1a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:300;transition:all .2s ease}.create-tile:hover .plus-icon{background:#667eea;transform:scale(1.1) rotate(90deg)}.create-tile h3{color:#ffffffb3;font-weight:500;font-size:1.1rem}.create-tile:hover h3{color:#667eea}.scenario-content{width:100%;box-sizing:border-box;overflow-x:hidden}.scenario-content.clickable{cursor:pointer}.scenario-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem;gap:1rem}.scenario-tile h3{margin:0;color:#fffffff2;font-size:1.25rem;font-weight:600;flex:1;line-height:1.3}.role-badge{padding:4px 8px;border-radius:6px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border:1px solid transparent}.role-badge.owner{background:#28a74526;color:#4ade80;border-color:#28a7454d}.role-badge.collaborator{background:#17a2b826;color:#67e8f9;border-color:#17a2b84d}.scenario-tile p{margin:0;color:#ffffff80;line-height:1.5;font-size:.95rem}.no-scenarios{grid-column:1 / -1;text-align:center;padding:3rem;background:#f8f9fa;border-radius:12px;border:2px dashed #dee2e6}.no-scenarios p{color:#6c757d;font-size:1.1rem;margin:0}.loading-spinner{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;gap:1rem}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-spinner p{color:#6c757d;margin:0;font-size:1rem}.back-btn{background:#ffffff1a;color:#ffffffde;border:1px solid rgba(255,255,255,.2);padding:.5rem .85rem;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s ease;white-space:nowrap}.back-btn:hover{background:#fff3}.scenario-title-group{display:flex;align-items:center;gap:.75rem}.scenario-title{margin:0;font-size:2rem;font-weight:600;color:#ffffffde}.edit-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#ffffffde;border-radius:6px;padding:.375rem .625rem;font-size:1.125rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.edit-btn:hover{background:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.leave-btn{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444e6;border-radius:6px;padding:.375rem .75rem;font-size:.875rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-weight:500}.leave-btn:hover{background:#ef444433;border-color:#ef444480;transform:translateY(-1px)}.delete-btn{background:var(--color-danger);color:#fff;border:none;padding:.65rem 1.25rem;min-height:40px;font-size:.95rem;font-weight:600;border-radius:var(--radius-md);cursor:pointer;transition:background .15s ease,opacity .15s ease}.delete-btn:hover:not(:disabled){opacity:.9}.delete-btn:disabled{opacity:.5;cursor:not-allowed}.scenario-description{margin-bottom:1.5rem;padding:0;background:transparent;border-radius:0;border:none}.scenario-description p{margin:0;color:#ffffffb3;font-size:1rem;line-height:1.5}.lists-section,.completed-lists-section{margin-bottom:3rem}.lists-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.lists-header h2{margin:0;color:#ffffffde;font-size:1.5rem;font-weight:600}.header-actions{display:flex;gap:.75rem;align-items:center}.create-btn.secondary{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#ffffffde}.create-btn.secondary:hover{background:#ffffff26;border-color:#ffffff4d}.lists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;width:100%;box-sizing:border-box;overflow-x:hidden}.list-tile{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-left:4px solid rgba(16,185,129,.75);border-radius:12px;padding:1.5rem;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.list-tile:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}:root[data-theme=light] .scenarios-header h2,:root[data-theme=light] .lists-header h2{color:var(--text-main)}:root[data-theme=light] .scenario-description p{color:var(--text-muted)}:root[data-theme=light] .create-btn{background:var(--color-primary);color:var(--text-inverse);border-color:var(--color-primary)}:root[data-theme=light] .create-btn:hover{background:var(--color-primary-hover);color:var(--text-inverse);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}:root[data-theme=light] .create-btn.secondary{background:var(--bg-card);border-color:var(--border-color);color:var(--text-main)}:root[data-theme=light] .create-btn.secondary:hover{background:var(--bg-secondary);border-color:var(--color-primary);color:var(--text-main);box-shadow:var(--shadow-sm)}:root[data-theme=light] .secondary-btn{background:var(--bg-secondary);color:var(--text-main);border:1px solid var(--border-color)}:root[data-theme=light] .secondary-btn:hover{background:var(--bg-card-hover)}:root[data-theme=light] .scenario-tile{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-sm)}:root[data-theme=light] .scenario-tile:hover{background:var(--bg-secondary);border-color:var(--color-primary);box-shadow:var(--shadow-md)}:root[data-theme=light] .create-tile{border-color:var(--border-color)}:root[data-theme=light] .create-tile:hover{border-color:var(--color-primary);background:var(--bg-secondary)}:root[data-theme=light] .list-tile{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);border-left-color:var(--color-online)}:root[data-theme=light] .list-tile:hover{box-shadow:var(--shadow-md)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .scenarios-header h2,:root:not([data-theme=dark]) .lists-header h2{color:var(--text-main)}:root:not([data-theme=dark]) .scenario-description p{color:var(--text-muted)}:root:not([data-theme=dark]) .create-btn{background:var(--color-primary);color:var(--text-inverse);border-color:var(--color-primary)}:root:not([data-theme=dark]) .create-btn:hover{background:var(--color-primary-hover);color:var(--text-inverse);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}:root:not([data-theme=dark]) .create-btn.secondary{background:var(--bg-card);border-color:var(--border-color);color:var(--text-main)}:root:not([data-theme=dark]) .create-btn.secondary:hover{background:var(--bg-secondary);border-color:var(--color-primary);color:var(--text-main);box-shadow:var(--shadow-sm)}:root:not([data-theme=dark]) .secondary-btn{background:var(--bg-secondary);color:var(--text-main);border:1px solid var(--border-color)}:root:not([data-theme=dark]) .secondary-btn:hover{background:var(--bg-card-hover)}:root:not([data-theme=dark]) .scenario-tile{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-sm)}:root:not([data-theme=dark]) .scenario-tile:hover{background:var(--bg-secondary);border-color:var(--color-primary);box-shadow:var(--shadow-md)}:root:not([data-theme=dark]) .create-tile{border-color:var(--border-color)}:root:not([data-theme=dark]) .create-tile:hover{border-color:var(--color-primary);background:var(--bg-secondary)}:root:not([data-theme=dark]) .list-tile{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);border-left-color:var(--color-online)}:root:not([data-theme=dark]) .list-tile:hover{box-shadow:var(--shadow-md)}}.list-tile.completed{opacity:.7;border-color:#667eea4d}.list-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.list-header h3{margin:0;color:#ffffffde;font-size:1.2rem;font-weight:600}.completed-badge{background:#667eea;color:#fff;padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.list-tile p{margin:.5rem 0;color:#ffffffb3;font-size:.9rem}.list-meta{margin-top:1rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:1rem;flex-wrap:wrap;align-items:center}.list-meta span{color:#fff9;font-size:.8rem}.item-count{color:#ffffffbf;font-weight:600;font-size:.85rem}.no-lists{grid-column:1 / -1;text-align:center;padding:3rem;background:#ffffff0d;border:2px dashed rgba(255,255,255,.2);border-radius:12px}.no-lists p{color:#ffffffb3;margin:0;font-size:1.1rem}.completed-lists-section h2{color:#667eea}.invite-status-container{text-align:center;padding:3rem 2rem;max-width:500px;margin:0 auto}.success-icon,.error-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:3rem;margin:0 auto 1.5rem;font-weight:700}.success-icon{background-color:#10b981;color:#fff}.error-icon{background-color:#ef4444;color:#fff}.invite-status-container h2{color:#667eea;margin-bottom:1rem}.invite-status-container p{color:#ffffffd9;font-size:1.1rem;margin-bottom:.5rem}.redirect-message{color:#fff9;font-size:.95rem;font-style:italic;margin-top:1rem}.trust-badge{margin-top:1.5rem;font-size:.95rem;color:#0f172aa6;font-weight:500}:root[data-theme=dark] .trust-badge{color:#fff9}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .trust-badge{color:#fff9}}.section-title{text-align:center;font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:800;color:#0f172a;margin:0 0 3rem;letter-spacing:-.02em}:root[data-theme=dark] .section-title{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .section-title{color:#fffffff2}}.features-section{padding:4rem 2rem;max-width:1200px;margin:0 auto;background:#fff6;border-radius:24px;margin-bottom:3rem}:root[data-theme=dark] .features-section{background:#2a2a2a99}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .features-section{background:#2a2a2a99}}.features-section .features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:0}.how-it-works-section{padding:4rem 2rem;max-width:1200px;margin:0 auto 3rem}.steps-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem}.step{text-align:center;padding:2rem 1.5rem;background:#ffffffb3;border-radius:16px;border:1px solid rgba(15,23,42,.08);transition:transform .16s ease,box-shadow .16s ease}:root[data-theme=dark] .step{background:#2a2a2ab3;border:1px solid rgba(255,255,255,.1)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .step{background:#2a2a2ab3;border:1px solid rgba(255,255,255,.1)}}.step:hover{transform:translateY(-5px);box-shadow:0 20px 40px #0f172a1f}:root[data-theme=dark] .step:hover{box-shadow:0 20px 40px #0006}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .step:hover{box-shadow:0 20px 40px #0006}}.step-number{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#4f46e5,#2563eb);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.75rem;font-weight:700;margin:0 auto 1.25rem;box-shadow:0 10px 30px #4f46e54d}.step h3{margin:0 0 .75rem;font-size:1.15rem;font-weight:700;color:#0f172a}:root[data-theme=dark] .step h3{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .step h3{color:#fffffff2}}.step p{margin:0;font-size:.95rem;line-height:1.6;color:#0f172ab3}:root[data-theme=dark] .step p{color:#ffffffb3}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .step p{color:#ffffffb3}}.use-cases-section{padding:4rem 2rem;max-width:1200px;margin:0 auto 3rem;background:linear-gradient(135deg,#6366f10d,#10b9810d);border-radius:24px}:root[data-theme=dark] .use-cases-section{background:linear-gradient(135deg,#6366f114,#10b98114)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .use-cases-section{background:linear-gradient(135deg,#6366f114,#10b98114)}}.use-cases-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}.use-case-card{background:#ffffffd9;padding:2rem;border-radius:16px;border:1px solid rgba(15,23,42,.08);transition:transform .16s ease,box-shadow .16s ease}:root[data-theme=dark] .use-case-card{background:#2a2a2acc;border:1px solid rgba(255,255,255,.1)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .use-case-card{background:#2a2a2acc;border:1px solid rgba(255,255,255,.1)}}.use-case-card:hover{transform:translateY(-3px);box-shadow:0 15px 35px #0f172a1a}:root[data-theme=dark] .use-case-card:hover{box-shadow:0 15px 35px #0006}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .use-case-card:hover{box-shadow:0 15px 35px #0006}}.use-case-card h3{margin:0 0 .75rem;font-size:1.15rem;font-weight:700;color:#0f172a}:root[data-theme=dark] .use-case-card h3{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .use-case-card h3{color:#fffffff2}}.use-case-card p{margin:0;font-size:.95rem;line-height:1.6;color:#0f172ab3}:root[data-theme=dark] .use-case-card p{color:#ffffffb3}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .use-case-card p{color:#ffffffb3}}.cta-section{text-align:center;padding:4rem 2rem;max-width:800px;margin:0 auto 3rem;background:linear-gradient(135deg,#4f46e5,#2563eb);border-radius:24px;color:#fff}.cta-section h2{margin:0 0 1rem;font-size:clamp(1.75rem,3.5vw,2.25rem);font-weight:800;letter-spacing:-.02em}.cta-section p{margin:0 0 2rem;font-size:1.1rem;opacity:.95}.cta-section .cta-button{background:#fff;color:#4f46e5;box-shadow:0 16px 40px #0003}.cta-section .cta-button:hover{background:#fffffff2;transform:translateY(-2px);box-shadow:0 20px 50px #00000040}.footer{background:#0f172af2;color:#fffc;padding:3rem 2rem 2rem;margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem}.footer-section h4{margin:0 0 1rem;color:#fff;font-size:1rem;font-weight:700}.footer-section p{margin:0;font-size:.9rem;line-height:1.6}.footer-section ul{list-style:none;padding:0;margin:0}.footer-section ul li{margin-bottom:.5rem}.footer-section ul li a{color:#ffffffb3;text-decoration:none;font-size:.9rem;transition:color .2s ease}.footer-section ul li a:hover{color:#fff}.footer-copyright{margin-top:.5rem;font-size:.85rem;opacity:.6}@media(max-width:768px){.features-section,.how-it-works-section,.use-cases-section,.cta-section{padding:2rem 1rem}.section-title{font-size:1.75rem;margin-bottom:2rem}.steps-container,.use-cases-grid{grid-template-columns:1fr}.footer-content{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.footer-content{grid-template-columns:1fr}}:root[data-theme=light] .scenario-tile:not(.create-tile){border-left:4px solid rgba(139,92,246,.45)}:root[data-theme=light] .scenario-tile h3{color:var(--text-main)}:root[data-theme=light] .scenario-tile p{color:var(--text-muted)}:root[data-theme=light] .role-badge.owner{background:#22c55e1a;color:#16a34a;border-color:#22c55e40}:root[data-theme=light] .role-badge.collaborator{background:#06b6d41a;color:#0891b2;border-color:#06b6d440}:root[data-theme=light] .plus-icon{background:var(--bg-secondary);color:var(--text-muted)}:root[data-theme=light] .create-tile h3{color:var(--text-muted)}:root[data-theme=light] .create-tile:hover .plus-icon{background:var(--color-primary);color:#fff}:root[data-theme=light] .create-tile:hover h3{color:var(--color-primary)}:root[data-theme=light] .list-header h3{color:var(--text-main)}:root[data-theme=light] .list-tile p{color:var(--text-muted)}:root[data-theme=light] .list-meta{border-top-color:var(--border-color)}:root[data-theme=light] .list-meta span{color:var(--text-muted)}:root[data-theme=light] .item-count{color:var(--text-main)}:root[data-theme=light] .no-lists{background:var(--bg-card);border:2px dashed var(--border-color)}:root[data-theme=light] .no-lists p{color:var(--text-muted)}:root[data-theme=light] .modal-content{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root[data-theme=light] .modal-header{border-bottom:1px solid var(--border-color)}:root[data-theme=light] .modal-header h3{color:var(--text-main)}:root[data-theme=light] .close-btn{color:var(--text-muted)}:root[data-theme=light] .close-btn:hover{background:var(--bg-secondary);color:var(--text-main)}:root[data-theme=light] .form-group label{color:var(--text-main)}:root[data-theme=light] .form-input,:root[data-theme=light] .form-textarea{background-color:var(--bg-root);border-color:var(--border-color);color:var(--text-main)}:root[data-theme=light] .form-input:focus,:root[data-theme=light] .form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61f}:root[data-theme=light] .modal-footer{border-top:1px solid var(--border-color)}:root[data-theme=light] .cancel-btn{background:var(--bg-secondary);color:var(--text-main)}:root[data-theme=light] .cancel-btn:hover{background:var(--border-color)}:root[data-theme=light] .card{background:var(--bg-card);-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid var(--border-color);box-shadow:var(--shadow-md);color:var(--text-main)}:root[data-theme=light] .card h3{color:var(--text-main)}:root[data-theme=light] .user-details{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root[data-theme=light] .user-details-name{color:var(--text-main)}:root[data-theme=light] .user-details-email{color:var(--text-muted)}:root[data-theme=light] .user-details-divider{background:var(--border-color)}:root[data-theme=light] .user-details-item{color:var(--text-main)}:root[data-theme=light] .user-details-item:hover{background:var(--bg-secondary)}:root[data-theme=light] .user-details-item--danger{color:var(--color-danger)}:root[data-theme=light] .user-details-item--danger:hover{background:var(--color-danger-bg)}:root[data-theme=light] .list-description p{color:var(--text-muted)}:root[data-theme=light] .invite-status-container h2{color:var(--color-primary)}:root[data-theme=light] .invite-status-container p{color:var(--text-main)}:root[data-theme=light] .redirect-message{color:var(--text-muted)}:root[data-theme=light] .spinner{border-color:var(--border-color);border-top-color:var(--color-primary)}:root[data-theme=light] .loading-spinner p{color:var(--text-muted)}:root[data-theme=light] .scenario-title-group .scenario-title{color:var(--text-main)}:root[data-theme=light] .completed-badge{background:var(--color-primary)}:root[data-theme=light] .completed-lists-section h2{color:var(--color-primary)}@media(prefers-color-scheme:light){:root:not([data-theme=dark]) .scenario-tile:not(.create-tile){border-left:4px solid rgba(139,92,246,.45)}:root:not([data-theme=dark]) .scenario-tile h3{color:var(--text-main)}:root:not([data-theme=dark]) .scenario-tile p{color:var(--text-muted)}:root:not([data-theme=dark]) .role-badge.owner{background:#22c55e1a;color:#16a34a;border-color:#22c55e40}:root:not([data-theme=dark]) .role-badge.collaborator{background:#06b6d41a;color:#0891b2;border-color:#06b6d440}:root:not([data-theme=dark]) .plus-icon{background:var(--bg-secondary);color:var(--text-muted)}:root:not([data-theme=dark]) .create-tile h3{color:var(--text-muted)}:root:not([data-theme=dark]) .create-tile:hover .plus-icon{background:var(--color-primary);color:#fff}:root:not([data-theme=dark]) .create-tile:hover h3{color:var(--color-primary)}:root:not([data-theme=dark]) .list-header h3{color:var(--text-main)}:root:not([data-theme=dark]) .list-tile p{color:var(--text-muted)}:root:not([data-theme=dark]) .list-meta{border-top-color:var(--border-color)}:root:not([data-theme=dark]) .list-meta span{color:var(--text-muted)}:root:not([data-theme=dark]) .item-count{color:var(--text-main)}:root:not([data-theme=dark]) .no-lists{background:var(--bg-card);border:2px dashed var(--border-color)}:root:not([data-theme=dark]) .no-lists p{color:var(--text-muted)}:root:not([data-theme=dark]) .modal-content{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root:not([data-theme=dark]) .modal-header{border-bottom:1px solid var(--border-color)}:root:not([data-theme=dark]) .modal-header h3{color:var(--text-main)}:root:not([data-theme=dark]) .close-btn{color:var(--text-muted)}:root:not([data-theme=dark]) .close-btn:hover{background:var(--bg-secondary);color:var(--text-main)}:root:not([data-theme=dark]) .form-group label{color:var(--text-main)}:root:not([data-theme=dark]) .form-input,:root:not([data-theme=dark]) .form-textarea{background-color:var(--bg-root);border-color:var(--border-color);color:var(--text-main)}:root:not([data-theme=dark]) .form-input:focus,:root:not([data-theme=dark]) .form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61f}:root:not([data-theme=dark]) .modal-footer{border-top:1px solid var(--border-color)}:root:not([data-theme=dark]) .cancel-btn{background:var(--bg-secondary);color:var(--text-main)}:root:not([data-theme=dark]) .cancel-btn:hover{background:var(--border-color)}:root:not([data-theme=dark]) .card{background:var(--bg-card);-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid var(--border-color);box-shadow:var(--shadow-md);color:var(--text-main)}:root:not([data-theme=dark]) .card h3{color:var(--text-main)}:root:not([data-theme=dark]) .user-details{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);box-shadow:var(--shadow-lg)}:root:not([data-theme=dark]) .user-details-name{color:var(--text-main)}:root:not([data-theme=dark]) .user-details-email{color:var(--text-muted)}:root:not([data-theme=dark]) .user-details-divider{background:var(--border-color)}:root:not([data-theme=dark]) .user-details-item{color:var(--text-main)}:root:not([data-theme=dark]) .user-details-item:hover{background:var(--bg-secondary)}:root:not([data-theme=dark]) .user-details-item--danger{color:var(--color-danger)}:root:not([data-theme=dark]) .user-details-item--danger:hover{background:var(--color-danger-bg)}:root:not([data-theme=dark]) .list-description p{color:var(--text-muted)}:root:not([data-theme=dark]) .invite-status-container h2{color:var(--color-primary)}:root:not([data-theme=dark]) .invite-status-container p{color:var(--text-main)}:root:not([data-theme=dark]) .redirect-message{color:var(--text-muted)}:root:not([data-theme=dark]) .spinner{border-color:var(--border-color);border-top-color:var(--color-primary)}:root:not([data-theme=dark]) .loading-spinner p{color:var(--text-muted)}:root:not([data-theme=dark]) .scenario-title-group .scenario-title{color:var(--text-main)}:root:not([data-theme=dark]) .completed-badge{background:var(--color-primary)}:root:not([data-theme=dark]) .completed-lists-section h2{color:var(--color-primary)}}.invite-page{min-height:100vh}.invite-main{padding-top:2.25rem;padding-bottom:2.25rem}.invite-hero{max-width:860px;margin-left:auto;margin-right:auto}.invite-header-left{display:flex;align-items:center;gap:.9rem}.invite-title-wrapper{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;width:auto;max-width:50%;gap:.5rem}.invite-title{margin:0;font-size:1.5rem;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.invite-user-chip{max-width:50vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#ffffff1a;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:.45rem .75rem;font-size:.85rem;color:#ffffffe6}.invite-user-chip strong{font-weight:700}.invite-status-container{background:#ffffffc7;border:1px solid rgba(15,23,42,.08);border-radius:18px;box-shadow:0 14px 45px #0f172a1f;padding:clamp(1.6rem,3vw,2.25rem);max-width:540px;margin:0 auto}.invite-status-container h2{margin:.75rem 0 .5rem;font-size:1.55rem;font-weight:800;letter-spacing:-.015em;color:#0f172a}.invite-status-container p{margin:.25rem 0;color:#0f172ab8;font-size:1rem;line-height:1.65}.invite-current-user{margin-top:.9rem!important;color:#0f172ac7!important}.invite-current-user strong{color:#0f172ae6}.redirect-message{margin-top:.9rem;color:#0f172a8c;font-size:.95rem;font-style:italic}.success-icon,.error-icon{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;font-size:2.25rem;margin:0 auto 1rem;font-weight:900;box-shadow:0 10px 25px #0f172a1f}.success-icon{background:linear-gradient(135deg,#10b981e6,#059669e6);color:#fff}.error-icon{background:linear-gradient(135deg,#ef4444eb,#dc2626eb);color:#fff}.invite-actions{display:flex;gap:.75rem;justify-content:center;margin-top:1.25rem;flex-wrap:wrap}.invite-primary{padding:.85rem 1.25rem}.invite-secondary-button{appearance:none;border:1px solid rgba(15,23,42,.14);background:#ffffffbf;color:#0f172ae6;border-radius:999px;padding:.85rem 1.15rem;font-weight:700;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.invite-secondary-button:hover{transform:translateY(-1px);background:#ffffffe6;box-shadow:0 10px 25px #0f172a1f}.invite-secondary-button:focus-visible{outline:3px solid rgba(99,102,241,.35);outline-offset:3px}@media(max-width:520px){.invite-user-chip{display:none}}.static-page{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#f5f7fa,#c3cfe2)}:root[data-theme=dark] .static-page{background:linear-gradient(135deg,#1a1a1a,#2a2a2a)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .static-page{background:linear-gradient(135deg,#1a1a1a,#2a2a2a)}}.static-header{background:#fffffff2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(15,23,42,.1);padding:1rem 0;position:sticky;top:0;z-index:100;box-shadow:0 2px 10px #0000000d}:root[data-theme=dark] .static-header{background:#1e1e1ef2;border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 2px 10px #0000004d}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .static-header{background:#1e1e1ef2;border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 2px 10px #0000004d}}.static-header-content{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center}.static-logo{height:40px;width:auto}.static-logo.clickable{cursor:pointer;transition:opacity .2s ease}.static-logo.clickable:hover{opacity:.8}.back-to-home-btn{background:#4f46e51a;color:#4f46e5;border:1px solid rgba(79,70,229,.2);padding:.6rem 1.2rem;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease}:root[data-theme=dark] .back-to-home-btn{background:#6366f126;color:#a3b8ff;border:1px solid rgba(99,102,241,.3)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .back-to-home-btn{background:#6366f126;color:#a3b8ff;border:1px solid rgba(99,102,241,.3)}}.back-to-home-btn:hover{background:#4f46e526;border-color:#4f46e54d;transform:translateY(-1px)}:root[data-theme=dark] .back-to-home-btn:hover{background:#6366f140;border-color:#6366f180}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .back-to-home-btn:hover{background:#6366f140;border-color:#6366f180}}.static-content{flex:1;padding:3rem 2rem;max-width:900px;margin:0 auto;width:100%}.content-container{background:#fffffff2;border-radius:16px;padding:3rem;box-shadow:0 10px 40px #0000001a}:root[data-theme=dark] .content-container{background:#2a2a2af2;box-shadow:0 10px 40px #00000080}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-container{background:#2a2a2af2;box-shadow:0 10px 40px #00000080}}.content-container h1{margin:0 0 .5rem;font-size:2.5rem;font-weight:800;color:#0f172a;letter-spacing:-.02em}:root[data-theme=dark] .content-container h1{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-container h1{color:#fffffff2}}.last-updated{margin:0 0 2rem;font-size:.9rem;color:#0f172a99;font-style:italic}:root[data-theme=dark] .last-updated{color:#fff9}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .last-updated{color:#fff9}}.content-section{margin-bottom:2.5rem}.content-section:last-of-type{margin-bottom:3rem}.content-section h2{margin:0 0 1rem;font-size:1.75rem;font-weight:700;color:#0f172a;border-bottom:2px solid rgba(79,70,229,.2);padding-bottom:.5rem}:root[data-theme=dark] .content-section h2{color:#fffffff2;border-bottom:2px solid rgba(99,102,241,.3)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-section h2{color:#fffffff2;border-bottom:2px solid rgba(99,102,241,.3)}}.content-section h3{margin:1.5rem 0 .75rem;font-size:1.25rem;font-weight:700;color:#334155}:root[data-theme=dark] .content-section h3{color:#ffffffe6}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-section h3{color:#ffffffe6}}.content-section p{margin:0 0 1rem;font-size:1rem;line-height:1.7;color:#0f172acc}:root[data-theme=dark] .content-section p{color:#fffc}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-section p{color:#fffc}}.content-section ul{margin:0 0 1rem;padding-left:1.5rem}.content-section ul li{margin-bottom:.5rem;font-size:1rem;line-height:1.7;color:#0f172acc}:root[data-theme=dark] .content-section ul li{color:#fffc}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-section ul li{color:#fffc}}.content-section ul li strong{color:#0f172a;font-weight:600}:root[data-theme=dark] .content-section ul li strong{color:#fffffff2}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .content-section ul li strong{color:#fffffff2}}.cta-container{text-align:center;padding-top:2rem;margin-top:3rem;border-top:1px solid rgba(15,23,42,.1)}:root[data-theme=dark] .cta-container{border-top:1px solid rgba(255,255,255,.1)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .cta-container{border-top:1px solid rgba(255,255,255,.1)}}.cta-container .cta-button{appearance:none;border:none;border-radius:999px;padding:.9rem 1.8rem;font-size:1rem;font-weight:700;letter-spacing:.01em;color:#fff;cursor:pointer;background:linear-gradient(135deg,#4f46e5,#2563eb);box-shadow:0 16px 40px #2563eb38;transition:transform .16s ease,box-shadow .16s ease}.cta-container .cta-button:hover{transform:translateY(-2px);box-shadow:0 20px 50px #2563eb47}.static-footer{background:#0f172af2;color:#fffc;text-align:center;padding:2rem;margin-top:auto}.static-footer p{margin:0;font-size:.9rem}.feedback-form{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.feedback-field{display:flex;flex-direction:column;gap:.5rem}.feedback-label{font-weight:700;color:#0f172a}:root[data-theme=dark] .feedback-label{color:#ffffffeb}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feedback-label{color:#ffffffeb}}.feedback-input,.feedback-select,.feedback-textarea{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid rgba(15,23,42,.15);background:#ffffffe6;padding:.75rem .9rem;font-size:1rem;color:#0f172ae6;outline:none;transition:border-color .16s ease,box-shadow .16s ease}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feedback-input,:root:not([data-theme=light]) .feedback-select,:root:not([data-theme=light]) .feedback-textarea{border:1px solid rgba(255,255,255,.18);background:#1e1e1eb3;color:#ffffffe6}}:root[data-theme=dark] .feedback-input,:root[data-theme=dark] .feedback-select,:root[data-theme=dark] .feedback-textarea{border:1px solid rgba(255,255,255,.18);background:#1e1e1eb3;color:#ffffffe6}.feedback-input:focus,.feedback-select:focus,.feedback-textarea:focus{border-color:#4f46e599;box-shadow:0 0 0 4px #4f46e526}.feedback-textarea{resize:vertical;min-height:140px}.feedback-signed-in{margin:0;padding:.75rem 1rem;border-radius:12px;background:#4f46e514;border:1px solid rgba(79,70,229,.15);color:#0f172ad9}:root[data-theme=dark] .feedback-signed-in{background:#6366f11f;border:1px solid rgba(99,102,241,.22);color:#ffffffd9}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feedback-signed-in{background:#6366f11f;border:1px solid rgba(99,102,241,.22);color:#ffffffd9}}.feedback-actions{display:flex;align-items:center;gap:1rem;margin-top:.25rem}.feedback-alt{font-weight:700;color:#4f46e5;text-decoration:none}.feedback-alt:hover{text-decoration:underline}:root[data-theme=dark] .feedback-alt{color:#a3b8ff}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .feedback-alt{color:#a3b8ff}}@media(max-width:768px){.static-header-content{padding:0 1rem}.static-content{padding:2rem 1rem}.content-container{padding:2rem 1.5rem}.content-container h1{font-size:2rem}.content-section h2{font-size:1.5rem}.content-section h3{font-size:1.15rem}.back-to-home-btn{padding:.5rem 1rem;font-size:.85rem}}@media(max-width:480px){.static-logo{height:32px}.content-container{padding:1.5rem 1rem}.content-container h1{font-size:1.75rem}.back-to-home-btn{padding:.4rem .8rem;font-size:.8rem}}