.sheet{background:var(--ds-bg-canvas);border:1px solid var(--ds-fg);padding:6px;position:relative}.sheet.zoned{padding:16px}.sheet-in{border:1px solid var(--ds-border-strong);background:var(--ds-bg-canvas);flex-direction:column;min-height:100%;display:flex}.sheet-body{flex:1;position:relative}.sheet-body.pad{padding:var(--s5)}.zones span{font:500 9px/1 var(--ds-font-mono);color:var(--ds-fg-muted);position:absolute;transform:translate(-50%,-50%)}.zones .zt{top:8px}.zones .zb{top:auto;bottom:-1px;transform:translate(-50%,-50%)}.zones .zl{left:8px}.zones .zr{left:auto;right:-1px;transform:translate(-50%,-50%)}.sheet.zoned:before,.sheet.zoned:after{content:"";pointer-events:none;position:absolute}.sheet.zoned:before{background:linear-gradient(var(--ds-fg), var(--ds-fg)) 25% 0 / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 50% 0 / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 75% 0 / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 25% 100% / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 50% 100% / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 75% 100% / 1px 6px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 0 33.3% / 6px 1px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 0 66.6% / 6px 1px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 100% 33.3% / 6px 1px no-repeat, linear-gradient(var(--ds-fg), var(--ds-fg)) 100% 66.6% / 6px 1px no-repeat;inset:0}@media (width<=560px){.sheet.zoned{padding:6px}.zones,.sheet.zoned:before{display:none}.sheet-body.pad{padding:var(--s4)}}