:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-synthesis:none;background:#101412;color:#eef2ef;--muted:#b3beb6;--green:#b3edc8;--red:#f0a195}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}button,input{font:inherit}button{border:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:3px}button:disabled{cursor:default;opacity:.48}button:active:not(:disabled){filter:brightness(.9)}[hidden]{display:none!important}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex:none}
.app,.login{height:100vh;height:100svh;height:100dvh}.app{display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);overflow:hidden}.header{height:48px;flex:none;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.top-actions{display:flex;align-items:center;gap:4px;min-width:0}.localcamera,.exit{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;min-width:44px;padding:0 9px;background:transparent;color:#cbd6ce;font-size:12px;white-space:nowrap}.localcamera .icon{width:17px;height:17px;color:var(--green)}.exit{color:#a8b7ad;font-size:11px;padding:0 7px}.exit .icon{width:15px;height:15px}.status{display:flex;align-items:center;gap:8px;flex:none;font-size:11px;color:#b3bfb7;white-space:nowrap;padding-right:7px}.network{width:6px;height:6px;background:#e99084;border-radius:50%;flex:none}.network[data-state="orange"]{background:#edc08a}.network[data-state="green"]{background:#8ee0ab}
.camera{flex:1;min-height:0;display:flex;flex-direction:column;background:#000}.stage{flex:1;min-height:0;position:relative;overflow:hidden;background:#000;isolation:isolate}.video,.transition-frame{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;border:0;transition:none!important}.video{opacity:0}.video[data-ready="true"]{opacity:1}.video[data-mirrored="true"],.transition-frame[data-mirrored="true"]{transform:scaleX(-1)}.transition-frame{z-index:1;pointer-events:none}.toast{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);padding:10px 14px;background:#14211bf5;border:1px solid #a8c8b32e;border-radius:9px;color:#e8f1eb;font-size:12px;line-height:1.6;z-index:3;text-align:center;pointer-events:none}
.controls{flex:none;display:grid;grid-template-columns:minmax(58px,1fr) minmax(118px,158px) minmax(58px,1fr);align-items:center;column-gap:14px;min-height:80px;padding:10px 18px calc(10px + env(safe-area-inset-bottom));background:#101412}.side-control{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px;min-height:56px;max-width:100%;justify-self:center;padding:3px 5px;background:transparent;color:#bdc8c0;font-size:10px}.icon-box{width:36px;height:29px;display:grid;place-items:center;border-radius:5px;overflow:hidden}.icon-box .icon{width:22px;height:22px}.garment-thumb{width:100%;height:100%;object-fit:contain;background:#e8e7df}.main-wrap{min-width:0}.main-control{min-height:50px;width:100%;border-radius:13px;display:flex;align-items:center;justify-content:center;gap:10px;padding:0 12px;font-size:16px;font-weight:650;letter-spacing:2px;color:#183f27;background:var(--green);transition:background .16s}.main-control[data-running="true"]{background:var(--red);color:#50241e}.main-control[data-ending="true"]{background:#d9c6a8;color:#4a3921}.main-control .icon{width:17px;height:17px;fill:currentColor;stroke:none}
.login{display:grid;place-items:center;padding:24px max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));overflow:auto;background:#101412}.login-panel{width:min(100%,300px);padding:16px 0}.password{display:block;width:100%;height:52px;border:1px solid #3e5044;background:#1b251f;border-radius:11px;color:#edf2ef;padding:0 16px;font-size:16px;line-height:1.5;letter-spacing:2px;appearance:none;-webkit-appearance:none}.password::placeholder{color:#8b9c90;letter-spacing:1px}.enter{min-height:52px;width:100%;margin-top:14px;border-radius:11px;background:var(--green);color:#183f27;font-size:15px;font-weight:600;letter-spacing:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:760px){.header{padding:0 22px}.controls{grid-template-columns:72px 158px 72px;justify-content:center;gap:40px;min-height:84px}}
@media(max-width:360px){.header{padding:0 6px;gap:4px}.localcamera{font-size:11px;padding:0 7px;gap:6px}.exit{padding:0 6px}.status{font-size:10px;gap:6px;padding-right:5px}.controls{padding-left:10px;padding-right:10px;column-gap:8px}.main-control{font-size:15px}}
@media(max-height:500px){.header{height:44px;padding:0 10px}.controls{min-height:60px;padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom));grid-template-columns:80px 140px 80px;justify-content:center;gap:24px}.side-control{flex-direction:row;min-height:44px;min-width:68px;gap:5px}.icon-box{width:25px;height:28px}.main-control{min-height:44px;border-radius:10px}}
@media(max-width:380px) and (max-height:500px){.controls{grid-template-columns:60px minmax(118px,140px) 60px;gap:10px}.side-control{flex-direction:column;gap:1px;font-size:9px;min-width:60px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.remote-video{z-index:1;transform:none!important;pointer-events:none}.transition-frame{z-index:2}#login-error{font-size:12px;color:#f0a195;line-height:1.5}#login-error:empty{display:none}