*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--green: #16a34a;--green-light: #dcfce7;--red: #dc2626;--gray: #6b7280;--border: #e5e7eb;--radius: 8px;font-family:system-ui,sans-serif;color:#111827}body{background:#f9fafb;min-height:100dvh}.page{max-width:600px;margin:0 auto;padding:1rem}header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}header h1{flex:1;font-size:1.25rem}.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem}.auth-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;gap:1rem}.auth-page h1{font-size:1.5rem;color:var(--green)}.auth-page .card{width:min(360px,100%)}.tabs{display:flex;gap:.5rem;margin-bottom:1rem}.tabs button{flex:1;padding:.5rem;border:1px solid var(--border);border-radius:var(--radius);background:#fff;color:#111827;cursor:pointer}.tabs button.active{background:var(--green);color:#fff;border-color:var(--green)}form label{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.75rem;font-size:.875rem;color:var(--gray)}input[type=text],input[type=email],input[type=password]{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius);font-size:1rem}input[type=text]:focus,input[type=email]:focus,input[type=password]:focus{outline:2px solid var(--green);outline-offset:-1px}button{padding:.5rem 1rem;border:none;border-radius:var(--radius);background:var(--green);color:#fff;cursor:pointer;font-size:.875rem}button:disabled{opacity:.5;cursor:not-allowed}button.btn-danger{background:transparent;color:var(--red);padding:.25rem .5rem}.error{color:var(--red);font-size:.875rem;margin-bottom:.5rem}.create-form,.add-form{display:flex;gap:.5rem;margin-bottom:1rem}.create-form input,.add-form input{flex:1;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius)}.list-overview{list-style:none;display:flex;flex-direction:column;gap:.5rem}.list-overview li{display:flex;align-items:center;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:.75rem 1rem}.list-overview li a{flex:1;text-decoration:none;color:inherit;font-weight:500}.items{list-style:none;display:flex;flex-direction:column;gap:2px;margin-bottom:1rem}.items li{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.items li.checked{opacity:.5}.items li.checked .name{text-decoration:line-through}.items .item-main{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem}.items .item-edit{padding:.5rem .75rem .75rem;border-top:1px solid var(--border);background:#f9fafb;display:flex;flex-direction:column;gap:.5rem}.items .check-btn,.items .check{background:none;color:var(--green);font-size:1rem;border:none;cursor:pointer}.items .name{flex:1}.items .qty{font-size:.8rem;color:var(--gray)}.items .tag{font-size:.7rem;background:var(--green-light);color:var(--green);padding:.1rem .4rem;border-radius:999px}.items .btn-icon{background:none;color:var(--gray);padding:.1rem .3rem;font-size:.9rem}.group-header{display:flex;align-items:center;gap:.5rem;margin:1rem 0 .25rem}.group-header span{flex:1;font-size:.875rem;font-weight:600;color:var(--gray);text-transform:uppercase;letter-spacing:.05em}.add-form-expanded{margin-bottom:1rem;display:flex;flex-direction:column;gap:.5rem}.add-row{display:flex;gap:.5rem}.add-row input{flex:1;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius)}.btn-secondary{background:#fff;color:var(--gray);border:1px solid var(--border);padding:.5rem .75rem}.add-details{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:#fff;border:1px solid var(--border);border-radius:var(--radius)}.field{display:flex;flex-direction:column;gap:.25rem}.field label{font-size:.8rem;color:var(--gray)}.field select{padding:.4rem .5rem;border:1px solid var(--border);border-radius:var(--radius);background:#fff}.tag-picker{display:flex;flex-wrap:wrap;gap:.35rem}.tag-btn{background:#fff;color:var(--gray);border:1px solid var(--border);padding:.2rem .6rem;border-radius:999px;font-size:.8rem}.tag-btn.active{background:var(--green-light);color:var(--green);border-color:var(--green)}.section-manage{margin-top:1.5rem;display:flex;flex-direction:column;gap:.5rem}.section-manage details{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .75rem}.section-manage details summary{cursor:pointer;font-size:.875rem;color:var(--gray);-webkit-user-select:none;user-select:none}.inline-form{display:flex;gap:.5rem;margin-top:.5rem}.inline-form input{flex:1;padding:.4rem .75rem;border:1px solid var(--border);border-radius:var(--radius)}.tag-manage{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem}.tag-list{display:flex;flex-wrap:wrap;gap:.35rem;min-height:1.5rem}.tag-item{display:inline-flex;align-items:center;gap:.25rem;background:var(--green-light);color:var(--green);padding:.15rem .5rem;border-radius:999px;font-size:.8rem}.tag-item button{background:none;color:var(--green);padding:0;font-size:.8rem}.empty-hint{font-size:.8rem;color:var(--gray)}.checkout-bar{display:flex;align-items:center;justify-content:space-between;background:var(--green-light);border-radius:var(--radius);padding:.5rem 1rem;margin-bottom:.75rem;font-size:.875rem;color:var(--green)}.checkout-bar button{background:var(--green);color:#fff;padding:.25rem .75rem}.share-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:1rem}.share-modal input{width:min(480px,100%);padding:.5rem;border:1px solid var(--border);border-radius:var(--radius);background:#fff}
