:root{--screen:#999}html{height:100%}body{background-color:#fff;margin:0;padding:0;height:100%;display:flex;align-items:center;justify-content:center}.container{height:80vh;aspect-ratio:216/384}.case{width:calc(100% + 52px);height:calc(100% + 52px);position:absolute;pointer-events:none;margin:-26px;border-radius:26px;border:solid 18px purple;box-sizing:border-box;top:0;left:0}.device{position:relative;height:100%}.screen{height:100%}#canvas{display:block;image-rendering:pixelated;width:216px;height:384px;width:100%;height:100%;position:relative}.corner{position:absolute;top:-8px;left:-8px;border:solid 8px #000;width:100%;height:100%;pointer-events:none}