@font-face{font-family:EnterCommand;src:url(entercommand.woff2) format("woff2"),url(entercommand.woff) format("woff")}:root{--monitor-light-color:#d3ccbc;--monitor-dark-color:#ccc5b3;--monitor-shadow-light:#d7d4c1;--monitor-shadow-medium:#b7b19b;--monitor-shadow-dark:#908e7a;--monitor-shadow-very-dark:#6e6d5f;--monitor-gradient:linear-gradient(
      to bottom,
      var(--monitor-light-color),
      var(--monitor-dark-color)
    );--monitor-shadow-texture:2px -2px 30px #493e2a33 inset,-2px -2px 30px #493e2a33 inset,1px -1px 1px #493e2a33 inset,-1px -1px 1px #493e2a33 inset,0 2px 30px #ddd inset}body{background:#336}.container{display:flex;justify-content:center;margin-top:3em}.computer-container{--width-monitor:500px;--height-monitor:450px;display:flex;flex-direction:column;align-items:center}.computer-container .monitor{display:flex;flex-direction:column;justify-content:center;position:relative;align-items:center;width:var(--width-monitor);height:var(--height-monitor);background:var(--monitor-gradient);border-radius:5px;box-shadow:var(--monitor-shadow-texture)}.computer-container .monitor .monitor-inner{width:calc(var(--width-monitor) * .75);height:calc(var(--height-monitor) * .7);border-radius:5px;display:flex;justify-content:center;align-items:center;background:#000;border:15px solid var(--monitor-shadow-medium);border-top:15px solid var(--monitor-shadow-dark);border-bottom:15px solid var(--monitor-shadow-light)}.computer-container .monitor .monitor-inner .screen-container{width:calc(var(--width-monitor) * .72);height:calc(var(--height-monitor) * .68);background:#222;border-radius:5px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;border:3px solid #000;box-shadow:10px 10px 20px 14px #0008 inset,-10px -10px 20px 14px #0008 inset;position:relative}.computer-container .monitor .monitor-inner .screen-container .screen{width:100%;max-width:calc(var(--width-monitor) * .72);font-family:EnterCommand;font-size:32px;color:#fff;text-shadow:0 0 5px #ccc;padding:10px 20px;box-sizing:border-box;position:absolute;top:0;z-index:5;transition:opacity .5s}.computer-container .monitor .monitor-inner .screen-container .screen.off{opacity:0}.computer-container .monitor .monitor-inner .screen-container .eyes{width:300px;height:100px;display:flex;justify-content:space-around;align-items:center;transition:opacity .5s}.computer-container .monitor .monitor-inner .screen-container .eyes.off{opacity:0}.computer-container .monitor .monitor-inner .screen-container .eyes .eye{width:50px;height:50px;background:#000;border-radius:50%;display:flex;justify-content:center;align-items:center;transform:translate(0,25px);position:relative;overflow:hidden}.computer-container .monitor .monitor-inner .screen-container .eyes .eye::before{content:"";display:block;background:#333;width:100%;height:110%;position:absolute;top:0;z-index:5;animation:blinkEye 2s ease infinite alternate}.computer-container .monitor .monitor-inner .screen-container .eyes .eye::after{content:"";display:block;background:#333;width:100%;height:10%;position:absolute;bottom:0;z-index:5;transform:translate(0,0)}.computer-container .monitor .monitor-inner .screen-container .eyes .eye .shine{content:"";display:block;border-radius:50%;width:20px;height:20px;background:#ccc;transform:translate(10px,-5px)}.computer-container .monitor .monitor-bottom{width:100%;height:50px;position:absolute;bottom:0;display:flex;justify-content:center;align-items:center;transform:translate(150px,0)}.computer-container .monitor .monitor-bottom .power-switch{width:38px;height:38px;background:linear-gradient(to bottom,var(--monitor-shadow-dark),var(--monitor-shadow-light));border-radius:50%;margin-right:6px;display:flex;justify-content:center;align-items:center}.computer-container .monitor .monitor-bottom .power-switch .button{--symbol-color:#888;width:24px;height:24px;border:2px solid #555;border-radius:50%;background:#cac1b2;display:flex;justify-content:center;align-items:center}.computer-container .monitor .monitor-bottom .power-switch .button:active{--symbol-color:#666;box-shadow:1px 1px 2px #0006 inset;background:var(--monitor-shadow-medium)}.computer-container .monitor .monitor-bottom .power-switch .button::before{content:"";display:block;width:10px;height:10px;border:3px solid var(--symbol-color);border-radius:50%;clip-path:polygon(15% 0,0 0,0 102%,102% 100%,102% 0,85% 0,50% 50%)}.computer-container .monitor .monitor-bottom .power-switch .button::after{content:"";display:block;width:4px;height:10px;border-radius:1px;border-left:3px solid var(--symbol-color);position:absolute;transform:translate(2px,-4px)}.computer-container .monitor .monitor-bottom .power-led{width:9px;height:9px;background:#333;border-radius:50%;border:1px solid var(--monitor-shadow-dark)}.computer-container .monitor .monitor-bottom .power-led:not(.on){box-shadow:0 0 1px 1px #2228 inset;animation:blink 2s infinite ease-out}.computer-container .monitor .monitor-bottom .power-led.on{background:#5cef11;box-shadow:0 0 1px 1px #2228 inset}.computer-container .monitor::after,.computer-container .monitor::before{content:"";display:block;width:63px;height:40px;background:linear-gradient(to right,#0004 65%,#0008 80%);position:absolute;top:130px}.computer-container .monitor::before{left:0}.computer-container .monitor::after{right:0;transform:rotate(180deg)}.computer-container .monitor-base{width:calc(var(--width-monitor) * .75);height:45px;background:var(--monitor-gradient);overflow:hidden;border-radius:0 0 3px 3px;position:relative;display:flex;justify-content:center}.computer-container .monitor-base::before{content:"";display:block;width:100%;height:30px;background:#0007;filter:blur(8px);transform:translate(0,-10px);position:absolute;top:0;z-index:5}.computer-container .monitor-base .wheels-parent{width:125px;height:20px;display:flex}.computer-container .monitor-base .wheels-parent .wheel{width:30px;height:30px;border-radius:50%;margin:0 4px;background:var(--monitor-shadow-light);box-shadow:0 1px 5px #0009;transform:translate(95px,-26px)}.computer-container .monitor-holder-container{width:calc(var(--width-monitor) * .6);perspective:280px;position:relative;z-index:-1;transform:translateY(-10px)}.computer-container .monitor-holder-container .monitor-holder{width:100%;height:90px;background:linear-gradient(to top,var(--monitor-shadow-medium) 5%,var(--monitor-shadow-very-dark) 40%);box-shadow:0 -10px 20px #0007 inset;transform:rotateX(44deg) translateY(-33px);display:flex;justify-content:center}.computer-container .monitor-holder-container .monitor-holder .monitor-holder-inner{width:calc(var(--width-monitor) * .45);height:100px;background:linear-gradient(to top,var(--monitor-shadow-medium) 1%,var(--monitor-shadow-dark) 15%);border-radius:50%;box-shadow:0 -2px 20px #000a inset;transform:translate(0,-55px)}.computer-container .monitor-holder-container .monitor-holder .monitor-holder-inner-front{content:"";display:block;width:calc(var(--width-monitor) * .45);height:100px;border-radius:28% 28% 50% 50%;background:#0001;box-shadow:0 -2px 10px #0004 inset;position:absolute;z-index:-1;transform:translate(0,-32px)}.computer-container .monitor-holder-container .monitor-holder .monitor-holder-inner-front.bottom{background:var(--monitor-shadow-dark);box-shadow:0 -12px 10px #fff4 inset,0 -6px 10px #0001 inset;transform:translate(0,-54px);z-index:0}.computer-container .monitor-holder-container .monitor-holder-front{width:calc(var(--width-monitor) * .62);height:20px;background:var(--monitor-shadow-light);transform:translate(-5px,-36px)}@keyframes blinkEye{0%,80%{transform:translateY(0)}100%,80%{transform:translateY(-90%)}}@keyframes blink{0%,19%{background:#ed9940}20%,99%{background:#333}}