header{display:grid;grid-area:1/1/2/2;grid-template-columns:auto auto;grid-template-rows:1fr auto;padding:8px;grid-column-gap:0;grid-row-gap:0;grid-template-areas:"logo options" "search search";@media (min-width:600px){grid-template-areas:"logo search options";grid-template-columns:1fr 45rem 1fr;grid-template-rows:1fr}#options{grid-area:options;margin:0;padding:0 .5rem 0 0;text-align:right;svg{cursor:pointer;height:1rem;margin-left:1rem;width:1rem;@media (min-width:600px){height:auto;width:auto}}button{border:1px solid gray;border-radius:1rem;@media (min-width:600px){height:100%;padding:1rem}}}h1{cursor:pointer;grid-area:logo;margin:0;&:hover{font-style:italic}}.search{grid-area:search;input{border:1px solid gray;border-radius:1rem;box-shadow:2px 2px .3rem #eee;box-sizing:border-box;flex-grow:1;padding:1rem;width:100%;&.loading{animation:move-stripes 10s linear infinite;background:repeating-linear-gradient(45deg,#ddf5ff 100px,#b0bbff 200px);background-size:calc(20px/sin(45deg)) 100%}}}}@keyframes move-stripes{0%{background-position:0 0}to{background-position:100% 0}}*{font-family:sans-serif}body,html{margin:0}main{&[data-v-36b53d30]{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-column-gap:0;grid-row-gap:0;background:#fff;height:100dvh}&.dark{&[data-v-36b53d30]{filter:invert(1) hue-rotate(180deg)}#content[data-v-36b53d30]:fullscreen{filter:invert(1) hue-rotate(180deg)}}}#welcome{&[data-v-36b53d30]{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center}svg[data-v-36b53d30]{height:50%;width:50%}}#content{&[data-v-36b53d30]{grid-area:2/1/3/2;overflow:auto}&.drag-over[data-v-36b53d30]{border:10px dashed red}}footer[data-v-36b53d30]{color:gray;font-size:.75rem;grid-area:3/1/4/2;text-align:center}