:root{--overlay-control-size:2rem;color:#f4f7fb;font-synthesis:none;text-rendering:optimizelegibility;background:#10151d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;min-width:320px;height:100%;min-height:100%;margin:0;overflow:hidden}body{overscroll-behavior:none;min-height:100dvh}.workspace{background:#10151d;width:100%;height:100dvh}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.viewport{background:radial-gradient(circle at 50% 42%,#263242 0%,#151c26 48%,#0c1118 100%);width:100%;height:100%;position:relative}canvas{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}canvas:active{cursor:grabbing}.app-menu-anchor{z-index:1;top:max(1rem, env(safe-area-inset-top));left:max(1rem, env(safe-area-inset-left));justify-items:start;gap:.5rem;display:grid;position:absolute}.app-menu-toggle{cursor:pointer;touch-action:manipulation;background:0 0;border:1px solid #0000;border-radius:.65rem;padding:.35rem .45rem;display:block}.app-menu-toggle:hover,.app-menu-toggle[aria-expanded=true]{background:#0b1017b8;border-color:#52657b}.app-menu-toggle:focus-visible,.mode-button:focus-visible{outline-offset:2px;outline:2px solid #8ec5ff}.wordmark{pointer-events:none;-webkit-user-select:none;user-select:none;width:clamp(9rem,18vw,14rem);height:auto;display:block}.app-menu{width:min(17rem, calc(100vw - max(2rem, env(safe-area-inset-left) + env(safe-area-inset-right))));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b1017e0;border:1px solid #334155;border-radius:.8rem;padding:.55rem;box-shadow:0 .8rem 2rem #00000047}.app-menu[hidden]{display:none}.app-menu-section{gap:.35rem;display:grid}.app-menu-heading{color:#9bacc0;letter-spacing:.08em;margin:0;padding:.25rem .4rem;font-size:.7rem;font-weight:700}.app-menu-items{gap:.2rem;display:grid}.mode-button{color:#c8d4e3;min-height:2.75rem;font:inherit;text-align:left;cursor:pointer;touch-action:manipulation;background:0 0;border:1px solid #0000;border-radius:.55rem;grid-template-columns:1fr auto;align-items:center;padding:.55rem .65rem;display:grid}.mode-button:hover:not(:disabled){background:#2c394b8c;border-color:#3d4d61}.mode-button:disabled{color:#78889a;cursor:not-allowed}.mode-button[aria-pressed=true]{color:#f4f7fb;background:#334c68b8;border-color:#6385aa}.mode-button-name{font-size:.85rem;font-weight:650}.mode-button-label{align-items:baseline;gap:.55rem;display:inline-flex}.mode-button-korean{color:#9bacc0;font-size:.75rem}.mode-button[aria-pressed=true] .mode-button-korean{color:#c8d4e3}.mode-button-status{color:#8e9daf;white-space:nowrap;border:1px solid #3d4d61;border-radius:999px;padding:.15rem .35rem;font-size:.65rem;font-weight:700}.controls{right:max(1rem, env(safe-area-inset-right));bottom:max(1rem, env(safe-area-inset-bottom));color:#9bacc0;pointer-events:none;white-space:nowrap;margin:0;font-size:.75rem;position:absolute}.viewport-actions{left:max(1rem, env(safe-area-inset-left));bottom:max(1rem, env(safe-area-inset-bottom));align-items:center;gap:.5rem;display:flex;position:absolute}.status{height:var(--overlay-control-size);color:#c8d4e3;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0b1017b8;border:1px solid #334155;border-radius:999px;align-items:center;margin:0;padding:.45rem .7rem;font-size:.75rem;display:inline-flex}.fullscreen-toggle{width:var(--overlay-control-size);height:var(--overlay-control-size);color:#c8d4e3;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);touch-action:manipulation;background:#0b1017b8;border:1px solid #334155;border-radius:.65rem;place-items:center;padding:.38rem;display:inline-grid}.fullscreen-toggle:hover{color:#f4f7fb;background:#19222fd1;border-color:#52657b}.fullscreen-toggle:focus-visible{outline-offset:2px;outline:2px solid #8ec5ff}.fullscreen-toggle:active{transform:scale(.94)}.fullscreen-toggle svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:100%;height:100%}.status--ready:before{content:"";background:#65d7a4;border-radius:50%;width:.45rem;height:.45rem;margin-right:.45rem;display:inline-block}.status--error{color:#ffd2d2;border-color:#7f3f49}.facial-panel-layer{z-index:4;top:max(1rem, env(safe-area-inset-top));right:max(1rem, env(safe-area-inset-right));pointer-events:none;width:min(19rem,100vw - 2rem);position:absolute}.facial-panel{pointer-events:auto;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b1017e0;border:1px solid #3d4d61;border-radius:.85rem;gap:.75rem;max-height:calc(100dvh - 6rem);padding:.9rem;display:grid;overflow:auto;box-shadow:0 .8rem 2rem #00000047}.facial-panel h2{margin:0;font-size:.9rem}.facial-panel button,.facial-panel input{color:#e5edf7;min-height:2.35rem;font:inherit;background:#19222feb;border:1px solid #52657b;border-radius:.5rem}.facial-panel button{cursor:pointer;padding:.45rem .65rem}.facial-panel input{min-width:0;padding:.4rem .55rem}.facial-panel button:hover,.facial-panel button[aria-pressed=true]{background:#334c68e0;border-color:#8ec5ff}.facial-panel button:focus-visible,.facial-panel input:focus-visible,.vertex-gizmo__handle:focus-visible{outline-offset:2px;outline:2px solid #8ec5ff}.facial-mesh-list{gap:.45rem;display:grid}.facial-mesh-row{grid-template-columns:minmax(0,1fr);gap:.35rem;display:grid}.viewport-overlay{z-index:3;pointer-events:none;position:absolute;inset:0;overflow:hidden}.vertex-gizmo{pointer-events:none;width:0;height:0;position:absolute;top:0;left:0}.vertex-gizmo[hidden]{display:none}.vertex-gizmo__handle{color:#f4f7fb;cursor:grab;pointer-events:auto;touch-action:none;background:#182230;border:2px solid;border-radius:50%;place-items:center;width:2rem;height:2rem;padding:0;font:700 .7rem/1 sans-serif;display:grid;position:absolute;transform:translate(-50%,-50%);box-shadow:0 .25rem .7rem #00000073}.vertex-gizmo__handle:active{cursor:grabbing}.vertex-gizmo__handle--x{color:#ff6978;left:2.3rem}.vertex-gizmo__handle--y{color:#65d7a4;top:-2.3rem}.vertex-gizmo__handle--z{color:#6eb7ff;top:-1.75rem;left:1.75rem}@media (max-width:520px){.controls{display:none}.facial-panel-layer{top:auto;right:.75rem;bottom:calc(max(3.75rem, env(safe-area-inset-bottom) + 3.25rem));width:auto;left:.75rem}.facial-panel{max-height:min(44dvh,24rem)}}
