*,*:before,*:after{box-sizing:border-box}:root{--color-bg: #ffffff;--color-text: #000000;--color-border: #d0d0d0;--color-shadow: rgba(0, 0, 0, .15);--color-hover: #ddddfe;--color-accent: #7f77dd;--color-accent-light: #eeedfe;--color-accent-dark: #3c3489;--color-accent-hover: #dddcfe;--color-danger: #c0392b;--color-danger-bg: #fdecea;--color-muted: #555555;--color-muted-light: #888888;--color-surface: #f5f5f5;--radius-sm: 5px;--radius-md: 7px;--shadow-panel: 0 8px 25px var(--color-shadow);--focus-ring: 0 0 0 2px var(--color-accent)}@font-face{font-family:Cascadia;src:url(/assets/CascadiaCode-Regular-8zMuzwez.ttf)}body{margin:0;overflow:hidden;background:var(--color-bg);color:var(--color-text);font-family:Cascadia,sans-serif}button{cursor:pointer;border:none;background:transparent;transition:background-color .15s ease,transform .1s ease,opacity .15s ease;font-family:Cascadia,sans-serif}button:active{transform:scale(.95)}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.edit,.simulate,.undo,.redo,.zoom-in,.zoom-out,.snap-to-grid,.show-label,.device-bar-Source,.device-bar-Bulb,.device-bar-Switch,.device-bar-AndGate,.device-bar-OrGate,.device-bar-NotGate,.device-bar-XorGate,.device-bar-NandGate,.device-bar-NorGate,.device-bar-XnorGate{position:relative}.edit img,.simulate img,.undo img,.redo img,.zoom-in img,.zoom-out img,.snap-to-grid img,.show-label img,.device-bar-Source img,.device-bar-Bulb img,.device-bar-Switch img,.device-bar-AndGate img,.device-bar-OrGate img,.device-bar-NotGate img,.device-bar-XorGate img,.device-bar-NandGate img,.device-bar-NorGate img,.device-bar-XnorGate img{transition:all .25s ease}.edit:hover img,.simulate:hover img,.undo:hover img,.zoom-in:hover img,.zoom-out:hover img,.snap-to-grid:hover img,.show-label:hover img,.device-bar-Source:hover img,.device-bar-Bulb:hover img,.device-bar-Switch:hover img,.device-bar-AndGate:hover img,.device-bar-OrGate:hover img,.device-bar-NotGate:hover img,.device-bar-XorGate:hover img,.device-bar-NandGate:hover img,.device-bar-NorGate:hover img,.device-bar-XnorGate:hover img{transform:translateY(.5rem)}.edit:after,.simulate:after,.undo:after,.redo:after,.zoom-in:after,.zoom-out:after,.snap-to-grid:after,.show-label:after,.device-bar-Source:after,.device-bar-Bulb:after,.device-bar-Switch:after,.device-bar-AndGate:after,.device-bar-OrGate:after,.device-bar-NotGate:after,.device-bar-XorGate:after,.device-bar-NandGate:after,.device-bar-NorGate:after,.device-bar-XnorGate:after{position:absolute;top:0;height:0;opacity:0;transition:all .25s ease;font-size:.6rem;white-space:nowrap;color:gray;font-family:Cascadia,sans-serif}.edit:after{content:"Edit"}.simulate:after{content:"Simulate"}.undo:after{content:"Undo"}.redo:after{content:"Redo"}.zoom-in:after{content:"Zoom in";font-size:.55rem}.zoom-out:after{content:"Zoom out";font-size:.55rem}.snap-to-grid:after{content:"Snap"}.show-label:after{content:"Label"}.device-bar-Source:after{content:"source"}.device-bar-Bulb:after{content:"bulb"}.device-bar-Switch:after{content:"switch"}.device-bar-AndGate:after{content:"and gate"}.device-bar-OrGate:after{content:"or gate"}.device-bar-NotGate:after{content:"not gate"}.device-bar-XorGate:after{content:"xor gate"}.device-bar-NandGate:after{content:"nand gate"}.device-bar-NorGate:after{content:"nor gate"}.device-bar-XnorGate:after{content:"xnor gate"}.edit:hover:after,.simulate:hover:after,.undo:hover:after,.redo:hover:after,.zoom-in:hover:after,.zoom-out:hover:after,.snap-to-grid:hover:after,.show-label:hover:after,.device-bar-Source:hover:after,.device-bar-Bulb:hover:after,.device-bar-Switch:hover:after,.device-bar-AndGate:hover:after,.device-bar-OrGate:hover:after,.device-bar-NotGate:hover:after,.device-bar-XorGate:hover:after,.device-bar-NandGate:hover:after,.device-bar-NorGate:hover:after,.device-bar-XnorGate:hover:after{height:.5rem;opacity:1}.context{position:fixed;top:50%;left:50%;padding:.4rem;border-radius:5px;font-size:.9rem;z-index:999;background-color:#fff}.transparent-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:transparent;z-index:998}.hidden{display:none}.context-element{padding:.3rem 2rem;border-radius:5px;text-align:center;display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;-moz-user-select:none;cursor:pointer;color:#333}.context-element:hover{background-color:#ddddfe}.delete-device{color:tomato}.loading-screen{position:fixed;top:0;left:0;width:100%;min-height:100vh;z-index:999;background-color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;-moz-user-select:none}.logo-container{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#333}.logo-container h1{margin:0;font-size:1.5rem}.logo-container img{width:4rem;height:4rem}.progress-bar{margin-top:1rem;width:250px;height:12px;background-color:#ccc;border-radius:999px;overflow:hidden}.progress{height:100%;width:10%;border-radius:999px;background-color:#555;transition:all .3s ease}.tools-left,.tools-right{position:fixed;bottom:5%;display:flex;flex-direction:column;gap:.4rem}.tools-left{left:3%}.tools-right{right:3%}.device-bar{position:fixed;bottom:5%;left:50%;transform:translate(-50%);width:60%}.menu-bar{position:fixed;left:2rem;top:1rem}.info-bar{position:fixed;top:2rem;right:2rem;z-index:499;font-size:.85rem;opacity:.7;pointer-events:none}.device-bar,.zoom-in-out,.general-settings,.undo-redo,.mode,.context,.menu-bar{border:1px solid var(--color-border);box-shadow:var(--shadow-panel);border-radius:var(--radius-md);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.device-bar{padding:.5rem 2rem;display:flex;justify-content:center;gap:.5rem}.device-bar img{width:25px;height:25px}.device{padding:.5rem;display:flex;justify-content:center;align-items:center;border-radius:var(--radius-sm);transition:background-color .15s ease;cursor:pointer}.device:hover{background-color:var(--color-hover)}.tools-left button,.tools-right button,.zoom-in-out button,.general-settings button{padding:.6rem;display:flex;justify-content:center;align-items:center;border-radius:var(--radius-sm)}.tools-left button:hover,.tools-right button:hover,.zoom-in-out button:hover,.general-settings button:hover{background-color:var(--color-hover)}.tools-left img,.tools-right img,.zoom-in-out img,.tools-left svg,.tools-right svg,.zoom-in-out svg,.general-settings svg{width:18px;height:18px}.mode{flex-direction:column;gap:.3rem;padding:.5rem .4rem;margin-bottom:1rem}.mode button{opacity:.5}.mode button.selected,.selected{opacity:1}.undo-redo{flex-direction:column;gap:.3rem;padding:.5rem .4rem}.redo img{transform:scaleX(-1)}.redo:hover img{transform:scaleX(-1) translateY(2px)}.zoom-in-out,.general-settings{flex-direction:column;gap:.3rem;padding:.5rem .4rem;margin-bottom:1rem}.zoom-percentage,.general-settings{font-size:.8rem;text-align:center;display:flex;justify-content:center;align-items:center}.snap-to-grid img{opacity:.5}.snap-to-grid.selected img{opacity:1}.show-label img{opacity:.5}.show-label.selected img{opacity:1}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0000004d;z-index:998}.dialog{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);padding:1rem;background-color:var(--color-bg);border-radius:var(--radius-md);box-shadow:var(--shadow-panel);z-index:999}#devices-dialog-title{text-align:center;margin:.2rem}.extra-devices-dialog{width:90%;max-width:400px;display:flex;flex-direction:column;gap:1rem}.extra-devices-dialog h3{margin:0;text-align:center}.extra-devices{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:.8rem;padding:.5rem}.extra-devices button{display:flex;justify-content:center;align-items:center;padding:.5rem;border-radius:var(--radius-sm);transition:background-color .2s ease}.extra-devices button:hover{background-color:var(--color-hover)}.extra-devices button img{width:40px;height:40px}.save-dialog{width:90%;max-width:380px;display:flex;flex-direction:column;gap:1.1rem;padding:1.25rem 1.5rem}.save-dialog-header{display:flex;justify-content:space-between;align-items:center}.save-dialog-header h2{margin:0;font-size:1.05rem;font-weight:600;color:var(--color-text)}.save-dialog-close{padding:.3rem;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-muted);font-size:1rem;line-height:1}.save-dialog-close:hover{background-color:var(--color-hover)}.save-dialog-close img{width:14px;height:14px;opacity:.6}.save-dialog p{margin:0;font-size:.8rem;color:var(--color-muted);line-height:1.55}.save-dialog p code{font-family:Cascadia,monospace;font-size:.8rem;background-color:var(--color-surface);padding:.1rem .35rem;border-radius:3px;border:1px solid var(--color-border)}.save-dialog-field{display:flex;flex-direction:column;gap:.4rem}.save-dialog-field label{font-size:.8rem;font-weight:600;color:#444}.save-filename-input-wrapper{display:flex;align-items:stretch;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease}.save-filename-input-wrapper:focus-within{border-color:var(--color-accent);box-shadow:var(--focus-ring)}.save-filename-input-wrapper:has(input[aria-invalid=true]){border-color:var(--color-danger);box-shadow:0 0 0 2px var(--color-danger)}.save-filename-input{flex:1;border:none;padding:.5rem .65rem;font-size:.9rem;font-family:Cascadia,monospace;background:transparent;color:var(--color-text);outline:none;min-width:0}.save-filename-input:focus{outline:none;box-shadow:none}.save-filename-ext{padding:.5rem .65rem;font-size:.85rem;font-family:Cascadia,monospace;color:var(--color-muted-light);background-color:var(--color-surface);border-left:1px solid var(--color-border);-webkit-user-select:none;user-select:none;white-space:nowrap;display:flex;align-items:center}.save-filename-error{font-size:.75rem;color:var(--color-danger);margin:0;display:flex;align-items:center;gap:.3rem}.save-filename-error:before{content:"";display:inline-block;width:12px;height:12px;background-color:var(--color-danger);border-radius:50%;flex-shrink:0;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1zm0 3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4.5zm0 6.5a.875.875 0 1 1 0 1.75A.875.875 0 0 1 8 11z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1zm0 3.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4.5zm0 6.5a.875.875 0 1 1 0 1.75A.875.875 0 0 1 8 11z'/%3E%3C/svg%3E");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat}.save-dialog-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.1rem}.save-dialog-cancel{padding:.45rem 1.1rem;border-radius:var(--radius-sm);border:1px solid var(--color-border)!important;font-size:.85rem;color:var(--color-muted);font-family:Cascadia,sans-serif}.save-dialog-cancel:hover{background-color:var(--color-hover)}.save-dialog-confirm{padding:.45rem 1.1rem;border-radius:var(--radius-sm);border:1px solid var(--color-accent)!important;font-size:.85rem;font-weight:600;color:var(--color-accent-dark);background-color:var(--color-accent-light);font-family:Cascadia,sans-serif}.save-dialog-confirm:hover{background-color:var(--color-accent-hover)}.save-dialog-confirm:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.menu-bar{width:fit-content;padding:.3rem}.menu-bar button{border-radius:5px;padding:.3rem 1rem}.menu-bar button:hover{background-color:var(--color-hover)}.dropdown{position:absolute;top:100%}.context{padding:.3rem;min-width:120px}.context-element{width:100%;text-align:left;padding:.4rem .8rem;border-radius:var(--radius-sm);font-size:.875rem;font-family:Cascadia,sans-serif;color:var(--color-text)}.context-element:hover{background-color:var(--color-hover)}.delete-device{color:var(--color-danger)}.delete-device:hover{background-color:var(--color-danger-bg)}.toast{position:fixed;bottom:20%;left:50%;transform:translate(-50%);background-color:#000000b3;color:var(--color-bg);border-radius:5px;padding:.3rem 2rem;font-size:.7rem;opacity:1;transition:all .25s ease;pointer-events:none}.toast.hidden{height:0;opacity:0}.copyright{position:fixed;left:50%;bottom:.5rem;transform:translate(-50%);font-size:.55rem;color:#555}@media(forced-colors:active){.save-filename-input-wrapper:focus-within{outline:2px solid ButtonText}.save-dialog-confirm{forced-color-adjust:none;background-color:Highlight;color:HighlightText;border-color:Highlight!important}.mode button.selected,.snap-to-grid.selected img,.show-label.selected img{forced-color-adjust:none;outline:2px solid Highlight}}