:root{color-scheme:light;font-family:Pretendard Variable,SUIT Variable,Noto Sans KR,sans-serif;line-height:1.5;font-weight:400;color:#e6edf8;background:#050810;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{min-width:320px;overflow:hidden}button,input,textarea,select{font:inherit}button{cursor:pointer}code{font-family:SFMono-Regular,SF Mono,Consolas,Liberation Mono,monospace}.eyebrow{margin:0 0 8px;color:#7fd6d8;font-size:.86rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.modal-header h2{margin:0;line-height:1.08}.viewport-shell{width:100dvw;height:100dvh;display:grid;place-items:center;overflow:hidden;background:#050810}.menu-shell{width:100dvw;height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top,rgba(25,61,134,.2),transparent 42%),linear-gradient(180deg,#07101c,#050810)}.menu-card{width:min(560px,100%);padding:28px;border:1px solid rgba(172,194,255,.16);border-radius:28px;background:#0b1220d1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 30px 80px #00000052}.menu-eyebrow{margin:0 0 10px;color:#7fd6d8;font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.menu-card h1{margin:0;font-size:clamp(1.7rem,3vw,2.2rem);line-height:1.1}.menu-copy{margin:12px 0 0;color:#e6edf8c2;font-size:.98rem}.menu-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px}.layout-option{width:100%;padding:22px 20px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#ffffff0f;color:#f4f8ff;text-align:left;transition:transform .16s ease,border-color .16s ease,background-color .16s ease}.layout-option:hover,.layout-option:focus-visible{border-color:#7abeff6b;background:#3268c92e;transform:translateY(-2px);outline:none}.layout-option strong,.layout-option span{display:block}.layout-option strong{font-size:1.2rem}.layout-option span{margin-top:8px;color:#e6edf8b8;font-size:.94rem;line-height:1.5}.completion-toast{position:fixed;top:20px;right:20px;z-index:70;min-width:min(420px,calc(100vw - 32px));max-width:calc(100vw - 32px);padding:14px 18px;border:1px solid rgba(55,214,128,.28);border-radius:999px;background:#08140eeb;color:#f4fff8;font-size:1rem;font-weight:700;text-align:left;box-shadow:0 20px 44px #0000003d;transform:translateY(-18px);opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}.completion-toast.is-visible{opacity:1;transform:translateY(0)}.fullscreen-button{position:fixed;right:20px;bottom:20px;z-index:65;display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border:1px solid rgba(172,194,255,.2);border-radius:999px;padding:0;background:#080f1cd6;color:#f4f8ff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 18px 34px #0000003d;transition:transform .16s ease,background-color .16s ease,border-color .16s ease}.fullscreen-button:hover,.fullscreen-button:focus-visible{transform:translateY(-1px);border-color:#7abeff6b;background:#152a4ee6;outline:none}.fullscreen-button svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}.sheet-stage{position:relative;overflow:hidden;background:#050810;-webkit-user-select:none;user-select:none;touch-action:none}.sheet-image{display:block;width:100%;height:100%}.sheet-overlay{position:absolute;inset:0}.hotspot{position:absolute;left:var(--hotspot-left);top:var(--hotspot-top);width:var(--hotspot-width);height:var(--hotspot-height);padding:0;border:0;background:transparent;color:inherit;cursor:pointer}.hotspot__frame,.hotspot__status-tag{position:absolute}.hotspot__frame{inset:0;border:max(2px,.22vw) solid var(--hotspot-border);background:var(--hotspot-fill);opacity:0;box-shadow:0 0 0 max(1px,.12vw) #ffffff26 inset,0 0 0 1px #0000001f;transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease,opacity .18s ease}.hotspot__status-tag{top:12px;left:12px;bottom:auto;transform:none;padding:8px 12px;border-radius:10px;background:#0099ffeb;color:#fff;font-size:clamp(.9rem,1.05vw,1.06rem);font-weight:800;white-space:nowrap;line-height:1.2;box-shadow:0 12px 30px #0000003d}.hotspot:hover .hotspot__frame,.hotspot:focus-visible .hotspot__frame{transform:scale(1.015);background:color-mix(in srgb,var(--hotspot-fill) 74%,white);box-shadow:0 0 0 max(2px,.18vw) color-mix(in srgb,var(--hotspot-border) 50%,white),0 24px 44px #0000002e}.hotspot:focus-visible{outline:none}.hotspot.is-complete .hotspot__frame{background:#fff0;border-color:#09f;opacity:1}.hotspot.is-debug .hotspot__frame{background:color-mix(in srgb,var(--hotspot-fill) 48%,transparent);opacity:1}.hotspot.is-debug-selected .hotspot__frame{border-style:dashed;box-shadow:0 0 0 max(2px,.16vw) #ffffff94,0 18px 32px #00000038}.debug-selection-box,.debug-cursor-marker{position:absolute;pointer-events:none;opacity:0}.debug-selection-box{border:max(2px,.18vw) dashed #7cfb5d;background:#7cfb5d24;box-shadow:0 0 0 max(1px,.12vw) #ffffff3d inset,0 18px 30px #0003}.debug-selection-box.is-visible,.debug-cursor-marker.is-visible{opacity:1}.debug-cursor-marker{width:14px;height:14px;margin-left:-7px;margin-top:-7px;border:2px solid #7cfb5d;border-radius:999px;background:#05080fe0;box-shadow:0 0 0 2px #ffffff4d}.debug-panel{position:fixed;top:16px;left:16px;z-index:20;width:min(420px,calc(100vw - 32px));padding:16px;border:1px solid rgba(124,251,93,.28);border-radius:18px;background:#060a12d1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 18px 40px #00000047}.debug-panel.is-collapsed{width:auto}.debug-panel__header,.debug-panel__actions{display:flex;align-items:center}.debug-panel__header{justify-content:space-between;gap:12px}.debug-panel__header strong{font-size:.95rem;letter-spacing:.04em;text-transform:uppercase}.debug-panel__caption,.debug-panel__message{margin:10px 0 0;color:#e6edf8cc;font-size:.84rem}.debug-panel__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.debug-panel__grid div{padding:10px;border-radius:12px;background:#ffffff0d}.debug-panel__grid span,.debug-panel__grid strong{display:block}.debug-panel__grid span{margin-bottom:6px;color:#e6edf88f;font-size:.72rem}.debug-panel__grid strong{font-size:.84rem;word-break:break-all}.debug-code{margin:14px 0 0;padding:12px;border-radius:14px;background:#00000057;color:#b8ff92;font-size:.78rem;line-height:1.5;white-space:pre-wrap;word-break:break-word}.debug-panel__actions{flex-wrap:wrap;gap:8px;margin-top:12px}.debug-chip{border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:8px 12px;background:#ffffff14;color:#f6fbff;font-size:.78rem;font-weight:700}.debug-chip:disabled{opacity:.44;cursor:not-allowed}.primary-button,.secondary-button,.ghost-button{border:0;border-radius:999px;padding:12px 18px;font-weight:700;transition:transform .16s ease,opacity .16s ease,background-color .16s ease}.primary-button:hover,.secondary-button:hover,.ghost-button:hover{transform:translateY(-1px)}.primary-button{background:linear-gradient(135deg,#31c46d,#1979ff);color:#f7fbff}.secondary-button{background:#ffffff1a;color:#f3f8ff}.ghost-button{background:#ffffff0f;color:#ffaba1}.primary-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.modal{position:fixed;inset:0;display:grid;place-items:center;padding:12px;pointer-events:none;opacity:0;transition:opacity .18s ease;z-index:40}.modal.is-open{opacity:1;pointer-events:auto}.modal:not(.is-open) .player-surface,.modal:not(.is-open) .modal-overlay-close{pointer-events:none}.modal-backdrop{position:absolute;inset:0;border:0;background:#030710ad}.modal-panel{position:relative;z-index:1;width:min(1400px,calc(100vw - 20px));max-height:calc(100dvh - 24px);height:min(90dvh,1020px);padding:16px;border-radius:28px;border:1px solid rgba(172,194,255,.18);background:#09101fbd;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 30px 80px #00000052;display:flex;flex-direction:column}.modal-header,.modal-header__actions{display:flex;align-items:center}.modal-header{justify-content:space-between;gap:16px;margin-bottom:12px}.modal-header__actions{gap:10px;flex-wrap:wrap}.player-surface{flex:1;min-height:0;position:relative;border-radius:22px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#0c0d11}.player-mount{width:100%}.player-mount miv2-player{display:block;width:100%;max-width:100%}.modal-overlay-close{display:none;border:0;padding:0;color:#f7fbff}.modal-overlay-close span{display:block;line-height:1}@media(max-width:900px){.modal-header,.modal-header__actions{flex-direction:column;align-items:flex-start}.modal-panel{border-radius:22px;height:min(90dvh,940px)}.debug-panel{top:12px;left:12px;width:min(380px,calc(100vw - 24px))}.debug-panel__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px),(max-height:480px){.menu-shell{padding:16px}.menu-card{padding:22px;border-radius:24px}.menu-actions{grid-template-columns:1fr}.completion-toast{top:12px;right:12px;min-width:calc(100vw - 24px);max-width:calc(100vw - 24px);padding:12px 16px;font-size:.92rem}.fullscreen-button{right:12px;bottom:12px;width:48px;height:48px}.hotspot__status-tag{padding:8px 12px;font-size:.72rem}.modal{padding:4px}.modal-panel{width:100%;height:calc(100dvh - 8px);max-height:calc(100dvh - 8px);padding:0;border:0;border-radius:16px;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;overflow:hidden;pointer-events:none}.modal-header{display:none}.player-surface{flex:1;min-height:0;border-radius:16px;align-items:center;justify-content:center;pointer-events:auto}.player-mount{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.player-mount miv2-player{margin:0 auto}.modal-overlay-close{position:absolute;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));z-index:2;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#070c18ad;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 8px 18px #0003;font-size:1.45rem;font-weight:400;pointer-events:auto}.debug-panel{width:calc(100vw - 24px);padding:14px}.debug-panel__grid{grid-template-columns:1fr}}@media(max-height:480px){.modal{padding:4px}}