@font-face{font-family:Pixel;src:url('assets/neodgm.woff2') format('woff2');font-weight:400;font-display:swap}
body.pixel-mode{--paper:#000;--ink:#fff;--muted:#fff;--line:#fff;--red:#fff;background:#000;color:#fff}
body.pixel-mode,body.pixel-mode button,body.pixel-mode input,body.pixel-mode textarea,body.pixel-mode .wordmark,body.pixel-mode .translation,body.pixel-mode .contact-title{font-family:Pixel,monospace!important;font-weight:400}
body.pixel-mode .wordmark{color:#fff;letter-spacing:0}
body.pixel-mode .topline nav a,body.pixel-mode .topline nav button{color:#aaa}
body.pixel-mode .topline nav a:hover,body.pixel-mode .topline nav button:hover,body.pixel-mode .topline nav .active{color:#fff;font-weight:400}
body.pixel-mode #stage,body.pixel-mode .perspective-canvas,body.pixel-mode .catalog,body.pixel-mode .composition-contact,body.pixel-mode .icon-button,body.pixel-mode .selection-tools .icon-button{background:#000;color:#fff}
body.pixel-mode .catalog,body.pixel-mode .forms,body.pixel-mode .composition-contact,body.pixel-mode dialog{border-color:#fff}
body.pixel-mode .stage-bottom,body.pixel-mode #empty,body.pixel-mode .selection-tools,body.pixel-mode button:hover,body.pixel-mode a:hover{color:#fff}
body.pixel-mode .piece.selected,body.pixel-mode .piece.snap-connected{outline-color:#fff}
body.pixel-mode .alignment-guides line{stroke:#fff}
body.pixel-mode .piece img,body.pixel-mode .form img{image-rendering:auto;filter:none}
/* Keep the layout boxes and cube scale unchanged while exposing shallow depth. */
body.pixel-mode .piece img{position:absolute;left:50%;top:50%;width:calc(200px * var(--pixel-sprite-width,1));height:calc(200px * var(--pixel-sprite-height,1));max-width:none;transform:translate(-50%,-50%)}
body.pixel-mode .form img{width:calc(var(--catalog-height) * var(--pixel-sprite-width,1));height:calc(var(--catalog-height) * var(--pixel-sprite-height,1));max-width:none;flex-shrink:0}
body.pixel-mode .arrangement-tools .icon-button{color:#777}
body.pixel-mode .arrangement-tools .icon-button.active,body.pixel-mode .arrangement-tools .icon-button:hover{color:#fff}
body.pixel-mode #perspective,body.pixel-mode #shuffle{color:#aaa}
body.pixel-mode #perspective.active,body.pixel-mode #perspective:hover,body.pixel-mode #shuffle:hover{color:#fff}
body.pixel-mode #quoteForm input,body.pixel-mode #quoteForm textarea{border-color:#fff;color:#fff}
body.pixel-mode .primary,body.pixel-mode .primary:hover,body.pixel-mode .toast{background:#fff;color:#000}
body.pixel-mode .outline{border-color:#fff;color:#fff}
body.pixel-mode .icon-button.active{box-shadow:inset 0 -2px #fff}
body.pixel-mode .arrangement-tools .icon-button.active,body.pixel-mode #perspective.active{box-shadow:none}
body.pixel-mode dialog::backdrop{background:#ffffff25}