*{padding:0;margin:0;box-sizing:border-box}body{font-family:Black Ops One,system-ui}.footer{background-color:#001524;color:#d5cea3;text-align:center;padding:12px;width:100%;font-size:.8rem;font-weight:600;bottom:0;position:static;left:0;margin-top:auto;margin-bottom:-30px}body{margin:0;padding:0;display:flex;flex-direction:column;min-height:100vh;background-color:#001524}.container{flex:1;display:flex;flex-direction:column;background-color:#001524;min-height:100vh;text-align:center;padding:40px clamp(16px,5vw,48px)}.title{font-size:64px;font-weight:700;color:#131f39;letter-spacing:5px;text-shadow:2px 2px 0 #000,4px 4px 0 #000,6px 6px 0 #000,8px 8px 0 #000,10px 10px 0 #000,12px 12px 0 #000,14px 14px 0 #000,16px 16px 0 #000,18px 18px 0 #000,20px 20px 0 #000}.subtitle{margin-top:10px;margin-bottom:50px;font-weight:400;color:#d5cea3;font-size:18px}.code-box{transition:background-color .3s ease;border-radius:24px;width:90%;max-width:900px;margin:16px auto 0;box-shadow:20px 20px #000;border:#000 solid 5px;overflow-x:auto;overflow-y:auto;white-space:pre;padding:clamp(16px,4vw,32px);box-sizing:border-box}.export-wrapper{width:100%;transition:all .3s ease;max-width:1100px;margin:0 auto;padding:0 clamp(12px,4vw,32px);box-sizing:border-box}.code-box .monaco-editor,.code-box .monaco-editor .overflow-guard,.code-box .monaco-editor .monaco-scrollable-element{background:transparent!important}.code-box .monaco-editor .inputarea.ime-input,.code-box .monaco-editor .lines-content,.code-box .monaco-editor,.code-box .monaco-editor .view-lines,.code-box .monaco-editor .overflow-guard,.code-box .monaco-editor-background,.code-box .monaco-editor .margin{outline:none!important;border:none!important}.top-dots{display:flex;position:relative;justify-content:flex-start;align-items:flex-start;margin-top:-20px;margin-left:22px;gap:8px}.top-dots img{width:50px;height:50px}.controls select,.controls input{background-color:#02101a;color:#a6a6a6;border:1px solid #444;border-radius:8px;padding:10px 20px;font-family:Black Ops One,system-ui,sans-serif;font-size:14px;outline:none;transition:all .3s ease;width:140px;text-align:center}.controls select:hover,.controls input:hover{background-color:#04111a94;border-color:#666}.controls select:focus,.controls input:focus{background-color:#02101a;border-color:#666;box-shadow:0 0 5px #666}.controls{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:28px;padding:0 10px}.export-btn{background-color:#02101a;color:#a6a6a6;border:1px solid #444;border-radius:8px;padding:10px 20px;font-family:Black Ops One,system-ui,sans-serif;font-size:14px;outline:none;transition:all .3s ease;width:140px;text-align:center;cursor:pointer}.snippet-name{background:transparent;border:none;outline:none;font-size:15px;font-weight:600;font-family:Black Ops One,system-ui,sans-serif;color:#d5cea3;margin:12px auto 6px;text-align:center;width:90%;max-width:300px}.snippet-name::placeholder{color:#777}.reset-btn{background-color:#8b0000!important}.reset-btn:hover{background-color:brown!important}@media (max-width: 768px){.container{padding:20px 10px}.export-wrapper{padding:0 16px}.title{font-size:48px;letter-spacing:3px;text-shadow:1px 1px 0 #000,2px 2px 0 #000,3px 3px 0 #000,4px 4px 0 #000,5px 5px 0 #000,6px 6px 0 #000,7px 7px 0 #000,8px 8px 0 #000}.subtitle{font-size:16px;margin-bottom:30px;padding:0 10px}.code-box{width:95%;padding:20px;border-radius:16px;box-shadow:10px 10px #000;border:#000 solid 3px;margin:16px auto}.top-dots{margin-left:15px;gap:6px}.top-dots img{width:40px;height:40px}.controls{gap:10px}.controls select,.controls input,.export-btn{width:120px;padding:8px 15px;font-size:12px}.snippet-name{font-size:14px;width:95%}}@media (max-width: 480px){.container{padding:15px 5px}.export-wrapper{padding:0 12px}.title{font-size:36px;letter-spacing:2px;text-shadow:1px 1px 0 #000,2px 2px 0 #000,3px 3px 0 #000,4px 4px 0 #000,5px 5px 0 #000}.subtitle{font-size:14px;margin-bottom:20px}.code-box{width:98%;padding:16px;border-radius:12px;box-shadow:8px 8px #000;border:#000 solid 2px;margin:14px auto}.top-dots{margin-top:-16px;margin-left:10px;gap:4px}.top-dots img{width:30px;height:30px}.controls{gap:8px;margin-bottom:20px}.controls select,.controls input,.export-btn{width:calc(50% - 8px);min-width:100px;padding:10px 12px;font-size:11px}.snippet-name{font-size:13px;width:98%;margin:10px auto 4px}}@media (max-width: 360px){.title{font-size:28px;letter-spacing:1px;text-shadow:1px 1px 0 #000,2px 2px 0 #000,3px 3px 0 #000}.subtitle{font-size:12px}.code-box{padding:12px;border-radius:10px;box-shadow:6px 6px #000}.top-dots img{width:25px;height:25px}.controls select,.controls input,.export-btn{width:calc(50% - 6px);padding:8px 10px;font-size:10px}}