:root{--mobile: 480px;--tablet: 768px;--laptop: 1024px;--desktop: 1440px}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;margin:0;font-family:"Press Start 2P",monospace;overflow-x:hidden}html{font-size:16px}@media (max-width: 1024px){html{font-size:15px}}@media (max-width: 768px){html{font-size:14px}}@media (max-width: 480px){html{font-size:13px}}@media (max-width: 768px){input,select,textarea,button{min-height:44px;font-size:16px;padding:.5rem 1rem}}.pixel-button{padding:clamp(.5rem,2vw,.75rem) clamp(1rem,3vw,1.5rem);background:#4caf50;border:none;border-bottom:4px solid #2E7D32;color:#fff;font-family:"Press Start 2P",monospace;cursor:pointer;transition:transform .2s;font-size:clamp(.75rem,2vw,1rem);white-space:nowrap}.pixel-card{background:#fff;border:4px solid #4a4a4a;padding:clamp(1rem,3vw,1.5rem);box-shadow:8px 8px #4a4a4a;width:100%;max-width:100%;margin:0 auto}.pixel-input{padding:clamp(.5rem,2vw,.75rem);background:#f0f0f0;border:3px solid #4a4a4a;font-family:"Press Start 2P",monospace;font-size:clamp(.75rem,2vw,.9rem);width:100%}.responsive-container{width:100%;max-width:var(--desktop);margin:0 auto;padding:clamp(1rem,3vw,2rem)}.responsive-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}.flex-container{display:flex;flex-wrap:wrap;gap:1rem}.modal-content{width:min(90%,600px);max-height:90vh;overflow-y:auto;padding:clamp(1rem,3vw,2rem)}@media (max-width: 768px){.hide-on-mobile{display:none!important}}.show-on-mobile{display:none!important}@media (max-width: 768px){.show-on-mobile{display:block!important}}@media (hover: none){.pixel-button:hover{transform:none}.pixel-button:active{transform:translateY(2px)}}.responsive-table-container{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.form-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}.responsive-image{max-width:100%;height:auto;object-fit:cover}.nav-container{padding:clamp(.5rem,2vw,1rem);display:flex;align-items:center;flex-wrap:wrap;gap:1rem}@media (max-width: 768px){.nav-container{justify-content:center;text-align:center}.nav-container>*{width:100%;justify-content:center}}@supports (-webkit-touch-callout: none){.fixed-element{position:sticky;top:0}}.form-group{position:relative;margin-bottom:2.5rem}.pixel-input.error{border:none;outline:none;position:relative;background:#fff;box-shadow:3px 3px #7f0000,3px 0 #7f0000,0 3px #7f0000,-3px -3px #7f0000,-3px 0 #7f0000,0 -3px #7f0000,3px -3px #7f0000,-3px 3px #7f0000,inset -2px -2px #ffdede;animation:pixel-shake .3s steps(2,end)}.error-message{position:absolute;bottom:-1.8rem;left:0;right:0;font-family:"Press Start 2P",monospace;font-size:.6rem;color:#fff;text-align:center;background:#b71c1c;padding:.4rem;image-rendering:pixelated;box-shadow:2px 2px #7f0000,2px 0 #7f0000,0 2px #7f0000,-2px -2px #7f0000,-2px 0 #7f0000,0 -2px #7f0000,2px -2px #7f0000,-2px 2px #7f0000,inset 2px 2px #d32f2f;animation:pixel-pop .2s steps(1,end)}.pixel-error{background:#b71c1c;padding:1rem;margin:1rem 0;font-family:"Press Start 2P",monospace;font-size:.7rem;color:#fff;text-align:center;box-shadow:3px 3px #7f0000,3px 0 #7f0000,0 3px #7f0000,-3px -3px #7f0000,-3px 0 #7f0000,0 -3px #7f0000,3px -3px #7f0000,-3px 3px #7f0000,inset 3px 3px #d32f2f;animation:pixel-drop .3s steps(3,end);image-rendering:pixelated}.pixel-button:disabled{background:#424242;box-shadow:3px 3px #212121,inset -2px -2px #616161;cursor:not-allowed;position:relative}.pixel-button:disabled:after{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 48%,#212121 49%,#212121 51%,transparent 52%);background-size:4px 4px;image-rendering:pixelated}@keyframes pixel-shake{0%{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}to{transform:translate(0)}}@keyframes pixel-pop{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}@keyframes pixel-drop{0%{transform:translateY(-8px);opacity:0}50%{transform:translateY(4px);opacity:1}to{transform:translateY(0);opacity:1}}.material-selector.error{box-shadow:3px 3px #7f0000,3px 0 #7f0000,0 3px #7f0000,-3px -3px #7f0000,-3px 0 #7f0000,0 -3px #7f0000,3px -3px #7f0000,-3px 3px #7f0000}@media (max-width: 768px){.error-message{font-size:.5rem;padding:.3rem}.pixel-error{font-size:.6rem;padding:.75rem}}@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none){.pixel-input.error,.error-message,.pixel-error{border:2px solid #7f0000}}
