*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:Pretendard,-apple-system,Apple SD Gothic Neo,Noto Sans KR,sans-serif;background:#16161c;color:#eaeaf0;overflow:hidden}.app{position:relative;width:100%;height:100%}canvas{display:block}.loading{color:#aaa;font-size:14px;white-space:nowrap;background:#00000080;padding:8px 14px;border-radius:8px}.flash-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .35s ease-out}.flash-overlay.on{opacity:.9;transition:opacity .02s}.panel{position:absolute;top:16px;left:16px;width:264px;max-height:calc(100% - 32px);overflow-y:auto;background:#16161ed1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px;-webkit-user-select:none;user-select:none}.panel-right{left:auto;right:16px;width:276px}.panel h1{font-size:17px;font-weight:700;letter-spacing:-.02em}.panel .sub{font-size:11px;color:#9a9aa8;margin:3px 0 14px}.group{margin-bottom:13px}.group label{display:flex;justify-content:space-between;font-size:12px;color:#c6c6d2;margin-bottom:6px}.group label span{color:#8b8b9a;font-variant-numeric:tabular-nums}.group.row{display:flex;gap:8px}input[type=range]{width:100%;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#33333f;border-radius:2px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#7c8cf8;cursor:pointer;border:2px solid #fff2}.pose-group{margin-bottom:8px}.pose-group-name{font-size:10.5px;font-weight:700;letter-spacing:.06em;color:#8b8b9a;text-transform:uppercase;margin:2px 0 4px}.pose-group-hint{text-transform:none;font-weight:400;color:#62626f;letter-spacing:0}.pose-tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.pose-tab{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;font-size:11px;cursor:pointer;color:#a7a7b4;background:#ffffff0d;border:1px solid rgba(255,255,255,.09);border-radius:8px}.pose-tab svg{flex-shrink:0}.pose-tab.active{color:#fff;background:#7c8cf82e;border-color:#7c8cf88c}.pose-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.cam-grid{grid-template-columns:repeat(4,1fr)}.pose-btn.hint{border-color:#c8a06a99;color:#e8cfa4}.mini-toggle{padding:3px 9px;font-size:10.5px;border-radius:6px;cursor:pointer;background:#2a2a35;color:#9a9aa8;border:1px solid rgba(255,255,255,.08)}.mini-toggle.on{background:#3d4470;color:#dfe4ff;border-color:#7c8cf8aa}.light-item{border:1px solid rgba(255,255,255,.07);border-radius:9px;margin-bottom:6px;overflow:hidden}.light-item.open{border-color:#7c8cf866}.light-head{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;background:#22222c}.light-name{display:flex;align-items:center;gap:8px;border:none;background:none;color:#d5d5e0;font-size:12px;cursor:pointer;padding:2px 0}.light-dot{width:9px;height:9px;border-radius:50%}.light-body{padding:8px 10px 6px;background:#1b1b23}.pd-axis{display:grid;grid-template-columns:52px 1fr 42px;align-items:center;gap:7px;margin-bottom:5px}.axis-name{font-size:10.5px;color:#8b8b9a}.axis-val{font-size:10.5px;color:#c6c6d2;text-align:right;font-variant-numeric:tabular-nums}.pose-btn{padding:6px 2px;font-size:11px;border-radius:7px;cursor:pointer;background:#2a2a35;color:#b8b8c6;border:1px solid rgba(255,255,255,.07);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pose-btn:hover{background:#333342}.pose-btn.active{background:#3d4470;color:#dfe4ff;border-color:#7c8cf8aa}.pose-note{font-size:10.5px;color:#77778a;margin-top:6px}.pose-note a{color:#9aa6f8}.swatches{display:flex;gap:6px;align-items:center}.swatch{width:24px;height:24px;border-radius:50%;cursor:pointer;border:2px solid transparent;outline:1px solid rgba(255,255,255,.15)}.swatch.active{border-color:#7c8cf8}input[type=color]{width:26px;height:26px;border:none;background:none;cursor:pointer}.toggle{flex:1;padding:8px 0;font-size:12px;border-radius:8px;cursor:pointer;background:#2a2a35;color:#b8b8c6;border:1px solid rgba(255,255,255,.07)}.toggle.on{background:#3d4470;color:#dfe4ff;border-color:#7c8cf8aa}.shoot{width:100%;padding:12px 0;margin-top:4px;font-size:15px;font-weight:700;letter-spacing:.02em;background:linear-gradient(135deg,#7c8cf8,#5f6ee8);color:#fff;border:none;border-radius:10px;cursor:pointer;transition:transform .08s}.shoot:active{transform:scale(.97)}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:#0a0a0e8c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center}.modal-backdrop.modal-left{justify-content:flex-start;padding-left:312px;background:#0a0a0e40;-webkit-backdrop-filter:none;backdrop-filter:none}.modal{width:380px;max-height:80%;display:flex;flex-direction:column;background:#181820f7;border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 18px 60px #0000008c}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px}.modal-head h2{font-size:15px;font-weight:700}.modal-close{border:none;background:none;color:#8b8b9a;font-size:20px;cursor:pointer;line-height:1}.modal-close:hover{color:#fff}.modal-body{padding:4px 18px;overflow-y:auto}.modal-foot{display:flex;gap:8px;padding:12px 18px 16px;border-top:1px solid rgba(255,255,255,.07)}.gaze-pad{position:relative;width:128px;height:128px;margin:8px auto 4px;border-radius:50%;cursor:crosshair;touch-action:none;background:radial-gradient(circle,#ffffff12,#ffffff08 70%);border:1px solid rgba(255,255,255,.14)}.gaze-pad.active{border-color:#7c8cf899}.gaze-pad-cross:before,.gaze-pad-cross:after{content:"";position:absolute;background:#ffffff1a}.gaze-pad-cross:before{left:50%;top:6%;bottom:6%;width:1px}.gaze-pad-cross:after{top:50%;left:6%;right:6%;height:1px}.gaze-pad-dot{position:absolute;width:14px;height:14px;border-radius:50%;background:#8fa0ff;border:2px solid #c9d2ff;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 8px #7c8cf8b3}.gaze-pad-label{position:absolute;font-size:9px;color:#63637a;pointer-events:none}.gaze-pad-label.t{top:3px;left:50%;transform:translate(-50%)}.gaze-pad-label.b{bottom:3px;left:50%;transform:translate(-50%)}.gaze-pad-label.l{left:5px;top:50%;transform:translateY(-50%)}.gaze-pad-label.r{right:5px;top:50%;transform:translateY(-50%)}.gallery-modal{width:560px}.gallery-hover-preview{position:absolute;left:28px;top:50%;transform:translateY(-50%);width:min(52vw,920px);pointer-events:none;z-index:30;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.2);box-shadow:0 20px 70px #000000a6;background:#101014;animation:hoverPreviewIn .12s ease-out}.gallery-hover-preview img{width:100%;display:block}.gallery-hover-cap{padding:8px 12px;font-size:12px;color:#c9c9d4;border-top:1px solid rgba(255,255,255,.08)}@keyframes hoverPreviewIn{0%{opacity:0;transform:translateY(-50%) scale(.96)}to{opacity:1;transform:translateY(-50%) scale(1)}}.gallery-tabs{display:flex;gap:6px;padding:0 18px 8px}.gallery-tabs button{flex:1;padding:6px 0;font-size:12px;cursor:pointer;color:#a7a7b4;background:#ffffff0d;border:1px solid rgba(255,255,255,.09);border-radius:8px}.gallery-tabs button.active{color:#fff;background:#7c8cf82e;border-color:#7c8cf88c}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;grid-auto-rows:max-content;align-content:start;padding-bottom:12px}.gallery-item{border:1px solid rgba(255,255,255,.1);border-radius:10px;overflow:hidden;background:#ffffff08;display:flex;flex-direction:column}.gallery-item img{width:100%;display:block;cursor:pointer;aspect-ratio:4 / 3;object-fit:cover;transition:transform .12s}.gallery-item img:hover{transform:scale(1.045)}.gallery-item-bar{display:flex;align-items:center;gap:6px;padding:4px 8px}.gallery-name-row{display:flex;align-items:center;gap:6px;padding:6px 8px 0}.gallery-name{font-size:12px;color:#dcdce6;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gallery-name.editable{cursor:text}.gallery-name.editable:hover{color:#fff;text-decoration:underline dotted rgba(255,255,255,.4)}.gallery-name-input{flex:1;min-width:0;font-size:12px;color:#fff;background:#ffffff12;border:1px solid rgba(124,140,248,.55);border-radius:6px;padding:3px 6px;outline:none}.pub-chip{font-size:9.5px;color:#7ce0a3;border:1px solid rgba(124,224,163,.4);padding:1px 6px;border-radius:20px;white-space:nowrap}.owner-chip{font-size:9.5px;color:#9aa6f8;border:1px solid rgba(124,140,248,.35);padding:1px 6px;border-radius:20px;white-space:nowrap}.scope-btn{border:1px solid rgba(255,255,255,.14);background:none;cursor:pointer;font-size:10px;color:#8d8d9c;padding:1px 7px;border-radius:20px}.scope-btn:hover{color:#d5d5e0}.scope-btn.pub{color:#7ce0a3;border-color:#7ce0a366}.fav-btn{border:none;background:none;cursor:pointer;font-size:15px;line-height:1;color:#6d6d7c;padding:2px}.fav-btn.on,.fav-btn:hover{color:#f4c542}.gallery-time{font-size:10.5px;color:#77778a;flex:1}.gallery-dl{font-size:12px;color:#9aa6f8;text-decoration:none}.gallery-del{border:none;background:none;cursor:pointer;font-size:12px;color:#6d6d7c;padding:2px}.gallery-del:hover{color:#e07a7a}.toggle.ic,.pose-btn.ic,.shoot.ic{display:inline-flex;align-items:center;justify-content:center;gap:6px}.toggle.ic svg,.pose-btn.ic svg,.shoot.ic svg{flex-shrink:0;opacity:.9}.light-compact{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.light-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 9px;font-size:11.5px;color:#a7a7b4;text-align:left;cursor:pointer;background:#ffffff0a;border:1px solid rgba(255,255,255,.09);border-radius:8px}.light-chip:hover{border-color:#ffffff38}.light-chip.on{color:#e8e8f2;border-color:#7c8cf866}.help-modal{width:min(560px,92vw)}.help-body h3{font-size:12px;color:#9aa6f8;margin:12px 0 6px;letter-spacing:.02em}.help-body h3:first-child{margin-top:0}.help-body ul{margin:0 0 4px;padding-left:18px;display:grid;gap:4px}.help-body li{font-size:12px;color:#c2c2ce;line-height:1.55}.help-body b{color:#e8e8f2}.shot-preview{width:100%;display:block;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:#0d0d11}.photos{position:absolute;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px}.photos img{width:168px;border-radius:8px;display:block;border:1px solid rgba(255,255,255,.18);box-shadow:0 4px 16px #00000080;transition:transform .12s}.photos img:hover{transform:scale(1.04)}
