.app{color:#eee;background:#16171a;width:100vw;height:100vh;font-family:Pretendard,-apple-system,Malgun Gothic,sans-serif;display:flex}html,body,#root{overscroll-behavior:none;width:100%;height:100%;overflow:hidden}.sidebar{box-sizing:border-box;background:#1e1f24;border-right:1px solid #2c2d33;flex-direction:column;flex-shrink:0;gap:16px;width:320px;padding:24px 20px;display:flex;overflow-y:auto}.sidebar h1{margin:0;font-size:18px}.subtitle{color:#9a9ba3;margin:-8px 0 0;font-size:13px}.layout-switch{background:#26272d;border-radius:8px;flex-direction:column;gap:8px;padding:14px;display:flex}.layout-switch-label{font-size:13px;font-weight:600}.layout-switch-row{gap:6px;display:flex}.layout-switch-option{color:#9a9ba3;background:#1e1f24;border:1px solid #3a3b42;flex:1;padding:8px 6px;font-size:12px}.layout-switch-option.is-active{color:#eee;background:#2b3350;border-color:#5b8def}.layout-switch-hint{color:#6c6d76;font-size:11px}.seat-picker-launch{z-index:5;color:#fff;background:linear-gradient(#5b8def,#3f6fd0);border:1px solid #7ba2f5;border-radius:10px;align-items:center;gap:8px;padding:10px 16px;font-size:13px;font-weight:700;display:flex;position:absolute;top:16px;right:16px;box-shadow:0 6px 18px #14285a8c,inset 0 1px #ffffff38}.seat-picker-launch:hover{background:linear-gradient(#6d9bf5,#4a7ade);border-color:#9dbcff}.seat-picker-launch:active{transform:translateY(1px);box-shadow:0 2px 8px #14285a80,inset 0 1px #ffffff2e}.seat-picker-launch svg{fill:currentColor;opacity:.92;flex-shrink:0;width:15px;height:15px}.seat-picker-overlay{z-index:20;box-sizing:border-box;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);touch-action:auto;background:#05070cc2;place-items:center;padding:24px;display:grid;position:absolute;inset:0}.seat-picker{background:#202229;border:1px solid #464a57;border-radius:14px;width:fit-content;max-width:min(1050px,100%);max-height:100%;overflow:auto;box-shadow:0 24px 80px #0000008c}.seat-picker-header{justify-content:space-between;align-items:flex-start;gap:20px;padding:18px 20px 12px;display:flex}.seat-picker-header h2,.seat-picker-header p{margin:0}.seat-picker-header h2{font-size:18px}.seat-picker-header p{color:#9296a2;margin-top:4px;font-size:12px}.seat-picker-header>button{color:#fff;background:#30333d;width:34px;height:34px;padding:0;font-size:23px;line-height:1}.seat-overview-scroll{--plan-height:min(70vh, 720px);max-height:var(--plan-height);background:#181a20;border:1px solid #3b3f49;border-radius:8px;width:fit-content;max-width:calc(100% - 40px);margin:0 auto;overflow:auto}.seat-overview{width:calc(var(--plan-height) * var(--venue-aspect));max-width:100%;aspect-ratio:var(--venue-aspect);background:#202229;margin:0 auto;position:relative;overflow:hidden}.seat-overview-stage,.seat-overview-deck{box-sizing:border-box;pointer-events:none;background:#41444d;border:1px solid #858a94;position:absolute}.seat-overview-stage{color:#e4e5e8;letter-spacing:.12em;place-items:center;font-size:9px;font-weight:800;display:grid}.seat-overview-deck{background:#343741}.seat-overview-section-label{z-index:2;color:#ffffffe0;pointer-events:none;font-size:11px;font-weight:800;line-height:1;position:absolute;transform:translate(-50%,-100%)}.seat-overview-cell{--section-color:#5b8def;z-index:1;border:1px solid color-mix(in srgb, var(--section-color) 60%, white);background:color-mix(in srgb, var(--section-color) 55%, #b9b19e);border-radius:1px;min-width:3px;min-height:3px;padding:0;position:absolute;transform:translate(-50%,-50%)}.seat-overview-cell:hover{z-index:4;filter:brightness(1.45);border-color:#fff;transform:translate(-50%,-50%)scale(2.2)}.seat-overview-cell.is-selected{z-index:3;background:#ffcf4d;border-color:#fff;transform:translate(-50%,-50%)scale(1.8);box-shadow:0 0 0 2px #ffcf4d,0 0 12px #ffcf4dcc}.seat-picker-section-tabs{scrollbar-width:none;gap:7px;padding:0 20px 14px;display:flex;overflow-x:auto}.seat-picker-section-tabs::-webkit-scrollbar{display:none}.seat-picker-section-tabs button{--section-color:#5b8def;white-space:nowrap;color:#b8bbc5;background:#292c34;border:1px solid #414550;flex:none;min-width:60px;padding:8px 10px;font-size:12px}.seat-picker-section-tabs button.is-active{border-color:var(--section-color);background:color-mix(in srgb, var(--section-color) 55%, #24262d);color:#fff}.seat-matrix-stage{color:#c8cbd2;letter-spacing:.14em;text-align:center;background:#2c2f37;border-top:6px solid #747983;margin:0 20px;padding:8px;font-size:11px;font-weight:800}.seat-matrix-scroll{background:#181a20;border:1px solid #3b3f49;border-radius:8px;max-height:min(60vh,610px);margin:10px 20px 0;overflow:auto}.seat-matrix{min-width:max(620px, calc(var(--seat-columns) * 19px + 54px));padding:12px 14px 16px 8px}.seat-matrix-row{grid-template-columns:34px repeat(var(--seat-columns), minmax(13px, 1fr));align-items:center;gap:3px;margin-bottom:3px;display:grid}.seat-matrix-row-label{color:#858995;text-align:right;padding-right:6px;font-size:11px}.seat-matrix-cell{aspect-ratio:1;border:1px solid color-mix(in srgb, var(--section-color) 58%, #d7d9de);background:color-mix(in srgb, var(--section-color) 50%, #bbb4a5);border-radius:2px;width:100%;min-width:0;min-height:0;padding:0}.seat-matrix-cell:hover{z-index:1;filter:brightness(1.3);border-color:#fff;position:relative;transform:scale(1.35)}.seat-matrix-cell.is-empty{box-sizing:border-box;opacity:.7;background:#292c33;border-color:#33363e}.seat-matrix-cell.is-selected{background:#ffcf4d;border-color:#fff;box-shadow:0 0 0 2px #ffcf4d,0 0 12px #ffcf4dbf}.seat-picker-footer{color:#aeb1bb;justify-content:space-between;align-items:center;gap:16px;min-height:42px;padding:14px 20px 18px;font-size:13px;display:flex}.seat-picker-footer strong{color:#fff;font-size:15px}.seat-picker-footer button{min-width:112px}.seat-picker-body{padding:0 20px 20px}.seat-picker-map{background:linear-gradient(#171920,#1c1e27);border:1px solid #3a3b42;border-radius:7px;height:min(52vh,430px);position:relative;overflow:hidden}.seat-picker-stage,.seat-picker-deck{box-sizing:border-box;pointer-events:none;background:#343741;border:1px solid #707680;position:absolute}.seat-picker-stage{color:#c7c9cf;letter-spacing:.08em;place-items:center;font-size:8px;font-weight:700;display:grid}.seat-picker-deck{background:#2b2e38}.seat-picker-section{--section-color:#5b8def;border:1px solid color-mix(in srgb, var(--section-color) 75%, white);background:color-mix(in srgb, var(--section-color) 42%, #1c1e27);color:#fff;opacity:.8;border-radius:4px;min-width:18px;min-height:16px;padding:0;font-size:10px;font-weight:700;position:absolute}.seat-picker-section:hover,.seat-picker-section.is-active{opacity:1;background:var(--section-color);z-index:1;box-shadow:0 0 0 2px #ffffffb8}.seat-picker-controls{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;display:grid}.seat-picker-controls label{color:#9a9ba3;gap:4px;font-size:11px;display:grid}.seat-picker-controls select{color:#eee;width:100%;min-width:0;font:inherit;background:#1e1f24;border:1px solid #3a3b42;border-radius:6px;padding:7px 8px;font-size:12px}.seat-picker-seat-label{color:#9a9ba3;margin:10px 0 6px;font-size:11px}.seat-picker-seats{grid-template-columns:repeat(12,1fr);gap:5px;max-height:148px;display:grid;overflow-y:auto}.seat-picker-seats button{aspect-ratio:1;color:#cfd2dc;background:#1d2028;border:1px solid #454854;border-radius:5px;min-width:0;padding:0;font-size:11px}.seat-picker-seats button:hover,.seat-picker-seats button.is-selected{color:#fff;background:#5b8def;border-color:#8aafff}.seat-info{background:#26272d;border-radius:8px;min-height:56px;padding:14px}.seat-info-title{font-size:20px;font-weight:600}.seat-info-status{color:#9a9ba3;margin-top:4px;font-size:13px}.seat-info-height{color:#6c6d76;margin-top:2px;font-size:12px}.seat-info-placeholder{color:#6c6d76;font-size:13px}.height-input{background:#26272d;border-radius:8px;flex-direction:column;gap:6px;padding:14px;display:flex}.height-input label{font-size:13px;font-weight:600}.height-input-row{align-items:center;gap:8px;display:flex}.height-input-row input{color:#eee;background:#1e1f24;border:1px solid #3a3b42;border-radius:6px;flex:1;min-width:0;padding:8px 10px;font-size:14px}.height-input-unit{color:#9a9ba3;font-size:13px}.height-slider{accent-color:#5b8def;width:100%;margin:2px 0 0}.height-input-hint{color:#6c6d76;font-size:11px}.actions{flex-direction:column;gap:8px;display:flex}button{cursor:pointer;border:none;border-radius:8px;padding:10px 14px;font-size:14px}button.primary{color:#fff;background:#5b8def}button.primary:disabled{color:#6c6d76;cursor:not-allowed;background:#33364a}button.secondary{color:#eee;background:#33343b}button.ghost{color:#9a9ba3;background:0 0;border:1px solid #3a3b42}.note{color:#6c6d76;margin-top:auto;font-size:11px;line-height:1.5}.viewer{touch-action:none;flex:1;min-width:0;min-height:0;position:relative}.viewer canvas{touch-action:none;display:block}.viewer-badge{color:#eee;pointer-events:none;background:#141519bf;border:1px solid #3a3b42;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;position:absolute;top:16px;left:16px}.controls-help{color:#cfd0d6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#141519d1;border:1px solid #3a3b42;border-radius:10px;font-size:12px;position:absolute;bottom:16px;right:16px;overflow:hidden}.controls-help-toggle{color:#cfd0d6;text-align:left;background:0 0;border-radius:0;width:100%;padding:8px 12px;font-size:12px;font-weight:600}.controls-help-list{gap:6px;margin:0;padding:0 12px 10px;list-style:none;display:grid}.controls-help-list li{justify-content:space-between;align-items:center;gap:8px;display:flex}.controls-help-keys{gap:3px;display:flex}.controls-help-keys kbd{text-align:center;color:#eee;background:#33343b;border:1px solid #45464e;border-bottom-width:2px;border-radius:4px;min-width:18px;padding:2px 5px;font-family:inherit;font-size:11px}.controls-help-label{color:#9a9ba3}.mobile-move-controls{display:none}body{margin:0}@media (width<=720px),(pointer:coarse){.app{flex-direction:column;height:100dvh}.viewer{flex:auto;order:-1}.sidebar{width:100%;max-height:42dvh;padding:12px max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));overscroll-behavior:contain;border-top:1px solid #2c2d33;border-right:0;flex:none;gap:10px}.sidebar h1{font-size:16px}.subtitle,.note{display:none}.seat-info,.height-input{padding:10px 12px}.seat-info{min-height:44px}.seat-info-title{font-size:17px}.height-input-row input{box-sizing:border-box;min-height:44px;font-size:16px}.height-slider{min-height:28px}.actions{flex-flow:wrap}.actions button{flex:140px;min-height:44px}.viewer-badge{top:max(10px, env(safe-area-inset-top));left:max(10px, env(safe-area-inset-left));box-sizing:border-box;max-width:calc(100% - 20px);font-size:12px}.seat-picker-launch{top:max(10px, env(safe-area-inset-top));right:max(10px, env(safe-area-inset-right));min-height:44px}.seat-picker-overlay{padding:max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));position:fixed}.seat-picker-map{height:min(48vh,360px)}.seat-picker-seats{grid-template-columns:repeat(8,1fr)}.controls-help{right:max(10px, env(safe-area-inset-right));max-width:calc(100% - 20px);bottom:10px}.controls-help-toggle{min-height:44px;padding:10px 14px}.mobile-move-controls{z-index:4;left:max(10px, env(safe-area-inset-left));-webkit-user-select:none;user-select:none;touch-action:none;align-items:flex-end;gap:8px;display:flex;position:absolute;bottom:10px}.mobile-dpad{grid-template-rows:repeat(2,44px);grid-template-columns:repeat(3,44px);gap:4px;display:grid}.mobile-dpad .mobile-move-button:first-child{grid-area:1/2}.mobile-dpad .mobile-move-button:nth-child(2){grid-area:2/1}.mobile-dpad .mobile-move-button:nth-child(3){grid-area:2/2}.mobile-dpad .mobile-move-button:nth-child(4){grid-area:2/3}.mobile-vertical-controls{gap:4px;display:grid}.mobile-move-button{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);-webkit-tap-highlight-color:transparent;background:#141519b8;border:1px solid #ffffff4d;border-radius:12px;min-width:44px;min-height:44px;padding:0 8px;font-size:15px;font-weight:700;line-height:1}.mobile-move-button:active{background:#5b8defe6;transform:scale(.96)}}.seat-overview-tip{z-index:5;color:#fff;white-space:nowrap;pointer-events:none;background:#10121af5;border:1px solid #6177a8;border-radius:5px;padding:4px 8px;font-size:12px;font-weight:700;line-height:1.2;display:none;position:absolute;transform:translate(-50%,calc(-100% - 10px))}.seat-overview-tip[data-visible]{display:block}.fps-meter{z-index:6;color:#9fe6b0;font-variant-numeric:tabular-nums;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#141519d1;border:1px solid #3a3b42;border-radius:8px;padding:6px 10px;font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;bottom:60px;right:16px}.fps-meter-ms{color:#6f7c74;font-weight:500}.viewer-error{box-sizing:border-box;color:#cfd0d6;flex-direction:column;justify-content:center;gap:10px;height:100%;padding:24px;display:flex}.viewer-error h2{margin:0;font-size:17px}.viewer-error p{color:#9a9ba3;margin:0;font-size:13px;line-height:1.6}.viewer-error pre{color:#ff9a9a;white-space:pre-wrap;background:#1e1f24;border:1px solid #3a3b42;border-radius:8px;max-height:40%;margin:0;padding:10px 12px;font:11px/1.5 ui-monospace,Menlo,monospace;overflow:auto}
