[hidden]{display:none!important}body:has(dialog[open]){overflow:hidden}
.tool-button{height:37px;padding:0 13px;border:1px solid var(--edge);border-radius:6px;background:#192936;color:var(--text);font-size:12px;font-weight:700;white-space:nowrap;transition:background .18s,border-color .18s}.tool-button:hover:not(:disabled){background:#233b49;border-color:#6a9299}button:disabled{opacity:.45;cursor:default}.terminal-indicator{display:inline-block;width:6px;height:6px;border-radius:50%;margin-left:4px;background:var(--accent);box-shadow:0 0 9px #8ee9ce88}
.studio-panels{display:flex;min-height:550px}.code-panel{width:100%}.editor-surface{position:relative;isolation:isolate;flex:1;display:flex;min-height:470px;overflow:hidden;background:#101a24}.editor-surface:before,.wallpaper-preview:before{content:'';position:absolute;inset:0;z-index:-2;background-image:var(--editor-wallpaper,none);background-position:center;background-size:cover;background-repeat:no-repeat}.editor-surface:after,.wallpaper-preview:after{content:'';position:absolute;inset:0;z-index:-1;background:rgb(9 17 25 / var(--wallpaper-shade,.72));pointer-events:none}.code-panel textarea{width:100%;min-height:470px;background:transparent}.CodeMirror{min-width:0;min-height:470px;height:calc(100dvh - 270px);background:transparent;line-height:1.75}.CodeMirror-gutters{background:#101a24aa;border-right:1px solid #ffffff0d}.CodeMirror-lines{padding:20px 0}
.studio-dialog{padding:0;margin:auto;width:min(720px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:1px solid #46616b;border-radius:16px;background:#101b25;color:var(--text);box-shadow:0 28px 100px #0009;overflow:hidden}.studio-dialog[open]{animation:dialog-in .18s ease-out}.studio-dialog::backdrop{background:#030a12a6;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 23px 17px;border-bottom:1px solid #ffffff10;background:#ffffff02}.dialog-eyebrow{color:#82b5ad;font-size:9px;font-weight:700;letter-spacing:.17em}.dialog-heading h2{font-size:21px;letter-spacing:-.025em;margin:5px 0 0}.dialog-actions{display:flex;align-items:center;gap:9px}.dialog-actions .tool-button{border:0;background:transparent;color:var(--muted);font-weight:400}.close-button{height:36px;width:36px;flex:none;border:1px solid #ffffff18;border-radius:8px;background:#ffffff05;color:#c3d7db;font:24px/1 'Segoe UI',sans-serif}.close-button:hover{background:#ffffff12;color:white}.terminal-panel{border:0;height:min(510px,calc(100dvh - 34px));background:#101b25}.terminal-body{padding:24px}.terminal-idle{padding:20px 0}.terminal-body pre{font-size:14px;line-height:1.8}.terminal-input{height:auto;min-height:50px;flex-shrink:0;margin:0 20px 18px;border:1px solid #8ee9ce66;border-radius:9px;padding:7px 8px 7px 14px;background:#17312f66;box-shadow:0 0 0 3px #8ee9ce06}.terminal-input:focus-within{border-color:var(--accent)}.input-marker{font:700 19px Consolas,monospace;color:var(--accent)}.terminal-input input{font-size:14px}.terminal-input button{background:#8ee9ce1a;border:1px solid #8ee9ce33;border-radius:5px;min-height:32px;padding:5px 10px;color:var(--accent);font-size:11px}.terminal-input button:hover{background:#8ee9ce33}.terminal-panel .panel-foot{border-color:#ffffff0e;height:39px;min-height:39px;padding:0 23px}.batch-input{padding:0 20px 18px;display:grid;gap:10px}.batch-input label{font-size:12px}.batch-input small{display:block;color:var(--muted);margin-top:5px}.batch-input textarea{width:100%;resize:vertical;max-height:150px;background:#0b141d;border:1px solid var(--edge);border-radius:6px;color:var(--text);padding:10px;font:13px/1.5 Consolas,monospace}.batch-input button{justify-self:end}
.wallpaper-dialog{width:min(480px,calc(100% - 32px));overflow-y:auto}.wallpaper-content{padding:20px 23px 23px}.wallpaper-preview{position:relative;isolation:isolate;min-height:145px;display:flex;align-items:center;padding:22px;border:1px solid #ffffff14;border-radius:9px;overflow:hidden;background:#101a24}.wallpaper-preview code{font:12px/1.9 Consolas,monospace;color:#e9f4f2}.wallpaper-preview code span{color:#c5a6f1}.wallpaper-preview code em{color:#e5c48e;font-style:normal}.wallpaper-options{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:13px 0}.wallpaper-options button{min-height:38px;padding:5px;border:1px solid #ffffff20;border-radius:6px;background:#ffffff03;color:#a9bec5;font-size:11px}.wallpaper-options button:hover{background:#ffffff09}.wallpaper-options button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:#8ee9ce10}.upload-button{position:relative;min-height:44px;display:flex;align-items:center;justify-content:center;border:1px dashed #6e969c;border-radius:7px;color:#c7e9e3;cursor:pointer;font-size:13px;background:#8ee9ce05}.upload-button:hover{background:#8ee9ce10}.upload-button:focus-within{outline:2px solid var(--accent);outline-offset:3px}.upload-button input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.wallpaper-adjust{margin-top:22px}.wallpaper-adjust label{display:flex;justify-content:space-between;color:#b9cdd2;font-size:12px}.wallpaper-adjust output{color:var(--accent);font:12px Consolas,monospace}.wallpaper-adjust input{width:100%;accent-color:var(--accent);margin:12px 0 0}.wallpaper-status{font-size:11px;color:#8faab2;margin:14px 0 0;line-height:1.6;min-height:34px}
@keyframes dialog-in{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}
@media(max-width:850px){.studio-toolbar{align-items:stretch;flex-direction:column;gap:14px}.toolbar-controls{align-items:end}.language-control{margin-right:auto}.CodeMirror{height:calc(100dvh - 310px)}}
@media(max-width:560px){.toolbar-controls{grid-template-columns:1fr 1fr 1fr}.language-control{grid-column:1/-1;margin:0;flex-direction:row;align-items:center;gap:12px}.language-control select{flex:1;min-width:0}.tool-button,.run-button{padding:0 9px;font-size:11px;height:40px}.studio-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);border-radius:12px}.terminal-panel{height:min(480px,calc(100dvh - 22px))}.dialog-heading{padding:16px}.terminal-body{padding:18px 16px}.terminal-input{margin:0 12px 14px}.terminal-input input{font-size:16px}.terminal-panel .panel-foot{padding:0 16px}.wallpaper-content{padding:16px}.wallpaper-preview{padding:14px}.CodeMirror,.editor-surface,.code-panel textarea{min-height:400px}.studio-panels{min-height:478px}}
@media(prefers-reduced-motion:reduce){.studio-dialog[open]{animation:none}}



.terminal-dialog{width:min(680px,calc(100% - 24px));max-height:calc(100dvh - 24px)}.terminal-dialog .dialog-heading{padding:12px 16px;gap:10px}.terminal-dialog h2{font-size:16px;margin:0}.terminal-dialog .dialog-actions{gap:6px}.terminal-dialog .terminal-panel{height:min(500px,calc(100dvh - 26px))}.terminal-dialog .terminal-body{padding:14px 16px}.terminal-dialog .terminal-idle{padding:0}.terminal-dialog .terminal-body pre{font:14px/1.5 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.terminal-dialog .terminal-input{margin:0 12px 12px;padding:6px 8px 6px 12px;min-height:44px;box-shadow:none}.terminal-dialog .terminal-input input{font-size:16px}.terminal-dialog .input-marker{display:none}.terminal-dialog .batch-input{padding:0 12px 12px;gap:8px}.terminal-dialog .panel-foot{height:32px;min-height:32px;padding:0 16px}@media(max-width:560px){.terminal-dialog .dialog-heading{padding:10px 12px}.terminal-dialog .terminal-body{padding:12px}.terminal-dialog .dialog-actions .tool-button{padding:0 7px}.terminal-dialog .close-button{height:32px;width:32px}.terminal-dialog .terminal-panel{height:min(460px,calc(100dvh - 26px))}}

.editor-actions{position:relative;display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:6px;padding:7px 12px;border-top:1px solid var(--edge);background:#0b141d;flex-shrink:0}.editor-actions .tool-button{display:grid;place-items:center;flex:0 0 38px;width:38px;height:36px;padding:0;border-color:transparent;background:transparent}.editor-actions .tool-button:hover{background:#233b49}.editor-actions #clearCode{color:#ffb4b4}.editor-actions #editStatus{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media(max-width:560px){.editor-actions{justify-content:space-between;gap:4px;padding:6px 10px}.editor-actions .tool-button{height:40px;flex:0 0 40px;width:40px}}
