@keyframes rotateDiscoBall{0%{transform:rotateX(90deg)rotate(0)rotate(0)}to{transform:rotateX(90deg)rotate(360deg)rotate(0)}}@keyframes rotateDiscoBallMiddle{0%{transform:rotateX(90deg)rotateY(0)rotate(0)}to{transform:rotateX(90deg)rotateY(-360deg)rotate(0)}}@keyframes lowerDiscoBall{0%{transform:translateY(0%)}to{transform:translateY(60%)}}@keyframes reflect{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.square{transform-style:preserve-3d;width:6px;height:6px;position:absolute;top:50px;left:50px;transform:rotateX(90deg)rotateY(0)translateZ(0)}.drag-area{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}:root{--page:black;--page-image:none;--footer-bg:black;--footer-fg:gray;--footer-hover:white;--banner:#f7f5f7;--banner-ink:black;--badge:black;--badge-ink:pink;--tape:#e9573f;--tape-edge:white;--tape-label:#fffd82;--tape-ink:black;--tape-hole:black;--tape-reel:white;--radio:#e0b650;--radio-edge:#ffe186;--radio-inset:#dec38c;--screen:#1cb676;--screen-ink:black;--slot:black;--slot-ink:white;--slider:#1cb676;--btn:white;--btn-ink:black;--btn-edge:lightgray;--play:#29a745;--play-ink:#1eff4f;--pause:#ffc107;--pause-ink:#fff600;--eject:#2f8f83;--eject-ink:white;--tv:#2f8f83;--tv-edge:#7cc7b8;--tv-inset:#dec38c;--tv-dark:#1d5b53;--tv-foot:#1d5b53;--tv-label:#f3f6f9;--antenna:#f3f6f9;--knob:#ffe186;--knob-edge:#e0b650;--osd:#1eff4f;--switch-on:#29a745;--power-on:#e9573f}:root[data-theme=walnut]{--page:#302625;--footer-bg:#302625;--footer-fg:#b1ac7a;--footer-hover:#e5dfd2;--banner:#e5dfd2;--banner-ink:#302625;--badge:#594237;--badge-ink:#d9c797;--tape:#987044;--tape-edge:#e5dfd2;--tape-label:#d9c797;--tape-ink:#302625;--tape-hole:#302625;--tape-reel:#e5dfd2;--radio:#c39a60;--radio-edge:#d9c797;--radio-inset:#e5dfd2;--screen:#b1ac7a;--screen-ink:#302625;--slot:#302625;--slot-ink:#e5dfd2;--slider:#594237;--btn:#e5dfd2;--btn-ink:#302625;--btn-edge:#d9c797;--play:#b1ac7a;--play-ink:#302625;--pause:#987044;--pause-ink:#e5dfd2;--eject:#594237;--eject-ink:#e5dfd2;--tv:#594237;--tv-edge:#987044;--tv-inset:#d9c797;--tv-dark:#302625;--tv-foot:#987044;--tv-label:#e5dfd2;--antenna:#e5dfd2;--knob:#d9c797;--knob-edge:#c39a60;--osd:#e5dfd2;--switch-on:#b1ac7a;--power-on:#c39a60}:root[data-theme=shore]{--page:#e5edf8;--page-image:linear-gradient(#e5edf8, #f3e3e4);--footer-bg:#232c2c;--footer-fg:#a5b4b1;--footer-hover:#e5edf8;--banner:#647d7d;--banner-ink:#e5edf8;--badge:#232c2c;--badge-ink:#f3e3e4;--tape:#b9c9d4;--tape-edge:#647d7d;--tape-label:#f3e3e4;--tape-ink:#232c2c;--tape-hole:#232c2c;--tape-reel:#e5edf8;--radio:#a5b4b1;--radio-edge:#b9c9d4;--radio-inset:#e5edf8;--screen:#232c2c;--screen-ink:#f3e3e4;--slot:#232c2c;--slot-ink:#e5edf8;--slider:#647d7d;--btn:#e5edf8;--btn-ink:#232c2c;--btn-edge:#b9c9d4;--play:#647d7d;--play-ink:#f3e3e4;--pause:#f3e3e4;--pause-ink:#647d7d;--eject:#232c2c;--eject-ink:#e5edf8;--tv:#647d7d;--tv-edge:#a5b4b1;--tv-inset:#e5edf8;--tv-dark:#232c2c;--tv-foot:#232c2c;--tv-label:#e5edf8;--antenna:#647d7d;--knob:#f3e3e4;--knob-edge:#b9c9d4;--osd:#f3e3e4;--switch-on:#232c2c;--power-on:#232c2c}body{background:var(--page);margin:0;padding:0;font-family:Helvetica,Arial,sans-serif;display:grid}a{color:#fff}header{color:#fff;text-align:center;background:#f0293e}main{background:#fff;min-height:80vh}main .controls{text-align:center;color:#fff;background:#333e5a;padding:.5em 0}main canvas{margin:0 auto;padding:20px;display:block}footer{color:#fff;text-align:center;background:#333e5a}