:root{--c-background: #0a1129;--c-text: rgb(255 255 255 / .9);--c-primary: rgba(98, 157, 233, .8);--c-secondary: rgb(233 98 125 / .8);--c-success: rgba(98, 233, 143, .8);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}html,body{background:var(--c-background);color:var(--c-text);margin:0;padding:0;scrollbar-gutter:stable}body{width:80ch;max-width:calc(100dvw - 3rem);margin:0 auto;display:flex;flex-direction:column}body:not(:has(#entries label)) #unloadzip,body:not(:has(#entries label)) #filename,body:not(:has(#entries label)) #saveall{display:none}body:not(:has(#entries label)) #welcome{display:block}body #saveall{display:flex;margin-top:2rem}button{--c: var(--c-primary);border:1px solid var(--c);background:transparent;color:var(--c-text);text-transform:uppercase;font-size:1rem;align-items:start;padding:.5rem;cursor:pointer}button:has(small){display:flex;flex-direction:column}button:has(small) small{font-size:.8em;opacity:.8;text-align:start;text-transform:none}button:hover{background:color-mix(in srgb,var(--c),transparent 80%);outline:2px solid var(--c);outline-offset:-3px}button#unloadzip{--c: var(--c-secondary)}header{padding:2rem 0 0}header h1{display:inline-block;margin:0}header img{height:3rem;width:auto}#top{display:flex;align-items:start;justify-content:space-between;margin-top:1rem}main{flex:1;display:flex;flex-direction:column;gap:1rem}main #entries{display:flex;flex-direction:column;gap:.5rem}main #entries label{--c: color-mix(in srgb, var(--c-success), transparent 50%);display:flex;align-items:center;justify-content:space-between;padding:1rem;border-left:3px solid var(--c);background-color:color-mix(in srgb,var(--c-background),var(--c-text) 10%)}main #entries label>span{overflow:hidden}main #entries label .name{display:flex;flex-direction:column}main #entries label:not([data-mimetype^="image/"]){color:color-mix(in srgb,var(--c-text),transparent 50%);border-color:color-mix(in srgb,var(--c-text),transparent 90%)}main #entries label:not([data-mimetype^="image/"]) input{visibility:hidden}main #entries label:hover{background-color:color-mix(in srgb,var(--c-text),transparent 85%)}main #entries label[data-mimetype^="image/"]:hover{background-color:color-mix(in srgb,var(--c-success),transparent 80%)}main #welcome{display:none}main #welcome p{font-size:1.1em;text-wrap:pretty;margin-top:0}main #welcome ul{padding-inline-start:1.25rem}.title{font-weight:700;font-style:normal}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%);border:0}[type=checkbox]{accent-color:var(--c-secondary);scale:1.5}a{color:var(--c-primary)}a:hover{color:color-mix(in srgb,var(--c-primary),var(--c-text) 70%)}