@font-face{font-family:"InterK";src:url("/haishin/fonts/Inter-Black.otf") format("opentype");font-weight:900}
@font-face{font-family:"InterK";src:url("/haishin/fonts/Inter-ExtraBold.otf") format("opentype");font-weight:800}
@font-face{font-family:"InterK";src:url("/haishin/fonts/Inter-SemiBold.otf") format("opentype");font-weight:600}
@font-face{font-family:"InterK";src:url("/haishin/fonts/Inter-Medium.otf") format("opentype");font-weight:500}
:root{--hue:0deg;--namefont:"InterK";
  --jp:"Yu Gothic UI","Yu Gothic","YuGothic","Hiragino Sans","Hiragino Kaku Gothic ProN","Meiryo","Noto Sans JP","IPAPGothic","WenQuanYi Zen Hei",sans-serif}
html,body{margin:0;padding:0;width:100vw;height:100vh;overflow:hidden}
body{background:#000}
body.r-text,body.r-alpha{background:transparent}
#stage{position:absolute;inset:0}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.r-text #gl{display:none}
.r-bg #ui{display:none}
#ui{position:absolute;inset:0;pointer-events:none;color:#fff;font-family:"InterK",var(--jp);filter:hue-rotate(var(--hue))}
#main{position:absolute;inset:0;transform-origin:50% 45%}
.t{position:absolute;left:0;right:0;text-align:center;white-space:nowrap}
#title .ch{display:inline-block;will-change:transform,opacity}
#sub{top:31%;font-size:1.9vw;font-weight:600;letter-spacing:.6em;padding-left:.6em}
#title{top:36.5%;font-size:6.4vw;font-weight:900;letter-spacing:.06em;line-height:1.1}
#name{top:52.5%;font-size:2.5vw;font-weight:600;letter-spacing:.22em;font-family:var(--namefont),"InterK",var(--jp)}
#bar{position:absolute;left:32%;right:32%;top:61.5%;height:.32vw;border-radius:1vw;overflow:hidden;background:rgba(255,255,255,.14)}
#bar i{display:block;height:100%;width:0}
#timer{top:63.6%;font-size:1.15vw;font-weight:600;letter-spacing:.32em;opacity:.85;font-variant-numeric:tabular-nums}
#count{top:24%;font-size:23vw;font-weight:900;line-height:1;opacity:0}
#go{top:33%;font-size:11vw;font-weight:900;line-height:1;opacity:0}
#flash{position:absolute;inset:0;background:#fff;opacity:0}
#hint{position:absolute;left:0;right:0;bottom:2vw;text-align:center;font:600 1.1vw var(--jp);color:#fff;opacity:0;transition:opacity .4s;text-shadow:0 0 .5vw #000}
.noname #name{display:none}
.noname #bar{top:54.5%}
.noname #timer{top:56.6%}
.noname #sub{top:34%}
.noname #title{top:39.5%}

/* ----- stream scene: room + frames ----- */
#room,#ov{position:absolute;inset:0;pointer-events:none}
#room{filter:hue-rotate(var(--hue))}
#room svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.m-overlay{background:transparent!important}
.m-overlay #gl{display:none}
.m-talk #ui,.m-overlay #ui{display:none}
#ov{--u:1vw;filter:hue-rotate(var(--hue));font-family:"InterK",var(--jp)}
.lay-chat #ov,.lay-camera #ov,.lay-frame #ov{--u:19.2px}
.single{position:absolute;inset:calc(var(--u)*1.2)}
.fr{position:absolute;box-sizing:border-box;border:calc(var(--u)*.16) solid var(--a1,#7cc4ff);border-radius:calc(var(--u)*var(--rad,.7));
  box-shadow:0 0 calc(var(--u)*.9) var(--a1g,rgba(124,196,255,.55)),inset 0 0 calc(var(--u)*.7) var(--a1g,rgba(124,196,255,.35))}
.fr-chat,.fr-info{background:var(--panel,rgba(6,10,24,.5))}
.fr-info{background:var(--panel2,rgba(6,10,24,.82))}
.fr .lb{position:absolute;left:calc(var(--u)*1);top:calc(var(--u)*-.75);padding:calc(var(--u)*.12) calc(var(--u)*.7);font-size:calc(var(--u)*.72);font-weight:800;letter-spacing:.22em;
  color:var(--lbfg,#061018);background:var(--a1,#7cc4ff);border-radius:calc(var(--u)*.3);line-height:1.5}
.fr .c{position:absolute;width:calc(var(--u)*1.3);height:calc(var(--u)*1.3);border:calc(var(--u)*.22) solid var(--a2,#ff6fd1);filter:drop-shadow(0 0 calc(var(--u)*.4) var(--a2,#ff6fd1))}
.fr .c.tl{left:calc(var(--u)*-.5);top:calc(var(--u)*-.5);border-right:0;border-bottom:0}
.fr .c.tr{right:calc(var(--u)*-.5);top:calc(var(--u)*-.5);border-left:0;border-bottom:0}
.fr .c.bl{left:calc(var(--u)*-.5);bottom:calc(var(--u)*-.5);border-right:0;border-top:0}
.fr .c.br{right:calc(var(--u)*-.5);bottom:calc(var(--u)*-.5);border-left:0;border-top:0}
.fr .run{position:absolute;left:calc(var(--u)*-.38);top:calc(var(--u)*-.38);width:calc(var(--u)*.6);height:calc(var(--u)*.6);border-radius:50%;background:#fff;
  box-shadow:0 0 calc(var(--u)*.8) calc(var(--u)*.25) var(--a2,#ff6fd1)}
.fr-info{display:flex;align-items:center;gap:calc(var(--u)*1.4);padding:0 calc(var(--u)*1.6)}
.fr-info .in{flex:0 1 auto;min-width:0;overflow:hidden;font-size:calc(var(--u)*1.9);font-weight:800;letter-spacing:.08em;color:#fff;text-shadow:0 0 calc(var(--u)*.7) var(--a1,#7cc4ff);font-family:var(--namefont),"InterK",var(--jp);white-space:nowrap}
.fr-info .it{font-size:calc(var(--u)*.95);font-weight:600;letter-spacing:.3em;color:var(--a2,#ff6fd1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r-text .run{display:none}