@import "https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";
@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;700&display=swap";
body{background:#525a46;justify-content:center;padding:40px;font-family:Fira Code,monospace;display:flex}h1{padding:5px;font-family:"Press Start 2P",sans-serif;font-size:20px}a{color:#c2a40c}.header{z-index:1000;color:#fff;background:#2c2c2c;border-bottom:1px solid #000;flex-wrap:wrap;justify-content:space-between;align-items:center;width:100%;display:flex;position:fixed;top:0;left:0;box-shadow:inset 0 0 3px rgba(0,0,0,.8)}iframe{width:100%;height:500px}.header p{white-space:nowrap;margin:0;font-weight:700}.header a{color:#c2a40c;text-decoration:none}.header button{color:#fff;cursor:pointer;background:#444;border:none;border-radius:4px;margin:2px 3px;padding:2px 4px}#clock{color:#fff;text-align:right;border-radius:4px;margin-left:auto;padding:6px 10px;font-size:11px;display:inline-block}.container{text-align:center;background:#2c2c2c;border:1px solid #000;border-radius:4px;max-width:1000px;padding:20px;box-shadow:inset 0 0 8px rgba(0,0,0,.8)}.win95-window{background:silver;border:2px solid #000;width:400px;margin-top:3px;display:none;position:absolute;top:5%;left:25%;box-shadow:2px 2px gray,-2px -2px #fff}.win95-titlebar{color:#fff;cursor:move;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:linear-gradient(90deg,#3d4334,#525a46);justify-content:space-between;align-items:center;padding:2px;font-family:"Press Start 2P",monospace;font-size:12px;display:flex}.win95-buttons{gap:2px;display:flex}.win95-btn{cursor:pointer;background:#2c2c2c;border:2px solid #000;border-color:#fff #000 #000 #fff;width:20px;height:20px;margin:3px auto;padding:0;font-family:MS Sans Serif,sans-serif;font-size:12px;line-height:14px}.win95-btn:active{border:2px solid #fff;border-color:#000 #fff #fff #000}.win95-content{background:silver;padding:10px;position:relative;box-shadow:inset 2px 2px #fff,inset -2px -2px gray}.win95-content img{width:100%;height:100%}.win95-content a{cursor:pointer;resize:both;text-decoration:none}.win95-content .tg-btn{position:absolute;top:10px;right:10px}.win95-window.minimized .win95-content{height:0;display:none;overflow:hidden}.win95-window.maximized{width:65%;position:fixed;top:0;left:0}.win95-window.maximized .win95-content{height:calc(100% - 20px);overflow:auto}.win95-window button{margin-left:auto}.image-grid{grid-template-columns:repeat(4,1fr);justify-items:center;gap:15px;margin:10px auto;display:grid}.image-wrapper{text-align:center;cursor:pointer;flex-direction:column;align-items:center;width:100%;max-width:150px;display:flex}.image-box{aspect-ratio:1;width:100%;position:relative}.base{object-fit:cover;border-radius:10px;width:100%;height:100%;display:block}.circle-overlay{opacity:0;pointer-events:none;background-position:50%;background-repeat:no-repeat;background-size:contain;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.caption{color:#222;word-break:break-word;font-family:Fira Code,monospace;font-size:12px;line-height:1.2}.p{margin:0}.image-wrapper:hover .circle-overlay,.image-wrapper.clicked .circle-overlay{opacity:1}.style1{background-image:url(/img/circle1.png)}.style2{background-image:url(/img/circle2.png)}.style3{background-image:url(/img/circle3.png)}.style4{background-image:url(/img/circle4.png)}.style5{background-image:url(/img/circle5.png)}.style6{background-image:url(/img/circle6.png)}.style7{background-image:url(/img/circle7.png)}.style8{background-image:url(/img/circle8.png)}.emoji-grid{grid-template-columns:repeat(auto-fit,minmax(50px,1fr));justify-items:center;display:grid}.emoji-card{flex-direction:column;align-items:center;display:flex}.emoji{object-fit:contain;width:35px;height:35px;margin:10px 4px}.emoji-card button{cursor:pointer;color:#fff;background:#000;border:none;border-radius:4px;padding:3px 6px;font-family:inherit;font-size:10px}.emoji-card a button{all:unset;color:#fff;cursor:pointer;background:#000;border-radius:4px;padding:6px 10px;font-size:12px}button{color:#e5e5e5;cursor:pointer;background:linear-gradient(#3a3a3a,#2a2a2a);border:1px solid #000;border-radius:3px;margin:15px auto;padding:8px 14px;font-family:"Press Start 2P",sans-serif;font-size:11px;transition:background .2s;display:block}button:hover{background:linear-gradient(#4a4a4a,#2a2a2a)}button.pressed{border:2px solid #404040;border-color:#404040 #6c6c6c #5b5b5b #404040;transform:translateY(2px);box-shadow:inset 1px 1px #4e4e4e,inset -1px -1px #6c6c6c}.icon{text-align:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:1px;width:80px;padding:4px 2px;position:absolute}.icon img{border-radius:6px;width:auto;max-width:100%;max-height:64px;margin:0 auto;display:block}.icon p{color:#fff;margin:4px 0 0;font-family:Fira Code,monospace;font-size:10px;line-height:1.2}.icon.selected{background:rgba(0,120,215,.6);outline:1px solid #0078d7;margin-top:-2px;padding-top:6px}.speech-bubble{color:#000;word-wrap:break-word;opacity:0;pointer-events:none;z-index:10;white-space:pre-line;background:#fff;border:1px solid #000;border-radius:5px;width:350px;padding:6px 10px;font-family:"Press Start 2P",sans-serif;font-size:11px;transition:opacity .3s;position:absolute;top:-10px;left:100%;box-shadow:2px 2px 6px rgba(0,0,0,.4)}.speech-bubble p{color:#000}.speech-bubble.show{opacity:1}.editor-container{flex-direction:column;gap:8px;width:100%;height:400px;display:flex}#editor{resize:none;box-sizing:border-box;flex:1;width:100%;height:100%}#saveBtn{cursor:pointer;align-self:flex-end}.notification{color:#fff;opacity:0;pointer-events:none;z-index:2000;background:#2c2c2c;border-radius:4px;padding:10px 16px;font-family:"Press Start 2P",sans-serif;font-size:12px;transition:opacity .4s;position:fixed;bottom:20px;right:20px}.notification.show{opacity:1}.ghoul-icon{margin-left:8px;display:flex}.ghoul-icon img{width:25px;height:auto}.z-icon{margin-left:8px;display:flex}.z-icon img{border-radius:4px;width:25px;height:auto;padding:0}#cryptdefender{background:#000;border:2px solid #444;margin:0 auto;display:block}#highscores{color:#fff;background:#111;border:1px solid #444;max-height:150px;padding:8px;font-family:monospace;font-size:14px;overflow-y:auto}#highscores h3{color:gold;margin:0 0 5px;font-size:16px}#score-list{margin:0;padding-left:20px}.name-entry{color:#fff;background:#222;border:2px solid #666;margin-top:10px;padding:10px;font-family:monospace;display:none}.name-entry input{color:#0f0;background:#000;border:1px solid #444;margin-right:6px;padding:4px;font-family:monospace}.name-entry button{color:#fff;cursor:pointer;background:#444;border:1px solid #888;padding:4px 8px}@media (max-width:768px){.name-entry{box-sizing:border-box;text-align:center;background:rgba(0,0,0,.8);border:none;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;margin:0;padding:25% 20px 20px;display:none;position:fixed;top:0;left:0}.name-entry input{width:80%;margin:10px 0;font-size:16px}.name-entry button{width:60%;margin-top:10px}}#mobile-controls{background-color:#000;display:none}#mobile-shoot{flex-wrap:wrap;justify-content:center;display:flex}#mobile-start{background:#272727;border:2px solid #000;flex-wrap:wrap;justify-content:center;gap:4px;display:flex}#mobile-controls button{cursor:pointer;border:2px solid #000;border-top-width:1px}#btn-shoot{color:red;background:#272727;border-radius:0;width:50%;height:69px;margin:0;padding:10px 16px;font-size:16px}#btn-right,#btn-left{color:#fff;background:#272727;border-radius:0;width:25%;margin:0;padding:10px 16px;font-size:16px}#btn-pause,#btn-start{padding:8px 12px;font-size:10px}canvas,button{touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}@media (max-width:768px){#mobile-controls{display:block}#cryptdefender{width:100%;height:auto;top:0;left:0}.win95-window{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;top:0;left:0}.speech-bubble{top:0;left:0}html,body{width:100%;margin:0;padding:0;overflow-x:hidden}body{width:100%;height:100%;position:fixed}canvas,#btn-left,#btn-right,#btn-shoot,#btn-start,#btn-reset,#btn-pause{touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}}