html,body{margin:0;height:100%;overflow:hidden;font-family:'Malgun Gothic','Apple SD Gothic Neo',sans-serif;color:#fff;touch-action:none;-webkit-user-select:none;user-select:none}
input{-webkit-user-select:text;user-select:text}
.panel{background:rgba(25,2,18,.82);border:2px solid #d4a017;border-radius:12px;padding:10px;box-shadow:0 0 18px #ff3cac66}
.center{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10;width:min(420px,92vw);max-height:92dvh;overflow:auto;box-sizing:border-box}
h1{text-align:center;color:#fff3c4;font-family:Georgia,serif;letter-spacing:2px;text-shadow:0 0 10px #ff3cac,0 0 20px #ff3cac;margin:4px 0 0;font-size:26px}
.sub{text-align:center;color:#d4a017;margin-bottom:10px}
input{background:#2a0020;color:#fff;border:1px solid #d4a017;border-radius:6px;padding:7px;font-size:16px}
button{background:#5a0030;color:#fff;border:1px solid #d4a017;border-radius:8px;padding:6px 10px;margin:2px;cursor:pointer;font-size:15px;touch-action:manipulation}
button:disabled{opacity:.5}.sel{background:#b0005a}.big{width:100%;padding:13px;font-size:18px;margin-top:10px;background:#b0005a}
.row{margin:8px 0}.row b{display:inline-block;width:52px}.hint{font-size:12px;opacity:.75}
.swatch{display:inline-block;width:26px;height:26px;border-radius:50%;margin:2px;cursor:pointer;border:2px solid transparent;vertical-align:middle}.swatch.sel{border-color:#fff}
.hidden{display:none!important}
#loading{position:fixed;inset:0;z-index:20;background:#0a0108e0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:18px;color:#ffd84a}
.spin{font-size:56px;animation:sp 1.2s linear infinite}@keyframes sp{to{transform:rotate(360deg)}}
#hud>*{position:fixed;z-index:5}
#topbar{top:8px;left:8px;display:flex;align-items:center;gap:2px;flex-wrap:wrap}#where{background:#0009;padding:6px 9px;border-radius:6px;font-size:14px}
#muteBtn{font-size:20px;min-width:44px;min-height:40px}#vol{width:90px;padding:0}
#chat{left:8px;bottom:8px;width:min(340px,60vw)}#msgs{height:150px;overflow-y:auto;font-size:14px;-webkit-user-select:text;user-select:text}#chatForm{display:flex}#chatIn{flex:1;min-width:0}
#chatTitle{color:#ffd84a;font-weight:bold}
#music{right:8px;top:8px;width:min(310px,40vw);font-size:13px;max-height:45vh;overflow:auto}#pl{max-height:150px;overflow:auto;padding-left:20px;margin:4px 0}#pl li.cur{color:#ffd84a}
.arow{display:flex;gap:4px;margin:4px 0;align-items:center}.arow input{flex:1;min-width:0;font-size:13px}
#unmute{left:50%;top:70px;transform:translateX(-50%);font-size:18px;padding:10px 16px;background:#b0005a}
#prompt{left:50%;top:58%;transform:translateX(-50%);background:#000a;padding:6px 12px;border-radius:6px}
#mob{left:18px;bottom:84px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.12);border:2px solid rgba(255,216,74,.55);display:none;touch-action:none;pointer-events:auto;z-index:20}#joyKnob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:rgba(255,216,74,.75);box-shadow:0 0 12px #ff3cac;pointer-events:none}
.fab{display:none;width:46px;height:46px;font-size:20px;border-radius:50%}
#ytWrap{position:fixed;left:-10px;bottom:-10px;width:2px;height:2px;overflow:hidden;opacity:0.01;pointer-events:none}
/* 모바일 */
@media (max-width:700px),(pointer:coarse){
 .fab{display:block}#chatToggle{left:8px;bottom:8px}#musicToggle{left:60px;bottom:8px}
 #chat{bottom:62px;width:calc(100vw - 16px);box-sizing:border-box}#msgs{height:22vh}
 #music{top:auto;bottom:62px;left:8px;right:auto;width:calc(100vw - 16px);box-sizing:border-box;max-height:40vh}
 #hud:not(.showChat) #chat{display:none}#hud:not(.showMusic) #music{display:none}
 #mob{display:block}#vol{width:70px}
}
@media (max-width:700px),(pointer:coarse){#hud.showChat #mob,#hud.showMusic #mob{display:none}#msgs{height:18vh}}

.pv{text-align:center}#preview{width:150px;height:162px;background:radial-gradient(circle,#5a0a2a,#1a0010);border-radius:50%;border:2px solid #d4a017}
@media (max-height:700px){#preview{width:110px;height:119px}}

#chat{z-index:7}#music{z-index:6}
@media (max-width:700px),(pointer:coarse){#music{z-index:8}}
.a-enter-vr,.a-enter-ar,.a-orientation-modal{display:none!important}

#actBar{position:fixed;right:12px;bottom:12px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;max-width:60vw;z-index:21;pointer-events:auto}#actBar.hidden{display:none}#actBar button,#actBar .lbl{font-size:16px;padding:8px 14px;border-radius:22px;border:2px solid #ffd84a;background:rgba(30,10,40,.85);color:#fff;touch-action:manipulation}#actBar .lbl{border-color:transparent;background:rgba(0,0,0,.5);font-size:14px}
@media (max-width:700px),(pointer:coarse){#actBar{right:10px;bottom:70px;flex-direction:column;align-items:flex-end;max-width:45vw}#actBar button{font-size:14px;padding:7px 11px}}

#jumpBtn{position:fixed;left:150px;bottom:90px;width:64px;height:64px;border-radius:50%;background:rgba(255,60,172,.35);border:2px solid rgba(255,216,74,.7);color:#fff;font-size:22px;line-height:1;text-align:center;padding-top:10px;box-sizing:border-box;display:none;touch-action:none;pointer-events:auto;z-index:20;user-select:none}#jumpBtn small{font-size:11px}
@media (max-width:700px),(pointer:coarse){#jumpBtn{display:block}#hud.showChat #jumpBtn,#hud.showMusic #jumpBtn{display:none}}