*,:before,:after{margin:0;padding:0;box-sizing:border-box}:host{contain:content}menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;padding:16px;list-style:none;container:menu / inline-size;li{aspect-ratio:1 / 1;background-color:#eee;text-align:center;outline:1px solid #ddd;box-shadow:3px 3px #aaa;font-weight:bolder;font-variation-settings:"wdth" 200;container:item / inline-size;&:hover{background-color:#ddd;outline:1px solid #eee}a{color:inherit;font-size:5cqh;word-break:break-word}&.center{a{display:grid;place-items:center center;width:100%;height:100%;text-decoration:none}a:hover{cursor:pointer}}&.user{a{font-size:7rem}}&.storage{display:grid;align-content:center;justify-items:center;--storage-used: 0;background-image:conic-gradient(from 0turn,#aaa 0turn calc(var(--storage-used) * 1turn),#eee calc(var(--storage-used) * 1turn) 1turn);.ephemeral{em{color:red;font-variant:all-small-caps}}}}}