@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

html, body, #app { margin: 0; padding: 0; height: 100%; overflow: hidden; background: #0a2f6e; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
a { color: #0a3aa8; text-decoration: underline; }
a:hover { color: #c24a00; }

@keyframes uxbar { 0% { transform: translateX(-100%); } 100% { transform: translateX(320%); } }
@keyframes uxspin { to { transform: rotate(360deg); } }
@keyframes uxblink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes uxstamp { 0% { transform: scale(0.4) rotate(-14deg); opacity: 0; } 60% { transform: scale(1.15) rotate(-14deg); opacity: 1; } 100% { transform: scale(1) rotate(-14deg); opacity: 1; } }

::-webkit-scrollbar { width: 16px; height: 16px; background: #f0efe6; }
::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #fff, #cfd8ee 40%, #9db2dc); border: 1px solid #7089c0; }
::-webkit-scrollbar-button { height: 16px; background: linear-gradient(180deg, #fff, #cbd5ec); }

/* hover states (replace Design Canvas' style-hover sugar with real :hover) */
.hv-bright18:hover { filter: brightness(1.18); }
.hv-bright15:hover { filter: brightness(1.15); }
.hv-bright11:hover { filter: brightness(1.1); }
.hv-blue-eaf1fd:hover { background: #eaf1fd; }
.hv-blue-dbe7fa:hover { background: #dbe7fa; }
.hv-blue-e8f0fd:hover { background: #e8f0fd; }
.hv-blue-eef4fd:hover { background: #eef4fd; }
.hv-white-20:hover { background: rgba(255, 255, 255, 0.2); }