@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:'DM Sans','Noto Sans JP',sans-serif;color:#eeeff3;background:#101114;font-size:16px}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,select{cursor:pointer}button{color:inherit}header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid #292a30}.brand{font-size:23px;font-weight:700;letter-spacing:-1px;text-decoration:none;color:inherit}.brand>span{color:#ceff7c;margin:0 4px}.brand i{display:block;font-size:10px;letter-spacing:3px;font-style:normal;font-weight:500;color:#858790;margin-top:5px}.head-right{display:flex;align-items:center;gap:26px;color:#9c9ea8;font-size:14px}button{border:1px solid #35363e;background:#202126;border-radius:10px;padding:10px 14px;transition:background .15s,border-color .15s}button:hover{background:#31333b;border-color:#777b87}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #ceff7c;outline-offset:4px}main{display:grid;grid-template-columns:minmax(0,1fr) 354px;max-width:1800px;margin:auto}.stage{position:sticky;top:0;height:calc(100dvh - 88px);min-height:630px;padding:30px 36px 22px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 44%,#1b1c23 0%,#111216 67%);overflow:hidden}.stage-top{display:flex;justify-content:space-between;font-size:12px;color:#898c97;letter-spacing:2px}#status{letter-spacing:0;color:#ceff7c}canvas{width:100%;min-height:240px;flex:1;display:block;touch-action:none}.stats{display:flex;align-items:center;justify-content:center;gap:44px;position:relative;margin:5px 0 24px}.stats>div{text-align:center;min-width:72px}.stats strong{display:block;font-size:28px;font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums}.stats span{display:block;font-size:10px;letter-spacing:2px;color:#858892;margin-top:5px}#limit{position:absolute;top:-26px;color:#ceff7c;font-size:12px;margin:0}.transport{display:flex;justify-content:center;gap:12px;align-items:center}.start{background:#cfff82;color:#18200d;border:0;border-radius:12px;width:235px;height:54px;font-weight:700}.start:hover{background:#b7ed67}.iconbtn{height:48px;width:48px;font-size:25px;padding:0}.stage-foot{display:flex;justify-content:space-between;color:#6e717b;font-size:12px;margin-top:28px;gap:12px}.stage-foot>span:last-child{letter-spacing:1.5px}.custom-help{font-size:13px;text-align:center;color:#cfff82}.custom-help button{font-size:12px;margin-left:8px}aside{background:#191a1f;border-left:1px solid #303137;padding:28px 24px}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.panel-heading h1{font-size:20px;margin:0}.panel-heading>span{font-size:12px;color:#7e818c}.control{border-top:1px solid #33343b;padding:22px 0}.control h2{font-size:15px;margin:0 0 18px;font-weight:600;display:flex;align-items:center;gap:12px}.control h2 b{font-size:12px;font-weight:500;color:#cfff82}.choices{display:grid;gap:6px}.frames{grid-template-columns:repeat(5,1fr)}.choices button{font-size:12px;padding:10px 2px;border-radius:8px;background:#22232a}.choices button.selected{border-color:#cfff82;background:#2e3526;color:#d9ffac}.frames span{display:block;height:32px;font-size:27px;line-height:26px;margin-bottom:7px}.micro{font-size:12px;line-height:1.8;color:#9598a4;margin:12px 0 0}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0}.row label{font-size:14px;flex-shrink:0}select{color:#e3e5eb;border:1px solid #3c3d45;background:#24252c;border-radius:8px;padding:11px 10px;width:100%;font-size:14px}.row select{max-width:190px}.materials{grid-template-columns:repeat(4,1fr);margin:18px 0}.swatch{display:block;width:24px;height:24px;border-radius:50%;margin:0 auto 9px}.glass{background:radial-gradient(circle at 30% 25%,#efffff,#84dfe887 30%,#42808622 65%,#9befea);border:1px solid #92dcda}.rubber{background:#eeaa96;box-shadow:inset -5px -6px 8px #994333}.metal{background:linear-gradient(130deg,#535a72,#fff 40%,#7d8597 55%,#333744)}.neon{background:#bd8aff;box-shadow:0 0 12px #9d62ff}.range-label{font-size:14px;display:flex;justify-content:space-between;margin-top:16px;margin-bottom:9px}.range-label output{color:#c1c4cd;font-size:13px}input[type=range]{accent-color:#cfff82;width:100%;height:16px;margin:0;cursor:pointer}input[type=number]{width:75px;min-width:0;background:#24252c;border:1px solid #41434c;border-radius:7px;padding:8px;color:#cfff82}.bottom-note{font-size:12px;line-height:1.9;color:#8d909c;margin-bottom:0}.stage:fullscreen{height:100dvh;width:100vw} [hidden]{display:none!important}@media(min-width:1400px){.stage{padding-left:60px;padding-right:60px}main{grid-template-columns:minmax(0,1fr) 380px}aside{padding:30px}}@media(max-width:800px){header{height:74px;padding:0 18px}.brand{font-size:20px}.head-right{font-size:0;gap:0}.head-right button{font-size:13px}main{display:flex;flex-direction:column}.stage{position:relative;height:640px;min-height:0;padding:23px 18px 18px}aside{border-left:0;border-top:1px solid #303137;padding:24px}.stage-foot>span:last-child{display:none}.stats{gap:24px}.control{padding:24px 0}.choices button{font-size:14px}.frames span{font-size:30px}.brand i{font-size:9px}.custom-help{font-size:12px}}@media(prefers-reduced-motion:reduce){button{transition:none}}
.multi-note{margin-left:auto;color:#888b96;font-size:11px;font-weight:500}.effects{display:grid;gap:7px}.effect-row{display:grid;grid-template-columns:20px minmax(0,1fr) 58px 38px;align-items:center;gap:7px;min-height:48px;padding:8px 9px;border:1px solid #383a43;border-radius:9px;background:#22232a;cursor:pointer;transition:.15s}.effect-row:hover{border-color:#686b76}.effect-row.selected,.effect-row:has(input:checked){border-color:#9fca66;background:#2b3126}.effect-row>input[type=checkbox]{width:17px;height:17px;accent-color:#cfff82}.effect-row>span{font-size:13px}.effect-row>span b{color:#cfff82;font-size:15px;margin-right:5px}.effect-row>input[type=number]{width:58px;padding:7px;text-align:center}.effect-row>em{font-size:11px;color:#9295a0;font-style:normal}.effect-row.simple{grid-template-columns:20px 1fr}.effect-row.simple>span{grid-column:2/5}
.cycle-toggle{margin-top:7px}.cycle-settings{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 10px;padding:9px 10px;background:#1b1c21;border:1px solid #33353d;border-radius:9px}.cycle-settings label{font-size:12px;color:#b9bcc5;display:flex;align-items:center;gap:6px}.cycle-settings input{width:58px;padding:6px;text-align:center}.cycle-settings>span{font-size:11px;color:#7f828d}.cycle-settings>span:last-child{text-align:right}
.combo-display{position:absolute;z-index:3;top:68px;left:50%;transform:translateX(-50%);font-size:14px;letter-spacing:3px;color:#d7ffa0;text-shadow:0 0 18px #bfff83}.combo-display b{font-size:28px;margin-left:6px}.event-banner{position:absolute;z-index:3;top:108px;left:50%;transform:translateX(-50%);padding:8px 16px;border:1px solid #a994ff88;border-radius:999px;background:#17141fdd;color:#d7c9ff;font-size:12px;letter-spacing:1px}.extras h3{font-size:12px;color:#8e919c;font-weight:500;margin:0 0 10px}.presets{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-bottom:16px}.presets button{font-size:12px;padding:9px 5px}.presets button:first-child{grid-column:1/-1}.feature-list{display:grid;gap:7px}.feature-card{padding:10px;border:1px solid #373941;border-radius:9px;background:#22232a}.feature-card:has(input[type=checkbox]:checked){border-color:#7c9f50;background:#2a3025}.feature-card>label{display:flex;align-items:center;gap:9px;font-size:13px;cursor:pointer}.feature-card>label input{width:17px;height:17px;accent-color:#cfff82}.feature-card>label b{font-weight:600}.feature-card>div{display:flex;align-items:center;gap:7px;margin-top:9px;color:#9295a0;font-size:11px}.feature-card>div input[type=range]{flex:1}.feature-card>div input[type=number]{width:57px;padding:6px}.feature-card>div button{font-size:11px;padding:7px 8px;white-space:nowrap}.feature-card>div select{font-size:11px;padding:7px;width:auto;min-width:0}.feature-card em{font-style:normal}.feature-card.compact{padding:12px 10px}.feature-card.compact>label{margin:0}.music-card>div{flex-wrap:wrap}.music-card>div label{display:flex;align-items:center;gap:5px}.music-card>div label input{width:55px}
.extras h3 span{margin-left:5px;font-size:10px;color:#696c77}.feature-card{position:relative;padding-right:38px}.info-btn{position:absolute;right:8px;top:7px;width:24px;height:24px;padding:0;border-radius:50%;font-size:12px;color:#aeb1bc;background:#191a1f}.feature-description{display:none;margin:9px -28px 0 0;padding:9px 10px;border-top:1px solid #3b3d45;color:#b9bcc5;font-size:12px;line-height:1.7}.feature-card.help-open .feature-description{display:block}@media(hover:hover) and (pointer:fine){.info-btn{display:none}.feature-card:hover{border-color:#717581;z-index:5}.feature-card:hover .feature-description{display:block;position:absolute;left:8px;right:8px;top:calc(100% - 2px);margin:0;padding:10px 11px;border:1px solid #555965;border-radius:8px;background:#111217f2;box-shadow:0 12px 25px #0008;color:#d4d6dd}}@media(max-width:800px){.feature-description{font-size:13px}.info-btn{display:block}}
@media(hover:hover) and (pointer:fine){.feature-card:hover .feature-description{left:auto;right:calc(100% + 12px);top:0;width:270px}}
input[type=range]{-webkit-appearance:none;appearance:none;height:28px;background:transparent;cursor:ew-resize;position:relative;z-index:2;touch-action:none}input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:999px;background:linear-gradient(90deg,#687453,#3d4048)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;margin-top:-6.5px;border:2px solid #17191d;border-radius:50%;background:#cfff82;box-shadow:0 0 0 1px #9bbd68,0 2px 7px #0008}input[type=range]::-moz-range-track{height:5px;border-radius:999px;background:#3d4048}input[type=range]::-moz-range-progress{height:5px;border-radius:999px;background:#9fca66}input[type=range]::-moz-range-thumb{width:16px;height:16px;border:2px solid #17191d;border-radius:50%;background:#cfff82;box-shadow:0 2px 7px #0008}input[type=range]:focus-visible{outline-offset:1px}
#backToTop{display:none}@media(max-width:800px){#backToTop{position:fixed;display:flex;z-index:20;right:16px;bottom:max(18px,env(safe-area-inset-bottom));width:52px;height:52px;padding:3px 0 8px;align-items:center;justify-content:center;border:1px solid #b4dc79;border-radius:50%;background:#20251ddf;color:#d9ffac;box-shadow:0 6px 22px #000a;backdrop-filter:blur(8px);font-size:20px;line-height:17px}#backToTop::after{content:'TOP';position:absolute;bottom:6px;font-size:8px;letter-spacing:1px}}
.advanced-controls{flex-wrap:wrap}.feature-card>div label{display:flex;align-items:center;gap:5px;color:#aeb1bc}.advanced-controls select{flex:1;min-width:125px}.advanced-controls label{flex:1;min-width:105px}.advanced-controls label input{width:58px}.config-tools>div{flex-wrap:wrap}.config-tools input[type=text]{min-width:0;flex:1;background:#191a1f;border:1px solid #41434c;border-radius:7px;padding:8px;color:#eeeff3}.config-tools select{flex:1;min-width:130px}.config-tools button{flex:1}.feature-card>div>em{font-style:normal;color:#858892}@media(max-width:800px){.advanced-controls>*{min-height:38px}.config-tools button{min-height:40px}}
.ad-area{margin:24px auto 4px;max-width:300px;text-align:center}.ad-area>span{display:block;margin-bottom:7px;color:#686b76;font-size:10px;letter-spacing:1.5px}.admax-sp{display:none}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1800px;margin:auto;padding:24px 38px;border-top:1px solid #292a30;background:#101114;color:#858892}.site-footer nav{display:flex;flex-wrap:wrap;gap:12px 22px}.site-footer a{color:#b9bcc5;font-size:13px;text-decoration:none}.site-footer a:hover{color:#d9ffac}.site-footer small{font-size:11px;white-space:nowrap}.info-page{min-height:100dvh;background:#101114}.info-page header{position:static}.info-shell{width:min(760px,calc(100% - 36px));margin:52px auto 80px}.info-shell h1{margin:0 0 26px;font-size:clamp(28px,5vw,46px);letter-spacing:-1px}.info-shell h2{margin:34px 0 12px;font-size:19px;color:#d9ffac}.info-shell p,.info-shell li{color:#c4c6ce;font-size:16px;line-height:1.9}.info-shell ul,.info-shell ol{padding-left:1.4em}.info-back{display:inline-block;margin-bottom:28px;color:#d9ffac;text-decoration:none}.info-note{padding:16px 18px;border:1px solid #373941;border-radius:10px;background:#191a1f}.info-page .site-footer{margin-top:auto}@media(max-width:800px){.admax-pc{display:none}.admax-sp{display:block}.site-footer{align-items:flex-start;flex-direction:column;padding:22px 20px}.info-shell{margin-top:36px}.info-shell p,.info-shell li{font-size:15px}}