.sheet{
  inset-inline:22px auto;bottom:22px;top:96px;
  width:380px;max-height:none;border-radius:16px;
  border:1px solid var(--edge)
}
.sheet.entering{animation:sheet-slidein .42s cubic-bezier(.19,1,.28,1) both}
@keyframes sheet-slidein{
  from{transform:translateX(-14px);opacity:0}
  to{transform:translateX(0);opacity:1}
}
[dir="rtl"] .sheet.entering{animation-name:sheet-slidein-rtl}
@keyframes sheet-slidein-rtl{
  from{transform:translateX(14px);opacity:0}
  to{transform:translateX(0);opacity:1}
}

.sheet.closing{transition:transform .3s cubic-bezier(.4,0,.7,.2),opacity .3s ease;
  transform:translateX(-14px)!important;opacity:0}
[dir="rtl"] .sheet.closing{transform:translateX(14px)!important}

.sheet-head{padding:1.25em var(--pad) 0;cursor:default}

.sheet-head .head-row h2,
#search .sheet-head .head-row h2,
#settings .sheet-head .head-row h2{margin-block-end:0}
.sheet-head .head-row{margin-block-end:12px;padding-inline-end:.2em}

.sheet-body{padding-bottom:20px}
.grip{display:none}
#scrim{background:transparent;opacity:1}

.row:hover{background:rgba(255,255,255,.035)}
.chip:hover{border-color:var(--sodium);color:var(--ink)}


.icon-btn.sheet-close{display:grid}
.icon-btn.sheet-close:hover{color:var(--ink);
  border-color:color-mix(in srgb,var(--ink) 22%,transparent)}

.sheet-body{scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--ink) 18%,transparent) transparent}
.sheet-body::-webkit-scrollbar{width:10px}
.sheet-body::-webkit-scrollbar-track{background:transparent}
.sheet-body::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--ink) 16%,transparent);
  border-radius:999px;border:3px solid transparent;background-clip:padding-box}
.sheet-body:hover::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--ink) 30%,transparent);background-clip:padding-box}
.sheet-body::-webkit-scrollbar-thumb:active{
  background:color-mix(in srgb,var(--sodium) 55%,transparent);background-clip:padding-box}

.tag.live-ok,.tag.live-tight,.tag.live-full,.tag.live-closed{
  display:inline-flex;align-items:center;gap:6px}
.tag.live-ok::before,.tag.live-tight::before{
  content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.tag.live-ok{border-color:var(--free);color:var(--free)}
.tag.live-tight{border-color:var(--sodium);color:var(--sodium)}
.tag.live-full{border-color:var(--heavy);color:var(--heavy)}
.tag.live-closed{border-color:var(--edge);color:var(--mute);border-style:dashed}