*{box-sizing:border-box}html{background:#f6f5ef;color:#282c26;font-family:"Trebuchet MS",sans-serif;font-size:16px}body{margin:0}main{max-width:780px;margin:0 auto;padding:32px 24px 24px}h1,h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.035em;margin:0}h1{font-size:clamp(32px,7vw,46px)}h2{font-size:27px}p{line-height:1.5}.eyebrow{font-size:10px;letter-spacing:.16em;margin:0 0 9px;color:#5c6656}header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:27px;border-bottom:2px solid #282c26}.list-heading{display:flex;justify-content:space-between;align-items:baseline;margin:27px 0 16px}.list-heading>span{font-size:13px;color:#5c6656}button,input,select{font:inherit;border:1px solid #a8afa0;border-radius:3px;background:transparent;color:inherit;min-height:48px}button{cursor:pointer;padding:10px 15px}button:hover{background:#e7ebdf}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #486040;outline-offset:3px}.primary{background:#303f2a;border-color:#303f2a;color:#fff}.primary:hover{background:#42563a}.quiet{border:0;font-size:12px;white-space:nowrap;padding:8px}.add{display:flex;gap:8px}.add input{flex:1;min-width:0;padding:12px;background:#fffefa}.add button{white-space:nowrap}.groceries{list-style:none;margin:19px 0 30px;padding:0;border-top:1px solid #b7beaf}.groceries li{border-bottom:1px solid #c6ccbf}.item{display:flex;width:100%;gap:14px;align-items:center;text-align:left;border:0;border-radius:0;min-height:62px;padding:12px 3px}.check{display:grid;place-items:center;flex-shrink:0;width:25px;height:25px;border:1px solid #6b7962;font-size:18px}.bought .check{background:#303f2a;color:white}.bought .item>span:nth-child(2){text-decoration:line-through;color:#74806e}.item-note{margin-left:auto;font-size:11px;color:#74806e}.empty{padding:33px 0;line-height:1.8}.empty span{font-size:14px;color:#5c6656}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:15px}.quick button{width:100%;display:flex;justify-content:space-between;gap:8px}.quick span{color:#74806e}.message{border-left:3px solid #486040;padding:8px 12px;background:#e8ecdf;font-size:14px}footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #b7beaf;margin-top:36px;padding-top:16px;font-size:12px;color:#5c6656}a{color:inherit}.login{max-width:390px;margin:10vh auto}.login .intro{color:#5c6656;margin-bottom:28px}.login form{display:flex;flex-direction:column;gap:9px}.login input,.login select{padding:12px;background:#fffefa}.login label{font-size:13px;margin-top:12px}.login .primary{margin-top:15px}.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}@media(max-width:500px){main{padding:24px 18px}header{align-items:flex-start}.quiet{padding:0;font-size:11px}h1{font-size:33px}.quick{grid-template-columns:repeat(2,1fr)}footer{font-size:11px}}