*,*: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;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{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:#fff;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer}.items li.checked{opacity:.5}.items li.checked .name{text-decoration:line-through}.items li .check-btn,.items li .check{background:none;color:var(--green);font-size:1rem;border:none;cursor:pointer}.items li .name{flex:1}.items li .qty{font-size:.8rem;color:var(--gray)}.items li .tag{font-size:.7rem;background:var(--green-light);color:var(--green);padding:.1rem .4rem;border-radius:999px}.group-header{font-size:.875rem;font-weight:600;color:var(--gray);margin:1rem 0 .25rem;text-transform:uppercase;letter-spacing:.05em}.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}
