.app-container{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;padding:1rem;max-width:600px;background-color:var(--color-black);min-height:100vh;min-height:100dvh}.app-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(252,252,242,.2)}.app-title{font-size:1.5rem;font-weight:600;color:var(--color-white);margin:0}.sync-status{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.875rem;color:var(--color-white);opacity:.7}.logout-button{justify-self:end;width:36px;height:36px;border-radius:50%;border:none;background:transparent;color:var(--color-white);opacity:.7;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .15s ease,color .15s ease,opacity .15s ease}.logout-button:hover{background:#fcfcf21a;color:var(--color-hotpink);opacity:1}.logout-button:active{transform:scale(.95)}.logout-button svg{width:20px;height:20px}.sync-dot{width:8px;height:8px;border-radius:50%;background-color:#34c759}.sync-dot.offline{background-color:#ff9500}.store-filter{margin-bottom:1rem}.store-filter-select{width:100%;padding:.75rem 1rem;font-size:1rem;font-family:inherit;color:var(--color-white);background-color:#fcfcf21a;border:1px solid rgba(252,252,242,.2);border-radius:12px;outline:none;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FCFCF2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;transition:border-color .15s ease,box-shadow .15s ease}.store-filter-select:focus{border-color:var(--color-blue);box-shadow:0 0 0 3px #068be640}.store-filter-select:hover{border-color:#fcfcf266}.store-filter-select option{text-transform:capitalize}.items-grouped{display:flex;flex-direction:column;gap:1.5rem}.store-section{display:flex;flex-direction:column;gap:.75rem}.store-section-header{font-size:1rem;font-weight:600;color:var(--color-white);opacity:.7;text-transform:capitalize;margin:0;padding-left:.25rem}.items-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.item-tile{position:relative;border-radius:12px;padding:1rem;min-height:120px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 2px 8px #00000014}.item-tile:active{transform:scale(.98)}.item-tile.active{color:var(--color-black)}.item-tile.active:hover{box-shadow:0 4px 16px #0000004d}.item-tile.bought{background:#fcfcf21a;color:var(--color-white);opacity:.6;cursor:default}.item-name{font-size:1rem;font-weight:600;line-height:1.3;margin:0;word-break:break-word}.item-tile.active .item-name{color:var(--color-black)}.item-tile.bought .item-name{color:var(--color-white);text-decoration:line-through}.item-amount{font-size:.75rem;margin-top:.5rem;text-transform:capitalize}.item-tile.active .item-amount{color:var(--color-black)}.item-tile.bought .item-amount{color:var(--color-white)}.edit-button{position:absolute;top:8px;left:8px;width:32px;height:32px;border-radius:50%;border:none;background:var(--color-dark-green);color:var(--color-white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,background .15s ease;padding:0}.edit-button:hover{background:#228f6e;transform:scale(1.1)}.edit-button:active{transform:scale(.95)}.edit-button svg{width:16px;height:16px;color:var(--color-white)}.delete-button{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;border:none;background:var(--color-hotpink);color:var(--color-white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,background .15s ease;padding:0}.delete-button:hover{background:#c9065c;transform:scale(1.1)}.delete-button:active{transform:scale(.95)}.delete-button svg{width:16px;height:16px;color:var(--color-white)}.reactivate-button{position:absolute;bottom:8px;left:50%;transform:translate(-50%);width:36px;height:36px;border-radius:50%;border:none;background:var(--color-green);color:var(--color-white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,background .15s ease;padding:0}.reactivate-button:hover{background:#228f6e;transform:translate(-50%) scale(1.1)}.reactivate-button:active{transform:translate(-50%) scale(.95)}.reactivate-button svg{width:18px;height:18px;color:var(--color-white)}.empty-state{text-align:center;padding:4rem 2rem;color:var(--color-white);opacity:.7}.empty-state-icon{margin-bottom:1rem;color:var(--color-white)}.empty-state-icon svg{width:64px;height:64px}.empty-state-text{font-size:1.125rem;margin:0}.add-item-button{position:fixed;bottom:2rem;right:2rem;width:56px;height:56px;border-radius:100vmax;background:var(--color-blue);color:var(--color-white);border:none;cursor:pointer;box-shadow:0 4px 12px #068be666;transition:transform .2s ease,box-shadow .2s ease;display:flex;align-items:center;justify-content:center;padding:0}.add-item-button svg{width:28px;height:28px}.add-item-button:hover{transform:scale(1.05);box-shadow:0 6px 16px #068be680}.add-item-button:active{transform:scale(.95)}.login-prompt{text-align:center;padding:4rem 2rem}.login-prompt p{font-size:1.125rem;color:var(--color-white);opacity:.7;margin-bottom:1.5rem}.login-button{padding:.75rem 2rem;font-size:1rem;font-weight:500;color:var(--color-white);background:var(--color-blue);border:none;border-radius:8px;cursor:pointer;transition:background .2s ease}.login-button:hover{background:#0570bf}@media(min-width:480px){.app-container{padding:1.5rem}.items-grid{gap:1rem}.item-tile{min-height:140px;padding:1.25rem}.item-name{font-size:1.125rem}}.add-item-dialog{border:none;border-radius:16px;padding:0;width:min(400px,90vw);box-shadow:0 8px 32px #0006;background:var(--color-black)}.add-item-dialog::backdrop{background:#00000080}.user-menu-dialog{min-width:280px}.user-menu-dialog .dialog-header{padding:1rem 1.25rem}.user-menu-content{padding:.5rem 1.25rem 1.25rem;display:flex;flex-direction:column;gap:.25rem}.user-menu-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border:none;border-radius:8px;background:transparent;color:var(--color-white);font-size:1rem;cursor:pointer;text-align:left;transition:background .15s ease}.user-menu-item:hover{background:#fcfcf21a}.user-menu-item svg{width:20px;height:20px;flex-shrink:0}.user-menu-invite{flex-wrap:wrap;cursor:default}.user-menu-invite:hover{background:transparent}.user-menu-invite-label{flex:1;min-width:0}.user-menu-copy{padding:.25rem .5rem;font-size:.875rem;border-radius:6px;border:1px solid rgba(252,252,242,.3);background:transparent;color:var(--color-blue);cursor:pointer}.user-menu-copy:hover{background:#068be633}.add-item-dialog form{display:flex;flex-direction:column}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid rgba(252,252,242,.2)}.dialog-header h2{margin:0;font-size:1.25rem;font-weight:600;color:var(--color-white)}.dialog-close-button{width:32px;height:32px;border-radius:50%;border:none;background:#fcfcf21a;color:var(--color-white);opacity:.7;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .15s ease,color .15s ease,opacity .15s ease}.dialog-close-button:hover{background:var(--color-hotpink);color:var(--color-white);opacity:1}.dialog-close-button svg{width:16px;height:16px}.dialog-content{padding:1.25rem;display:flex;flex-direction:column;gap:1rem}.form-field{display:flex;flex-direction:column;gap:.5rem}.form-field label{font-size:.875rem;font-weight:500;color:var(--color-white);opacity:.7}.form-field input{padding:.75rem 1rem;font-size:1rem;color:var(--color-black);background-color:var(--color-yellow-charming);border:1px solid rgba(252,252,242,.2);border-radius:8px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.form-field input::placeholder{color:var(--color-black);opacity:.6}.form-field input:focus{border-color:var(--color-blue);box-shadow:0 0 0 3px #068be640}.dialog-actions{padding:1rem 1.25rem;border-top:1px solid rgba(252,252,242,.2)}.submit-button{width:100%;padding:.875rem;font-size:1rem;font-weight:600;color:var(--color-black);background:var(--color-purple-charming);border:none;border-radius:8px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.submit-button:hover{background:var(--color-purple);box-shadow:0 4px 12px #c593ea66}.submit-button:active{transform:scale(.98)}.auth-container{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;padding:1rem;max-width:600px;margin:0 auto;background-color:var(--color-black);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center}.auth-header{width:100%;text-align:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(252,252,242,.2)}.auth-title{font-size:1.5rem;font-weight:600;color:var(--color-white);margin:0}.auth-form{width:100%;display:flex;flex-direction:column;gap:1rem}.auth-form .form-field{width:100%}.auth-form .form-field input{width:100%;box-sizing:border-box}.auth-button{width:100%;padding:.875rem;font-size:1rem;font-weight:600;color:var(--color-black);background:var(--color-purple-charming);border:none;border-radius:8px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;margin-top:.5rem}.auth-button:hover{background:var(--color-purple);box-shadow:0 4px 12px #c593ea66}.auth-button:active{transform:scale(.98)}.auth-error{color:var(--color-hotpink);font-size:.875rem;text-align:center;margin:0}.auth-link{margin-top:1.5rem;font-size:.875rem;color:var(--color-white);opacity:.7;text-align:center}.auth-link a{color:var(--color-blue);text-decoration:none}.auth-link a:hover{text-decoration:underline}.auth-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.auth-modal{background:var(--color-black);border-radius:16px;padding:1.5rem;max-width:360px;width:90%;display:flex;flex-direction:column;gap:1rem}.auth-modal h2{margin:0;font-size:1.25rem;color:var(--color-white)}.auth-modal-text{margin:0;font-size:.875rem;color:var(--color-white);opacity:.9}.auth-modal-code{margin:0;font-size:1.25rem;font-family:monospace;letter-spacing:.1em;color:var(--color-blue)}.auth-button-secondary{background:transparent;border:1px solid rgba(252,252,242,.3);box-shadow:none}.auth-button-secondary:hover{background:#fcfcf21a;box-shadow:none}@media(min-width:480px){.auth-container{padding:1.5rem}}*,*:before,*:after{box-sizing:border-box}*{margin:0}html,body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root{isolation:isolate;min-height:100vh;min-height:100dvh}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-hotpink: #EE086F;--color-yellow: #FFE935;--color-yellow-charming: #FFDE6A;--color-blue: #068BE6;--color-black: #121B2F;--color-white: #FCFCF2;--color-rouge: #F1B8B9;--color-aperol: #FCA2A2;--color-purple: #C593EA;--color-purple-charming: #CB9AEC;--color-orange: #FEAD54;--color-pistachio: #A4E9B8;--color-green: #29AD86;--color-dark-green: #468171}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{min-width:375px;min-height:100vh;min-height:100dvh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
