:root{color-scheme:light dark;font-family:Noto Sans JP,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.4;font-weight:400;background-color:#0f172a;color:#f8fafc}*{box-sizing:border-box}body,html,#root{margin:0;padding:0;height:100%}body{background:linear-gradient(180deg,#0f172a,#020617)}.app{display:flex;flex-direction:column;height:100vh;max-width:1100px;margin:0 auto;padding:12px;gap:12px}.status{background:#0f172acc;border-radius:16px;padding:16px 20px;box-shadow:0 12px 30px #0f172a59}.status h1{margin:0 0 8px;font-size:1.6rem}.status p{margin:4px 0;font-size:1rem}.visualizer{display:flex;flex-direction:column;flex:1;gap:12px}.unity-area{background:#0f172ad9;border-radius:16px;padding:16px;box-shadow:0 12px 30px #0f172a73}.unity-area h2{margin:0 0 12px;font-size:1.4rem}.unity-canvas-wrapper{position:relative;width:100%;max-width:1500px;margin:0 auto;aspect-ratio:1500 / 800;border-radius:12px;overflow:hidden;background:#0f172a99;border:2px solid rgba(148,163,184,.25)}.unity-canvas-wrapper canvas{width:100%;height:100%;display:block;background:#0f172a}.unity-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#0f172abf;color:#e2e8f0;font-size:1rem}.unity-loader{width:32px;height:32px;border:3px solid rgba(148,163,184,.4);border-top-color:#38bdf8;border-radius:50%;animation:unitySpin .9s linear infinite}@keyframes unitySpin{to{transform:rotate(360deg)}}.indicator{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at center,#f87171,#b91c1c 70%);box-shadow:0 0 20px #f87171bf;transition:left .1s ease}.bottom-controls{display:flex;justify-content:center;align-items:flex-start;gap:12px;margin-top:auto;width:100%}.video-area{flex-shrink:0;display:flex;justify-content:center;width:100%}.video-wrapper{position:relative;width:min(320px,100%);max-width:320px;aspect-ratio:2 / 1;margin:0 auto;border-radius:16px;border:2px solid rgba(148,163,184,.35);background:#000;box-shadow:0 12px 30px #0f172a73;overflow:hidden}@supports not (aspect-ratio: 1 / 1){.video-wrapper{height:0}.video-wrapper:before{content:"";display:block;padding-top:50%}}.video-wrapper video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;object-fit:fill;transform:scaleX(-1);transform-origin:center}.video-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;pointer-events:none}