:root{@media(pointer:coarse){--target-min: 40px}@media not (pointer:coarse){--target-min: 32px}}body{position:relative;font-family:sans-serif;margin:0 auto;max-width:500px;background:#f0fff0;color:#000c}h1{position:absolute;top:0;right:0;z-index:2;font-size:12px;margin:0;padding:4px 8px;pointer-events:none}h2{font-family:Roboto,sans-serif;font-optical-sizing:auto;font-weight:700;font-style:normal;font-variation-settings:"wdth" 50;font-size:28px;margin:0}dialog{border:solid black 2px;box-shadow:4px 4px #000;background:#e0ffff;&::backdrop{background:#00000080}}.move-handle{touch-action:pan-x;cursor:grab;user-select:none;width:var(--target-min);text-align:center;color:#00000026}.empty{padding-top:50px;text-align:center}@media(width<800px){body{padding-bottom:100px}nav{position:fixed;inset-inline-end:0;inset-block-end:0;z-index:1}}button{cursor:pointer;height:var(--target-min);line-height:var(--target-min);border:none;corner-shape:squircle;background-color:#8080801a;padding:0 16px;&:hover,&:focus{outline:none;background-color:#80808033}&:active{background-color:#8080804d}}button.icon{width:var(--target-min);padding:0;background-color:transparent;position:relative;color:#00000080;&:before{content:"";border-radius:50%;position:absolute;inset:0;z-index:-1}&:hover:before,&:focus:before{background-color:#8080801a}}button.fab{position:relative;min-width:80px;margin:8px;border:solid black 2px;box-sizing:content-box;box-shadow:3px 3px #000;background:tomato;transition-duration:.1s;transition-timing-function:ease-in-out;transition-property:box-shadow,transform;&:before{content:"";position:absolute;inset:-2px}&:hover,&:focus{transform:translate(-2px,-2px);box-shadow:5px 5px #000;&:before{inset:0 -4px -4px 0}}&:active{transform:translate(2px,2px);box-shadow:1px 1px #000;&:before{inset:-4px 0 0 -4px}}.text{margin-inline-start:8px}}button.fab,button.icon{padding:0}span.icon{filter:brightness(0)}svg{font-size:24px;vertical-align:middle}ul{>li,>.backlay{height:var(--target-min);line-height:var(--target-min)}>li{position:relative;display:flex;background-color:#f0fff0;z-index:0;touch-action:pan-y;&:hover{background-color:color-mix(in srgb,honeydew 96%,black)}.overflow{visibility:hidden}&:hover .overflow{@media(pointer:fine){visibility:visible}}.text{flex:1}.actions{display:flex;gap:8px}}>.backlay{position:absolute;left:0;right:0;z-index:-1;padding:0 8px;&.right{text-align:right}}}.tutorial{font-size:smaller;@media(width>=800px)or (pointer:fine){display:none}}section>header,p,ul>li{padding-left:8px}p{margin:0}section>header{position:relative;z-index:1;display:flex;justify-content:space-between;background:#f0fff0;border-bottom:solid #888 2px;height:56px;line-height:80px;vertical-align:bottom}ul{margin:0;padding:0;width:100%;overflow:hidden;list-style-type:none;background:#0000001a}