@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600&family=Noto+Sans+JP:wght@300;400;500&display=swap";:root{--font-title:"Outfit", "Noto Sans JP", sans-serif;--font-body:"Outfit", "Noto Sans JP", sans-serif;--bg-dark:#020308;--accent-blue:#00b4ff;--accent-green:#00ff96;--glass-bg:#060c1c73;--glass-border:#00b4ff33;--text-primary:#f0f4fc;--text-secondary:#90a4c2}body{background-color:var(--bg-dark);font-family:var(--font-body);color:var(--text-primary);-webkit-user-select:none;user-select:none;margin:0;padding:0;overflow:hidden}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#app{flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative}canvas{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}#ui-container{z-index:10;pointer-events:none;box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%;height:100%;padding:30px;display:flex;position:absolute;top:0;left:0}.hud{pointer-events:auto;background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:16px;max-width:380px;padding:24px;transition:all .4s cubic-bezier(.16,1,.3,1);animation:1s ease-out slide-in;box-shadow:0 8px 32px #000c,inset 0 0 20px #00b4ff0d}.hud:hover{border-color:#00ff9673;box-shadow:0 12px 40px #00ff9626,0 8px 32px #000c}.hud h2{font-family:var(--font-title);letter-spacing:1px;background:linear-gradient(135deg, var(--accent-blue), var(--accent-green));-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0 0 12px;font-size:22px;font-weight:600}.hud p{color:var(--text-secondary);margin:8px 0;font-size:14px;line-height:1.6}.hud p strong{color:var(--accent-green);text-shadow:0 0 8px #00ff9666}.hud span{color:var(--text-primary);font-family:monospace;font-size:16px;font-weight:700}.overlay{background:var(--bg-dark);z-index:100;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity 1.2s cubic-bezier(.25,1,.5,1);display:flex;position:absolute;top:0;left:0}.overlay p{letter-spacing:3px;color:var(--accent-blue);text-shadow:0 0 10px #00b4ff80;font-size:16px;animation:2s infinite pulse}@keyframes slide-in{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}