*,*:before,*:after{box-sizing:border-box}:root{--stage: #e9e9e7;--paper: #fafafa;--surface: #ffffff;--ink: #202020;--muted: #626262;--line: #d5d5d2;--hairline: #00000022;--control: #858585;--accent: #5b3fbf;--accent-on: #ffffff;--warn: #b5342a;--naver: #03c75a;--text-2xs: 10px;--text-xs: 12px;--text-sm: 14px;--text-md: 16px;--text-lg: 20px;--text-xl: 24px;--text-2xl: 32px;--text-3xl: 48px;--w-normal: 400;--w-medium: 500;--w-bold: 700;--w-heavy: 800;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--tap-min: 44px;--h-input: 48px;--h-cta: 52px;--h-plate: 56px;--app-max-w: 480px;--stage-min: 120px;--stage-min-kb: 80px;--kor-blue: #17408f;--plate-outline: #2a2f2d;--accent-soft: #ede7ff;--coral: #ff6b57;--sun: #ffd166;--shade: #00000099;--radius-sm: 8px;--radius-lg: 20px;--radius-round: 999px;--shadow-sheet: 0 -4px 20px #0000000d;--shadow-lift: 0 10px 24px #00000014;--slide: 28px;--slide-ms: .26s;--ease: cubic-bezier(.22, .61, .36, 1)}html,body{margin:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Malgun Gothic,sans-serif;font-size:var(--text-sm);line-height:1.5;background:var(--stage);color:var(--ink);-webkit-font-smoothing:antialiased}body{overscroll-behavior:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none;min-height:var(--tap-min);-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:2px}h1,h2,h3,p{margin:0}#root{height:100%}.app{display:flex;flex-direction:column;height:100dvh;max-width:var(--app-max-w);margin:0 auto;position:relative;background:var(--stage);overflow:hidden}.nav{flex:none;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:0 var(--space-5);padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top))}.brand{font-size:var(--text-md);font-weight:var(--w-heavy);letter-spacing:.5px;white-space:nowrap}.brand i{font-style:normal;font-weight:var(--w-normal);color:var(--muted)}.brand b{font-size:var(--text-xs);font-weight:var(--w-bold);letter-spacing:0;color:var(--muted);margin-left:var(--space-1)}.nav-label{font-size:var(--text-xs);color:var(--muted);text-align:right}.stage{flex:1 1 0;min-height:var(--stage-min);display:flex;flex-direction:column}.stage-info{flex:none;display:flex;justify-content:space-between;gap:var(--space-2);font-size:var(--text-xs);color:var(--muted);padding:var(--space-3) var(--space-5)}.viewer{flex:1 1 0;min-height:0;position:relative;touch-action:none;overflow:hidden}.viewer canvas{display:block}.viewer-loading,.viewer-hint{position:absolute;left:0;right:0;bottom:var(--space-1);text-align:center;font-size:var(--text-xs);color:var(--muted);pointer-events:none}.viewer-loading{top:50%;bottom:auto;transform:translateY(-50%)}.sheet{flex:none;background:var(--paper);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:var(--space-2) var(--space-5) 0;box-shadow:var(--shadow-sheet);z-index:2}.steps{display:flex;list-style:none;margin:0 0 var(--space-3);padding:0;gap:var(--space-1);border-bottom:1px solid var(--line)}.step{flex:1 1 0}.step button{width:100%;min-height:0;padding:var(--space-2) 0;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:var(--text-2xs);color:var(--muted);border-bottom:2px solid transparent}.step button i{font-style:normal;font-size:var(--text-2xs);font-weight:var(--w-bold);width:18px;height:18px;border-radius:var(--radius-round);border:1px solid var(--line);background:var(--surface);display:grid;place-items:center}.step.done button{color:var(--ink)}.step.done button i{background:var(--accent);border-color:var(--accent);color:var(--accent-on)}.step[aria-current=step] button{color:var(--ink);font-weight:var(--w-bold);border-bottom-color:var(--ink)}.step[aria-current=step] button i{background:var(--ink);border-color:var(--ink);color:var(--surface)}.step button:disabled{opacity:.4}.panel{padding-bottom:var(--space-2)}.panel h2{font-size:var(--text-lg);font-weight:var(--w-bold);line-height:1.4}.panel .sub{font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-1)}@keyframes slide-from-right{0%{opacity:0;transform:translate(var(--slide))}to{opacity:1;transform:none}}@keyframes slide-from-left{0%{opacity:0;transform:translate(calc(var(--slide) * -1))}to{opacity:1;transform:none}}.panel.fwd{animation:slide-from-right var(--slide-ms) var(--ease)}.panel.bwd{animation:slide-from-left var(--slide-ms) var(--ease)}@media (prefers-reduced-motion: reduce){.panel.fwd,.panel.bwd{animation:none}}.plate-field{display:block;margin-top:var(--space-3)}.plate-input{width:100%;height:var(--h-plate);border:1px solid var(--control);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);text-align:center;font-size:var(--text-xl);font-weight:var(--w-bold);letter-spacing:0;padding:0 var(--space-3)}.plate-input::placeholder{color:var(--control);font-weight:var(--w-bold)}.plate-input:focus{border-color:var(--ink)}.field{display:block}.field>span{display:block;font-size:var(--text-xs);font-weight:var(--w-bold);color:var(--muted);margin-bottom:var(--space-1)}.field-row{display:flex;justify-content:space-between;align-items:baseline}.field-row b{font-weight:var(--w-bold)}.field-row em{font-style:normal;font-weight:var(--w-normal)}.text-input{display:block;width:100%;height:var(--h-input);border:1px solid var(--control);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font-size:var(--text-md);font-weight:var(--w-bold);padding:0 var(--space-3)}.text-input::placeholder{color:var(--control);font-weight:var(--w-medium)}select.text-input{-webkit-appearance:none;appearance:none;padding-right:40px;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23202020' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center}select.text-input:invalid,select.text-input[value=""]{color:var(--muted)}.region-pick,.phone-field{margin-top:var(--space-4)}.text-input:focus{border-color:var(--ink)}.note{font-size:var(--text-xs);color:var(--muted);margin:var(--space-2) 0 0;padding-top:var(--space-2);border-top:1px solid var(--line)}.hint-line{font-size:var(--text-xs);color:var(--muted);margin:var(--space-2) 0 0;min-height:18px}.hint-line .warn,.hint-line.warn-line{color:var(--warn);font-weight:var(--w-bold)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin-top:var(--space-3)}.cards.two{grid-template-columns:repeat(2,1fr)}.card,.opt{border:1px solid var(--control);border-radius:var(--radius-sm);background:var(--surface);text-align:left;position:relative}.card{padding:var(--space-2);min-height:62px}.opt{display:block;width:100%;margin-top:var(--space-2);padding:var(--space-2) var(--space-3);min-height:var(--h-input)}.card[aria-pressed=true],.opt[aria-pressed=true]{border:2px solid var(--ink);background:var(--stage)}.card[aria-pressed=true]{padding:7px}.opt[aria-pressed=true]{padding:7px 11px}.card[aria-pressed=true]:after,.opt[aria-pressed=true]:after{content:"✓";position:absolute;right:var(--space-2);top:5px;font-size:var(--text-xs);font-weight:var(--w-bold)}.card-icon{display:flex;align-items:center;height:22px;margin-bottom:var(--space-2);color:var(--ink)}.pt{position:relative;display:inline-block;overflow:hidden;border-radius:2px;border:1.5px solid var(--plate-outline);box-sizing:border-box}.pt.long{width:58px;height:14px}.pt.short{width:36px;height:19px}.pt-band{position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--kor-blue)}.pt-band:after{content:"";position:absolute;left:2px;top:3px;width:3px;height:3px;border-radius:50%;background:var(--surface)}.pt-line{position:absolute;height:3px;border-radius:1px}.card-label,.opt-label{display:block;font-size:var(--text-sm);font-weight:var(--w-bold)}.card-sub,.opt-sub{display:block;font-size:var(--text-xs);color:var(--muted);margin-top:2px;line-height:1.35}.swatches{display:flex;justify-content:space-between;margin-top:var(--space-3)}.swatch{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);padding:0;min-height:0}.swatch .chip{width:44px;height:44px;border-radius:var(--radius-round);background:var(--sw);border:2px solid transparent;box-shadow:inset 0 0 0 1px var(--hairline);display:grid;place-items:center;font-size:var(--text-md);color:transparent}.swatch small{font-size:var(--text-xs);color:var(--muted)}.swatch[aria-pressed=true] .chip{border-color:var(--ink);color:var(--surface);text-shadow:0 0 3px var(--shade)}.swatch[aria-pressed=true] small{color:var(--ink);font-weight:var(--w-bold)}.checkout{flex:none;background:var(--paper);padding:var(--space-3) var(--space-5) max(var(--space-3),env(safe-area-inset-bottom));z-index:3}.actions{display:flex;gap:var(--space-2)}.back{flex:none;min-width:64px;height:var(--h-cta);border-radius:var(--radius-sm);border:1px solid var(--control);background:var(--surface);font-size:var(--text-sm);font-weight:var(--w-bold)}.cta{flex:1 1 auto;height:var(--h-cta);border-radius:var(--radius-sm);background:var(--accent);color:var(--accent-on);font-weight:var(--w-bold);font-size:var(--text-sm);display:flex;align-items:center;justify-content:center;gap:var(--space-2);text-decoration:none}.cta:disabled{background:var(--line);color:var(--muted);cursor:default}.app.kb{height:var(--vvh, 100dvh)}.app.kb .nav,.app.kb .stage-info,.app.kb .steps,.app.kb .panel h2,.app.kb .panel .sub,.app.kb .viewer-hint{display:none}.app.kb .stage{min-height:var(--stage-min-kb)}.app.kb .sheet{padding-top:var(--space-3)}.app.kb .plate-field,.app.kb .field{margin-top:0}.app.kb .panel{padding-bottom:0}.app.kb .checkout{padding-top:var(--space-2);padding-bottom:var(--space-2)}@media (min-width: 520px){body{background:var(--line);display:grid;place-items:center}.app{height:812px;max-height:100dvh;box-shadow:var(--shadow-lift)}}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.order .nav{justify-content:flex-start}.order-back{min-height:0;padding:0;font-size:var(--text-sm);font-weight:var(--w-bold);color:var(--muted)}.order-summary{flex:none;display:flex;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--space-3) var(--space-5);font-size:var(--text-xs);color:var(--muted)}.order .sheet{padding-top:var(--space-5)}.order-head{display:flex;justify-content:space-between;align-items:center}.order-head h1{font-size:var(--text-lg);font-weight:var(--w-bold)}.order-saved{font-size:var(--text-xs);color:var(--muted)}.order-code{display:block;width:100%;min-height:0;margin:var(--space-2) 0 var(--space-2);padding:var(--space-1) 0;font-size:clamp(var(--text-2xl),13vw,var(--text-3xl));font-weight:var(--w-heavy);letter-spacing:2px;line-height:1.2;color:var(--ink);font-variant-ligatures:none;font-variant-numeric:tabular-nums;text-align:center}.copy{display:block;width:100%;height:var(--h-input);border:1px solid var(--control);background:var(--surface);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:var(--w-bold)}.timer{display:flex;align-items:center;justify-content:center;gap:var(--space-2);margin:var(--space-4) 0;font-size:var(--text-xs);color:var(--muted)}.timer strong{font-size:var(--text-lg);font-weight:var(--w-heavy);font-variant-numeric:tabular-nums;color:var(--ink)}.timer .warn{color:var(--warn);font-weight:var(--w-bold)}.order-steps{list-style:none;margin:0;padding:var(--space-4) 0 var(--space-3);border-top:1px solid var(--line);display:grid;gap:var(--space-3)}.order-steps li{display:flex;gap:var(--space-3);font-size:var(--text-sm);line-height:1.5}.order-steps .num{width:24px;height:24px;flex:none;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--radius-round);font-size:var(--text-xs);font-weight:var(--w-bold)}.order-steps b{font-weight:var(--w-bold)}.order-steps small{display:block;font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-1)}.cta.pay{background:var(--naver);color:var(--surface)}.order-note{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--muted);text-align:center}.order-error{margin:0 0 var(--space-2);font-size:var(--text-xs);color:var(--warn);font-weight:var(--w-bold);text-align:center}.admin{max-width:var(--app-max-w);margin:0 auto;min-height:100dvh;background:var(--paper);padding:calc(var(--space-5) + env(safe-area-inset-top)) var(--space-5) calc(var(--space-8) + env(safe-area-inset-bottom))}.admin-head h1{font-size:var(--text-lg);font-weight:var(--w-heavy);margin-bottom:var(--space-3)}.admin-head form{display:flex;gap:var(--space-2);flex-wrap:wrap}.admin-key{flex:1 1 100%!important;letter-spacing:2px!important;font-size:var(--text-md)!important;text-transform:none!important}.admin-head input{flex:1 1 auto;min-width:0;height:var(--h-input);border:1px solid var(--control);border-radius:var(--radius-sm);background:var(--surface);padding:0 var(--space-4);font-size:var(--text-md);font-weight:var(--w-bold);letter-spacing:1.5px;text-transform:uppercase}.admin-head button{flex:none;height:var(--h-input);padding:0 var(--space-4);border-radius:var(--radius-sm);background:var(--ink);color:var(--surface);font-size:var(--text-sm);font-weight:var(--w-bold)}.admin-head button:disabled{opacity:.5}.admin-error{margin-top:var(--space-3);font-size:var(--text-xs);color:var(--warn);font-weight:var(--w-bold)}.admin-stage{height:28vh;min-height:160px;max-height:240px;margin:var(--space-5) 0 0;border-radius:var(--radius-lg);overflow:hidden;background:var(--stage);display:flex;flex-direction:column}.admin-stage .viewer{flex:1 1 0}.admin-code{margin:var(--space-3) 0 var(--space-1);text-align:center;font-size:var(--text-2xl);font-weight:var(--w-heavy);letter-spacing:2px}.admin-rows{margin:var(--space-2) 0 0}.admin-rows>div{display:flex;gap:var(--space-4);padding:var(--space-3) 2px;border-bottom:1px solid var(--line)}.admin-rows dt{flex:none;width:96px;font-size:var(--text-xs);color:var(--muted)}.admin-rows dd{margin:0;flex:1 1 auto;font-size:var(--text-sm);font-weight:var(--w-medium);display:flex;align-items:center;gap:var(--space-2)}.swatch-dot{width:16px;height:16px;border-radius:var(--radius-round);flex:none;border:1px solid var(--hairline);display:inline-block}