:root{--pink:#f15ca6;--ink:#202020;--muted:#5f5f5f;--purple:#6c5ce7;--line:#e6e6e6}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#fff;font-family:Arial,"Noto Sans KR","Noto Sans JP",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
.skip-link{position:fixed;z-index:100;left:12px;top:-60px;padding:10px 14px;color:#fff;background:#111;border-radius:8px}
.skip-link:focus{top:12px}
.site-header{position:sticky;z-index:20;top:0;height:64px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;background:#686868;color:#fff;box-shadow:0 1px 4px #0002}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:20px;font-weight:400;letter-spacing:.01em}
.brand img{width:48px;height:48px;object-fit:contain}
.top-link{color:var(--pink);font-size:14px;font-weight:700;text-decoration:none}
.tracking-section{max-width:960px;margin:0 auto;padding:82px 24px 72px;text-align:center}
.tracking-section h1{margin:0;color:var(--pink);font-size:clamp(28px,3vw,36px);line-height:1.2}
.tracking-section h2{margin:26px 0 38px;font-size:clamp(19px,2.3vw,25px);line-height:1.45}
.pk-track{width:100%;max-width:620px;margin:0 auto 34px;padding:0 8px;text-align:center;overflow:hidden}
.pk-track form{width:100%;display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:nowrap}
.wbl-field{--h:clamp(46px,8.2vw,54px);position:relative;width:auto;max-width:500px;height:var(--h);border-radius:16px;flex:1 1 auto;min-width:0}
.wbl-input{position:relative;z-index:2;width:100%;height:100%;padding:0 8px;border:1px solid #ddd;border-radius:16px;background:#fff;outline:none;text-align:center;font-size:clamp(14px,3.8vw,20px);line-height:1;caret-color:transparent;-webkit-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:auto}
.wbl-input:focus{border-color:#b9b3ff;box-shadow:0 0 0 4px #6c5ce71f}
.cells{display:none;position:absolute;z-index:1;inset:0;border:1px solid #ddd;border-radius:16px;background:#fff;overflow:hidden;pointer-events:none}
.cells-grid{display:grid;grid-template-columns:repeat(12,1fr);height:100%}
.cell{position:relative;display:flex;justify-content:center;align-items:center;border-right:1px solid #0000001a;background:transparent;color:#222;font-size:clamp(14px,3.8vw,20px);font-weight:800;font-variant-numeric:tabular-nums;user-select:none;transition:background .12s ease,box-shadow .12s ease}
.cell:last-child{border-right:0}.cell:nth-child(4),.cell:nth-child(8){border-right:2px solid #0000002e}
.wbl-field.active .cells{display:block}.wbl-field.active .wbl-input{border-color:#b9b3ff;background:transparent;color:transparent;caret-color:transparent}
.cell.hl{background:#6c5ce71a;box-shadow:inset 0 0 0 2px #6c5ce74d}
@keyframes pkBlink{0%,49%{opacity:1}50%,100%{opacity:0}}
.cell.caret::after{content:"";position:absolute;top:18%;left:50%;width:2px;height:64%;border-radius:1px;background:#222;transform:translateX(-1px);animation:pkBlink 1s steps(1) infinite}
.cell.caret.end::after{right:5px;left:auto;transform:none}
.pk-btn{height:clamp(46px,8.2vw,54px);padding:0 20px;border:0;border-radius:16px;background:var(--purple);color:#fff;cursor:pointer;font-size:clamp(16px,4vw,20px);font-weight:900;line-height:1;white-space:nowrap;flex:0 0 auto}
.pk-btn:hover{background:#5b4bd8}.pk-btn:focus-visible,.store-banner:focus-visible,.top-link:focus-visible,.brand:focus-visible{outline:3px solid #ffb3d7;outline-offset:4px}
.tracking-notes{max-width:760px;margin:0 auto;text-align:left;color:#242424;font-size:14px;line-height:1.85}
.tracking-notes p{margin:8px 0}
.visual-section{max-width:1156px;margin:0 auto;padding:24px 24px 28px}
.wide-image{display:block;width:100%;height:auto}
.guide-image{margin-bottom:50px}
.store-banner{display:block;transition:transform .18s ease,box-shadow .18s ease}
.store-banner:hover{transform:translateY(-2px);box-shadow:0 12px 34px #0002}
.service-notice{max-width:1050px;margin:0 auto;padding:26px 24px 44px;text-align:center;font-size:13px;line-height:1.9}
.service-notice p{margin:24px 0}
.site-footer{padding:8px 24px 58px;text-align:center;font-size:13px;line-height:1.8}
.site-footer p{margin:22px 0}.site-footer a{color:#a6296b;text-underline-offset:3px}
@media(max-width:640px){
  .site-header{height:58px;padding:0 14px}.brand{gap:8px;font-size:16px}.brand img{width:42px;height:42px}
  .tracking-section{padding:54px 14px 40px}.tracking-section h2{margin:20px 0 30px}
  .pk-track{padding:0 2px;margin-bottom:28px}.pk-track form{gap:6px}.pk-btn{padding:0 13px;font-size:15px}.wbl-input,.cell{font-size:14px}
  .tracking-notes{font-size:13px;line-height:1.65}.tracking-notes p{margin:12px 0}
  .visual-section{padding:14px 0 18px}.guide-image{margin-bottom:22px}
  .service-notice{padding:18px 18px 30px;font-size:12px}.site-footer{padding:4px 18px 42px;font-size:12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cell.caret::after{animation:none}.store-banner{transition:none}}

/* 2026 official-site coming-soon redesign */
:root{--pink:#e95789;--ink:#35263a;--muted:#746a74;--purple:#5f4770;--line:#eadde6;--paper:#fff9fb}
body{background:linear-gradient(180deg,#fff9fb 0,#fff 48%,#fff9fb 100%);font-family:Pretendard,"Noto Sans KR","Noto Sans JP",Arial,sans-serif}
.site-header{height:72px;padding:0 max(24px,calc((100vw - 1180px)/2));color:var(--ink);background:#fffdfde8;box-shadow:0 1px 0 #eadde6;backdrop-filter:blur(14px)}
.brand{font-size:19px;font-weight:900;letter-spacing:.025em}.brand img{width:46px;height:46px}.brand small{margin-left:4px;color:#8d7787;font-size:11px;letter-spacing:.08em}
.top-link{padding:10px 14px;border-radius:999px;color:#8d4565;background:#fff0f5;font-size:12px}.top-link:hover{background:#ffe6ef}
.launch-hero{width:min(calc(100% - 48px),1180px);aspect-ratio:1919/820;margin:28px auto 0;position:relative;overflow:hidden;border:1px solid #f0e5ea;border-radius:34px;background:#fff;box-shadow:0 24px 70px #503a4d1a}
.launch-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}
.launch-copy{position:absolute;z-index:1;top:12%;left:5%;width:34%;color:var(--ink)}
.launch-kicker,.section-kicker{color:var(--pink);font-size:11px;font-weight:950;letter-spacing:.13em}
.launch-copy h1{margin:12px 0 0;font-size:clamp(30px,4.1vw,54px);line-height:1.12;letter-spacing:-.065em}.launch-copy h1 em{color:#a43f67;font-style:normal}
.launch-copy h1 small{font-size:.42em;font-weight:850;letter-spacing:-.03em;vertical-align:.18em}
.launch-copy p{margin:clamp(22px,3.4vw,45px) 0 0;color:#5f515d;font-size:clamp(13px,1.35vw,17px);font-weight:650;line-height:1.7}
.store-cta-wrap{width:min(calc(100% - 48px),920px);margin:24px auto 0;text-align:center}
.store-cta-wrap p{margin:0;color:#5f515d;font-size:clamp(13px,1.35vw,17px);font-weight:650;line-height:1.7}
.store-link{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border:1px solid #efd2de;border-radius:999px;color:#a43f67;background:#fff6f9;box-shadow:0 10px 28px #503a4d0d;font-size:16px;font-weight:900;text-decoration:none;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.store-link:hover{background:#ffedf4;box-shadow:0 14px 34px #503a4d16;transform:translateY(-2px)}
.store-cta-wrap .store-link{margin-top:11px}
.tracking-section{width:min(calc(100% - 48px),860px);max-width:none;margin:54px auto 30px;padding:48px 54px;border:1px solid var(--line);border-radius:30px;background:#fff;box-shadow:0 18px 55px #503a4d12;text-align:center}
.tracking-section h2{margin:10px 0 8px;font-size:clamp(26px,3.2vw,38px);line-height:1.3;letter-spacing:-.05em}.tracking-intro{margin:0 0 30px;color:var(--muted);font-size:14px;line-height:1.65}
.pk-track{max-width:640px;margin:0 auto 18px;padding:0}.wbl-field{--h:54px}.wbl-input,.cells{border-color:#dfd2db;border-radius:15px}.pk-btn{height:54px;border-radius:15px;background:linear-gradient(135deg,#755989,#5c416d);font-size:16px}.pk-btn:hover{background:#523760}
.tracking-details{max-width:640px;margin:14px auto 0;border-top:1px solid #f0e7ec;text-align:left}.tracking-details h3{margin:0;padding:18px 4px 2px;color:#765f6d;font-size:12px;font-weight:900}.tracking-notes{margin-top:12px;padding:16px 18px;border-radius:16px;color:#625762;background:#fff7fa;font-size:12px;line-height:1.7}.tracking-notes p{margin:8px 0}
.service-notice{max-width:860px;padding:20px 24px 34px;color:#81747d}.site-footer{padding-top:18px;border-top:1px solid #f0e7ec;color:#6f646c}

@media(max-width:640px){
  .site-header{height:62px;padding:0 14px}.brand{font-size:16px}.brand img{width:40px;height:40px}.brand small{font-size:9px}.top-link{padding:8px 11px;font-size:11px}
  .launch-hero{width:calc(100% - 28px);aspect-ratio:auto;margin-top:14px;display:flex;flex-direction:column;border-radius:24px}
  .launch-image{position:relative;aspect-ratio:1919/820;object-fit:cover}
  .launch-copy{position:relative;top:auto;left:auto;width:auto;padding:25px 21px 29px}
  .launch-kicker{font-size:9px}.launch-copy h1{margin-top:9px;font-size:30px}.launch-copy p{margin-top:18px;font-size:13px}
  .store-cta-wrap{width:calc(100% - 42px);margin-top:17px}.store-cta-wrap p{font-size:13px;line-height:1.7}.store-cta-wrap .store-link{margin-top:9px}.store-link{width:100%;min-height:54px;padding:10px 17px;border-radius:18px;font-size:14px;line-height:1.45}
  .tracking-section{width:calc(100% - 28px);margin:22px auto 24px;padding:30px 18px;border-radius:24px}.tracking-section h2{margin-top:8px;font-size:27px}.tracking-intro{margin-bottom:23px;font-size:13px}
  .pk-track{margin-bottom:12px}.pk-track form{gap:7px}.wbl-field{--h:50px}.pk-btn{height:50px;padding:0 15px;font-size:14px}
  .tracking-details h3{padding-top:16px}.service-notice{padding:12px 20px 28px}.site-footer{padding:16px 18px 38px}
}