@font-face{font-family:'Press Start 2P';src:url('assets/press-start-2p.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
html.contact-open{overflow:hidden;scrollbar-gutter:stable}
.contact-dialog{--tile:24px;color:#f7f4e9;background:#101917;border:0;border-radius:0;padding:0;width:min(700px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;box-shadow:0 32px 100px #0008,0 0 0 1px #9cbd9f55;scrollbar-width:thin;scrollbar-color:#9dc5a6 #172820}
.contact-dialog::backdrop{background:#12231ccc;backdrop-filter:blur(12px)}
.contact-machine{position:relative;isolation:isolate;padding:calc(var(--tile)*2.25) calc(var(--tile)*2.65);overflow:hidden;background-color:#101917;background-image:linear-gradient(#719b8622 1px,transparent 1px),linear-gradient(90deg,#719b8622 1px,transparent 1px);background-size:var(--tile) var(--tile)}
.contact-panel{position:relative;z-index:2;background:#14221f;box-shadow:0 0 0 1px #719b8644,0 0 48px #07141088;padding:30px}
.contact-close{position:absolute;z-index:5;top:10px;right:10px;width:44px;height:44px;display:grid;place-items:center;padding:0;background:#15271f;color:#f7f4e9;border:1px solid #91bda5;font-size:27px;line-height:1}
.contact-close:hover{background:#254334}
.contact-panel h2{font:400 clamp(20px,4vw,27px)/1.55 'Press Start 2P',monospace;letter-spacing:-.06em;margin:0 0 12px;color:#fee27a;text-wrap:balance}
.contact-intro{font:400 17px/1.5 'Satoshi',sans-serif;color:#e5ece4;max-width:35ch;margin-bottom:25px}
.contact-cursor{display:inline-block;width:.55em;height:.8em;margin-left:.25em;background:#fee27a;animation:contact-blink 1.1s steps(1,end) infinite;vertical-align:baseline}
.contact-fields{margin:0;padding:0;border:0;min-width:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 16px}
.contact-field{display:flex;flex-direction:column;gap:7px;min-width:0;font:500 15px/1.4 'Satoshi',sans-serif}
.contact-message{grid-column:1/-1}
.contact-field input,.contact-field textarea{width:100%;min-width:0;min-height:46px;border:1px solid #719483;border-radius:0;background:#0e1916;color:#fffdf4;font:400 16px/1.5 'Satoshi',sans-serif;padding:10px 12px;box-shadow:inset 0 2px 0 #0003;transition:border-color .18s,box-shadow .18s}
.contact-field textarea{min-height:126px;resize:vertical}
.contact-field input:focus,.contact-field textarea:focus{outline:2px solid #ffe47e;outline-offset:3px;border-color:#ffe47e;box-shadow:0 0 22px #fee27a14}
.contact-submit{display:flex;align-items:center;justify-content:space-between;gap:15px;grid-column:1/-1;min-height:50px;width:100%;padding:14px 18px;color:#14251c;background:#fee27a;border:0;box-shadow:0 4px 0 #91723f;font:400 11px/1.6 'Press Start 2P',monospace;text-align:left;transition:translate .18s,box-shadow .18s,background .18s}
.contact-submit:hover{background:#ffeb9f;translate:0 -2px;box-shadow:0 6px 0 #91723f}
.contact-submit:active{translate:0 3px;box-shadow:0 1px 0 #91723f}
.contact-submit:disabled{cursor:wait;opacity:.65;translate:0 0;box-shadow:0 4px 0 #91723f}
.contact-submit>span:last-child{font:23px/1 monospace}
.contact-panel :focus-visible{outline:2px solid #ffe47e;outline-offset:4px}
.contact-status{min-height:24px;color:#eef6ec;font:400 15px/1.55 'Satoshi',sans-serif;margin:17px 0 0!important}
.contact-status:empty{display:none}
.contact-status.is-error{color:#ffd3b8}
.contact-direct{margin-top:21px!important;color:#c3d5c7;font:400 13px/1.65 'Satoshi',sans-serif}
.contact-direct a{text-decoration:underline;text-underline-offset:3px;display:inline-block;min-height:24px}
.contact-direct a:hover{color:#fff}
.contact-frame{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.tetromino{position:absolute;display:grid;grid-template-columns:repeat(var(--cols),var(--tile));grid-template-rows:repeat(var(--rows),var(--tile));filter:drop-shadow(0 3px 0 #0005)}
.tetromino-cell{grid-column:var(--x);grid-row:var(--y);background:var(--block);border:1px solid #07100d;box-shadow:inset 3px 3px #ffffff55,inset -3px -3px #0004}
.contact-dialog.is-entering .tetromino{animation:contact-drop .58s cubic-bezier(.36,0,.86,.55) both;animation-delay:var(--delay)}
.contact-dialog.is-entering .contact-panel{animation:contact-screen-on .3s ease-out both}
.contact-dialog.is-sent .contact-frame{filter:brightness(1.25)}
.contact-thanks-page{min-height:100dvh;margin:0;display:grid;place-items:center;background:#101917;padding:24px;color:#f7f4e9;font-family:'Satoshi',sans-serif}
.contact-thanks-page .contact-panel{width:min(540px,100%);padding:40px}
.contact-thanks-page h1{font:400 22px/1.7 'Press Start 2P',monospace;color:#fee27a;margin:0 0 20px}
.contact-thanks-page p{line-height:1.6;margin:0 0 24px}
.contact-thanks-page a{color:#fee27a;text-underline-offset:5px}
@keyframes contact-drop{0%{translate:0 -760px}87%{translate:0 0}94%{translate:0 -5px}100%{translate:0 0}}
@keyframes contact-screen-on{from{opacity:.65;translate:0 5px}to{opacity:1;translate:0 0}}
@keyframes contact-blink{50%{opacity:0}}
@media(max-width:600px){.contact-dialog{--tile:12px;width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.contact-machine{padding:52px 24px 39px}.contact-panel{padding:24px 19px}.contact-panel h2{font-size:21px}.contact-intro{font-size:16px;margin-bottom:20px}.contact-fields{grid-template-columns:1fr;gap:15px}.contact-field textarea{min-height:108px}.contact-close{top:5px;right:5px}.contact-direct{font-size:12px}.contact-submit{font-size:10px}.contact-dialog .tetromino{opacity:.9}}
@media(max-height:690px) and (min-width:601px){.contact-machine{padding-block:38px}.contact-panel{padding:25px}.contact-field textarea{min-height:90px}.contact-intro{margin-bottom:16px}.contact-fields{gap:14px}.contact-direct{margin-top:15px!important}}
@media(prefers-reduced-motion:reduce){.contact-dialog.is-entering .tetromino,.contact-dialog.is-entering .contact-panel,.contact-cursor{animation:none}.contact-submit,.contact-field input,.contact-field textarea{transition:none}}
