@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&display=swap");*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;list-style:none}html{font-size:16px;min-height:100dvh;min-height:100svh;min-height:100vh}@media screen and (max-width: 500px){html{font-size:calc(16 / 500 * 100vw)}}body{font-family:'Noto Sans JP', sans-serif;position:relative;color:#ffffff;background-color:#111111;min-height:100dvh;min-height:100svh;min-height:100vh;overflow:hidden}.wrap{display:flex;justify-content:center;padding:1.5rem;position:absolute;top:0;left:0;width:100%;z-index:10;pointer-events:none}.preset-container{max-width:320px;width:100%;background:rgba(30,30,30,0.75);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);border-radius:12px;padding:12px 16px;box-shadow:0 8px 32px 0 rgba(0,0,0,0.4);pointer-events:auto}.preset-container h3{font-size:0.75rem;font-weight:600;letter-spacing:2px;color:rgba(0,255,0,0.8);margin-bottom:8px;text-align:center;text-transform:uppercase;text-shadow:0 0 5px rgba(0,255,0,0.3)}.selected_preset{width:100%;appearance:none;-webkit-appearance:none;border:1px solid rgba(255,255,255,0.15);background-color:#1a1a1a;background-image:url("data:image/svg+xml;utf8,<svg fill='white' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");background-repeat:no-repeat;background-position:right 8px center;border-radius:6px;padding:8px 32px 8px 12px;color:#fff;font-size:0.9rem;font-weight:500;cursor:pointer;outline:none;transition:border-color 0.2s, box-shadow 0.2s}.selected_preset:focus,.selected_preset:hover{border-color:rgba(0,255,0,0.5);box-shadow:0 0 8px rgba(0,255,0,0.2)}.pad-wrap{display:flex;justify-content:center;align-items:center;position:fixed;left:0;top:0;width:100%;height:100vh;height:100dvh;z-index:4;pointer-events:none}.pad-wrap .pad{max-width:480px;width:94%;aspect-ratio:1 / 1;border:2px solid rgba(0,255,0,0.3);border-radius:16px;background:rgba(15,15,15,0.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 32px 0 rgba(0,255,0,0.15),inset 0 0 20px rgba(0,255,0,0.05);position:relative;overflow:hidden;pointer-events:auto;cursor:crosshair;touch-action:none;transition:border-color 0.2s, box-shadow 0.2s}.pad-wrap .pad:hover,.pad-wrap .pad:active{border-color:rgba(0,255,0,0.6);box-shadow:0 8px 32px 0 rgba(0,255,0,0.25),inset 0 0 20px rgba(0,255,0,0.1)}.pad-wrap #waveform1{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.pad-wrap .pad-grid{position:absolute;top:0;left:0;right:0;bottom:0;background-image:linear-gradient(rgba(0,255,0,0.08) 1px, transparent 1px),linear-gradient(90deg, rgba(0,255,0,0.08) 1px, transparent 1px);background-size:10% 10%;pointer-events:none;z-index:1}.pad-wrap .pad-cursor{position:absolute;width:20px;height:20px;background:#0f0;border-radius:50%;transform:translate(-50%, -50%);pointer-events:none;box-shadow:0 0 15px 5px rgba(0,255,0,0.8),0 0 30px 10px rgba(0,255,0,0.4);opacity:0;transition:opacity 0.15s, transform 0.05s ease-out;z-index:3}.pad-wrap .pad-cursor.active{opacity:1}.pad-wrap .pad-info{position:absolute;top:15px;left:15px;display:flex;flex-direction:column;gap:4px;font-family:monospace;font-size:0.85em;color:#0f0;text-shadow:0 0 5px rgba(0,255,0,0.5);pointer-events:none;background:rgba(0,0,0,0.6);padding:6px 12px;border-radius:6px;border:1px solid rgba(0,255,0,0.2);z-index:2}.pad-wrap .pad-info .pad-info-row span{color:rgba(0,255,0,0.6)}.pad-wrap .pad-info .pad-info-row strong{font-weight:bold}.pad-wrap .pad-label-x{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:0.7em;color:rgba(0,255,0,0.5);letter-spacing:2px;font-weight:600;pointer-events:none;z-index:2}.pad-wrap .pad-label-y{position:absolute;left:10px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left center;font-size:0.7em;color:rgba(0,255,0,0.5);letter-spacing:2px;font-weight:600;pointer-events:none;white-space:nowrap;z-index:2}
/*# sourceMappingURL=style.css.map */