@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--base:#070913;--muted:#98a7b9;--cyan:#72f2de;--pink:#ed78c6;--ivory:#f6f6fc;--panel:#0c1121f2;--stroke:#7787a332;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;width:100%;padding:0;margin:0;background:#070913;color:var(--ivory);overflow:hidden;overscroll-behavior:none;font-family:'DM Sans',system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.47;cursor:not-allowed}[hidden]{display:none!important}.game{position:fixed;inset:0;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 60% 0%,#1b1b33,#070913 65%)}#view{display:block;width:100%;height:100%;touch-action:none;outline:0}.veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(3,5,15,.43) 0,transparent 23%,transparent 65%,rgba(3,5,15,.58) 100%),radial-gradient(ellipse at 40% 20%,transparent 35%,rgba(4,5,16,.3) 120%)}
.hud-top{position:absolute;top:0;right:0;left:0;display:flex;gap:12px;align-items:center;padding:calc(14px + var(--safe-top)) calc(16px + var(--safe-right)) 15px calc(16px + var(--safe-left));pointer-events:none}.wordmark{display:flex;gap:11px;align-items:center;white-space:nowrap;margin-right:auto}.sigil{font-family:'Barlow Condensed',sans-serif;width:44px;height:44px;display:grid;place-items:center;border:1px solid #74cfccaa;box-shadow:0 0 27px #41d7d52e,inset 0 0 20px #60cce018;background:#091123b0;border-radius:12px;font-weight:900;font-size:24px;letter-spacing:-.07em}.sigil span{color:var(--cyan);font-size:13px}.word{font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:800;line-height:.91;letter-spacing:.08em}.word em{display:block;font-size:11px;letter-spacing:.3em;font-style:normal;color:var(--cyan);margin-top:3px}.word small{display:block;font-size:9px;letter-spacing:.45em;color:#ccd3e1;line-height:2.1}
.hud-status{display:flex;align-items:center;gap:8px;border:1px solid #85d7c54b;background:#080d1bdb;backdrop-filter:blur(14px);border-radius:14px;padding:11px 13px;font-size:10px;letter-spacing:.07em;font-weight:800;white-space:nowrap;max-width:50vw}.hud-status.offline{border-color:#f5ab7150;color:#dfc3bb}.hud-status #roomLabel{color:#a9c2cf;font-weight:500;border-left:1px solid #ffffff26;padding-left:9px}.hud-status #population{color:var(--cyan);font-variant-numeric:tabular-nums}.pulse{width:8px;height:8px;flex:none;background:var(--cyan);box-shadow:0 0 0 4px #55e9cf1c,0 0 20px #58ddc6;display:block;border-radius:50%}.offline .pulse{background:#ff9b79;box-shadow:none}.toolbar{display:flex;gap:8px;pointer-events:auto}.round{height:44px;width:44px;border-radius:13px;background:#0c1222dd;border:1px solid #d0d9ee30;backdrop-filter:blur(15px);color:white;font-size:23px}.round.strong{border-color:#71e3d15a;color:var(--cyan)}.round:hover,.nav-item:hover{background:#1f3445}
.location{position:absolute;top:calc(87px + var(--safe-top));left:calc(21px + var(--safe-left));pointer-events:none;display:flex;align-items:center;gap:9px;background:#090f2099;border:1px solid #ffffff1c;border-radius:9px;padding:10px 13px;font-size:11px;font-weight:800;letter-spacing:.15em;backdrop-filter:blur(8px)}.location small{color:#b0c1d1;font-size:9px;letter-spacing:.09em;margin-left:10px}.loc-dot{color:var(--cyan)}
.toast{position:absolute;top:calc(96px + var(--safe-top));left:50%;transform:translateX(-50%);z-index:11;max-width:min(82vw,430px);border-radius:12px;background:#101a2be6;border:1px solid #75c9b855;padding:11px 18px;color:#e9ffff;text-align:center;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s}.toast.visible{opacity:1}.prompt{position:absolute;bottom:calc(119px + var(--safe-bottom));left:50%;transform:translateX(-50%);background:#071020ed;border:1px solid #80e4dd66;border-radius:15px;backdrop-filter:blur(18px);padding:12px 13px;display:flex;gap:15px;align-items:center;max-width:90vw;font-size:12px;z-index:4;box-shadow:0 6px 30px #0009}.prompt strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prompt button{background:#81eade;color:#10212b;border:0;padding:10px 12px;border-radius:9px;font-size:10px;font-weight:900;white-space:nowrap;letter-spacing:.1em}
.desktop-help{position:absolute;bottom:calc(32px + var(--safe-bottom));left:21px;font-size:10px;color:#d1d8e1;letter-spacing:.09em;text-shadow:0 2px 10px #000;font-weight:750}.desktop-help span{color:var(--cyan);margin:0 7px}.bottom-nav{position:absolute;left:50%;bottom:calc(16px + var(--safe-bottom));transform:translateX(-50%);display:flex;gap:3px;padding:7px 10px;border:1px solid #c6d4f029;background:#090f1de5;backdrop-filter:blur(18px);border-radius:19px;box-shadow:0 7px 35px #0008;z-index:5}.nav-item{position:relative;color:#b7c3d3;background:transparent;border:0;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:78px;min-height:49px;padding:5px 9px}.nav-item span{font-size:22px;line-height:1.1;color:#ecf0f9}.nav-item small{font-size:8px;letter-spacing:.09em;font-weight:800}.nav-item.active{background:#2b414d83;color:var(--cyan)}.nav-item.active span{color:var(--cyan)}.nav-item i{position:absolute;top:7px;right:22px;width:8px;height:8px;border-radius:50%;background:var(--pink)}
.scrim{position:absolute;inset:0;background:#0306117a;backdrop-filter:blur(4px);z-index:7}.drawer{position:absolute;top:calc(80px + var(--safe-top));right:calc(17px + var(--safe-right));bottom:calc(90px + var(--safe-bottom));width:min(390px,calc(100vw - 34px));display:flex;flex-direction:column;border-radius:20px;background:#0c1425f7;border:1px solid #92b9c64b;box-shadow:0 24px 80px #000c;z-index:9;overflow:hidden}.drawer-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:22px 22px 18px;border-bottom:1px solid #ffffff19;background:linear-gradient(115deg,#122b36bb,#17162ea0)}.drawer-head h2{font:800 27px/1 'Barlow Condensed',sans-serif;letter-spacing:.08em;margin:6px 0 0}.drawer-head small{font-size:9px;letter-spacing:.17em;color:var(--cyan);font-weight:900}.drawer-head button,.chat-head button{height:37px;width:37px;border:1px solid #a7c1c247;background:#132337;border-radius:10px;color:#f6f7fc;font-size:20px}.drawer-content{overflow-y:auto;flex:1;padding:20px 22px 28px;scrollbar-width:thin;scrollbar-color:#496879 #0b1221}.drawer-content h3{font:800 16px 'Barlow Condensed',sans-serif;letter-spacing:.11em;color:#d6e6f2;margin:20px 0 9px}.drawer-content p,.drawer-content .small{font-size:12px;color:#bac7d7;line-height:1.6}.drawer-content label{display:block;color:#b8c8d9;font-size:10px;letter-spacing:.11em;font-weight:800;margin:18px 0 9px}.drawer-content input,.drawer-content select{width:100%;min-height:43px;border:1px solid #7c9cb94f;background:#070e1c;border-radius:11px;color:#eef5fc;padding:0 12px;outline:none}.drawer-content input:focus-visible,.drawer-content select:focus-visible{border-color:var(--cyan)}.drawer-content button.plain,.drawer-content button.primary,.drawer-content a.plain{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:41px;border-radius:10px;text-decoration:none;padding:10px 15px;font-size:11px;font-weight:900;letter-spacing:.06em;border:1px solid #73e3d59b;margin:7px 5px 5px 0;color:var(--cyan);background:#132739}.drawer-content button.primary{background:var(--cyan);color:#10202a}.drawer-content button.selected{background:#215855;color:#d9fcf2}.drawer-content .card{padding:14px 15px;margin:9px 0;border-radius:12px;background:#122337a8;border:1px solid #6c9cb635}.drawer-content .list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;padding:10px 0;border-bottom:1px solid #ffffff16}.drawer-content .list-row span:last-child{color:var(--cyan);font-size:11px}.drawer-content .tag{font-size:9px;color:#8ff8e5;background:#123d4580;padding:5px 8px;border-radius:6px}.drawer-content .swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:10px}.drawer-content .swatch{height:37px;border-radius:9px;border:2px solid #ffffff33;cursor:pointer}.drawer-content .swatch.selected{outline:2px solid var(--cyan);outline-offset:2px}
.chat-dock{position:absolute;bottom:calc(95px + var(--safe-bottom));left:calc(18px + var(--safe-left));width:min(380px,calc(100vw - 36px));height:min(360px,45vh);z-index:6;background:#0a1325f5;border:1px solid #87b9c151;border-radius:16px;box-shadow:0 10px 50px #000b;display:flex;flex-direction:column;overflow:hidden;backdrop-filter:blur(18px)}.chat-head{display:flex;justify-content:space-between;align-items:center;padding:11px 13px;border-bottom:1px solid #ffffff21;font-size:11px;letter-spacing:.13em;font-weight:900;color:var(--cyan)}.chat-head button{height:29px;width:29px}.chat-messages{flex:1;min-height:0;padding:10px 13px;overflow-y:auto;scrollbar-width:thin}.chat-msg{margin:7px 0;font-size:12px;word-break:break-word;color:#dce5f0;line-height:1.5}.chat-msg b{font-size:11px;color:var(--cyan)}.chat-msg.system{color:#aabacf;font-size:11px;font-style:italic}.chat-msg .time{font-size:9px;color:#7d96aa;margin-right:6px}.chat-dock form{display:flex;gap:7px;padding:8px 10px;border-top:1px solid #ffffff20}.chat-dock input{min-width:0;flex:1;height:38px;padding:0 10px;background:#060d1b;border:1px solid #ffffff24;border-radius:9px;color:white;font-size:12px}.chat-dock form button{width:39px;background:#72e7d7;color:#081c21;border:0;border-radius:9px;font-size:23px}
.touch-ui{display:none}.intro{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:#080913;transition:opacity .55s,visibility .55s}.intro.hide{opacity:0;visibility:hidden;pointer-events:none}.intro-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 110%,#852d68ac,transparent 44%),radial-gradient(ellipse at 50% -10%,#13626777,transparent 54%)}.intro-center{position:relative;text-align:center;padding:16px}.intro-logo{width:92px;height:92px;border:1px solid #68e4d980;border-radius:24px;background:#142b3650;margin:0 auto 29px;display:grid;place-items:center;box-shadow:0 0 80px #49e6d02d;font:900 51px 'Barlow Condensed',sans-serif;letter-spacing:-.07em}.intro-logo span{color:var(--cyan);font-size:27px}.intro-kicker{font-size:10px;letter-spacing:.35em;font-weight:800;color:var(--cyan)}.intro h1{margin:12px 0 26px;font:900 clamp(52px,11vw,112px)/.75 'Barlow Condensed',sans-serif;letter-spacing:.04em}.intro h1 em{font-style:normal;color:#e27bbf}.progress{width:min(280px,65vw);height:4px;margin:0 auto 16px;background:#ffffff23;border-radius:99px;overflow:hidden}.progress>div{height:100%;width:4%;border-radius:99px;background:linear-gradient(90deg,#bc77e9,#77ffee);transition:width .4s}.intro-center>p:last-child{color:#b7ccd2;font-size:11px;letter-spacing:.15em}.intro-version{position:absolute;bottom:calc(24px + var(--safe-bottom));font-size:10px;color:#8497b3;letter-spacing:.19em}
.webgl-error{position:absolute;inset:0;background:#090f1d;z-index:35;padding:28px;display:grid;place-content:center;text-align:center;line-height:1.7;color:#efefff}.webgl-error p{color:#b4c1d6;font-size:13px;max-width:480px}
@media(max-width:900px){.word{font-size:16px}.location{top:calc(82px + var(--safe-top))}.desktop-help{display:none}.hud-status #roomLabel{max-width:110px;overflow:hidden;text-overflow:ellipsis}.bottom-nav .nav-item{min-width:64px}.prompt{bottom:calc(102px + var(--safe-bottom))}}
@media(pointer:coarse){.touch-ui{display:contents}.joystick{position:absolute;bottom:calc(100px + var(--safe-bottom));left:calc(22px + var(--safe-left));width:128px;height:128px;border-radius:50%;border:2px solid #c6f9f04e;background:radial-gradient(circle,#d3fef11d,#081421aa 76%);backdrop-filter:blur(6px);touch-action:none;z-index:3;box-shadow:inset 0 0 28px #70e4da20}.joy-knob{position:absolute;top:50%;left:50%;width:54px;height:54px;border-radius:50%;border:2px solid #7cf5d7a3;background:linear-gradient(145deg,#28535b,#0f1d37);box-shadow:0 0 20px #5ad4dc34;transform:translate(-50%,-50%);touch-action:none}.touch-actions{position:absolute;right:calc(22px + var(--safe-right));bottom:calc(115px + var(--safe-bottom));display:flex;gap:12px;align-items:center}.touch-actions button{background:#0b162ce0;border:2px solid #a5f3e680;color:#e0fff6;border-radius:50%;width:61px;height:61px;font:900 20px 'DM Sans',sans-serif;touch-action:manipulation}.touch-actions .camera-b{width:47px;height:47px;font-size:24px;border-color:#b9a0d780}}
@media(max-width:640px){.hud-top{padding-top:calc(10px + var(--safe-top));padding-left:12px;padding-right:12px;gap:5px}.sigil{height:36px;width:36px;font-size:20px}.sigil span{font-size:10px}.word{font-size:13px;letter-spacing:.04em}.word em{font-size:9px}.word small{font-size:7px}.hud-status{padding:9px;gap:5px;font-size:8px;max-width:48vw;border-radius:10px}.hud-status #roomLabel{display:none}.round{height:35px;width:35px;border-radius:11px;font-size:18px}.toolbar{gap:4px}.location{top:calc(63px + var(--safe-top));left:12px;padding:7px 9px;font-size:9px;letter-spacing:.09em}.location small{display:none}.bottom-nav{width:calc(100% - 16px);justify-content:space-around;bottom:calc(8px + var(--safe-bottom));padding:4px 1px;border-radius:15px}.nav-item{min-width:0!important;flex:1;padding:6px 2px;min-height:46px;gap:1px}.nav-item span{font-size:20px}.nav-item small{font-size:7px;letter-spacing:.03em}.touch-actions{bottom:calc(83px + var(--safe-bottom));right:14px}.joystick{bottom:calc(81px + var(--safe-bottom));left:13px;width:118px;height:118px}.prompt{bottom:calc(195px + var(--safe-bottom));width:max-content;padding:7px 10px}.prompt strong{font-size:10px}.prompt button{padding:8px;font-size:9px}.drawer{width:calc(100vw - 16px);top:calc(57px + var(--safe-top));right:8px;bottom:calc(64px + var(--safe-bottom));border-radius:15px}.drawer-head{padding:16px}.drawer-content{padding:14px 17px}.chat-dock{left:8px;width:calc(100vw - 16px);bottom:calc(61px + var(--safe-bottom));height:min(290px,50vh)}.intro h1{font-size:68px}}
@media(max-width:640px) and (orientation:portrait){.hud-status{position:absolute;top:calc(58px + var(--safe-top));left:12px;max-width:none}.location{top:calc(98px + var(--safe-top))}.wordmark{min-width:0}.toolbar{margin-left:auto}.toast{top:calc(133px + var(--safe-top))}.drawer{top:calc(60px + var(--safe-top))}.chat-dock{height:min(390px,45vh)}}
@media(max-height:450px) and (orientation:landscape){.hud-top{padding-top:calc(4px + var(--safe-top));padding-bottom:4px}.word small{display:none}.location{top:calc(53px + var(--safe-top))}.bottom-nav{left:auto;right:calc(8px + var(--safe-right));bottom:calc(5px + var(--safe-bottom));transform:none;width:min(400px,53vw)}.nav-item{min-height:36px}.nav-item span{font-size:16px}.nav-item small{font-size:7px}.joystick{left:calc(13px + var(--safe-left));bottom:calc(15px + var(--safe-bottom));height:108px;width:108px}.touch-actions{bottom:calc(26px + var(--safe-bottom));right:calc(440px + var(--safe-right));gap:6px}.touch-actions button{width:44px;height:44px}.touch-actions .camera-b{width:39px;height:39px}.drawer{top:calc(50px + var(--safe-top));bottom:calc(15px + var(--safe-bottom));max-width:380px}.chat-dock{bottom:calc(54px + var(--safe-bottom));width:min(330px,45vw);height:calc(100% - 110px)}.prompt{bottom:calc(20px + var(--safe-bottom));left:42%;padding:7px}.intro-logo{display:none}.intro h1{font-size:58px}.intro-center{padding:0}.intro h1{margin:8px 0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important}}
/* W02: cortando filtros de composição caros nos HUDs de celulares modestos. */
html[data-anw-quality="ultra"] .hud-status,
html[data-anw-quality="ultra"] .joystick,
html[data-anw-quality="ultra"] .drawer,
html[data-anw-quality="ultra"] .chat-dock,
html[data-anw-quality="low"] .hud-status,
html[data-anw-quality="low"] .joystick,
html[data-anw-quality="low"] .chat-dock{backdrop-filter:none;-webkit-backdrop-filter:none}

/* W03: thumb-sized floating joystick zone and compact nightclub radio toggle. */
.music-toggle{width:68px;flex:0 0 68px;font-size:11px;font-weight:900;letter-spacing:.02em}
@media(pointer:coarse){
 .joy-zone{position:absolute;left:calc(5px + var(--safe-left));bottom:calc(58px + var(--safe-bottom));width:min(49vw,280px);height:min(49vh,330px);z-index:3;touch-action:none}
 .joy-zone .joystick{left:43%;bottom:28px;top:auto;touch-action:none;will-change:left,top}
}
@media(pointer:coarse) and (orientation:landscape){
 .joy-zone{width:min(34vw,270px);height:min(67vh,235px);bottom:calc(5px + var(--safe-bottom))}
 .joy-zone .joystick{bottom:12px}
}
html[data-anw-quality="ultra"] .music-toggle,html[data-anw-quality="low"] .music-toggle{backdrop-filter:none;-webkit-backdrop-filter:none}

/* W04: single-thumb ergonomics, clear hierarchy and safe-area layouts.
   The camera button is a photographer; recenter is a separate control. */
@media(pointer:coarse){
 .joy-zone{z-index:4}
 .joy-zone .joystick{pointer-events:none;border-color:#82f7e5ad;background:radial-gradient(circle,#b5fff334 0,#132840c9 75%);box-shadow:0 0 0 7px #72dcca14,inset 0 0 28px #70e4da2b;transition:box-shadow .15s}
 .joy-zone:active .joystick{box-shadow:0 0 0 9px #72dcca22,inset 0 0 38px #70e4da50}
 .joy-knob{width:56px;height:56px;background:radial-gradient(circle at 30% 23%,#72f2de,#27626b 70%,#153048);border:1px solid #e6fff7ae;box-shadow:0 3px 16px #071122ae}
 .touch-actions{z-index:5;gap:9px}
 .touch-actions .recenter-b{width:47px;height:47px;font-size:27px;color:#8ef9df;border-color:#68e9d597;background:#0c253acc}
 .touch-actions .recenter-b:active{background:#275353;border-color:#e2fff9}
 .touch-actions .action-b{width:66px;height:66px;border-color:#84efeab8;background:radial-gradient(circle at 30% 10%,#34536b,#0c152a 79%);box-shadow:0 0 0 4px #5bcecc16}
}
@media(pointer:coarse) and (orientation:landscape) and (max-height:480px){
 .touch-actions{right:calc(17px + var(--safe-right));bottom:calc(78px + var(--safe-bottom));gap:8px}
 .touch-actions button{width:44px!important;height:44px!important}
 .joy-zone{left:calc(4px + var(--safe-left));width:min(30vw,250px);height:min(65vh,225px);bottom:calc(5px + var(--safe-bottom))}
 .music-toggle{width:58px;flex-basis:58px;font-size:10px}
}
@media(pointer:coarse) and (orientation:portrait) and (max-width:450px){
 .joy-zone{width:49vw;max-height:37vh;bottom:calc(55px + var(--safe-bottom))}
 .touch-actions{bottom:calc(102px + var(--safe-bottom));right:calc(12px + var(--safe-right));gap:6px}
 .touch-actions .camera-b,.touch-actions .recenter-b{width:41px;height:41px;font-size:22px}
 .touch-actions .action-b{width:62px;height:62px}
 .music-toggle{width:56px;flex-basis:56px;font-size:9px}
}

/* W05: joystick is INVISIBLE until the thumb contacts its left-side zone.
 * No permanent controller badge in the middle of the scene. */
@media(pointer:coarse){
 .joy-zone .joystick{
   opacity:0;visibility:hidden;pointer-events:none;
   background:#bac4d310;border:1px solid #c7e9e957;
   box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
   will-change:left,top,opacity;transition:none;
 }
 .joy-zone.is-active .joystick,.joy-zone.is-active:active .joystick{
   opacity:.57;visibility:visible;
   box-shadow:0 0 0 4px #c7e9e911,inset 0 0 11px #d8ffef10;
 }
 .joy-zone .joy-knob{
   background:#c7e6eb23;border:1px solid #e6f7ec79;
   box-shadow:none;opacity:.64;
 }
 .joy-zone.is-active .joy-knob{opacity:.78}
}

/* W05 professionally laid-out two-deck original Orfeu DJ workstation */
.dj-studio{display:flex;flex-direction:column;gap:10px}
.dj-brand{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#8cece1;border-bottom:1px solid #72e9dd4b;padding:7px 0 13px}
.dj-brand strong{font:900 19px 'Barlow Condensed',sans-serif;letter-spacing:.06em}
.dj-brand small{color:#becfdb;font-size:9px;text-align:right}
.dj-decks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.dj-deck{min-width:0;border-radius:13px;border:1px solid #73d7cb55;padding:12px;background:linear-gradient(152deg,#15323a,#11152c)}
.dj-deck:nth-child(2){background:linear-gradient(140deg,#30223f,#131829);border-color:#e39dd255}
.dj-deck>span{font:900 20px 'Barlow Condensed',sans-serif;color:#80fbec}
.dj-deck:nth-child(2)>span{color:#e9a9df}
.dj-deck select{font-size:10px;min-width:0;margin:4px 0 8px}
.dj-deck button{font-size:10px;width:100%;min-height:39px!important}
.dj-studio input[type=range]{accent-color:#89f8e8;width:100%;height:27px;min-height:27px}
.dj-studio .dj-meter{display:flex;justify-content:space-between;font-size:11px;color:#c6deea;margin-top:-13px}
.dj-studio .dj-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dj-studio .dj-controls button{margin:0!important;min-width:0;padding:8px 5px;font-size:10px}
.dj-fx{padding:12px;border-radius:14px;border:1px solid #82508f6d;background:#1b1429cc}
.dj-fx>strong{display:block;margin-bottom:12px;color:#e5a6d6;font-size:12px}
.wardrobe-premium{border-color:#77f2dd60!important;background:linear-gradient(155deg,#17313c91,#1a152e96)!important}
.wardrobe-premium a,.wardrobe-premium .primary{width:100%}

/* W07 — only ANGELS NIGHT Anime Next appears in the player's wardrobe */
.next-atelier{display:flex;flex-direction:column;gap:12px;color:#f5f8ff;padding:3px}
.next-atelier-heading{position:relative;padding:18px;border-radius:20px;border:1px solid #a6d6f064;background:radial-gradient(ellipse at top right,#6e468974,transparent 65%),linear-gradient(160deg,#242c4a,#141b30);overflow:hidden}
.next-atelier-heading:after{content:"✦";position:absolute;right:12px;bottom:-25px;font-size:130px;color:#c7c0ff13;pointer-events:none}
.next-atelier-heading .next-atelier-kicker{display:block;color:#9ffff2;font-size:9px;font-weight:900;letter-spacing:.2em}
.next-atelier-heading strong{display:block;margin-top:6px;font:900 26px 'Barlow Condensed',sans-serif;letter-spacing:.07em}
.next-atelier-heading p{position:relative;z-index:1;max-width:270px;color:#d0dae9;font-size:11px;line-height:1.6;margin:7px 0}
.next-atelier-grid{display:grid;grid-template-columns:1fr;gap:7px}
.next-atelier-grid label{font-size:10px;letter-spacing:.13em;color:#b6d7de;font-weight:850;margin-top:9px}
.next-atelier-grid select{min-width:0;width:100%;padding:12px 13px;min-height:45px;border-radius:12px;background:linear-gradient(125deg,#253655,#1c203c);color:#f8ffff;border:1px solid #9dbbc460;box-shadow:inset 0 1px #f8ffff18}
.next-atelier-tip{color:#b7cfdf;font-size:11px;line-height:1.7;padding:13px;border-left:2px solid #92f7e5;border-radius:3px;background:#80e0cf0d}
.next-atelier-apply{width:100%;min-height:51px;font-size:12px;letter-spacing:.08em}
.next-outfit-status{font-size:10px;color:#a4d8d2;text-align:center}
@media (orientation:landscape) and (max-height:540px){
 .next-atelier-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
 .next-atelier-grid label{align-self:end}
 .next-atelier-heading{padding:10px 15px}
 .next-atelier-heading strong{font-size:21px}
}

/* W07 — true player portrait with the existing game WebGL renderer. */
.next-avatar-portrait{border:1px solid #7debd561;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 50% 30%,#424063,#11182d 70%);box-shadow:inset 0 0 45px #8e78e518}
.next-portrait-frame{position:relative;height:clamp(235px,37vh,355px);display:flex;align-items:center;justify-content:center;overflow:hidden}
.next-portrait-frame img{height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 0 20px #a8e7d11f)}
.next-portrait-frame span{padding:24px;text-align:center;font-size:11px;line-height:1.6;color:#d9e4f8}
.next-portrait-controls{display:grid;grid-template-columns:46px minmax(0,1fr) 46px;align-items:center;text-align:center;gap:5px;background:#0e182ac9;padding:7px 12px}
.next-portrait-controls strong{color:#b6fbf1;font:800 10px 'DM Sans',sans-serif;letter-spacing:.095em}
.next-portrait-controls button{font-size:23px;border:1px solid #8be8db74;color:#c8fff9;background:#243956;border-radius:13px;min-height:43px}
.next-portrait-controls button:active{background:#42667f}
.next-atelier-apply:disabled{opacity:.5;cursor:progress}

/* W09: small always-readable chat HUD instead of opening a separate site. */
.room-chat-preview{position:absolute;z-index:17;top:calc(147px + var(--safe-top));left:calc(14px + var(--safe-left));width:min(308px,calc(100vw - 28px));max-height:132px;overflow:hidden;border:1px solid #80c9cb46;background:#06101cc4;color:#d9f2f8;border-radius:12px;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);box-shadow:0 10px 35px #0005;font-size:11px;pointer-events:auto}
.room-chat-preview .preview-open{display:flex;justify-content:space-between;align-items:center;width:100%;background:#103042aa;border:0;border-bottom:1px solid #ffffff15;color:#b4ffea;font-size:10px;font-weight:900;letter-spacing:.07em;padding:8px 10px;text-align:left}
.room-chat-preview .preview-open span{font-size:9px;color:#d0e3ed}
#chatPreviewLines{padding:7px 10px;min-height:30px;max-height:82px;overflow:hidden}
#chatPreviewLines p{margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#d1e0f0;font-size:10px;line-height:1.55}
#chatPreviewLines b{color:#93eddb}
.speech-layer{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden}
.speech-balloon{position:absolute;transform:translate(-50%,-100%);max-width:180px;background:#f2f5ffff;color:#131b31;border:2px solid #92e4dd;border-radius:13px 13px 13px 3px;padding:7px 11px;font-size:11px;line-height:1.3;font-weight:750;overflow-wrap:anywhere;box-shadow:0 5px 18px #000b}
@media(orientation:portrait) and (max-width:650px){
 .room-chat-preview{top:calc(128px + var(--safe-top));width:min(245px,65vw);max-height:97px}
 #chatPreviewLines{max-height:50px;padding:5px 8px}
 #chatPreviewLines p{font-size:9px}
}
@media(orientation:landscape) and (max-height:560px){
 .room-chat-preview{top:calc(65px + var(--safe-top));width:min(255px,37vw);max-height:100px}
 #chatPreviewLines{max-height:53px}
}
.inight-overlay:not(.social-split)~.room-chat-preview{pointer-events:none}
@media(prefers-reduced-motion:reduce){.speech-balloon{transition:none}}

/* W09: emoji speech animates only on creation; low-end devices avoid continuous work. */
.speech-balloon.emoji-bubble{animation:anw-chat-emoji .4s cubic-bezier(.2,1.4,.45,1)}
@keyframes anw-chat-emoji{0%{scale:.76}70%{scale:1.14}100%{scale:1}}
#chatPreviewLines{cursor:pointer}
@media(prefers-reduced-motion:reduce){.speech-balloon.emoji-bubble{animation:none}}

/* Social Night 3: compact room stream, bottom left, translucent and nonintrusive */
.room-chat-preview{top:auto!important;bottom:calc(14px + var(--safe-bottom))!important;left:calc(12px + var(--safe-left))!important;opacity:.75!important;background:#07111d88!important;border:1px solid #acb9d52a!important;box-shadow:0 8px 28px #00000024!important;max-height:104px!important;width:min(320px,35vw)!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important;transition:opacity .2s ease!important}
.room-chat-preview:hover,.room-chat-preview:focus-within{opacity:1!important;background:#07111de2!important}
.room-chat-preview .preview-open{background:#16243775!important;border-bottom:0!important;min-height:32px!important}
#chatPreviewLines{min-height:16px!important;max-height:57px!important}
#chatPreviewLines p{font-size:10px!important}
#game:has(.inight-overlay:not([hidden])) .room-chat-preview{opacity:0!important;pointer-events:none!important}
@media(pointer:coarse){.room-chat-preview{bottom:calc(13px + var(--safe-bottom))!important;width:min(230px,50vw)!important;max-height:78px!important;opacity:.64!important}}
@media(max-width:650px) and (orientation:portrait){.room-chat-preview{left:calc(10px + var(--safe-left))!important;bottom:calc(8px + var(--safe-bottom))!important;width:min(220px,62vw)!important}.room-chat-preview .preview-open{font-size:9px!important;padding:5px 7px!important}#chatPreviewLines{max-height:32px!important;padding:3px 7px!important}}
@media(max-height:560px) and (orientation:landscape){.room-chat-preview{width:min(200px,34vw)!important;bottom:calc(4px + var(--safe-bottom))!important;max-height:61px!important}#chatPreviewLines{max-height:22px!important}}

@media(max-width:650px) and (orientation:portrait){
 .room-chat-preview{left:50%!important;transform:translateX(-50%)!important;width:min(182px,48vw)!important;max-height:55px!important;bottom:calc(8px + var(--safe-bottom))!important}
 #chatPreviewLines{max-height:21px!important}
 #chatPreviewLines p:not(:first-child){display:none}
}

/* Protect thumb zones and the permanent iNight button: the feed preview cannot cover them. */
@media(max-width:650px) and (orientation:portrait){
 .room-chat-preview{left:calc(8px + var(--safe-left))!important;transform:none!important;width:min(110px,28vw)!important;max-height:53px!important;bottom:calc(8px + var(--safe-bottom))!important}
 .room-chat-preview .preview-open{font-size:9px!important;letter-spacing:0!important;min-height:27px!important}
 .room-chat-preview .preview-open span{display:none!important}
 #chatPreviewLines{padding:2px 7px!important;max-height:19px!important}
}
@media(pointer:coarse) and (orientation:landscape){
 .room-chat-preview{left:calc(9px + var(--safe-left))!important;transform:none!important;bottom:calc(137px + var(--safe-bottom))!important;width:min(185px,29vw)!important;max-height:68px!important}
}


/* P45: compact touch arcade grid; maintains camera surface and joystick zones. */
.pvp-toggle{font:800 10px 'DM Sans',sans-serif;letter-spacing:.05em;background:#111c2ddd;
 border:1px solid #e4a8d58a;border-radius:11px;padding:9px 12px;color:#e7e3ef;
 white-space:nowrap;min-height:38px}
.pvp-toggle[aria-pressed="true"]{background:#6c2054eb;color:#fff;border-color:#ffa0d2}
.touch-actions{display:grid!important;grid-template-columns:repeat(3,48px)!important;
 grid-template-rows:repeat(2,48px);gap:5px!important;right:calc(17px + var(--safe-right));
 bottom:calc(108px + var(--safe-bottom));pointer-events:auto}
.touch-actions button,.touch-actions .camera-b{width:48px!important;height:48px!important;
 font-size:19px!important;border-radius:14px}
.touch-actions .combat-b{background:#171e37df;border-color:#f18dcdab}
.touch-actions .jump-b{background:#13423fd9;border-color:#8af5e6}
.touch-actions button:active{transform:scale(.95)}
@media(max-width:640px){
 .pvp-toggle{font-size:8px;min-height:32px;padding:5px 7px;border-radius:8px}
 .touch-actions{bottom:calc(112px + var(--safe-bottom));right:11px}
 .touch-actions button,.touch-actions .camera-b{width:44px!important;height:44px!important}
}
@media(max-height:450px) and (orientation:landscape){
 .touch-actions{left:auto;right:calc(215px + var(--safe-right))!important;
 bottom:calc(13px + var(--safe-bottom))!important;
 grid-template-columns:repeat(3,40px)!important;grid-template-rows:repeat(2,40px)}
 .touch-actions button,.touch-actions .camera-b{width:40px!important;height:40px!important;font-size:15px!important}
}

/* P45 on-demand HP; omitted when combat is inactive. */
.combat-status{position:absolute;top:calc(142px + var(--safe-top));right:calc(17px + var(--safe-right));
 z-index:10;background:#111d2de8;color:#ffd4e6;border:1px solid #ed7aae88;border-radius:10px;
 font:700 12px 'DM Sans',sans-serif;letter-spacing:.045em;padding:8px 11px;pointer-events:none}
.combat-status[hidden]{display:none}
.combat-status span:first-child{font-size:15px;color:#fff}
.combat-status span:last-child{margin-left:8px;color:#a5f8e5;font-size:10px}
@media(max-width:640px){.combat-status{top:calc(104px + var(--safe-top));right:12px;font-size:10px}}


/* W27 ORFEU PLAY — one beautiful mixer, no engineer dashboard or deck A/B. */
.dj-party{display:grid;gap:13px;max-width:520px;margin:auto;color:#e5eef8;font-family:inherit}
.dj-party-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.dj-signal{color:#8bffea;font-weight:950;letter-spacing:.1em;font-size:15px}
.dj-roomtag{font-size:10px;letter-spacing:.08em;color:#f4b3de;font-weight:750}
.dj-party-console{position:relative;display:grid;grid-template-columns:1fr .78fr 1fr;align-items:center;gap:11px;background:linear-gradient(145deg,#263345,#111825 52%,#1e122f);border:1px solid #aacbe94f;border-bottom:5px solid #0009;box-shadow:0 17px 32px #0008,inset 0 2px 5px #c5effa16;border-radius:19px;min-height:133px;padding:12px;overflow:hidden}
.dj-party-console::after{content:'';position:absolute;inset:3px;pointer-events:none;border:1px solid #e5c6e51a;border-radius:15px}
.dj-console-platter{width:min(100%,110px);aspect-ratio:1;margin:auto;display:grid;place-items:center;border-radius:50%;border:6px solid #2f3c4d;background:radial-gradient(circle at 45% 35%,#afedf4,#273e50 21%,#1b2635 23%,#060c15 61%,#829faf 64%,#171721 68%);box-shadow:0 0 18px #64dce64a,inset 0 2px 8px #000c}
.dj-console-platter.plum{box-shadow:0 0 18px #eb7bc55b,inset 0 2px 8px #000c;border-color:#413747}
.dj-console-platter span{color:#8ffff0;font-size:25px;text-shadow:0 0 14px #70f6e8}
.dj-console-platter.plum span{color:#ffc0ed}
.dj-console-knobs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;align-items:center}
.dj-console-knobs i{display:block;width:15px;max-width:100%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 25% 25%,#e4f0f8,#4b6571 48%,#0b101b 52%);box-shadow:0 1px 2px #000a}
.dj-console-wave{grid-column:1/-1;display:flex;align-items:center;justify-content:space-around;gap:3px;height:48px;border-radius:8px;background:#070e1a;padding:6px}
.dj-console-wave span{width:9%;border-radius:6px;background:linear-gradient(#6afae3,#e76bb9);height:38%}
.dj-console-wave span:nth-child(3n){height:85%}.dj-console-wave span:nth-child(2n){height:63%}
.dj-party-now{display:grid;gap:5px;text-align:center;background:linear-gradient(150deg,#111e30,#21172a);padding:12px;border:1px solid #b885d335;border-radius:14px}
.dj-party-now small{color:#9ec3d2;font-weight:800;letter-spacing:.1em}
.dj-party-now strong{font-size:clamp(18px,5vw,25px);line-height:1.2;color:#fff;overflow-wrap:anywhere}
.dj-party-now p{color:#cbbcd8;margin:0;font-size:12px}
.dj-party-hint{text-align:center;font-size:12px;color:#d6e0eb;margin:0}
.dj-party-main{width:100%;background:linear-gradient(100deg,#71ffe5,#ac85ec)!important;color:#0b1625!important;border:0!important;border-radius:13px!important;font-weight:900!important;padding:14px!important}
.dj-party-main:disabled{opacity:.55;cursor:not-allowed}
.dj-party-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.dj-party-actions button{background:linear-gradient(145deg,#263246,#161c2a);border:1px solid #88b6c753;border-radius:16px;color:#f6f9ff;min-height:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:29px;cursor:pointer;touch-action:manipulation;transition:transform .12s ease,box-shadow .15s ease}
.dj-party-actions button span{font-size:12px;letter-spacing:.04em;font-weight:900}
.dj-party-actions button[aria-pressed="true"]{border-color:#a6fce8;background:linear-gradient(145deg,#254b50,#253145);box-shadow:0 0 17px #78f8e142}
.dj-party-actions button:active{transform:scale(.96)}
.dj-boop{animation:dj-boop .27s ease}@keyframes dj-boop{50%{box-shadow:0 0 22px #9cfce88c;transform:scale(1.03)}}
.dj-party-exit{padding:11px 8px;border:1px solid #d4bfd34f;border-radius:12px;color:#cdddea;background:#1d2231}
.dj-listener{display:grid;gap:8px;padding:12px;border:1px solid #d5c9ee30;background:#181b29;border-radius:14px}
.dj-listener>span{font-size:12px;font-weight:850}
.dj-listener input[type=range]{width:100%;accent-color:#86ffea}
.dj-listener button{background:#23283a;color:#dbeafa;border:1px solid #bfd9ee44;border-radius:10px;padding:9px;font-size:12px}
.dj-party-caption{color:#b6c5d4;font-size:11px;line-height:1.6;text-align:center;margin:0}
@media(prefers-reduced-motion:reduce){.dj-boop{animation:none}.dj-party-actions button{transition:none}}

/* W28 VRM diagnostics: do not hide a broken character behind a nameplate. */
.anw-avatar-error{position:fixed;z-index:145;left:max(12px,env(safe-area-inset-left));bottom:max(80px,env(safe-area-inset-bottom));max-width:min(430px,calc(100vw - 24px));padding:12px 16px;border:1px solid #ec9d84;border-radius:12px;background:rgba(34,15,25,.96);box-shadow:0 10px 40px #0009;color:#ffdfd9;font:650 12px/1.6 system-ui;overflow-wrap:anywhere;pointer-events:none}
.anw-avatar-error[hidden]{display:none!important}