*{box-sizing:border-box}body{margin:0;background:#faf9fc;color:#29232e;font-family:system-ui,'Malgun Gothic',sans-serif}header,main{max-width:1080px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:16px}a{color:#7544b2}h1{font-size:32px}p{line-height:1.7;color:#6b6473}label{display:block;margin:24px 0 8px;font-weight:600}input{width:100%;padding:16px;font:inherit;border:1px solid #cec3db;border-radius:12px}input:focus-visible,a:focus-visible{outline:3px solid #a476d8;outline-offset:3px}ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;padding:0}li{border:1px solid #e6e0ec;background:white;border-radius:14px;padding:18px}li[hidden]{display:none}li span{display:block;font-size:13px;color:#777;margin-top:7px}footer{font-size:12px;color:#888;padding:24px 0}