:root{font-size:min(.0625vw,1px);font-family:Noto Sans JP,Noto Sans Display,sans-serif;--main-color: #f7f7f7;--main-color-rgb: 247, 247, 247;--bg-color: #1d1d1d;--bg-color-rgb: 29, 29, 29;--panel-width: 400rem}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}@media only screen and (max-device-width: 1280px) and (max-width: 640px){:root{font-size:min(calc(100vw / 750),1px);--panel-width: 100%}}html,body{width:100%;height:100%;background-color:var(--bg-color);overflow:hidden}canvas#webgl{position:fixed;display:block}#app{width:100%;height:100%}.loading{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--bg-color);transition:opacity 1.2s cubic-bezier(.215,.61,.355,1);transition-delay:1.2s}.loading.fade-out{opacity:0}.loading .progress-container{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:50vw;max-width:480rem;height:2px;transition:opacity .8s cubic-bezier(.215,.61,.355,1)}.loading.fade-out .progress-container{opacity:0}.loading .progress-base,.loading .progress-fill{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(var(--main-color-rgb),.2)}.loading .progress-fill{width:0%;background:var(--main-color);transition:width .2s ease-in-out}.simulation{width:100%;height:100%;display:flex;flex-direction:row}@media only screen and (max-device-width: 1280px) and (max-width: 640px){.simulation{flex-direction:column}}.preview{flex:1;position:relative}.preview h2{position:absolute;left:32rem;top:32rem;color:#fff;font-size:24rem}.preview .caution{position:absolute;left:32rem;bottom:32rem;padding-left:12rem;color:#ccc;font-size:12rem;text-shadow:0 0 12rem rgba(0,0,0,.33)}.preview .caution:before{content:"※";position:absolute;left:0;top:0}@media only screen and (max-device-width: 1280px) and (max-width: 640px){.preview h2{font-size:32rem}.preview .caution{bottom:16rem;padding-left:15rem;font-size:15rem}}.panel .tab{display:flex;gap:2rem;background:#ffffff1a;margin:32rem;border-radius:8rem;-webkit-backdrop-filter:blur(6rem);backdrop-filter:blur(6rem)}.panel .tab button{flex:1;border:none;background:transparent;color:#ccc;font-size:14rem;padding:8rem 0;border-radius:8rem;cursor:pointer}.panel .tab button.selected{color:var(--bg-color);font-weight:700;background:var(--main-color)}.panel .tab button.disable{color:#666;pointer-events:none}@media only screen and (max-device-width: 1280px) and (max-width: 640px){.panel .tab{bottom:24rem}.panel .tab button{width:160rem;font-size:24rem;padding:8rem 0;border-radius:8rem}}.panel{display:flex;flex-direction:column;width:var(--panel-width);height:100%;background-color:var(--bg-color);overflow:hidden;overflow-y:auto}.panel .btn-container{position:relative;padding:32rem}.panel .btn-container.futa:before{content:"";position:absolute;left:16rem;top:0;width:calc(100% - 32rem);height:1px;background-color:#333}.panel .btn-container:after{content:"";position:absolute;left:16rem;bottom:0;width:calc(100% - 32rem);height:1px;background-color:#333}.panel .btn-container .labels{margin-bottom:32rem}.panel .btn-container .labels .title{font-size:12rem;margin-right:16rem;color:#ccc}.panel .btn-container .labels .value{font-size:16rem;font-weight:700;color:var(--main-color)}.panel .btn-container .options{display:grid;gap:24rem}.panel .btn-container.grid-3 .options{grid-template-columns:repeat(3,minmax(0,1fr))}.panel .btn-container.grid-4 .options{grid-template-columns:repeat(4,minmax(0,1fr))}.panel .btn-container .options button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:16rem;border:none;background:transparent;cursor:pointer;line-height:1}.panel .btn-container .options button img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;border-radius:8rem}.panel .btn-container .options button span{font-size:12rem;color:#ccc;line-height:1.25;white-space:nowrap}.panel .btn-container .options button.selected span{color:var(--main-color);font-weight:700}.panel .btn-container .options button.selected img{border-color:var(--main-color);outline:4rem solid var(--main-color)}@media only screen and (max-device-width: 1280px) and (max-width: 640px){.panel{width:100%;height:auto}.panel .btn-container{padding:24rem 0 0}.panel .btn-container.futa:before{left:0;bottom:0;width:100%;height:1px}.panel .btn-container:after{left:0;bottom:0;width:100%;height:1px}.panel .btn-container:last-child:after{display:none}.panel .btn-container .labels{padding:0 32rem;margin-bottom:16rem}.panel .btn-container .labels .title{font-size:20rem}.panel .btn-container .labels .value{font-size:26rem}.panel .btn-container .options{display:flex;gap:48rem;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:8rem 32rem 24rem}.panel .btn-container .options button{flex:0 0 auto;width:120rem;scroll-snap-align:start}.panel .btn-container .options button span{font-size:20rem}}