:root{--mm:5px}html{background-color:var(--paper);background-image:linear-gradient(90deg,#1b4b7a12 1px,#0000 1px),linear-gradient(#1b4b7a12 1px,#0000 1px);background-size:calc(10 * var(--mm)) calc(10 * var(--mm));background-position:top}body{background:0 0}#root{height:auto;min-height:100%}.masthead{padding:40px 32px 0}.masthead h1{font:600 44px/1 var(--display);letter-spacing:-.01em;margin:0}.masthead h1 a{color:inherit;text-decoration:none}.drawer{padding:calc(10 * var(--mm)) 32px calc(16 * var(--mm));justify-content:center;align-items:center;gap:calc(10 * var(--mm)) calc(12 * var(--mm));flex-wrap:wrap;margin:0;list-style:none;display:flex}.drawer:empty{display:none}.empty{color:var(--muted);margin:24px 0;padding:0 32px}.specimen{max-width:100%;position:relative}.specimen.loading{display:none}.frame{width:calc(var(--fw) * var(--mm));height:calc(var(--fh) * var(--mm));max-width:100%;perspective:calc(400 * var(--mm));outline-offset:6px;cursor:default;display:block;position:relative}.specimen[data-touch] .frame{cursor:crosshair}.specimen.cut .frame{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 85%,#0000);mask-image:linear-gradient(90deg,#000 85%,#0000)}.glass{width:calc(var(--w) * var(--mm));height:calc(var(--h) * var(--mm));transform:translate(-50%, -50%) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(var(--turn));background:#0b0b0d;transition:transform .12s ease-out,box-shadow .2s;display:block;position:absolute;top:50%;left:50%}.specimen[data-tech=epaper] .glass{background:#d8d6cf}.specimen[data-tech=led] .glass{background:0 0}.specimen.active .glass{box-shadow:0 calc(1.5 * var(--mm)) calc(5 * var(--mm)) #11181c38}.specimen[data-tech=led].active .glass{box-shadow:none}.open{z-index:1;font:500 16px/1 var(--mono);color:var(--blue);opacity:0;pointer-events:none;padding:0 0 6px 8px;text-decoration:none;transition:opacity .15s;position:absolute;top:0;bottom:0;left:100%}.specimen.active .open,.open:focus-visible{opacity:1;pointer-events:auto}.specimen.cut .open{padding:0 0 8px 8px;inset:auto 0 100% auto}@media (width<=640px){.masthead{padding:28px 16px 0}.masthead h1{font-size:34px}.drawer{padding:calc(8 * var(--mm)) 16px}}
