:root{color-scheme:dark;font-family:Inter,system-ui,"Pretendard",sans-serif;background:#050916;color:#eaf6ff}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(circle at 50% 0,#193753,#07101f 55%,#040711)}.shell{width:min(100%,920px);min-height:100dvh;margin:auto;padding:max(12px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom))}header{height:64px;display:flex;align-items:center;justify-content:space-between}header div{display:flex;flex-direction:column;letter-spacing:.14em}header strong{font-size:18px}header small{font-size:8px;color:#6f86a2;margin-top:3px}header span,.badge{font-size:10px;color:#6ef0c1;border:1px solid #2a4860;background:#081426cc;padding:8px 11px;border-radius:999px}.viewport{height:calc(100dvh - 190px);min-height:500px;position:relative;overflow:hidden;border:1px solid #263a55;border-radius:20px;background:radial-gradient(circle at 50% 35%,#244b68,#0b192c 52%,#050b16);box-shadow:0 24px 80px #0008}#vrmCanvas{display:block;width:100%;height:100%}#camera{position:absolute;right:12px;top:12px;width:112px;aspect-ratio:3/4;object-fit:cover;transform:scaleX(-1);border:1px solid #3a526e;border-radius:12px;background:#050812;display:none}.badge{position:absolute;left:12px;top:12px;color:#7de5ff}.signals{position:absolute;left:12px;right:12px;bottom:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.signals span{padding:8px;border-radius:9px;background:#071221d9;border:1px solid #23364e;color:#7087a2;font-size:7px}.signals b{display:block;color:#eaf6ff;font-size:10px;margin-top:3px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.controls button{height:48px;border:1px solid #37c9eb;border-radius:12px;background:linear-gradient(135deg,#138bae,#17627d);color:#fff;font-weight:700}.controls button.secondary{background:#101c30;border-color:#334a66}.help{text-align:center;color:#72849b;font-size:9px;margin:10px 4px 0;line-height:1.6}@media(max-width:560px){.shell{padding-left:8px;padding-right:8px}.viewport{height:calc(100dvh - 185px);min-height:460px;border-radius:16px}.signals{grid-template-columns:1fr 1fr}.signals span{padding:6px}#camera{width:88px}}

/* Secure media controls: the raw camera element never becomes visible. */
#camera{display:none!important;width:1px!important;height:1px!important;position:fixed!important;left:-10000px!important;opacity:0!important;pointer-events:none!important}
.security{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:10px 12px;border:1px solid #23664f;border-radius:12px;background:#08231bcc}.security strong{font-size:11px;color:#66efb9}.security span{font-size:8px;color:#7d9a91}.security.fail{border-color:#a63846;background:#2a0c13}.security.fail strong{color:#ff7182}
.controls{margin-top:8px}.controls button.record{background:linear-gradient(135deg,#a71e3a,#721a32);border-color:#ec4163}.controls button.active{box-shadow:0 0 0 2px #5be8ff55 inset}.record-options{display:flex;align-items:center;justify-content:space-between;margin-top:8px;color:#7f91aa;font-size:9px}.record-options input{accent-color:#38d3f5}#recordState{font-variant-numeric:tabular-nums;color:#eaf6ff}#downloadLink{display:block;margin-top:8px;text-align:center;padding:10px;border-radius:10px;background:#10263a;color:#65dcff;font-size:10px;text-decoration:none}
.avatar-library{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;margin-top:8px}.avatar-library select,.avatar-library button{height:42px;border:1px solid #334a66;border-radius:10px;background:#0c192b;color:#eaf6ff;padding:0 11px;font:inherit;font-size:10px}.avatar-library select{min-width:0}.avatar-library button{border-color:#2b91ad;color:#75e6ff;font-weight:700}.avatar-library button.danger{border-color:#653443;color:#e88b9c}.avatar-library button:disabled{opacity:.35}.library-state{margin:6px 4px 0;color:#70849d;font-size:8px;line-height:1.5}.library-state.error{color:#ff8191}.library-state.ok{color:#66efb9}@media(max-width:560px){.avatar-library{grid-template-columns:minmax(0,1fr) auto}.avatar-library .danger{grid-column:2}.avatar-library select{grid-row:1/3;height:91px}}