@import url('https://cdn.jsdelivr.net/npm/pretendard@1.3.5/dist/web/static/pretendard.css');
      button {font-family: 'Pretendard'}
      textarea {font-family: 'Pretendard'} 

  /* È÷¾î·Î ÇÏ´Ü ºó ±×¶óµ¥ÀÌ¼Ç ¿µ¿ª À§·Î ÄÜÅÙÃ÷¸¦ ²ø¾î¿Ã¸°´Ù */
  .oripa-wrap[data-tcg-page="main"] .main-sections{position:relative;z-index:1;margin-top:-420px}
  @media(max-width:860px){.oripa-wrap[data-tcg-page="main"] .main-sections{margin-top:-40vw}}

      .oripa-wrap {
        --bg: #ecebf9;
        --panel: #ffffff;
        --panel2: #f4f2fb;
        --paper: #16141f;
        --muted: #6c6885;
        --line: rgba(20,18,40,.14);
        --acid: #14c8e6;
      --acid-ink: #d4179a;
--oripa-card-back: url("/_template/service/images/07event_images/2026/08_pokemon/card_jp.png");
        --foil: #7a3df0;
        --orange: #ff7b45;
        --r: 15px;
        --type-display: "Pretendard", sans-serif;
        --type-number: "Pretendard", sans-serif;
      }
      .oripa-wrap * {
        box-sizing: border-box;
      }
      
      .oripa-wrap {
        margin: 0;
        background: var(--bg);
        color: var(--paper);
        font-family: var(--type-display);
      }
      .wrap {
        max-width: 1080px;
        margin: auto;
        padding: 0 26px;
      }
      .oripa-wrap header {
        height: 76px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--line);
      }
      .fileball-guide-wrap {
        padding-top: 14px;
      }
      .fileball-guide {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 18px;
        padding: 11px 13px;
        border: 1px solid rgba(20,200,230, 0.25);
        border-radius: 13px;
        background:
          linear-gradient(90deg, rgba(20,200,230, 0.07), transparent 46%),
          var(--panel);
        box-shadow: inset 3px 0 0 var(--acid);
      }
      .fileball-guide-mark {
        display: flex;
        align-items: center;
        gap: 9px;
        min-width: max-content;
      }
      .fileball-guide-mark span {
        display: grid;
        place-items: center;
        width: 34px;
        height: 34px;
        border-radius: 9px;
        color: #08222a;
        background: var(--acid);
        font: 900 13px var(--type-number);
        box-shadow: 0 0 18px rgba(20,200,230, 0.16);
      }
      .fileball-guide-mark b {
        color: var(--acid-ink);
        font-size: 13px;
        letter-spacing: 0.13em;
      }
      .fileball-guide-copy {
        margin: 0;
        color: #16141f;
        font-size: 13px;
        line-height: 1.55;
      }
      .fileball-guide-copy strong {
        color: #16141f;
      }
      .fileball-guide-rate {
        display: grid;
        gap: 2px;
        min-width: max-content;
        padding: 8px 11px;
        border: 1px solid var(--line);
        border-radius: 9px;
        background: rgba(0, 0, 0, 0.24);
      }
      .fileball-guide-rate small {
        color: #6c6885;
        font-size: 13px;
      }
      .fileball-guide-rate b {
        display: grid;
        gap: 2px;
        color: var(--acid-ink);
        font-size: 13px;
      }
      .logo {
        font: 700 23px var(--type-display);
        letter-spacing: 0.06em;
      }
      .logo i {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--acid);
        box-shadow: 0 0 16px var(--acid);
      }
      .oripa-wrap nav {
        display: flex;
        gap: 7px;
      }
      .oripa-wrap button {
        font-family: inherit;
      }
      .navbtn {
        border: 0;
        background: transparent;
        color: #6c6885;
        padding: 10px 14px;
        font-weight: 700;
        cursor: pointer;
      }
      .navbtn.active {
        color: #16141f;
        border-bottom: 2px solid var(--acid-ink);
      }
      .wallet {
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .wallet small {
        display: block;
        color: #6c6885;
        font-size: 13px;
      }
      .wallet b {
        font-size: 16px;
      }
      .outline {
        border: 1px solid rgba(20,18,40,.14);
        border-radius: 9px;
        padding: 9px 13px;
        background: transparent;
        color: #16141f;
        font-weight: 700;
        cursor: pointer;
      }
      .headline {
        display: flex;
        justify-content: space-between;
        align-items: end;
        padding: 44px 0 28px;
      }
      .wpe-eyebrow {
        color: var(--acid-ink);
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.16em;
      }
      .headline h1 {
        font: 700 clamp(42px, 5vw, 72px)/0.95 var(--type-display);
        letter-spacing: -.055em;
        margin: 9px 0;
      }
      .headline p {
        color: var(--muted);
        max-width: 460px;
        font-size: 13px;
        line-height: 1.7;
      }
      .showcase-label {
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-start;
        margin-bottom: 12px;
      }
      .showcase-label b {
        font-size: 13px;
      }
      .showcase-label span:last-child {
        color: #6c6885;
        font-size: 13px;
      }
      .store-shelf {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        padding: 48px 14px 34px;
        margin-bottom: 18px;
        overflow-x: visible;
        position: relative;
        background:
          linear-gradient(180deg, #ffffff 0%, #ece8f7 76%, rgba(20,18,40,.14) 77%, #ece8f7 82%),
          repeating-linear-gradient(90deg, transparent 0 8%, rgba(255,255,255,.025) 8.2% 8.4%);
        border: 1px solid var(--line);
        border-radius: 15px;
      }
      .store-shelf::before {
        box-sizing: border-box;
        content: "TODAY'S HIT BOX SHOWCASE  /  OPEN 00:00"; border-radius: 15px 15px 0 0;
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 32px;
        padding: 0 18px;
        display: flex;
        align-items: center;
        color: #08222a;
        background: var(--acid-ink);
        color: #fff;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.15em;
        white-space: nowrap;
      }
      .shelf-product {
        min-width: 145px;
        border: 1px solid rgba(20,18,40,.10);
        border-radius: 10px 10px 4px 4px;
        color: var(--paper);
        background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
        padding: 8px 8px 0;
        cursor: pointer;
        text-align: left;
        position: relative;
        transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
      }
      .shelf-product:hover {
        transform: translateY(-7px) scale(1.015);
        border-color: rgba(20,200,230,.55);
        background: linear-gradient(180deg, rgba(20,200,230,.08), rgba(255,255,255,.015));
      }
      /* DB À̹ÌÁö°¡ ¿À±â Àü¿¡´Â µðÀÚÀÌ³Ê ±âº» À̹ÌÁö¸¦ ¼û±ä´Ù */
      [data-tcg-catalog] .shelf-image img,
      [data-tcg-catalog] .daily-card > img {
        opacity: 0;
        transition: opacity 0.25s ease;
      }
      [data-tcg-catalog] img.tcg-live {
        opacity: 1;
      }
      .shelf-product:nth-child(odd) .shelf-image img {
        transform: rotate(-1.3deg);
      }
      .shelf-product:nth-child(even) .shelf-image img {
        transform: rotate(1.2deg);
      }
      .shelf-product:hover .shelf-image img {
        transform: rotate(0deg) translateY(-4px);
        filter: drop-shadow(0 20px 12px rgba(0, 0, 0, 0.42));
      }
      .shelf-product::after {
        content: "MARKET";
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 2;
        padding: 4px 6px;
        color: var(--acid-ink);
        background: rgba(20,18,40,.06);
        border: 1px solid rgba(20,200,230,.25);
        border-radius: 4px;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: .12em;
      }
      .shelf-image {
        height: 205px;
        display: grid;
        place-items: end center;
        position: relative;
        overflow: hidden;
        border-radius: 6px;
        background:
          radial-gradient(circle at 50% 25%, #f2f0f9 0 24%, #f7f6fc 65%, #ffffff 100%);
        box-shadow:
          inset 0 0 0 1px rgba(255,255,255,.45),
          inset 0 -22px 30px rgba(20,18,40,.14),
          0 8px 18px rgba(0,0,0,.22);
      }
      .shelf-image::before {
        content: "";
        position: absolute;
        left: 15%;
        right: 15%;
        bottom: 5px;
        height: 16px;
        border-radius: 50%;
        background: rgba(20,18,40,.28);
        filter: blur(7px);
        z-index: 0;
      }
      .shelf-image img {
        display: block;
        max-width: 100%;
        height: 195px;
        object-fit: contain;
        mix-blend-mode: normal;
        filter: drop-shadow(0 15px 10px rgba(0, 0, 0, 0.38));
        position: relative;
        z-index: 1;
        transition: transform .22s ease, filter .22s ease;
      }
      .shelf-meta {
        min-height: 108px;
        padding: 10px 8px 0;
        border-top: 1px solid rgba(20,18,40,.10);
        background: none;
        margin: 0 -8px;
        padding-left: 10px;
        padding-right: 10px;
      }
      .shelf-meta small {
        display: block;
        color: var(--acid-ink);
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.12em;
      }
      .shelf-meta b {
        display: block;
        margin: 4px 0 5px;
        font-size: 13px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;
      }
      .shelf-meta span {
        display: inline-flex;
        align-items: center;
        line-height: 21px;
        gap: 4px;
        margin: 8px 0 10px;
        padding: 6px 11px;
        border: 1px solid var(--acid-ink);
        border-radius: 999px;
        color: var(--acid-ink);
        background: none;
        font-size: 13px;
        font-weight: 800;
      }
      .hit-tabs {
        display: flex;
        gap: 6px;
        overflow-x: auto;
        padding-bottom: 10px;
        margin: 14px 0;
      }
      .hit-tab {
        flex: 0 0 auto;
        border: 1px solid var(--line);
        border-radius: 999px;
        padding: 8px 11px;
        color: #6c6885;
        background: #ffffff;
        font-size: 13px;
        font-weight: 700;
        cursor: pointer;
      }
      .hit-tab.active {
        border-color: var(--acid-ink);
        color: #08222a;
        background: var(--acid);
      }
      .hit-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
      }
      .hit-set-summary {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        gap: 14px;
        min-width: 0;
        padding: 13px 15px;
        border: 1px solid rgba(20,200,230, 0.26);
        border-radius: 13px;
        background:
          radial-gradient(circle at 6% 0, rgba(20,200,230, 0.12), transparent 38%),
          #ffffff;
      }
      .hit-set-summary img {
        width: 62px;
        height: 76px;
        flex: 0 0 auto;
        object-fit: contain;
        filter: drop-shadow(0 10px 12px rgba(0, 0, 0, 0.42));
      }
      .hit-set-summary div {
        min-width: 0;
      }
      .hit-set-summary small,
      .hit-set-summary b,
      .hit-set-summary span {
        display: block;
      }
      .hit-set-summary small {
        color: var(--acid-ink);
        font-size: 13px;
        font-weight: 900;
        letter-spacing: 0.12em;
      }
      .hit-set-summary b {
        margin: 4px 0 3px;
        overflow: hidden;
        color: #16141f;
        font-size: 16px;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .hit-set-summary span {
        color: #6c6885;
        font-size: 13px;
      }
      .hit-swipe {
        position: relative;
        grid-column: 1 / -1;
        min-width: 0;
      }
      .hit-track {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 2px;
        padding: 2px 2px 12px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        cursor: grab;
      }
      .hit-track.dragging { cursor: grabbing; scroll-snap-type: none; }
      .hit-track::-webkit-scrollbar { height: 6px; }
      .hit-track::-webkit-scrollbar-thumb { background: rgba(20,200,230,.45); border-radius: 999px; }
      .hit-track > .hit-card {
        flex: 0 0 auto;
        width: 152px;
        scroll-snap-align: start;
      }
      .hit-track { user-select: none; -webkit-user-select: none; }
      .hit-track img { pointer-events: none; }
      .hit-nav {
        position: absolute;
        top: calc(50% - 22px);
        transform: translateY(-50%);
        z-index: 3;
        width: 44px;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 50%;
        background: #ffffff;
        color: #7a3df0;
        font-size: 28px;
        font-weight: 900;
        padding-bottom: 4px;
        box-shadow: 0 6px 18px rgba(20, 18, 40, .3), 0 0 0 1px rgba(20, 18, 40, .08);
        cursor: pointer;
        transition: background .15s ease, color .15s ease, transform .15s ease;
      }
      .hit-nav:hover:not(:disabled) {
        background: linear-gradient(135deg, #14c8e6, #7a3df0);
        color: #ffffff;
        transform: translateY(-50%) scale(1.08);
      }
      .hit-nav.prev { left: 4px; }
      .hit-nav.next { right: 4px; }
      .hit-nav:disabled { opacity: .3; cursor: default; }
      .hit-swipe-hint {
        margin: 2px 0 0;
        color: var(--muted);
        font-size: 12px;
        text-align: center;
      }
      @media (max-width: 560px) {
        .hit-track > .hit-card { width: 132px; }
        .hit-nav { display: none; }
      }
      .hit-card {
        position: relative;
        min-width: 0;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: 13px;
        background: linear-gradient(180deg, #f4f2fb, #ffffff);
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
      }
      .hit-card-media {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 9px;
        background: #f7f6fc;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
      }
      .hit-card-media img {
        position: absolute;
        top: var(--guide-top);
        left: var(--guide-left);
        width: var(--guide-width);
        max-width: none;
        height: auto;
        pointer-events: none;
        user-select: none;
      }
      .hit-rarity {
        display: inline-flex;
        align-items: center;
        min-height: 19px;
        margin-top: 9px;
        padding: 0 7px;
        border-radius: 999px;
        color: #08222a;
        background: var(--acid);
        font: 900 13px var(--type-number);
        letter-spacing: 0.08em;
      }
      .hit-card b {
        display: block;
        min-height: 30px;
        margin: 7px 0 5px;
        overflow-wrap: anywhere;
        font-size: 13px;
        line-height: 1.35;
      }
      .hit-card small {
        display: block;
        color: #6c6885;
        font-size: 13px;
        line-height: 1.4;
      }
      .hit-card small strong {
        display: block;
        margin-top: 2px;
        color: var(--acid-ink);
        font: 900 13px var(--type-number);
      }
      /* ´ë¹ÚÄ«µå ¸®½ºÆ®: ½Ã¼¼ ´ë½Å Ä«µåº° Å©¸²½Ã¼¼º¸±â ¹öÆ° (»õâ) */
      .hit-kream {
        display: block;
        margin-top: 7px;
        padding: 7px 0;
        border-radius: 8px;
        text-align: center;
        text-decoration: none;
        color: #fff !important;
        background: linear-gradient(90deg, #0a9fbe, #6a2fe0);
        font-size: 12px;
        font-weight: 800;
      }
      .hit-kream:hover { filter: brightness(1.1); }
      .wpe-summary {
        display: grid;
        grid-template-columns: 1.2fr repeat(3, 0.6fr);
        gap: 1px;
        background: var(--line);
        border: 1px solid var(--line);
        border-radius: 14px;
        overflow: hidden;
        margin-bottom: 18px;
      }
      .wpe-summary > div {
        background: #ffffff;
        padding: 16px 18px;
      }
      .wpe-summary small {
        display: block;
        color: #6c6885;
        font-size: 13px;
        letter-spacing: 0.08em;
        margin-bottom: 5px;
      }
      .wpe-summary b {
        font-size: 18px;
      }
      .wpe-summary .mainstat {
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .progress {
        height: 4px;
        background: rgba(20,18,40,.14);
        width: 45%;
        border-radius: 10px;
        overflow: hidden;
      }
      .progress i {
        display: block;
        width: 76.8%;
        height: 100%;
        background: var(--acid);
      }
      .boardShell {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
        padding-bottom: 18px;
      }
      .notice-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: 0;
        padding: 0;
        list-style: none;
      }
      .notice-list li {
        display: grid;
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 14px;
        min-height: 67px;
        padding: 16px 22px 16px 26px;
        border-bottom: 1px solid var(--line);
        color: #6c6885;
        font-size: 13px;
        line-height: 1.6;
      }
      .notice-list li:nth-child(odd) {
        border-right: 1px solid var(--line);
      }
      .notice-list li:nth-last-child(-n + 2) {
        border-bottom: 0;
      }
      .notice-list b {
        color: #16141f;
        font-size: 13px;
      }
      .winner-archive {
        position: static;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
        column-gap: 18px;
        height: max-content;
        overflow: hidden;
        padding: 18px 20px;
        border: 1px solid var(--line);
        border-radius: var(--r);
        background:
          linear-gradient(145deg, rgba(20,200,230, 0.07), transparent 40%),
          var(--panel);
        cursor: pointer;
        transition: border-color .18s, transform .18s;
      }
      .winner-archive:hover,
      .winner-archive:focus-visible {
        border-color: rgba(20,200,230, .62);
        outline: none;
        transform: translateY(-2px);
      }
      .winner-archive h3 {
        margin: 7px 0 5px;
        font-size: 23px;
        line-height: 1.15;
        letter-spacing: -.04em;
      }
      .archive-count {
        display: block;
        color: #6c6885;
        font-size: 13px;
      }
      .archive-stack {
        position: relative;
        height: 205px;
        margin: 16px 0 18px;
      }
      .archive-thumb {
        position: absolute;
        top: 14px;
        left: 50%;
        width: 116px;
        height: 170px;
        object-fit: cover;
        border: 4px solid #ffffff;
        border-radius: 9px;
        background: #f7f6fc;
        box-shadow: 0 8px 18px rgba(0, 0, 0, .28);
        transition: transform .2s;
      }
      .archive-thumb:nth-child(1) { transform: translateX(-76%) rotate(-8deg); }
      .archive-thumb:nth-child(2) { z-index: 2; transform: translateX(-50%) translateY(-5px); }
      .archive-thumb:nth-child(3) { transform: translateX(-24%) rotate(8deg); }
      .winner-archive:hover .archive-thumb:nth-child(1) { transform: translateX(-84%) rotate(-11deg); }
      .winner-archive:hover .archive-thumb:nth-child(3) { transform: translateX(-16%) rotate(11deg); }
      .archive-recent {
        display: grid;
        gap: 7px;
        padding: 12px 0;
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
      }
      .archive-recent span {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        font-size: 13px;
        color: #6c6885;
      }
      .archive-recent b { color: var(--paper); font-size: 13px; }
      .archive-recent span > b {
        display: grid;
        gap: 3px;
      }
      .archive-recent small {
        color: #6c6885;
        font-size: 13px;
        font-weight: 400;
      }
      .archive-recent strong {
        align-self: center;
        color: #6c6885;
        font-size: 13px;
      }
      .archive-open {
        line-height: 21px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
        justify-self: center;
        margin-top: 8px;
        padding: 9px 18px;
        border: 1px solid var(--acid-ink);
        border-radius: 999px;
        color: var(--acid-ink);
        background: none;
        font-size: 13px;
        font-weight: 800;
        cursor: pointer;
      }
      .winner-archive .wpe-eyebrow { grid-column: 1; }
      .winner-archive h3 { grid-column: 1; margin: 4px 0; font-size: 20px; }
      .winner-archive .archive-count { grid-column: 1; }
      .winner-archive .archive-stack {
        grid-column: 2;
        grid-row: 1 / span 4;
        align-self: center;
        width: 100%;
        height: 200px;
        margin: 0;
      }
      .winner-archive .archive-thumb { width: 118px; height: 168px; }
      .winner-archive .archive-recent { grid-column: 1; }
      .winner-archive .archive-open { grid-column: 1 / -1; }
      .board {
        border: 1px solid var(--line);
        background: #ffffff;
        border-radius: var(--r);
        overflow: hidden;
      }
      .boardtop {
        padding: 16px 18px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid var(--line);
      }
      .boardtop b {
        font-size: 14px;
      }
      .legend {
        display: flex;
        gap: 14px;
        color: #6c6885;
        font-size: 13px;
      }
      .legend span {
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .legend i {
        width: 9px;
        height: 9px;
        border-radius: 3px;
        background: #ffffff;
        border: 1px solid rgba(20,18,40,.14);
      }
      .legend .open i {
        background: #ffffff;
      }
      .legend .chosen i {
        background: var(--acid);
        border-color: var(--acid-ink);
      }
      .legend .hit i {
        border-color: var(--foil);
        background: var(--foil);
      }
      .legend .mine i {
        border-color: var(--acid-ink);
        background: transparent;
        box-shadow: inset 0 0 0 2px #14c8e6;
      }
      .numbers {
        display: grid;
        grid-template-columns: repeat(20, minmax(0, 1fr));
        gap: 5px;
        padding: 16px;
        overflow: visible;
      }
      .pick {
        aspect-ratio: auto;
        height: 0;
        padding: 0 0 100%;
        border: 1px solid rgba(20,18,40,.14);
        background: #ffffff;
        color: #16141f;
        border-radius: 7px;
        font: 800 13px var(--type-number);
        font-weight: 700;
        cursor: pointer;
        transition: 0.14s;
        position: relative;
        overflow: hidden;
        isolation: isolate;
      }
      /* ·¹À̾ ¶° ÀÖ´Â µ¿¾È ºÎ¸ð ÆäÀÌÁö ½ºÅ©·Ñ Àá±Ý.
         html ¿¡ overflow-x °¡ °É·Á ÀÖ¾î ¼¼·Î ½ºÅ©·Ñ ÄÁÅ×À̳ʰ¡ html ÀÌ´Ù. */
      html.tcg-lock-modal,
      html.tcg-lock-slot,
      html:has(.tcginv-back.tcginv-on) {
        overflow: hidden !important;
      }
      /* ´ç÷ È÷½ºÅ丮 (µðÀÚÀÌ³Ê 0820 v2 À̽Ä) */
      .history-trigger{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(16,80,48,.18);border-radius:999px;background:#fff;padding:10px 15px;color:#0e3d28;font-weight:900;cursor:pointer;box-shadow:0 8px 20px rgba(19,76,47,.09)}
      .history-trigger span{font:900 9px ui-monospace,Consolas,monospace;letter-spacing:.12em;color:#5b8d18}
      .history-layout{display:grid;grid-template-columns:minmax(390px,1.25fr) minmax(250px,.75fr);gap:18px;margin-top:6px}
      .history-calendar,.history-results{border:1px solid #dfe7e1;border-radius:18px;background:#fbfdfb;padding:18px}
      .history-calendar header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.history-calendar header small,.history-results>small{display:block;color:#639126;font:900 10px ui-monospace,Consolas,monospace;letter-spacing:.13em}.history-calendar header b{display:block;margin-top:3px;font-size:20px;color:#14261c}
      .history-month-nav{display:inline-flex;gap:4px;margin-left:8px}.history-month-nav button{width:26px;height:26px;border:1px solid #d8e5da;border-radius:8px;background:#fff;color:#34483b;font-size:13px;cursor:pointer}.history-month-nav button:disabled{opacity:.3;cursor:default}
      .history-legend{display:flex;gap:6px}.history-legend span{padding:6px 9px;border-radius:999px;font:900 10px ui-monospace,Consolas,monospace}.history-legend .hit-dot{background:#dfff9e;color:#244600}.history-legend .box-dot{background:#ffedb3;color:#664500}
      .history-week,.history-days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.history-week span{text-align:center;color:#84938a;font-size:11px;font-weight:800;padding:5px}.history-days button,.history-days .empty{aspect-ratio:1;border:1px solid transparent;border-radius:10px;background:transparent;color:#34483b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}.history-days button:hover{background:#f1f7f2}.history-days button.has-win{background:#fff;border-color:#d8e5da;box-shadow:0 4px 10px rgba(20,62,39,.06)}.history-days button.selected{border-color:#8fc827;background:#edffd0;box-shadow:0 0 0 2px rgba(143,200,39,.16)}.history-days button b{font-size:12px}.history-days button span{display:flex;gap:3px;height:5px}.history-days i{width:5px;height:5px;border-radius:50%}.history-days i.hit{background:#7fbc13}.history-days i.box{background:#e7a900}
      .history-results h3{margin:5px 0 14px;color:#14261c;font-size:23px}.history-win{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;padding:10px 0;border-top:1px solid #e5ebe6}.history-win img{width:72px;height:92px;object-fit:contain;border-radius:9px;background:#f1f4f2}.history-win div{display:grid;gap:5px}.history-win div>span{justify-self:start;border-radius:999px;padding:4px 7px;font:900 9px ui-monospace,Consolas,monospace;background:#dfff9e;color:#244600}.history-win div>span.box{background:#ffedb3;color:#664500}.history-win b{font-size:15px;color:#14261c}.history-win small{color:#758079}.history-empty{min-height:180px;border:1px dashed #d5dfd7;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#8b9690;gap:6px}.history-empty b{color:#4d5e53}.history-note{font-size:12px!important;color:#738078!important}
      .history-groups{display:grid;gap:12px}.history-group{border:1px solid #e0e8e2;border-radius:14px;background:#fff;overflow:hidden}.history-group>header{display:flex;align-items:center;justify-content:space-between;padding:12px 13px;background:#f6faf7}.history-group>header div{display:grid;gap:2px}.history-group>header span{font:900 9px ui-monospace,Consolas,monospace;letter-spacing:.11em;color:#6f7e74}.history-group>header b{font-size:13px;color:#24362b}.history-group>header>strong{display:grid;place-items:center;min-width:26px;height:26px;border-radius:999px;background:#dfff9e;color:#244600;font-size:12px}.history-group.box-group>header>strong{background:#ffedb3;color:#664500}.history-group .history-win{margin:0 12px}.history-empty.compact{min-height:92px;margin:10px;border-radius:10px;font-size:12px}.history-empty.compact b{font-size:13px}
      @media(max-width:900px){.history-layout{grid-template-columns:1fr}}
      @media(max-width:700px){.history-trigger{padding:8px 11px}.history-trigger span{display:none}.history-calendar,.history-results{padding:13px}.history-week,.history-days{gap:3px}.history-days button{border-radius:8px}.history-legend span{padding:5px 7px;font-size:9px}.history-win{grid-template-columns:62px 1fr}.history-win img{width:62px;height:80px}}
      .slot-view {
        position: fixed;
        inset: 0;
        z-index: 240;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 24px;
        background: rgba(20, 18, 40, .45);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
      }
      .slot-view-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        max-width: min(320px, 86vw);
        padding: 22px 26px;
        border-radius: 16px;
        background: #ffffff;
        box-shadow: 0 24px 60px rgba(20, 18, 40, .35);
        text-align: center;
      }
      .slot-view-card small {
        color: #637589;
        font-weight: 800;
        letter-spacing: .14em;
      }
      .slot-view-card img {
        width: min(230px, 62vw);
        border-radius: 10px;
        filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .25));
      }
      .slot-view-card b { font-size: 16px; }
      .slot-view-grade {
        padding: 3px 10px;
        border-radius: 999px;
        background: #f0eef7;
        color: var(--acid-ink);
        font-size: 12px;
        font-weight: 800;
      }
      .slot-view-text {
        margin: 14px 4px;
        font-size: 22px;
        font-weight: 900;
        color: var(--acid-ink);
      }
      .pick.openable { cursor: pointer; }
      .pick.used.openable { cursor: pointer; }
      .pick.auth-disabled {
        cursor: not-allowed;
        filter: grayscale(1);
        opacity: .55;
      }
      .pick-back {
        position: absolute;
        inset: 3px;
        z-index: 1;
        border-radius: 3px;
        background: var(--oripa-card-back) center / contain no-repeat;
        filter: brightness(.82) saturate(.88);
        transition: transform .16s ease, filter .16s ease;
      }
      .pick-back::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(145deg, rgba(255,255,255,.13), transparent 34%, rgba(0,0,0,.2));
        pointer-events: none;
      }
      .pick:hover:not(:disabled):not(.auth-disabled) {
        border-color: var(--acid-ink);
        color: var(--acid-ink);
        transform: translateY(-2px);
        background: #ffffff;
      }
      .pick:hover:not(:disabled):not(.auth-disabled) .pick-back,
      .pick:focus-visible .pick-back {
        filter: brightness(1.12) saturate(1.05);
        transform: scale(1.055);
      }
      .pick.used {
        background: #ffffff;
        color: #6c6885;
        border-color: #ffffff;
        text-decoration: line-through;
        cursor: not-allowed;
      }
      .pick.card-hit,
      .pick.my-pick,
      .pick.my-hit {
        text-decoration: none;
      }
      .pick.card-hit {
        border-color: rgba(122,61,240,.76);
        color: #7a3df0;
        background: linear-gradient(145deg, #f3ebfb, #efe9fa 72%);
        box-shadow: inset 0 0 0 1px rgba(122,61,240,.06);
      }
      .pick.my-pick {
        border-color: rgba(20,200,230,.72);
        color: var(--acid-ink);
        background: linear-gradient(145deg, #f3ebfb, #ffffff 72%);
      }
      .pick.my-hit {
        border-color: var(--acid-ink);
        color: #08222a;
        background: linear-gradient(145deg, #14c8e6, #7a3df0);
        box-shadow: 0 0 17px rgba(20,200,230,.2);
      }
      .pick-number {
        position: relative;
        z-index: 1;
        display: block;
        transform: translateY(-3px);
        letter-spacing: .02em;
      }
      .pick-number.pick-mark {
        font-size: 1.35em;
        font-weight: 900;
        letter-spacing: 0;
      }
      .pick-prize-image {
        position: absolute;
        inset: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 6px;
        pointer-events: none;
      }
      .pick-state {
        position: absolute;
        left: 2px;
        right: 2px;
        bottom: 3px;
        z-index: 2;
        padding: 1px 0;
        border-radius: 2px;
        background: linear-gradient(90deg, transparent, rgba(5,8,6,.86) 22%, rgba(5,8,6,.86) 78%, transparent);
        overflow: hidden;
        font: 900 11px/1 var(--type-number);
        letter-spacing: .035em;
        text-align: center;
        white-space: nowrap;
        text-shadow: 0 1px 2px #000;
      }
      .pick.my-hit .pick-state { color: #08222a; background: rgba(255,255,255,.45); text-shadow: none; }
      .pick.selected {
        background: #f3ebfb;
        color: var(--acid-ink);
        border-color: var(--acid-ink);
        box-shadow: 0 0 15px rgba(20,200,230, 0.25);
      }
      .pick.selected .pick-back {
        inset: 2px;
        filter: brightness(1.25) saturate(1.12);
        box-shadow: inset 0 0 0 1px rgba(20,200,230,.45);
      }
      .pick.selected .pick-state {
        color: #08222a;
        background: var(--acid);
        text-shadow: none;
      }
      .pick.selected .pick-number { transform: translateY(-3px) scale(1.08); }
      .stickybar {
        position: fixed;
        left: 50%;
        bottom: 20px;
        transform: translate(-50%, 100px);
        opacity: 0;
        background: #ffffff;
        color: #16141f;
        border-radius: 14px;
        padding: 10px 12px 10px 18px;
        display: flex;
        align-items: center;
        gap: 18px;
        box-shadow: 0 18px 50px #000;
        z-index: 15;
        transition: 0.25s;
      }
      .stickybar.show {
        transform: translate(-50%, 0);
        opacity: 1;
      }
      .stickybar span {
        font-size: 13px;
      }
      .stickybar b {
        font-size: 18px;
        margin-left: 5px;
      }
      .cta {
        border: 0;
        border-radius: 10px;
        background: var(--acid);
        color: #08222a;
        padding: 5px 19px;
        font-size: 15px;
        font-weight: 800;
        cursor: pointer;
      }
      .stickybar .cta {
        background: var(--acid-ink);
        color: #ffffff;
      }
      .modalback {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.8);
        backdrop-filter: blur(8px);
        display: none;
        align-items: center;
        justify-content: center;
        padding: 18px;
        z-index: 120; /* sticky topnav(90) À§·Î - »Ì±â ¿¬Ãâ/°á°ú ·¹À̾ ¸Þ´º¸¦ µ¤¾î¾ß ÇÑ´Ù */
      }
      .modalback.open {
        display: flex;
      }
      .modal {
        width: min(900px, 100%);
        max-height: calc(100vh - 36px);
        overflow-y: auto;
        background: #ffffff;
        border: 1px solid rgba(20,18,40,.14);
        border-radius: 20px;
        padding: 24px;
        animation: up 0.22s;
      }
      .modal.wide {
        width: min(1080px, 100%);
      }
      /* Ä«µå Âü°í ½Ã¼¼: ±×·¡ÇÁ¡¤°Å·¡°Ç¼ö Á¦°Å ÈÄ Ãà¼Ò ·¹À̾î */
      .modal.market-compact { width: min(680px, 100%); }
      .modal.market-compact .card-market-detail { grid-template-columns: 200px 1fr; gap: 18px; }
      .modal.market-compact .card-market-visual img { max-width: 200px; }
      .winner-history-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        margin: 16px 0 18px;
      }
      .winner-history-card {
        position: relative;
        overflow: hidden;
        padding: 9px;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: #ffffff;
      }
      .winner-history-card img {
        display: block;
        width: 100%;
        height: 220px;
        object-fit: contain;
        border-radius: 8px;
        background: #ffffff;
      }
      .winner-history-card .grade {
        position: absolute;
        top: 16px;
        left: 16px;
        z-index: 2;
        padding: 4px 7px;
        border-radius: 4px;
        background: var(--acid);
        color: #08222a;
        font-size: 13px;
        font-weight: 900;
      }
      .winner-history-card b {
        display: block;
        margin: 9px 0 5px;
        font-size: 13px;
      }
      .winner-history-card small {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        color: #6c6885;
        font-size: 13px;
      }
      @keyframes up {
        from {
          opacity: 0;
          transform: translateY(12px);
        }
      }
      .mtop {
        display: flex;
        justify-content: space-between;
      }
      .mtop h2 {
        font: 400 28px 'Pretendard';
        margin: 6px 0;
      }
      .close {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        border: 1px solid var(--line);
        background: transparent;
        color: #16141f;
        cursor: pointer;
      }
      .seal {
        height: 500px;
        margin: 16px 0;
        background: radial-gradient(circle at 50% 42%, #ffffff, #e4dcf6 72%);
        border: 0;
        border-radius: 12px;
        display: grid;
        place-items: center;
        text-align: center;
        position: relative;
        overflow: hidden;
      }
      .seal:before {
        content: "";
        position: absolute;
        inset: -70%;
        background: repeating-conic-gradient(from 0deg,
          rgba(20,200,230,0) 0deg 9deg,
          rgba(20,200,230,.30) 11deg 12deg,
          rgba(255,238,160,.62) 13deg 14deg,
          rgba(20,200,230,.30) 15deg 16deg,
          rgba(20,200,230,0) 18deg 24deg);
        animation: turn 7s linear infinite;
      }
      .seal:after {
        content: "";
        position: absolute;
        inset: -70%;
        background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.42), transparent 16%),
          conic-gradient(from 150deg, transparent, rgba(20,200,230,.55), transparent 15%),
          conic-gradient(from 280deg, transparent, rgba(20,200,230,.48), transparent 14%);
        mix-blend-mode: screen;
        animation: turnRev 4.5s linear infinite;
      }
      @keyframes turnRev { to { transform: rotate(-360deg); } }
      @keyframes turn {
        to {
          transform: rotate(360deg);
        }
      }
      .seal b {
        font: 400 62px 'Pretendard';
        z-index: 1;
      }
      .seal small {
        display: block;
        color: var(--acid-ink);
        font: 10px 'Pretendard';
        letter-spacing: 0.15em;
        margin-top: 6px;
      }
      .cost {
        display: flex;
        justify-content: space-between;
        background: #ffffff;
        border: 1px solid var(--line);
        border-radius: 11px;
        padding: 14px;
        margin: 14px 0;
      }
      .cost span {
        color: #6c6885;
        font-size: 13px;
      }
      .cost b {
        color: var(--acid-ink);
      }
      .check {
        display: flex;
        gap: 9px;
        color: #6c6885;
        font-size: 13px;
        line-height: 1.5;
      }
      .check input {
        accent-color: var(--acid-ink);
      }
      .mactions {
        display: flex;
        gap: 9px;
        margin-top: 18px;
      }
      .mactions button {
        flex: 1;
      }
      .secondary {
        border: 1px solid rgba(20,18,40,.14);
        background: #ffffff;
        color: #16141f;
        border-radius: 10px;
        padding: 13px;
        font-weight: 700;
        cursor: pointer;
      }
      .result {
        text-align: center;
      }
      .burst {
        width: 110px;
        height: 110px;
        border-radius: 50%;
        background: rgba(20,200,230, 0.09);
        border: 1px solid rgba(20,200,230, 0.32);
        display: grid;
        place-items: center;
        margin: 14px auto;
        font: 400 38px 'Pretendard';
        box-shadow: 0 0 50px rgba(20,200,230, 0.12);
      }
      .result h2 {
        font: 400 34px 'Pretendard';
        margin: 5px;
      }
      .result p,
      .modal p {
        font-size: 13px;
        color: #6c6885;
        line-height: 1.7;
      }
      .items {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
        margin: 14px 0;
      }
      .item {
        border: 1px solid var(--line);
        background: #ffffff;
        border-radius: 9px;
        padding: 9px;
      }
      .thumb {
        height: 74px;
        border-radius: 6px;
        background: linear-gradient(145deg, #f3ebfb, #ffffff);
        display: grid;
        place-items: center;
        color: #6c6885;
        font: 400 22px 'Pretendard';
      }
      .item b {
        display: block;
        font-size: 13px;
        margin-top: 7px;
      }
      .item small {
        color: #6c6885;
        font-size: 13px;
      }
      .toast {
        position: fixed;
        left: 50%;
        bottom: 20px;
        background: var(--acid);
        color: #08222a;
        border-radius: 9px;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 800;
        transform: translate(-50%, 70px);
        opacity: 0;
        transition: 0.25s;
        z-index: 50;
      }
      .toast.show {
        transform: translate(-50%, 0);
        opacity: 1;
      }
      @media (max-width: 1050px) {
        .numbers {
          grid-template-columns: repeat(15, minmax(0, 1fr));
        }
      }
      @media (max-width: 760px) {
        .oripa-wrap nav { display: inline-flex !important;
        }
        .fileball-guide {
          grid-template-columns: 1fr;
          gap: 8px;
          padding: 12px;
        }
        .fileball-guide-mark span {
          width: 30px;
          height: 30px;
        }
        .fileball-guide-copy {
          font-size: 13px;
        }
        .fileball-guide-rate {
          min-width: 0;
          width: 100%;
        }
        .hit-grid {
          grid-template-columns: minmax(0, 1fr);
          gap: 8px;
        }
        .hit-set-summary {
          gap: 11px;
          padding: 11px 12px;
        }
        .hit-set-summary img {
          width: 52px;
          height: 66px;
        }
        .hit-set-summary b {
          font-size: 14px;
        }
        .hit-card {
          padding: 8px;
          border-radius: 11px;
        }
        .hit-card b {
          min-height: 29px;
          font-size: 13px;
        }
        .hit-card small strong {
          font-size: 13px;
        }
        .headline {
          align-items: start;
          flex-direction: column;
        }
        .wpe-summary {
          grid-template-columns: 1fr 1fr;
        }
        .boardShell {
          grid-template-columns: 1fr;
        }
        .winner-archive {
          position: static;
          display: grid;
          grid-template-columns: minmax(150px, 1fr) 230px;
          column-gap: 18px;
          padding: 18px;
        }
        .winner-archive .wpe-eyebrow { grid-column: 1; }
        .winner-archive h3 { grid-column: 1; margin-bottom: 4px; }
        .winner-archive .archive-count { grid-column: 1; }
        .winner-archive .archive-stack {
          grid-column: 2;
          grid-row: 1 / span 3;
          align-self: center;
          width: 100%;
          height: 170px;
          margin: 0;
        }
        .winner-archive .archive-thumb {
          width: 100px;
          height: 146px;
        }
        .winner-archive .archive-recent,
        .winner-archive .archive-open {
          grid-column: 1 / -1;
        }
        .numbers {
          grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
          padding: 10px;
        }
        .boardtop {
          align-items: flex-start;
          flex-direction: column;
          gap: 10px;
        }
        .legend {
          width: 100%;
          flex-wrap: wrap;
          gap: 8px 12px;
          padding-bottom: 2px;
        }
        .items {
          grid-template-columns: 1fr 1fr;
        }
        .wallet div {
          display: none;
        }
        .winner-history-grid {
          grid-template-columns: 1fr 1fr;
        }
        .notice-list {
          grid-template-columns: 1fr;
        }
        .notice-list li,
        .notice-list li:nth-child(odd),
        .notice-list li:nth-last-child(-n + 2) {
          border-right: 0;
          border-bottom: 1px solid var(--line);
        }
        .notice-list li:last-child {
          border-bottom: 0;
        }
      }
      @media (max-width: 430px) {
        .wrap {
          padding: 0 15px;
        }
        .numbers {
          grid-template-columns: repeat(5, minmax(0, 1fr));
          gap: 5px;
        }
        .wpe-summary {
          grid-template-columns: 1fr;
        }
        .pick { min-width: 0; font-size: 13px; }
        .pick-state { font-size: 13px; }
        .winner-archive {
          grid-template-columns: minmax(0, 1fr) 142px;
          column-gap: 8px;
          padding: 16px;
        }
        .winner-archive h3 { font-size: 21px; }
        .winner-archive .archive-stack { height: 145px; }
        .winner-archive .archive-thumb {
          width: 82px;
          height: 120px;
          top: 12px;
          border-width: 3px;
        }
        .notice-list li {
          grid-template-columns: 1fr;
          gap: 3px;
          min-height: 0;
          padding: 15px 17px;
        }
      }
      .shelf-product[data-tcg-winner]::before {
        position: absolute;
        left: 8px;
        top: 8px;
        z-index: 4;
        padding: 6px 8px;
        border-radius: 5px;
        color: #ffffff;
        background: #e0187f;
        box-shadow: 0 5px 14px rgba(0,0,0,.34);
        font-size: 13px;
        font-weight: 800;
        line-height: 1.35;
        letter-spacing: .04em;
        white-space: pre;
        text-align: left;
          content: "´ç÷ ¿Ï·á\A " attr(data-tcg-winner);
        }
      
      
      .daily-hit-zone {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 18px 0;
      }
      .hit-showcase {
        position: relative;
        overflow: visible;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: none;
      }
      .hit-showcase.tomorrow {
        background: none;
      }
      .hit-zone-head {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 15px;
      }
      .hit-zone-head h2 { 
        font-size: 21px;
      }
      .hit-zone-head p {
        margin: 0;
        color: #6c6885;
        font-size: 15px;
      }
      .daily-card-row {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px;
      }
      .daily-card {
        position: relative;
        min-width: 0;
        padding: 9px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.1);
        border-radius: 11px;
        background: linear-gradient(180deg, #f4f2fb, #ffffff);
        cursor: pointer;
        transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease, background-color .2s ease;
      }
      .daily-card:hover {
        background: #dae6f2;
        border-color: rgba(20,200,230,.42);
        box-shadow: 0 16px 34px rgba(0,0,0,.32);
        transform: translateY(-2px);
      }
      .daily-card:focus-visible {
        outline: 2px solid var(--acid-ink);
        outline-offset: 3px;
      }
      .daily-card img {
        display: block;
        margin: 0 auto;
        /*width: 100%;*/
        height: 235px;
        object-fit: contain;
        border-radius: 10px;
        background: #ffffff;
        filter: drop-shadow(0 3px 3px rgba(0,0,0,.3));
        transition: transform .22s ease;
      }
      .today .daily-card > img { padding-bottom: 0; }
      .daily-card:hover img { transform: translateY(-4px) rotate(-.5deg); }
      .daily-card-info { padding: 9px 2px 2px; }
      .daily-card-info b {
        text-align: center;
        display: block;
        margin: 4px 0;
        font-size: 15px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .daily-card-info small { color: #6c6885; font-size: 13px; }
      .market-price {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin: 8px 0 6px;
        padding: 8px 9px;
        border: 1px solid rgba(20,200,230,.18);
        border-radius: 8px;
        color: #16141f;
        background: rgba(20,200,230,.055);
      }
      .market-label {
        overflow: hidden;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: -.02em;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      .market-value {
        color: var(--acid-ink);
        font-size: 13px;
        font-weight: 900;
        white-space: nowrap;
      }
      .card-market-detail {
        display: grid;
        grid-template-columns: minmax(210px, 290px) minmax(0, 1fr);
        gap: 26px;
        align-items: center;
      }
      .card-market-visual {
        position: relative;
        padding: 18px;
        overflow: hidden;
        border: 1px solid rgba(20,18,40,.10);
        border-radius: 16px;
        background:
          radial-gradient(circle at 50% 14%, rgba(20,200,230,.18), transparent 46%),
          linear-gradient(145deg, #f7f6fc, #ffffff);
      }
      .card-market-visual::after {
        content: "KREAM REFERENCE";
        position: absolute;
        right: 12px;
        bottom: 9px;
        color: rgba(20,18,40,.14);
        font-size: 13px;
        font-weight: 900;
        letter-spacing: .13em;
      }
      .card-market-visual img {
        display: block;
        width: 100%;
        height: 340px;
        object-fit: contain;
        filter: drop-shadow(0 20px 18px rgba(0,0,0,.48));
      }
      .market-chip {
        display: inline-flex;
        padding: 6px 8px;
        border: 1px solid rgba(20,200,230,.32);
        border-radius: 999px;
        color: var(--acid-ink);
        background: rgba(20,200,230,.07);
        font-size: 13px;
        font-weight: 900;
        letter-spacing: .08em;
      }
      .card-market-copy h3 {
        margin: 12px 0 4px;
        font-size: clamp(24px, 4vw, 38px);
        letter-spacing: -.05em;
      }
      .card-market-copy > p { margin: 0 0 14px; }
      .wpe-market-hero {
        margin: 14px 0 10px;
        padding: 17px;
        border: 1px solid rgba(20,200,230,.24);
        border-radius: 13px;
        background: linear-gradient(145deg, rgba(20,200,230,.1), rgba(20,200,230,.025));
      }
      .wpe-market-hero span,
      .wpe-market-hero small {
        display: block;
        color: #6c6885;
        font-size: 13px;
      }
      .wpe-market-hero strong {
        display: block;
        margin: 3px 0 6px;
        color: var(--acid-ink);
        font-size: clamp(30px, 5vw, 46px);
        letter-spacing: -.06em;
      }
      .market-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }
      .market-stats span {
        padding: 11px 12px;
        border: 1px solid var(--line);
        border-radius: 10px;
        background: #ffffff;
      }
      .market-stats small,
      .market-stats b { display: block; }
      .market-stats small { color: #6c6885; font-size: 13px; }
      .market-stats b { margin-top: 4px; font-size: 13px; }
      .market-note {
        margin: 10px 0 14px;
        padding: 11px 12px;
        border-left: 2px solid #7a3df0;
        color: #6c6885;
        background: rgba(122,61,240,.06);
        font-size: 13px;
        line-height: 1.65;
      }
      .market-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
      }
      .market-source-link {
        display: grid;
        place-items: center;
        padding: 11px 18px;
        text-decoration: none;
      }
      .market-chart-wrap {
        margin: 11px 0;
        padding: 13px 13px 9px;
        border: 1px solid rgba(255,255,255,.085);
        border-radius: 12px;
        background: linear-gradient(180deg, rgba(20,200,230,.045), rgba(5,8,6,.34));
      }
      .market-chart-head,
      .market-chart-axis {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
      }
      .market-chart-head b {
        font-size: 13px;
        letter-spacing: -.02em;
      }
      .market-chart-note {
        color: #6c6885;
        font-size: 13px;
      }
      .market-chart-change {
        color: var(--acid-ink);
        font: 800 13px var(--type-number);
      }
      .market-chart-change.down { color: #e0187f; }
      .market-chart {
        display: block;
        width: 100%;
        height: 142px;
        margin-top: 10px;
        overflow: visible;
      }
      .market-chart-grid {
        stroke: rgba(20,18,40,.09);
        stroke-width: 1;
      }
      .market-chart-area { fill: rgba(20,200,230,.1); }
      .market-chart-line {
        fill: none;
        stroke: var(--acid);
        stroke-width: 3;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .market-chart-dot {
        fill: var(--acid);
        stroke: #14c8e6;
        stroke-width: 4;
      }
      .market-chart-axis {
        color: #6c6885;
        font-size: 13px;
      }
      .rarity {
        position: absolute;
        top: 16px;
        left: 16px;
        z-index: 2;
        padding: 5px 7px;
        border-radius: 5px;
        color: #fff;
        background: #e0187f;
        font-size: 13px;
        font-weight: 900;
      }
      /* ¿À´ÃÀÇ HIT Ä«µå: ´ç÷ ¿Ï·á ¹îÁö(Á»ó´Ü) + rarity ¿ì»ó´Ü À̵¿ (³»ÀÏ ¿¹°í µ¿ÀÏ) */
      .today .daily-card .rarity,
      .tomorrow .daily-card .rarity { left: auto; right: 16px; }
      .today .daily-card[data-tcg-winner]::before {
        position: absolute;
        left: 9px;
        top: 9px;
        z-index: 4;
        padding: 6px 8px;
        border-radius: 5px;
        color: #ffffff;
        background: #e0187f;
        box-shadow: 0 5px 14px rgba(0,0,0,.34);
        font-size: 13px;
        font-weight: 800;
        line-height: 1.35;
        letter-spacing: .04em;
        white-space: pre;
        text-align: left;
        pointer-events: none;
          content: "´ç÷ ¿Ï·á\A " attr(data-tcg-winner);
        }
      
      
      
      /* ³»ÀÏÀÇ HIT ¿¹°í Ä«µå¸¦ °¡¸®´ø ó¸®(Èæ¹é+¾îµÓ°Ô+ºí·¯)¸¦ °È¾î³Â´Ù.
         µÇ»ì¸®·Á¸é ¾Æ·¡ ÇÑ ÁÙÀÇ ÁÖ¼®À» ¹þ±â¸é µÈ´Ù. */
      .tomorrow .daily-card img {
        /* filter: grayscale(.7) brightness(.46) blur(1.2px); */
      }
      .tomorrow .daily-card::after {
        position: absolute; 
        inset: 9px 9px 54px;
        display: grid;
        place-items: center;
        border-radius: 7px;
        color: rgba(20,18,40,.72);
        /*content: "TOMORROW";
        background: linear-gradient(180deg, rgba(8,10,9,.08), rgba(8,10,9,.42));*/
        font-size: 13px;
        font-weight: 800;
        letter-spacing: .14em; 
      }
      @media (max-width: 900px) {
        .daily-hit-zone { grid-template-columns: 1fr; }
      }
      @media (max-width: 760px) {
        .hit-showcase.tomorrow { padding: 0; }
        .tomorrow .hit-zone-head { margin-bottom: 10px; }
        .tomorrow .hit-zone-head p { display: none; }
        .tomorrow .daily-card-row {
          grid-template-columns: repeat(3, minmax(0, 1fr));
          gap: 8px;
          overflow: visible;
        }
        .tomorrow .daily-card { padding: 7px; }
        .tomorrow .daily-card img { height: 128px; }
        .tomorrow .daily-card-info { padding: 7px 0 0; }
        .tomorrow .daily-card-info small { display: none; }
        .tomorrow .daily-card-info b { font-size: 13px; }
        .tomorrow .market-price { display: flex; padding: 7px 6px; }
        .tomorrow .market-label { display: none; }
        .tomorrow .market-value { width: 100%; text-align: center; }
        .tomorrow .daily-card::after { inset: 7px 7px 36px; font-size: 13px; }
      }
      @media (max-width: 560px) {
        
      .rarity {font-size: 11px;}
        .today .hit-zone-head {
          align-items: flex-start;
          flex-direction: column;
          gap: 6px;
        }
        .today .daily-card-row { overflow-x: auto; grid-template-columns: repeat(3, 155px); }
        .today .daily-card img { height: 210px; }
      }
      @media (max-width: 520px) {
        .modal { padding: 18px; }
        .mtop h2 { font-size: 23px; }
        .card-market-detail { grid-template-columns: 1fr; gap: 16px; }
        .card-market-visual { padding: 12px; }
        .card-market-visual img { height: min(42vh, 300px); }
        .card-market-copy h3 { margin-top: 9px; }
        .wpe-market-hero { margin-top: 10px; padding: 14px; }
        .winner-history-grid { grid-template-columns: 1fr; }
        .winner-history-card {
          display: grid;
          grid-template-columns: 98px minmax(0, 1fr);
          grid-template-rows: auto auto;
          gap: 5px 12px;
          min-height: 142px;
        }
        .winner-history-card img {
          grid-column: 1;
          grid-row: 1 / span 2;
          height: 124px;
        }
        .winner-history-card b {
          align-self: end;
          margin: 0;
          font-size: 14px;
        }
        .winner-history-card small {
          align-self: start;
          flex-direction: column;
          justify-content: start;
        }
      }
      /* ===== card-squeeze reveal ===== */
      .seal.dragging:before { animation-duration: 2s; filter: brightness(1.3) saturate(1.2); }
      .seal.dragging:after { animation-duration: 1.5s; filter: brightness(1.5) saturate(1.35); }
      .seal-glow { position:absolute; inset:-25%; z-index:0; pointer-events:none; filter:blur(8px);
        background: radial-gradient(circle at 50% 58%, rgba(212,23,154,.5), transparent 62%);
        opacity: calc(.22 + var(--p,0) * .78); transition: opacity .1s linear; }
      .card-stage { position:relative; width:150px; height:210px; margin:0 auto; z-index:2; perspective:1000px;
        touch-action:none; user-select:none; -webkit-user-select:none; }
      .card-layer { position:absolute; inset:0; border-radius:12px; overflow:hidden; box-shadow:0 12px 26px rgba(0,0,0,.3); }
      .card-front { background:#fff; z-index:1; isolation:isolate; backface-visibility:hidden; }
      .card-front:after { content:""; position:absolute; inset:0; pointer-events:none; background:rgba(14,16,24,.62); -webkit-backdrop-filter:blur(11px); backdrop-filter:blur(11px); opacity: calc(.74 + var(--p,0) * .26); transition: opacity .12s linear; }
      .card-front img { width:100%; height:100%; object-fit:cover; display:block; }
      .card-front .shine { position:absolute; inset:0; pointer-events:none; transform:translateX(-130%);
        background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.85) 48%, transparent 62%); }
      .card-front.revealed { animation: flipInReveal .62s cubic-bezier(.2,.8,.25,1.15) both; }
      .card-front.revealed .shine { animation: shineSweep .7s .08s ease-out forwards; }
      @keyframes cardpop { 0%{transform:scale(.92)} 42%{transform:scale(1.08)} 100%{transform:scale(1)} }
      @keyframes flipInReveal { 0%{transform:rotateY(-180deg) scale(.9);opacity:0} 50%{opacity:1} 100%{transform:rotateY(0deg) scale(1);opacity:1} }
      @keyframes shineSweep { to { transform: translateX(130%); } }
      .card-back { z-index:3; cursor:grab; touch-action:none; will-change:transform; backface-visibility:hidden;
        background: var(--oripa-card-back) center/cover no-repeat;
        border:1px solid #cfc7e6; box-shadow:0 12px 26px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.15); }
      .card-back.grabbing { cursor:grabbing; }
      .card-back.snap { transition: transform .4s cubic-bezier(.34,1.56,.64,1); }
      .card-back.gone { transform: rotateY(180deg) scale(.9) !important; opacity:0;
        transition: transform .55s cubic-bezier(.4,0,.2,1), opacity .5s ease-out; }
      .seal-burst { position:absolute; left:50%; top:50%; width:8px; height:8px; z-index:5; border-radius:50%;
        transform:translate(-50%,-50%); pointer-events:none; opacity:0; }
      .seal-burst.go { animation: sealBurst .6s ease-out; }
      @keyframes sealBurst { 0%{opacity:1; box-shadow:0 0 0 0 rgba(212,23,154,.95), 0 0 12px 6px rgba(212,23,154,.7);}
        100%{opacity:0; box-shadow:0 0 60px 50px rgba(212,23,154,0), 0 0 120px 90px rgba(212,23,154,0);} }
      .drag-hint { position:absolute; left:0; right:0; bottom:6px; text-align:center; z-index:4; pointer-events:none;
        color:var(--acid-ink); font:800 13px 'Pretendard'; letter-spacing:.05em; }
      .seal.dragging .drag-hint, .card-stage.opened ~ .drag-hint { opacity:0; }
      .seal-impact { position:absolute; inset:0; z-index:6; pointer-events:none; }
      .seal-bg { position:absolute; inset:0; z-index:1; background:url("/_template/service/images/07event_images/2026/08_pokemon/background.png") center/cover no-repeat; opacity:0; transition:opacity .55s ease; pointer-events:none; }
      .seal-bg.show { opacity:1; }
      /* ===== bling enhancement (multi-color + glitter + live background.png) ===== */
      .seal:before { background: repeating-conic-gradient(from 0deg,
          rgba(212,23,154,0) 0deg 6deg,
          rgba(212,23,154,.5) 7deg 8deg,
          rgba(255,255,255,.65) 8deg 9deg,
          rgba(20,200,230,.45) 10deg 12deg,
          rgba(255,255,255,.35) 12deg 13deg,
          rgba(212,23,154,0) 15deg 20deg); }
      .seal:after { background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.6), transparent 13%),
          conic-gradient(from 90deg, transparent, rgba(20,200,230,.62), transparent 13%),
          conic-gradient(from 180deg, transparent, rgba(212,23,154,.68), transparent 13%),
          conic-gradient(from 270deg, transparent, rgba(224,24,127,.5), transparent 12%); }
      .seal-glow { background:
          radial-gradient(circle at 50% 60%, rgba(212,23,154,.55), transparent 60%),
          radial-gradient(circle at 28% 32%, rgba(20,200,230,.42), transparent 55%),
          radial-gradient(circle at 72% 40%, rgba(224,24,127,.30), transparent 55%); }
      .seal-bg { opacity: calc(.30 + var(--p,0) * .55); transition: opacity .3s ease;
          animation: bgPulse 3.4s ease-in-out infinite; }
      .seal-bg.show { opacity: 1; }
      .seal-sparkle { position:absolute; inset:0; z-index:7; pointer-events:none; mix-blend-mode:screen;
          background-image:
            radial-gradient(circle, #ffffff 0 1.2px, transparent 2px),
            radial-gradient(circle, #14c8e6 0 1.2px, transparent 2px),
            radial-gradient(circle, #14c8e6 0 1px, transparent 2px),
            radial-gradient(circle, #e0187f 0 1px, transparent 2px),
            radial-gradient(circle, #ffffff 0 1px, transparent 2px);
          background-size: 70px 70px, 100px 100px, 130px 130px, 90px 90px, 55px 55px;
          background-position: 12px 20px, 45px 65px, 8px 95px, 65px 35px, 30px 120px;
          opacity:.55; animation: twinkle 1.3s ease-in-out infinite, sparkleDrift 6s linear infinite; }
      .seal.dragging .seal-sparkle { animation-duration: .7s, 4s; filter: brightness(1.6) drop-shadow(0 0 3px #fff); }
      @keyframes twinkle { 0%,100%{opacity:.25} 50%{opacity:.95} }
      @keyframes sparkleDrift { to { background-position: 12px -50px, 45px -5px, 8px 25px, 65px -35px, 30px 50px; } }
      @keyframes bgPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} }
      @keyframes sealBurst {
        0%{opacity:1; box-shadow:0 0 0 0 rgba(255,255,255,.95), 0 0 16px 8px rgba(212,23,154,.85);}
        50%{box-shadow:0 0 42px 26px rgba(20,200,230,.45), 0 0 74px 44px rgba(212,23,154,.4);}
        100%{opacity:0; box-shadow:0 0 96px 74px rgba(20,200,230,0), 0 0 150px 110px rgba(224,24,127,0);} }
      /* ===== multi-spin reveal + 360 background ===== */
      .card-front.revealed { animation: flipInReveal .95s cubic-bezier(.15,.72,.2,1) both; }
      @keyframes flipInReveal {
        0%   { transform: rotateY(-1080deg) scale(.72); opacity: 0; }
        18%  { opacity: .4; }
        78%  { opacity: 1; }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }
      .seal-bg { inset: auto; left: 50%; top: 50%; width: 1040px; height: 1040px;
        background: url("/_template/service/images/07event_images/2026/08_pokemon/background.png") center/cover no-repeat; z-index: 1; pointer-events: none;
        opacity: calc(.30 + var(--p,0) * .55); transition: opacity .3s ease;
        -webkit-mask-image:radial-gradient(circle closest-side, #000 62%, transparent 98%); mask-image:radial-gradient(circle closest-side, #000 62%, transparent 98%);
        transform: translate(-50%,-50%); animation: bgSpin 12s linear infinite; }
      .seal-bg.show { opacity: 1; }
      @keyframes bgSpin { from { transform: translate(-50%,-50%) rotate(0deg); } to { transform: translate(-50%,-50%) rotate(360deg); } }
      /* ===== vivid + soft lines + faster flip ===== */
      .seal:before { filter: blur(2.5px); background: repeating-conic-gradient(from 0deg,
          rgba(212,23,154,0) 0deg 5deg,
          rgba(212,23,154,.5) 6deg 7deg,
          rgba(255,255,255,.6) 7deg 8deg,
          rgba(20,200,230,.5) 9deg 11deg,
          rgba(224,24,127,.45) 12deg 14deg,
          rgba(62,220,190,.4) 15deg 16deg,
          rgba(212,23,154,0) 18deg 22deg); }
      .seal:after { filter: blur(3px); background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.6), transparent 12%),
          conic-gradient(from 72deg, transparent, rgba(20,200,230,.62), transparent 12%),
          conic-gradient(from 144deg, transparent, rgba(212,23,154,.68), transparent 12%),
          conic-gradient(from 216deg, transparent, rgba(224,24,127,.55), transparent 12%),
          conic-gradient(from 288deg, transparent, rgba(62,220,190,.5), transparent 11%); }
      .seal-glow { filter: blur(16px); background:
          radial-gradient(circle at 50% 60%, rgba(212,23,154,.55), transparent 60%),
          radial-gradient(circle at 28% 32%, rgba(20,200,230,.48), transparent 55%),
          radial-gradient(circle at 72% 40%, rgba(224,24,127,.42), transparent 55%),
          radial-gradient(circle at 55% 78%, rgba(62,220,190,.36), transparent 55%); }.seal.dragging:before {
  animation-duration: 2s; filter: brightness(1.3) saturate(1.2);
  filter: blur(2px) brightness(1.35) saturate(1.35); animation-duration: 1.2s;
}.seal.dragging:after {
  animation-duration: 1.5s; filter: brightness(1.5) saturate(1.35);
  filter: blur(2.5px) brightness(1.55) saturate(1.4); animation-duration: .9s;
}
      @keyframes sealBurst {
        0%{opacity:1; box-shadow:0 0 0 0 rgba(255,255,255,.95), 0 0 18px 9px rgba(212,23,154,.9);}
        45%{box-shadow:0 0 46px 28px rgba(224,24,127,.5), 0 0 80px 48px rgba(62,220,190,.42);}
        100%{opacity:0; box-shadow:0 0 104px 80px rgba(20,200,230,0), 0 0 160px 120px rgba(224,24,127,0);} }
      .card-front.revealed { animation: flipInReveal .6s cubic-bezier(.12,.7,.2,1) both; }
      /* drag-accelerated background rotation (JS-driven) */
      .seal:before { animation: none !important; transform: rotate(var(--spinA, 0deg)); }
      .seal:after { animation: none !important; transform: rotate(calc(var(--spinA, 0deg) * -1)); }
      .seal-bg { animation: none !important; transform: translate(-50%, -50%) rotate(var(--spinBg, 0deg)); }
      .seal-bg2 { position:absolute; inset:auto; left:50%; top:50%; width:1240px; height:827px;
        /*background:url("/_template/service/images/07event_images/2026/08_pokemon/background2.png") center/contain no-repeat; */z-index:1; pointer-events:none; mix-blend-mode:screen;
        -webkit-mask-image:radial-gradient(circle closest-side, #000 58%, transparent 97%); mask-image:radial-gradient(circle closest-side, #000 58%, transparent 97%);
        opacity: calc(.22 + var(--p,0) * .5); transition:opacity .3s ease;
        transform: translate(-50%,-50%) rotate(calc(var(--spinBg,0deg) * -1)); }
      .seal-bg2.show { opacity: .92 !important; }
      @keyframes flipInReveal {
        0%   { transform: rotateY(-1800deg) scale(.66); opacity: 0; }
        14%  { opacity: .35; }
        80%  { opacity: 1; }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }
      .card-front.revealed { animation: flipInReveal .85s cubic-bezier(.14,.72,.2,1) both; }
      /* background2 to front */
      .seal-bg2 { z-index: 8; }
      .seal-bg2.show { opacity: .8 !important; }
      /* card flip: fast spin -> gradual slow-down landing */
      @keyframes flipInReveal {
        0%   { transform: rotateY(-1800deg) scale(.62); opacity: 0; }
        12%  { opacity: .4; }
        40%  { opacity: 1; }
        50%  { transform: rotateY(-540deg) scale(.9); }
        75%  { transform: rotateY(-180deg) scale(.97); }
        90%  { transform: rotateY(-55deg) scale(.99); }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }
      .card-front.revealed { animation: flipInReveal 1.05s linear both; }
      .card-front.revealed:after { opacity: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
      /* both background images behind the front card */
      .seal-bg2 { z-index: 1; }
      .seal-bg2.show { opacity: .9 !important; }
      /* background2 in front of card face, translucent glare */
      .seal-bg2 { z-index: 8; opacity: calc(.18 + var(--p,0) * .32); }
      .seal-bg2.show { opacity: .45 !important; }
      /* background2 blinks while dragging; background.png flashes in on reveal */
      .seal-bg { opacity: 0; }.seal-bg.show {
  opacity:1;
  opacity: 1;
  opacity: 1;
  animation: bgFlash .95s ease-out both !important;
}
      @keyframes bgFlash { 0%,68%{opacity:0} 80%{opacity:1} 100%{opacity:1} }
      .seal.dragging .seal-bg2 { animation: bg2Blink .3s steps(1,end) infinite; }
      @keyframes bg2Blink { 0%,44%{opacity:.6} 48%,100%{opacity:0} }
      /* steady background2 (no blink) */
      .seal-bg2 { opacity: .35; }.seal.dragging .seal-bg2 {
  animation: bg2Blink .3s steps(1,end) infinite;
  animation: none;
}
      /* soft/hazy background.png */
      .seal-bg { filter: blur(8px); }
      /* background2 behind the front card */
      .seal-bg2 { z-index: 1; }
      /* background pop (shrink->grow) driven by --bgScale */
      .seal-bg { transform: translate(-50%,-50%) rotate(var(--spinBg,0deg)) scale(var(--bgScale,1)); }
      .seal-bg2 { transform: translate(-50%,-50%) rotate(calc(var(--spinBg,0deg) * -1)) scale(var(--bgScale,1)); }
      .seal-bg2.show { opacity: 1 !important; }
      /* background2: in front of back card while dragging, behind once opened */
      .seal-bg2 { z-index: 8; }.seal-bg2.show {
  opacity: .92 !important;
  opacity: .8 !important;
  opacity: .9 !important;
  opacity: .45 !important;
  opacity: 1 !important;
  z-index: 1;
}.seal-bg2 {
  position:absolute; inset:auto; left:50%; top:50%; width:1240px; height:827px;
        /*background:url("/_template/service/images/07event_images/2026/08_pokemon/background2.png") center/contain no-repeat; */z-index:1; pointer-events:none; mix-blend-mode:screen;
        -webkit-mask-image:radial-gradient(circle closest-side, #000 58%, transparent 97%); mask-image:radial-gradient(circle closest-side, #000 58%, transparent 97%);
        opacity: calc(.22 + var(--p,0) * .5); transition:opacity .3s ease;
        transform: translate(-50%,-50%) rotate(calc(var(--spinBg,0deg) * -1));
  z-index: 8;
  z-index: 1;
  z-index: 8; opacity: calc(.18 + var(--p,0) * .32);
  opacity: .35;
  z-index: 1;
  transform: translate(-50%,-50%) rotate(calc(var(--spinBg,0deg) * -1)) scale(var(--bgScale,1));
  z-index: 8;
  transform: translate(-50%,-50%) rotate(calc(var(--spinBg,0deg) * -0.8)) scale(var(--bgScale,1));
}
      /* burst badge to the left of the title, sized to the text */
      .result { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px; }
      .burst { width: 40px; height: 40px; margin: 0; font: 700 19px 'Pretendard'; box-shadow: 0 0 22px rgba(212,23,154,.18); }
      .result h2 { margin: 0; }
      .result p { flex-basis: 100%; margin-top: 8px; }
      /* headline accent color */
      .headline h1 .ora { background: linear-gradient(120deg, #14c8e6, #ff8a2b); -webkit-background-clip: text; background-clip: text; color: transparent; }
      .headline h1 .hit { color: #14c8e6; }
      /* white flash on reveal */
      .seal-flash { position:absolute; inset:0; z-index:9; background:#fff; opacity:0; pointer-events:none; }
      .seal-flash.go { animation: sealFlash .66s ease-out; }
      @keyframes sealFlash { 0%{opacity:0} 30%{opacity:1} 46%{opacity:1} 100%{opacity:0} }
      /* spinning impact background: gold + white only */
      .seal:before { background: repeating-conic-gradient(from 0deg,
          rgba(20,200,230,0) 0deg 5deg,
          rgba(20,200,230,.55) 6deg 7deg,
          rgba(255,255,255,.72) 8deg 9deg,
          rgba(20,200,230,.5) 10deg 11deg,
          rgba(255,255,255,.4) 12deg 13deg,
          rgba(20,200,230,0) 16deg 21deg); }.seal:after {
  content: "";
        position: absolute;
        inset: -70%;
        background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.42), transparent 16%),
          conic-gradient(from 150deg, transparent, rgba(20,200,230,.55), transparent 15%),
          conic-gradient(from 280deg, transparent, rgba(20,200,230,.48), transparent 14%);
        mix-blend-mode: screen;
        animation: turnRev 4.5s linear infinite;
  background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.6), transparent 13%),
          conic-gradient(from 90deg, transparent, rgba(20,200,230,.62), transparent 13%),
          conic-gradient(from 180deg, transparent, rgba(212,23,154,.68), transparent 13%),
          conic-gradient(from 270deg, transparent, rgba(224,24,127,.5), transparent 12%);
  filter: blur(3px); background:
          conic-gradient(from 0deg, transparent, rgba(255,255,255,.6), transparent 12%),
          conic-gradient(from 72deg, transparent, rgba(20,200,230,.62), transparent 12%),
          conic-gradient(from 144deg, transparent, rgba(212,23,154,.68), transparent 12%),
          conic-gradient(from 216deg, transparent, rgba(224,24,127,.55), transparent 12%),
          conic-gradient(from 288deg, transparent, rgba(62,220,190,.5), transparent 11%);
  animation: none !important; transform: rotate(calc(var(--spinA, 0deg) * -1));
  background:
          conic-gradient(from 0deg,   transparent, rgba(20,200,230,.70), transparent 12%),
          conic-gradient(from 60deg,  transparent, rgba(122,61,240,.62), transparent 12%),
          conic-gradient(from 120deg, transparent, rgba(255,255,255,.62), transparent 12%),
          conic-gradient(from 180deg, transparent, rgba(212,23,154,.60), transparent 12%),
          conic-gradient(from 240deg, transparent, rgba(224,24,127,.55), transparent 12%),
          conic-gradient(from 300deg, transparent, rgba(122,61,240,.52), transparent 12%);
}.seal-glow {
  position:absolute; inset:-25%; z-index:0; pointer-events:none; filter:blur(8px);
        background: radial-gradient(circle at 50% 58%, rgba(212,23,154,.5), transparent 62%);
        opacity: calc(.22 + var(--p,0) * .78); transition: opacity .1s linear;
  background:
          radial-gradient(circle at 50% 60%, rgba(212,23,154,.55), transparent 60%),
          radial-gradient(circle at 28% 32%, rgba(20,200,230,.42), transparent 55%),
          radial-gradient(circle at 72% 40%, rgba(224,24,127,.30), transparent 55%);
  filter: blur(16px); background:
          radial-gradient(circle at 50% 60%, rgba(212,23,154,.55), transparent 60%),
          radial-gradient(circle at 28% 32%, rgba(20,200,230,.48), transparent 55%),
          radial-gradient(circle at 72% 40%, rgba(224,24,127,.42), transparent 55%),
          radial-gradient(circle at 55% 78%, rgba(62,220,190,.36), transparent 55%);
  background:
          radial-gradient(circle at 50% 60%, rgba(20,200,230,.55), transparent 60%),
          radial-gradient(circle at 30% 34%, rgba(122,61,240,.46), transparent 55%),
          radial-gradient(circle at 70% 40%, rgba(212,23,154,.40), transparent 55%),
          radial-gradient(circle at 55% 80%, rgba(224,24,127,.34), transparent 55%);
}
      /* longer white flash */
      .seal-flash.go { animation: sealFlash 1.15s ease-out; }
      @keyframes sealFlash { 0%{opacity:0} 18%{opacity:1} 52%{opacity:1} 100%{opacity:0} }.seal:before {
  content: "";
        position: absolute;
        inset: -70%;
        background: repeating-conic-gradient(from 0deg,
          rgba(20,200,230,0) 0deg 9deg,
          rgba(20,200,230,.30) 11deg 12deg,
          rgba(255,238,160,.62) 13deg 14deg,
          rgba(20,200,230,.30) 15deg 16deg,
          rgba(20,200,230,0) 18deg 24deg);
        animation: turn 7s linear infinite;
  background: repeating-conic-gradient(from 0deg,
          rgba(212,23,154,0) 0deg 6deg,
          rgba(212,23,154,.5) 7deg 8deg,
          rgba(255,255,255,.65) 8deg 9deg,
          rgba(20,200,230,.45) 10deg 12deg,
          rgba(255,255,255,.35) 12deg 13deg,
          rgba(212,23,154,0) 15deg 20deg);
  filter: blur(2.5px); background: repeating-conic-gradient(from 0deg,
          rgba(212,23,154,0) 0deg 5deg,
          rgba(212,23,154,.5) 6deg 7deg,
          rgba(255,255,255,.6) 7deg 8deg,
          rgba(20,200,230,.5) 9deg 11deg,
          rgba(224,24,127,.45) 12deg 14deg,
          rgba(62,220,190,.4) 15deg 16deg,
          rgba(212,23,154,0) 18deg 22deg);
  animation: none !important; transform: rotate(var(--spinA, 0deg));
  background: repeating-conic-gradient(from 0deg,
          rgba(20,200,230,0) 0deg 5deg,
          rgba(20,200,230,.55) 6deg 7deg,
          rgba(255,255,255,.72) 8deg 9deg,
          rgba(20,200,230,.5) 10deg 11deg,
          rgba(255,255,255,.4) 12deg 13deg,
          rgba(20,200,230,0) 16deg 21deg);
  background: repeating-conic-gradient(from 0deg,
          rgba(20,200,230,0) 0deg 4deg,
          rgba(20,200,230,.58) 5deg 9deg,
          rgba(122,61,240,.52) 10deg 14deg,
          rgba(255,255,255,.6) 15deg 17deg,
          rgba(212,23,154,.5) 18deg 22deg,
          rgba(224,24,127,.45) 23deg 27deg,
          rgba(20,200,230,0) 30deg 36deg);
}
      /* obscured card a bit more visible (less black) */
      .card-front:after { background:rgba(22,24,34,.46); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); opacity: calc(.4 + var(--p,0) * .28); }
      /* pick state shown by background color only (labels removed) */
      .pick-state { display: none !important; }
      /* center the pick number */
      .pick-number { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; text-align: center; }
      /* reveal video (black bg -> transparent via screen) */
      .seal-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:10; opacity:0; pointer-events:none; mix-blend-mode:screen; transition:opacity .18s ease; }
      .seal-video.go { opacity:1; }
      /* removed micro-labels */
      .shelf-product::after { display: none !important; }
      .shelf-meta small { display: none !important; }
      /* full-bleed top background (excludes header), centered & stays centered */
      /* hidden Àº ½ºÅ©·Ñ ÄÁÅ×À̳ʸ¦ ¸¸µé¾î »ó´Ü ¸Þ´º sticky ¸¦ °¡µÐ´Ù - clip Àº À߶󳻱⸸ ÇÑ´Ù */
      .oripa-wrap { overflow-x: clip; }
      .top-hero {
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        background: url("/_template/service/images/07event_images/2026/08_pokemon/w_top_bg_new2.jpg") center center no-repeat;
        background-size: cover;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .top-hero img { display: block; margin: 0 auto; max-width: min(1080px, 100%); }
      /* bg2 full (bigger, extends down & overlaps shelf); img1 on top */
      .top-hero { display: block; position: relative; aspect-ratio: 1920 / 771; background-position: center top; margin-bottom: -5vw; z-index: 0; }
      .top-hero img { position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: min(1080px, 100%); z-index: 1; }
      /* bg2 as fixed-size, non-shrinking, centered layer BEHIND everything (meshes with shelf, no gap) */
      .top-hero { display: block; position: relative; margin: 0; aspect-ratio: auto; background: none; z-index: auto; overflow: visible; }
      .top-hero::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw;
        height: 771px;
        background: url("/_template/service/images/07event_images/2026/08_pokemon/w_top_bg_new2.jpg") center top no-repeat;
        background-size: auto;
        z-index: -1;
        pointer-events: none;
      }
      .top-hero img { position: static; display: block; margin: 0 auto; width: min(1080px, 100%); transform: none; z-index: auto; }
      /* img1 also fixed native size so it never drifts from bg2 on resize */
      .top-hero { width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); overflow: hidden; }
      .top-hero img { width: 1080px; max-width: none; margin: 0 auto; }
      /* keep top-hero open so bg2 can extend down; center img1 by transform (aligns with bg2, no drift) */
      .top-hero { width: auto; margin: 0; overflow: visible; }
      .top-hero img { position: relative; left: 50%; transform: translateX(-50%); width: 1080px; max-width: none; margin: 0; }
      /* bg2 as a real layer behind hero content (not clipped by oripa-wrap bg) */
      .hero-zone { position: relative; isolation: isolate; }
      .hero-bg {
        position: absolute; top: 0; left: 50%; transform: translateX(-50%);
        width: 100vw; height: 771px;
        background: url("/_template/service/images/07event_images/2026/08_pokemon/w_top_bg_new2.jpg") center top no-repeat;
        background-size: auto;
        z-index: 0; pointer-events: none;
      }
      .hero-zone > .top-hero, .hero-zone > .showcase-label { position: relative; z-index: 1; }
      .top-hero::before { content: none !important; }
      /* match '»ó½Ã ¿À¸®ÆÄ ¶óÀξ÷' to '¿À´ÃÀÇ HIT Ä«µå' size */
      .showcase-label b { font-size: 21px; }.seal {
  height: 500px;
        margin: 16px 0;
        background: radial-gradient(circle at 50% 42%, #ffffff, #e4dcf6 72%);
        border: 0;
        border-radius: 12px;
        display: grid;
        place-items: center;
        text-align: center;
        position: relative;
        overflow: hidden;
  height: 400px; 
}
      .card-stage { width: 230px; height: 322px; }
      /* restore big responsive top image */
      .top-hero { width: auto; margin: 0; overflow: visible; }
      .top-hero img { position: static; left: auto; transform: none; width: 100%; max-width: min(1080px, 100%); margin: 0 auto; display: block; }
      /* relocated centered nav + wallet (header removed) */
      /* ¸Þ´º´Â ÁÂÃø Á¤·Ä (¿ìÃø Áö°©°úÀÇ °ãħÀº Çã¿ë) */
      .oripa-topnav { position: sticky; top: 0; z-index: 90; display: flex; justify-content: flex-start; align-items: center; padding: 10px 0 16px; }
      .oripa-topnav.stuck {
        padding: 8px 12px;
        background: rgba(236, 235, 249, .88);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        box-shadow: 0 8px 22px rgba(20, 18, 40, .08);
      }
      .oripa-nav { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
      .oripa-topnav .wallet { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: 10px; }
      .hero-zone > *:not(.hero-bg) { position: relative; z-index: 1; }
      /* card BACK image -> card_jp.png */
      .card-back { background: url("/_template/service/images/07event_images/2026/08_pokemon/card_jp.png") center / cover no-repeat; }
      @media (max-width: 620px) {
        .oripa-topnav { flex-direction: column; gap: 10px; }
        .oripa-topnav .wallet { position: static; transform: none; }
      }
      /* pretty nav (segmented pill, centered) + wallet pill */
      .oripa-topnav { padding: 14px 0 20px; }
      .oripa-nav { display: inline-flex; gap: 6px; justify-content: center; flex-wrap: wrap; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 6px; box-shadow: 0 6px 18px rgba(20,18,40,.07); }
      .oripa-nav .navbtn { border: 0; background: transparent; color: #6c6885; padding: 10px 22px; font-weight: 800; font-size: 14px; border-radius: 999px; cursor: pointer; transition: background .15s, color .15s; }
      .oripa-nav .navbtn:hover { color: #16141f; background: rgba(20,200,230,.08); }
      .oripa-nav .navbtn.active { color: #16141f; background: var(--acid); box-shadow: 0 3px 10px rgba(20,200,230,.45); }
      .oripa-topnav .wallet { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 5px 5px 5px 15px; box-shadow: 0 6px 18px rgba(20,18,40,.07); }
      .oripa-topnav .wallet > div { display: flex !important; align-items: baseline; gap: 6px; }
      .oripa-topnav .wallet small { display: inline; color: #6c6885; font-size: 11px; font-weight: 800; letter-spacing: .04em; }
      .oripa-topnav .wallet b { font-size: 16px; color: var(--acid-ink); }
      .oripa-topnav .outline { border: 0; background: var(--acid-ink); color: #fff; border-radius: 999px; padding: 8px 16px; font-weight: 800; font-size: 13px; }
      .oripa-topnav .outline:hover { filter: brightness(1.1); }
      @media (max-width: 620px) { .oripa-topnav .wallet { position: static; transform: none; } }
      /* popup card frame matched to card_jp.png ratio (1824:2328) */
      .card-stage { width: 240px; height: 306px; }.card-stage {
  position:relative; width:150px; height:210px; margin:0 auto; z-index:2; perspective:1000px;
        touch-action:none; user-select:none; -webkit-user-select:none;
  width: 230px; height: 322px;
  width: 240px; height: 306px;
  width: 230px; height: 322px;
}
      .card-back { background: url("/_template/service/images/07event_images/2026/08_pokemon/card_jp.png") center / cover no-repeat; }
      .oripa-topnav .wallet .fb-icon { height: 24px; width: auto; display: block; }
      /* bg2 scales with img1 (1920/1080 of content width) so they stay aligned */
      .hero-bg { width: 177.78%; height: auto; aspect-ratio: 1920 / 771; background: url("/_template/service/images/07event_images/2026/08_pokemon/w_top_bg_new2.jpg") center top / 100% 100% no-repeat; }
      /* faster spin, card barely visible mid-spin, pops in on landing */
      @keyframes flipInReveal {
        0%   { transform: rotateY(-2160deg) scale(.68); opacity: 0; }
        55%  { opacity: 0; }
        72%  { opacity: .35; }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }
      .card-front.revealed { animation: flipInReveal 0.55s cubic-bezier(.2,.78,.25,1) both; }
      /* visible-but-fast spin */
      @keyframes flipInReveal {
        0%   { transform: rotateY(-1440deg) scale(.75); opacity: 0; }
        18%  { opacity: 1; }
        55%  { transform: rotateY(-360deg) scale(.95); }
        80%  { transform: rotateY(-120deg) scale(.98); }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }
      .card-front.revealed { animation: flipInReveal 0.85s cubic-bezier(.15,.72,.2,1) both; }
      /* revert to original reveal spin */
      @keyframes flipInReveal {
        0%   { transform: rotateY(-1800deg) scale(.62); opacity: 0; }
        12%  { opacity: .4; }
        40%  { opacity: 1; }
        50%  { transform: rotateY(-540deg) scale(.9); }
        75%  { transform: rotateY(-180deg) scale(.97); }
        90%  { transform: rotateY(-55deg) scale(.99); }
        100% { transform: rotateY(0deg) scale(1); opacity: 1; }
      }.card-front.revealed {
  animation: flipInReveal .62s cubic-bezier(.2,.8,.25,1.15) both;
  animation: flipInReveal .95s cubic-bezier(.15,.72,.2,1) both;
  animation: flipInReveal .6s cubic-bezier(.12,.7,.2,1) both;
  animation: flipInReveal .85s cubic-bezier(.14,.72,.2,1) both;
  animation: flipInReveal 1.05s linear both;
  animation: flipInReveal 0.55s cubic-bezier(.2,.78,.25,1) both;
  animation: flipInReveal 0.85s cubic-bezier(.15,.72,.2,1) both;
  animation: flipInReveal 1.05s linear both;
}.card-front {
  background:#fff; z-index:1; isolation:isolate; backface-visibility:hidden;
  backface-visibility: visible !important;
}.card-back {
  z-index:3; cursor:grab; touch-action:none; will-change:transform; backface-visibility:hidden;
        background: var(--oripa-card-back) center/cover no-repeat;
        border:1px solid #cfc7e6; box-shadow:0 12px 26px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.15);
  background: url("/_template/service/images/07event_images/2026/08_pokemon/card_jp.png") center / cover no-repeat;
  background: url("/_template/service/images/07event_images/2026/08_pokemon/card_jp.png") center / cover no-repeat;
  backface-visibility: visible !important;
}.seal-flash.go {
  animation: sealFlash .66s ease-out;
  animation: sealFlash 1.15s ease-out;
  animation: sealFlash 0.5s ease-out;
}
      @keyframes sealFlash { 0%{opacity:0} 30%{opacity:1} 45%{opacity:1} 100%{opacity:0} }
      /* unify all section titles: same size (21px), bold */
      .hit-zone-head h2,
      .showcase-label b,
      .boardtop b,
      .winner-archive h3{ font-size: 26px !important; font-weight: 800 !important; }
      .seal-subtitle { text-align: center; color: #6c6885; font-size: 13px; font-weight: 700; margin: 0 0 10px; }
      /* daily hit card: hover spin + background3 video overlay */
      .daily-card { perspective: 700px; }
      .daily-card img { backface-visibility: visible; }
      .daily-card:hover img { animation: dcSpin 1.4s linear infinite; }
      @keyframes dcSpin { to { transform: rotateY(360deg); } }
      .dc-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 5; opacity: 0; pointer-events: none; mix-blend-mode: screen; border-radius: 11px; transition: opacity .2s ease; }
      .daily-card:hover .dc-video { opacity: 1; }
      /* === TOP simplified: single w_top_bg4a banner, centered, dark base #ecebf9 === */
      html { margin: 0 !important; padding: 0 !important; overflow-x: hidden !important; }
      body { margin: 0 !important; padding: 0 !important; overflow-x: clip !important; }
      body, .oripa-wrap { background: #ecebf9 !important; }
      .hero-zone { background: #ecebf9 !important; }
      .hero-bg { display: none !important; }
      .top-hero::before { content: none !important; }
      .top-hero img { display: block !important; width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; height: auto !important; max-width: none !important; position: static !important; left: auto !important; transform: none !important; }
      .top-hero {
        display: block !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        height: auto !important;
        background: #ecebf9 !important;
        overflow: visible !important;
      }
      .hero-zone .showcase-label b, .hero-zone > b { color: #16141f !important; }
      /* nav + wallet overlap up into the banner image (sticky must stay - no position override) */
      .oripa-topnav { margin-top: -400px !important; }
      /* dark text on green accents */
      .oripa-nav .navbtn.active { color: #08222a !important; }
      .navbtn.active { color: #08222a !important; }
      .store-shelf > .showcase-label { grid-column: 1 / -1; margin: 0 0 6px; }
      /* full responsive: tracks & items shrink so nothing overflows */
      .store-shelf { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
      .items { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
      .shelf-image { min-width: 0 !important; }
      .store-shelf img, .daily-card img, .hit-card img, .items img, .card-market-visual img, .winner-history-card img, .shelf-image img { max-width: 100% !important; }
      @media (max-width: 860px){
        
        .store-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        .items { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
        .oripa-topnav { margin-top: 6px !important; }
      }
      @media (max-width: 440px){
        .store-shelf { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
      }
      /* scroll-to-top button beside content (right) */
      .w-to-top { position: fixed; bottom: 26px; right: max(16px, calc((100vw - 1080px) / 2 - 56px)); z-index: 60; width: 46px; height: 46px; border-radius: 50%; background: var(--acid); color: #08222a; border: 0; font-size: 20px; font-weight: 900; line-height: 46px; text-align: center; cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .2s ease; box-shadow: 0 8px 22px rgba(0,0,0,.45); }
      .w-to-top.show { opacity: 1; pointer-events: auto; }
      .w-to-top:hover { transform: translateY(-2px); }
      .daily-card, .shelf-product, .pick, .hit-card, .items > *, .store-shelf > * { min-width: 0 !important; }
    
      /* === mobile isolation + responsive fixes (2026 added) === */
      html, body { min-width: 0 !important; }
      @media (max-width: 1180px){
        #wrapper,#container,#contents_main,#contents_body,#footer,.con,.bot_t,.top_wrap,.top_h,.search_top,.sub_con,.sitemapin,.gnb ul { width:100% !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box; }
      }
      .daily-card-row { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
      .w-to-top { width:54px !important; height:54px !important; line-height:54px !important; font-size:26px !important; z-index:120 !important; background:#16141f !important; color:#08222a !important; border:1px solid rgba(20,200,230,.5) !important; box-shadow:0 6px 18px rgba(0,0,0,.35) !important; }
      @media (max-width: 620px){
        /* 2-up removed; horizontal slide applies below */
        .store-shelf { padding-top: 58px !important; }
        .store-shelf::before { white-space: pre !important; height:auto !important; line-height:1.35 !important; padding-top:6px !important; padding-bottom:6px !important; content:"TODAY'S HIT BOX SHOWCASE\A OPEN 00:00" !important; }
        .w-to-top { bottom: 84px !important; }
      }
    
      /* top banner: fixed size (no shrink) + center crop; scale only on mobile (<=860px) */
      /* ºäÆ÷Æ®°¡ ¾Æ´Ï¶ó ÄÜÅÙÃ÷ Ä÷³ Á߽ɿ¡ °íÁ¤ - Ãʱ¤Æø â¿¡¼­µµ º»¹®°ú ¾î±ß³ªÁö ¾Ê´Â´Ù */
      .top-hero { width:auto !important; margin-left:0 !important; margin-right:0 !important; overflow:visible !important; display:block !important; }
      .top-hero picture { display:block !important; width:100% !important; }
      .top-hero img { display:block !important; width:1920px !important; min-width:0 !important; max-width:none !important; height:auto !important; margin:0 !important; position:relative !important; left:50% !important; transform:translateX(-50%) !important; }
      @media (max-width:860px){
        .top-hero img { width:100% !important; min-width:0 !important; left:auto !important; transform:none !important; }
      }
      /* »ó´Ü ¹è³Ê ÇÏ´Ü Åõ¸í ÆäÀ̵å (w_top_bg_new2 / m_top_bg4 °øÅë) */
      .top-hero img { -webkit-mask-image: linear-gradient(to bottom, #000 66%, transparent 100%) !important; mask-image: linear-gradient(to bottom, #000 66%, transparent 100%) !important; }

      /* HIT cards: mobile horizontal slide (2 full + 1 half visible) */
      @media (max-width:860px){
        .daily-hit-zone, .hit-showcase { min-width:0 !important; max-width:100% !important; }
        .today .daily-card-row, .tomorrow .daily-card-row { display:block !important; grid-template-columns:none !important; white-space:nowrap !important; overflow-x:auto !important; overflow-y:hidden !important; -webkit-overflow-scrolling:touch !important; min-width:0 !important; max-width:100% !important; padding-bottom:6px !important; }
        .today .daily-card, .tomorrow .daily-card { display:inline-block !important; white-space:normal !important; vertical-align:top !important; width:44% !important; min-width:40% !important; margin:0 9px 0 0 !important; }
        /* ¡Ú HIT Ä«µå ÁÙ: ½ºÅ©·Ñ¹Ù¸¦ °¨Ãß°í ½º¿ÍÀÌÇÁ·Î¸¸ ³Ñ±ä´Ù.
           ¼Õ°¡¶ôÀº ¿ø·¡µµ ¹Ð·ÈÁö¸¸ ½ºÅ©·Ñ¹Ù°¡ ±×´ë·Î º¸¿© ÁöÀúºÐÇß°í,
           ¸¶¿ì½º·Î´Â ½ºÅ©·Ñ¹Ù ¸»°í´Â ¹Ì´Â ¹æ¹ýÀÌ ¾ø¾ú´Ù.
           ¸¶¿ì½º µå·¡±× 󸮴 tcg-nav.js ÀÇ bindDragScroll() ÀÌ ¸Ã´Â´Ù
           (¸ð´Þ ¾È .hit-track ¿¡ ¾²´ø ¹æ½Ä°ú µ¿ÀÏ).
           ¡Ú .today/.tomorrow ·Î Á¼È÷Áö ¾Ê´Â´Ù. À̺¥Æ® ȨÀº °°Àº Ä«µå ÁÙÀ»
              <article class="hit-showcase"> ·Î¸¸ °¨½Î(today Ŭ·¡½º°¡ ¾ø´Ù)
              Á¼È÷¸é Ȩ¿¡´Â ¾È °É¸°´Ù. »Ì±â¡¤È¨ ¾çÂÊÀ» ÇÑ ±ÔÄ¢À¸·Î µ¤´Â´Ù.
           ½ºÅ©·Ñ¹Ù¸¦ ´Ù½Ã º¸ÀÌ°Ô ÇÏ·Á¸é ¾Æ·¡ µÎ ±ÔÄ¢¸¸ Áö¿ì¸é µÈ´Ù. */
        .daily-card-row {
          scrollbar-width: none !important;             /* ÆÄÀ̾îÆø½º */
          -ms-overflow-style: none !important;          /* ±¸Çü IE/Edge */
          overscroll-behavior-x: contain !important;    /* ³¡±îÁö ¹Ð¾îµµ ÆäÀÌÁö°¡ °°ÀÌ ¾È ¹Ð¸®°Ô */
          cursor: grab;
          -webkit-user-select: none; user-select: none; /* µå·¡±×ÇÒ ¶§ ±ÛÀÚ°¡ ºí·ÏÀ¸·Î ÀâÈ÷Áö ¾Ê°Ô */
        }
        .daily-card-row::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }  /* Å©·Ò¡¤»çÆĸ® */
        /* ¡Ú ½ºÅ©·Ñ ½º³À(scroll-snap)Àº ³Ö¾ú´Ù°¡ »°´Ù.
           Ȩ HIT Ä«µå´Â 40%Â¥¸® 3ÀåÀÌ¶ó °¡·Î ³ÑħÀÌ È­¸éÀÇ 26% Á¤µµ»ÓÀε¥,
           ¾ÆÀÌÆù »çÆĸ®´Â proximity ¸¦ °ÅÀÇ mandatory ó·³ ó¸®ÇÏ´Â µ¥´Ù
           -webkit-overflow-scrolling:touch ÀÇ °ü¼º ½ºÅ©·Ñ°ú °ãÄ¡¸é ½º³ÀÀÌ À̰ܼ­
           ¹ÐÀÚ¸¶ÀÚ ¸Ç ¾ÕÀ¸·Î ƨ°Ü µ¹¾Æ¿Ô´Ù(= ½º¿ÍÀÌÇÁ°¡ ¾È µÇ´Â °Íó·³ º¸¿´´Ù).
           ´Ù½Ã ³ÖÀ» °Å¶ó¸é ³ÑħÀÌ ³Ë³ËÇÑ È­¸é¿¡¼­¸¸ ÄÑ¾ß ÇÑ´Ù. */
        .daily-card-row.dragging { cursor: grabbing; }
        /* Ä«µå À̹ÌÁö¸¦ ²ø¸é ºê¶ó¿ìÀú ±âº» À̹ÌÁö µå·¡±×°¡ ¸ÕÀú Àâ¾Æ ½ºÅ©·ÑÀÌ ²÷±ä´Ù */
        .daily-card img { -webkit-user-drag: none; }
      }
    
      /* mobile: menu overlaps banner bottom, in-flow (never disappears) */
      @media (max-width:860px){
        .top-hero { min-height:0 !important; }
        .hero-zone { position:relative !important; }
        /* ¿ø·¡ ¹èÄ¡: ¹è³Ê ÇÏ´Ü ÆäÀÌµå ±¸°£¿¡ -24vw ¿À¹ö·¦ (ºó °ø°£ ¾øÀ½) */
        .oripa-topnav { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:10px !important; margin:calc(-24vw - 20px) 0 14px !important; padding:0 12px !important; z-index:90 !important; }
        .oripa-topnav .oripa-nav { position:relative !important; margin:0 auto !important; max-width:100% !important; }
        .oripa-topnav .wallet { position:static !important; transform:none !important; right:auto !important; top:auto !important; left:auto !important; margin:0 auto !important; }
      }
    
      /* center the product list-view pill (dae-bak card list button) */
      .shelf-meta span { display:flex !important; width:fit-content !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; }
    
      /* fixes: hit img height on mobile, nav hover text color, list-pill text size */
      .oripa-nav .navbtn:hover { color:#08222a !important; background:rgba(20,200,230,.16) !important; }
      @media (max-width:860px){
        .today .daily-card img, .tomorrow .daily-card img { height:auto !important; }
      }
      @media (max-width:600px){
        .shelf-meta span { font-size:11px !important; padding:5px 9px !important; white-space:nowrap !important; letter-spacing:0 !important; }
      }
    
      /* mobile: shelf product image + background height 150px */
      @media (max-width:600px){
        .shelf-image { height:150px !important; }
        .shelf-image img { height:150px !important; }
      }
    
      /* mobile menu polish: floating rounded nav pill + wallet, centered */
      @media (max-width:860px){
        .oripa-topnav .oripa-nav { flex-wrap:nowrap !important; justify-content:center !important; gap:1px !important; padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; backdrop-filter:none !important; max-width:100% !important; overflow:visible !important; }
        .oripa-nav .navbtn { flex:0 0 auto !important; padding:6px 6px !important; font-size:11px !important; letter-spacing:0 !important; white-space:nowrap !important; color:#16141f !important; text-shadow:0 1px 3px rgba(0,0,0,.65) !important; }
        .oripa-nav .navbtn.active { color:#08222a !important; text-shadow:none !important; }
        .oripa-topnav .wallet { gap:8px !important; padding:6px 10px 6px 14px !important; border-radius:999px !important; box-shadow:0 12px 28px rgba(0,0,0,.34) !important; }
      }
    
      /* mobile: pull content block up (tighter under banner/menu) */
      @media (max-width:860px){
        .oripa-topnav { margin-bottom:6px !important; }
        .store-shelf { margin-top:0 !important; }
      }
    
      /* winners menu label: PC full text, mobile short */
      .oripa-nav .wn-mo { display:none; }
      @media (max-width:860px){
        .oripa-nav .wn-pc { display:none !important; }
        .oripa-nav .wn-mo { display:inline !important; }
      }
    
      /* PC: semi-transparent glass menu + wallet */
      @media (min-width:861px){
        .oripa-nav { background:rgba(255,255,255,.6) !important; -webkit-backdrop-filter:blur(9px) !important; backdrop-filter:blur(9px) !important; border-color:rgba(255,255,255,.32) !important; }
        .oripa-nav .navbtn { color:#16141f !important; text-shadow:none !important; }
        .oripa-nav .navbtn.active { color:#08222a !important; text-shadow:none !important; }
        .oripa-topnav .wallet { background:rgba(255,255,255,.6) !important; -webkit-backdrop-filter:blur(9px) !important; backdrop-filter:blur(9px) !important; border-color:rgba(255,255,255,.32) !important; }
        .oripa-topnav .wallet small { color:#16141f !important; }
        .oripa-topnav .wallet b { color:#16141f !important; }
      }
    
      /* mobile: full-bleed menu area, buttons spread across full width (no scroll) */
      @media (max-width:860px){
        .hero-zone .oripa-topnav { width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; }
        .oripa-topnav .oripa-nav { width:100% !important; max-width:100% !important; gap:0 !important; flex-wrap:nowrap !important; }
        .oripa-nav .navbtn { flex:1 1 auto !important; min-width:0 !important; text-align:center !important; padding:8px 4px !important; font-size:15px !important; }
      }
    
      /* FB mark -> fileball.png image (sized to text) */
      .fileball-guide-mark span { background:none !important; box-shadow:none !important; width:auto !important; height:auto !important; }
      .fileball-guide-mark span img { height:26px !important; width:auto !important; display:block !important; }.seal-bg {
  position:absolute; inset:0; z-index:1; background:url("/_template/service/images/07event_images/2026/08_pokemon/background.png") center/cover no-repeat; opacity:0; transition:opacity .55s ease; pointer-events:none;
  opacity: calc(.30 + var(--p,0) * .55); transition: opacity .3s ease;
          animation: bgPulse 3.4s ease-in-out infinite;
  inset: auto; left: 50%; top: 50%; width: 1040px; height: 1040px;
        background: url("/_template/service/images/07event_images/2026/08_pokemon/background.png") center/cover no-repeat; z-index: 1; pointer-events: none;
        opacity: calc(.30 + var(--p,0) * .55); transition: opacity .3s ease;
        -webkit-mask-image:radial-gradient(circle closest-side, #000 62%, transparent 98%); mask-image:radial-gradient(circle closest-side, #000 62%, transparent 98%);
        transform: translate(-50%,-50%); animation: bgSpin 12s linear infinite;
  animation: none !important; transform: translate(-50%, -50%) rotate(var(--spinBg, 0deg));
  opacity: 0;
  filter: blur(8px);
  transform: translate(-50%,-50%) rotate(var(--spinBg,0deg)) scale(var(--bgScale,1));
  filter: saturate(1.4) brightness(1.15) hue-rotate(198deg) !important;
}
    
      /* top button - landing.html skin */
      .w-to-top{position:fixed !important;right:max(16px,calc((100vw - 1080px)/2 - 56px)) !important;left:auto !important;bottom:26px !important;width:48px !important;height:48px !important;line-height:1 !important;border-radius:50% !important;background:#d4179a !important;color:#fff !important;border:0 !important;font-size:22px !important;font-weight:700 !important;box-shadow:0 10px 26px rgba(255,255,255,.28) !important;}
      .w-to-top:hover{transform:translateY(-2px) !important;}
      /* ¸ð¹ÙÀÏ: »Ì±â ·¹À̾ bm °íÁ¤ Çì´õ(z900)¿¡ °¡¸®Áö ¾Ê°Ô À§·Î */
      @media(max-width:900px){.modalback{z-index:9500 !important}}
      /* ¸ð¹ÙÀÏ: fx2 »Ì±â(¿µ»ó~°ø°³) ·¹À̾î´Â È­¸é °¡µæ - ³»ºÎ ¹èÄ¡´Â ±×´ë·Î µÐ´Ù.
         ´Ý±â(X)µµ ¼û°Ü °ø°³µÈ °á°ú´Â º¸°ü/Áï½ÃÆǸŷθ¸ Á¾·áÇÑ´Ù. */
      @media(max-width:900px){
        .modalback:has(.fx2-stage){padding:0 !important}
        .modal:has(.fx2-stage){width:100vw !important;max-width:none !important;min-height:100vh !important;min-height:100dvh !important;max-height:none !important;margin:0 !important;border-radius:0 !important}
        .modal:has(.fx2-stage) .mtop .close{display:none !important}
      }
      body:has(.modalback.open) .w-to-top{display:none !important;}
          /* full-screen card reveal popup: bg + card + title + drag hint only */
      /* backdrop-filter on .modalback makes it the containing block for the fixed modal,
   so its 18px padding leaves a frame - zero it out so the popup is truly full screen */
      .modalback:has(#seal){padding:0 !important;background:#ecebf9 !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
      .modal:has(#seal){position:fixed !important;inset:0 !important;width:100vw !important;height:100vh !important;max-width:none !important;max-height:none !important;min-height:100vh !important;margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:radial-gradient(circle at 50% 40%, #ffffff, #e4dcf6 74%) !important;overflow:hidden !important;display:flex !important;align-items:center !important;justify-content:center !important;}
      .modal:has(#seal) #mBody{width:100vw !important;height:100vh !important;position:relative !important;}.modal:has(#seal) .seal {position:absolute !important;inset:0 !important;width:100vw !important;height:100vh !important;box-sizing:border-box !important;padding-top:68px !important;padding-bottom:68px !important;margin:0 !important;border-radius:0 !important;overflow:hidden !important;display:grid !important;place-items:center !important;grid-template:1fr/1fr !important;perspective:1400px !important;}
      @keyframes resultPop{0%{opacity:0;transform:scale(.4) rotateY(-720deg);}40%{opacity:1;}100%{opacity:1;transform:scale(1) rotateY(0deg);}}
      .modal.show-result:has(#seal) .card-stage.result-pop{animation:resultPop .9s cubic-bezier(.16,.8,.28,1.04) both;}
      .modal:has(#seal) .card-stage{grid-area:1/1 !important;width:min(78vw,360px) !important;height:auto !important;aspect-ratio:63/88 !important;place-self:center !important;margin:0 !important;}
      /* drag hint: front card stays put, only the BACK card slides up/down (drag signal) */
      .modal:has(#seal) .seal:not(.dragging) .card-back:not(.gone){animation:backNudge 1.25s ease-in-out infinite;}
      @keyframes backNudge{0%,100%{transform:translateY(-9px);}50%{transform:translateY(9px);}}
      /* fixed (non-animated) up/down arrows: thin shaft, thick head */
      .modal:has(#seal) .drag-arrows{position:relative;grid-area:1/1;place-self:center;width:min(78vw,360px);aspect-ratio:63/88;pointer-events:none;z-index:9;transition:opacity .25s ease;}
      .drag-arrows .drag-arrow{position:absolute;left:50%;width:32px;height:42px;filter:drop-shadow(0 2px 5px rgba(0,0,0,.6));}
      .drag-arrows .ar-shaft{stroke:#16141f;stroke-width:6;stroke-linecap:round;fill:none;}
      .drag-arrows .ar-head{fill:#16141f;}
      .drag-arrows .up{bottom:100%;margin-bottom:12px;transform:translateX(-50%);}
      .drag-arrows .down{top:100%;margin-top:12px;transform:translateX(-50%) rotate(180deg);}
      .seal.dragging .drag-arrows, .card-stage.opened ~ .drag-arrows{opacity:0;}
      .modal:has(#seal) .mtop{position:absolute !important;top:16px !important;left:0 !important;right:0 !important;margin:0 !important;padding:0 20px !important;justify-content:center !important;z-index:30 !important;}
      .modal:has(#seal) .mtop h2{font-size:20px !important;font-weight:800 !important;text-align:center !important;color:#fff !important;}
      .modal:has(#seal) .mtop > div{width:auto !important;max-width:calc(100% - 96px) !important;text-align:center !important;background:rgba(255,255,255,.62) !important;padding:7px 20px !important;border-radius:16px !important;}
      .modal:has(#seal) .mtop h2,.modal:has(#seal) .mtop .wpe-eyebrow{text-shadow:0 1px 5px rgba(0,0,0,.7) !important;}
      .modal:has(#seal) .mtop .wpe-eyebrow{display:block !important;text-align:center !important;color:#d4179a !important;}
      .modal:has(#seal) .mtop .close{position:absolute !important;right:16px !important;top:-2px !important;}.modal.show-result:has(#seal) .card-stage {width:min(78vw,360px) !important;}
      .modal.show-result:has(#seal) #postReveal{position:absolute !important;left:0 !important;right:0 !important;bottom:0 !important;display:block !important;width:100% !important;box-sizing:border-box !important;z-index:20 !important;overflow-y:auto !important;padding:12px 22px calc(14px + env(safe-area-inset-bottom)) !important;background:linear-gradient(to top, rgba(255,255,255,.95) 84%, rgba(255,255,255,.55) 94%, rgba(255,255,255,0)) !important;text-align:center !important;}
      .modal.show-result:has(#seal) #postReveal .result{margin:0 !important;gap:9px !important;}
      .modal.show-result:has(#seal) #postReveal .result .burst{width:40px !important;height:40px !important;font-size:17px !important;margin:0 !important;box-shadow:0 0 20px rgba(20,200,230,.12) !important;}
      .modal.show-result:has(#seal) #postReveal .result h2{font-weight:800 !important;font-size:23px !important;margin:0 !important;}
      .modal.show-result:has(#seal) #postReveal .result p{font-weight:700 !important;color:#16141f !important;font-size:13px !important;line-height:1.4 !important;margin:1px 0 0 !important;white-space:nowrap !important;}
      /* buttons as small as possible, pushed to the right (PC) */
      .modal.show-result:has(#seal) #postReveal .mactions{max-width:360px !important;margin:8px auto 0 !important;gap:8px !important;justify-content:center !important;}
      .modal.show-result:has(#seal) #postReveal .mactions button{flex:0 0 auto !important;width:auto !important;padding:8px 14px !important;font-size:13px !important;}
      /* mobile: clean & tight */
      @media (max-width:600px){.modal.show-result:has(#seal) .card-stage {width:min(78vw,360px) !important;}
        .modal.show-result:has(#seal) #postReveal{padding:10px 14px calc(10px + env(safe-area-inset-bottom)) !important;}
        .modal.show-result:has(#seal) #postReveal .result .burst{width:36px !important;height:36px !important;font-size:15px !important;margin:0 !important;}
        .modal.show-result:has(#seal) #postReveal .result h2{font-size:19px !important;}
        .modal.show-result:has(#seal) #postReveal .result p{font-size:11px !important;white-space:normal !important;}
        .modal.show-result:has(#seal) #postReveal .mactions{justify-content:center !important;gap:8px !important;}
        .modal.show-result:has(#seal) #postReveal .mactions button{padding:8px 10px !important;font-size:12px !important;}
      }
      /* mobile: images 1 & 2 a bit smaller */
      @media (max-width:600px){
        .seal-bg{width:720px !important;height:720px !important;}
        .seal-bg2{width:880px !important;height:587px !important;}
      }
      .modal:has(#seal) .drag-hint{opacity:1 !important;color:#16141f !important;font-size:15px !important;font-weight:800 !important;letter-spacing:.02em !important;text-shadow:0 2px 6px rgba(0,0,0,.85) !important;bottom:26px !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;width:max-content !important;background:rgba(0,0,0,.4) !important;padding:7px 15px !important;border-radius:999px !important;}
      .modal:has(#seal) .seal.dragging .drag-hint, .modal:has(#seal) .card-stage.opened ~ .drag-hint{opacity:0 !important;}
      /* ===== casino-grade reveal FX ===== */
      .seal.fx-shake{animation:fxShake .58s cubic-bezier(.36,.07,.19,.97) both;}
      @keyframes fxShake{0%{transform:translate(0,0) scale(1.06)}12%{transform:translate(-8px,6px) scale(1.045)}24%{transform:translate(9px,-7px) scale(1.032)}36%{transform:translate(-10px,7px) scale(1.022)}48%{transform:translate(8px,-6px) scale(1.015)}60%{transform:translate(-6px,5px) scale(1.009)}72%{transform:translate(5px,-4px) scale(1.005)}84%{transform:translate(-3px,3px) scale(1.002)}100%{transform:translate(0,0) scale(1)}}
      .fx-vignette{position:absolute;inset:0;z-index:11;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 46%,transparent 40%,rgba(0,0,0,.52) 100%);transition:opacity .6s ease;}
      .seal.fx-lit .fx-vignette{opacity:1;}
      .fx-charge{position:absolute;left:50%;top:50%;width:min(86vw,440px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(calc(.5 + var(--p,0)*.75));opacity:calc(var(--p,0)*.9);pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(122,61,240,.6) 0%,rgba(224,24,127,.3) 36%,transparent 66%);mix-blend-mode:screen;filter:blur(3px);transition:opacity .12s linear;}
      .seal.fx-lit .fx-charge{opacity:0 !important;transition:opacity .45s ease;}
      .fx-shockwave{position:absolute;left:50%;top:50%;width:64px;height:64px;border-radius:50%;transform:translate(-50%,-50%) scale(.15);pointer-events:none;z-index:12;border:3px solid rgba(122,61,240,.95);box-shadow:0 0 52px 12px rgba(224,24,127,.55),inset 0 0 34px rgba(224,24,127,.45);opacity:0;}
      .fx-shockwave.go{animation:fxShock .72s cubic-bezier(.15,.75,.25,1) forwards;}
      @keyframes fxShock{0%{opacity:0;transform:translate(-50%,-50%) scale(.15);}10%{opacity:1;}100%{opacity:0;transform:translate(-50%,-50%) scale(12);border-width:1px;}}
      .fx-particle{position:absolute;left:50%;top:50%;width:var(--sz,8px);height:var(--sz,8px);border-radius:50%;pointer-events:none;z-index:13;background:radial-gradient(circle at 38% 32%,#ffffff,#e0187f 52%,#7a3df0 100%);box-shadow:0 0 10px 2px rgba(224,24,127,.85);opacity:0;}
      .fx-particle.go{animation:fxPart var(--dur,.9s) cubic-bezier(.1,.65,.28,1) forwards;}
      @keyframes fxPart{0%{opacity:1;transform:translate(-50%,-50%);}70%{opacity:1;}100%{opacity:0;transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,0px))) scale(.25);}}
      .card-front.fx-rim{box-shadow:0 0 0 2px rgba(122,61,240,.95),0 0 46px 9px rgba(224,24,127,.62),0 14px 34px rgba(0,0,0,.45) !important;}
      @media (prefers-reduced-motion: reduce){.seal.fx-shake{animation:none !important;}}
      /* ===== NEW cinematic full-screen reveal (multi-phase, European casino style) ===== */
      .cine{position:absolute;inset:0;z-index:9999;overflow:hidden;pointer-events:none;font-family:'Pretendard';}
      /* darken surroundings */
      .cine-back{position:absolute;inset:0;z-index:0;opacity:0;background:#000;transition:opacity .35s ease;}
      .cine.run .cine-back{opacity:1;}
      .cine.white .cine-back,.cine.reveal .cine-back,.cine.out .cine-back{opacity:0;transition:opacity .5s ease;}
      /* zigzag stream of card-backs flowing behind (rows alternate L/R) */
      .cine-stream{position:absolute;inset:-20%;z-index:1;display:flex;flex-direction:column;gap:0;opacity:0;transform:rotate(-8deg) scale(1.45);filter:brightness(.8);transition:opacity .5s ease;pointer-events:none;}
      .cine.run .cine-stream{opacity:.4;}
      .cine.charge .cine-stream{opacity:.5;}
      .cine.white .cine-stream,.cine.reveal .cine-stream,.cine.out .cine-stream{opacity:0;}
      .cine-row{display:flex;flex:1;overflow:hidden;}
      .cine-row>span{display:flex;flex:none;gap:0;will-change:transform;}
      .cine-row.L>span{animation:streamL 9s linear infinite;}
      .cine-row.R>span{animation:streamR 9s linear infinite;}
      @keyframes streamL{from{transform:translateX(0);}to{transform:translateX(-50%);}}
      @keyframes streamR{from{transform:translateX(-50%);}to{transform:translateX(0);}}
      .cine-tile{flex:none;height:100%;aspect-ratio:63/88;background:var(--oripa-card-back) center/cover no-repeat;}
      /* spotlight cone from top onto the card */
      .cine-spot{position:absolute;left:50%;top:-10%;width:min(128vw,720px);height:122%;transform:translateX(-50%);opacity:0;z-index:2;pointer-events:none;mix-blend-mode:screen;transition:opacity .6s ease;
        background:radial-gradient(ellipse 58% 62% at 50% 24%, rgba(235,240,255,.6), rgba(255,231,158,.26) 50%, transparent 78%);clip-path:polygon(28% 0,72% 0,99% 100%,1% 100%);}
      .cine.run .cine-spot{opacity:.95;}
      .cine.white .cine-spot,.cine.reveal .cine-spot,.cine.out .cine-spot{opacity:0;}
      /* light.mp4 shining from above (replaces spotlight) */
      .cine-light{position:absolute;left:50%;top:0;width:min(120vw,780px);height:100%;transform:translateX(-50%);object-fit:cover;object-position:center top;opacity:0;z-index:2;pointer-events:none;mix-blend-mode:screen;transition:opacity .5s ease;filter:blur(9px);-webkit-mask-image:radial-gradient(ellipse 74% 80% at 50% 24%, #000 28%, transparent 96%);mask-image:radial-gradient(ellipse 74% 80% at 50% 24%, #000 28%, transparent 96%);}
      .cine.run .cine-light{opacity:.8;}
      .cine.white .cine-light,.cine.reveal .cine-light,.cine.out .cine-light{opacity:0;}
      /* rotating radiant rays (build up) */
      .cine-rays{position:absolute;left:50%;top:44%;width:230vmax;height:230vmax;margin-left:-115vmax;margin-top:-115vmax;opacity:0;mix-blend-mode:screen;filter:blur(1px);animation:cineSpin 9s linear infinite;transition:opacity .6s ease;
        background:repeating-conic-gradient(from 0deg, rgba(224,24,127,0) 0deg 6deg, rgba(20,200,230,.28) 7deg 9deg, rgba(160,225,245,.55) 9.4deg 10.6deg, rgba(20,200,230,.28) 11deg 12deg, rgba(224,24,127,0) 13deg 18deg);}
      .cine.build .cine-rays{opacity:.55;}
      .cine.charge .cine-rays{opacity:.95;animation-duration:2.4s;}
      .cine.white .cine-rays,.cine.out .cine-rays{opacity:0;}
      @keyframes cineSpin{to{transform:rotate(360deg);}}
      /* glowing aura behind card */
      .cine-halo{position:absolute;left:50%;top:44%;width:min(110vw,640px);height:min(110vw,640px);opacity:0;z-index:3;pointer-events:none;mix-blend-mode:screen;transform:translate(-50%,-50%) scale(.85);
        background:radial-gradient(circle, rgba(122,61,240,.7), rgba(224,24,127,.28) 42%, transparent 66%);transition:opacity .5s ease;}
      .cine.build .cine-halo{opacity:.7;animation:haloPulse 1s ease-in-out infinite;}
      .cine.charge .cine-halo{opacity:1;animation:haloPulse .42s ease-in-out infinite;}
      .cine.white .cine-halo,.cine.out .cine-halo{opacity:0;animation:none;}
      @keyframes haloPulse{0%,100%{transform:translate(-50%,-50%) scale(.85);}50%{transform:translate(-50%,-50%) scale(1.12);}}
      /* full-screen fluorescent glow flooding in as it charges */
      .cine-fluor{position:absolute;inset:0;z-index:5;opacity:0;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle at 50% 44%, rgba(200,230,250,.55), rgba(224,24,127,.14) 46%, transparent 74%);}
      .cine.charge .cine-fluor{animation:fluorPulse .4s ease-in-out infinite;}
      .cine.vanish .cine-fluor{opacity:1;transition:opacity .3s ease;}
      .cine.white .cine-fluor,.cine.out .cine-fluor{opacity:0;}
      @keyframes fluorPulse{0%,100%{opacity:.25;}50%{opacity:.72;}}
      /* face-down mystery card: appears, shakes L-R harder, then spins away & vanishes */
      .cine-cardback{position:absolute;left:50%;top:44%;width:min(72vw,340px);aspect-ratio:63/88;z-index:6;border-radius:14px;overflow:hidden;opacity:0;transform:translate(-50%,-50%) scale(.55);
        background:var(--oripa-card-back) center/cover no-repeat, linear-gradient(145deg,#f3ebfb,#ffffff);border:1px solid rgba(122,61,240,.55);box-shadow:0 18px 46px rgba(0,0,0,.6);transition:opacity .4s ease, transform .4s cubic-bezier(.2,.9,.3,1.2);}
      .cine.run .cine-cardback{opacity:1;transform:translate(-50%,-50%) scale(1);}
      .cine.build .cine-cardback{animation:cardShakeLR .5s ease-in-out infinite;}
      .cine.charge .cine-cardback{animation:cardShakeLR .13s ease-in-out infinite;box-shadow:0 0 46px 10px rgba(224,24,127,.65),0 18px 46px rgba(0,0,0,.6);}
      .cine.frenzy .cine-cardback{animation:cardShakeHard .05s linear infinite;filter:blur(.5px);box-shadow:0 0 66px 18px rgba(224,24,127,.85),0 18px 46px rgba(0,0,0,.6);}
      .cine.vanish .cine-cardback{animation:cardVanish .5s cubic-bezier(.5,0,.85,.35) forwards;}
      @keyframes cardShakeLR{0%{transform:translate(-50%,-50%) translateX(-8px) rotate(-3deg);}50%{transform:translate(-50%,-50%) translateX(8px) rotate(3deg);}100%{transform:translate(-50%,-50%) translateX(-8px) rotate(-3deg);}}
      @keyframes cardShakeHard{0%{transform:translate(-50%,-50%) translateX(-13px) rotate(-5deg);}50%{transform:translate(-50%,-50%) translateX(13px) rotate(5deg);}100%{transform:translate(-50%,-50%) translateX(-13px) rotate(-5deg);}}
      @keyframes cardVanish{0%{opacity:1;transform:translate(-50%,-50%) scale(1) rotateY(0deg);}70%{opacity:1;}100%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotateY(1080deg);}}
      /* round light that explodes right before the white-out */
      .cine-orb{position:absolute;left:50%;top:44%;width:64px;height:64px;border-radius:50%;transform:translate(-50%,-50%) scale(.1);opacity:0;z-index:19;background:radial-gradient(circle,#fff 0%,#ffffff 34%,rgba(224,24,127,.6) 60%,transparent 73%);box-shadow:0 0 90px 34px rgba(20,200,230,.7);}
      .cine-orb.go{animation:cineOrb .55s cubic-bezier(.42,0,.7,.42) forwards;}
      @keyframes cineOrb{0%{opacity:0;transform:translate(-50%,-50%) scale(.1);}18%{opacity:1;}100%{opacity:1;transform:translate(-50%,-50%) scale(28);}}
      /* the 1-second pure WHITE-OUT */
      .cine-white{position:absolute;inset:0;z-index:20;background:#fff;opacity:0;}
      .cine.white .cine-white{opacity:1;transition:opacity .16s ease-in;}
      .cine.reveal .cine-white{opacity:0;transition:opacity .35s ease-out;}
      /* the real card front: spins out of the white */
      .cine-cardfront{position:absolute;left:50%;top:44%;width:min(62vw,290px);aspect-ratio:63/88;z-index:24;border-radius:14px;overflow:hidden;opacity:0;transform:translate(-50%,-50%) scale(.3) rotateY(-1080deg);box-shadow:0 22px 58px rgba(0,0,0,.5);}
      .cine-cardfront img{width:100%;height:100%;object-fit:cover;display:block;}
      .cine.reveal .cine-cardfront{animation:cardOut 1.05s cubic-bezier(.16,.8,.28,1.04) .12s both;}
      @keyframes cardOut{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotateY(-1080deg);}26%{opacity:1;}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotateY(0deg);box-shadow:0 0 0 2px rgba(122,61,240,.95),0 0 56px 10px rgba(224,24,127,.6),0 22px 52px rgba(0,0,0,.5);}}
      .cine.out .cine-cardfront{opacity:0;transition:opacity .4s ease;}
      /* burst flash + title stamp on reveal */
      .cine-flash{position:absolute;inset:0;z-index:22;opacity:0;background:radial-gradient(circle at 50% 44%, #fff, rgba(235,240,255,.75) 38%, transparent 68%);}
      .cine-flash.go{animation:cineFlash .55s ease-out;}
      @keyframes cineFlash{0%{opacity:0;}10%{opacity:1;}100%{opacity:0;}}
      .cine-title{position:absolute;left:0;right:0;top:61%;text-align:center;z-index:26;font-weight:800;font-size:min(9.5vw,46px);color:#fff;letter-spacing:.02em;opacity:0;transform:scale(2.4);text-shadow:0 2px 0 #e4dcf6,0 0 28px rgba(224,24,127,.9),0 8px 24px rgba(0,0,0,.6);}
      .cine-title.go{animation:cineStamp .55s cubic-bezier(.2,1.45,.35,1) forwards;}
      @keyframes cineStamp{0%{opacity:0;transform:scale(2.6);}58%{opacity:1;transform:scale(.9);}100%{opacity:1;transform:scale(1);}}
      .cine.out .cine-title{opacity:0;transition:opacity .3s ease;}
      .cine.shake{animation:fxShake .55s cubic-bezier(.36,.07,.19,.97) both;}
      .cine-part{position:absolute;left:50%;top:44%;width:10px;height:10px;border-radius:50%;z-index:25;opacity:0;background:radial-gradient(circle at 38% 32%,#ffffff,#e0187f 52%,#7a3df0);box-shadow:0 0 11px 2px rgba(224,24,127,.85);}
      .cine-part.go{animation:cinePart var(--dur,1s) cubic-bezier(.1,.65,.28,1) forwards;}
      @keyframes cinePart{0%{opacity:1;transform:translate(-50%,-50%);}72%{opacity:1;}100%{opacity:0;transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,0px))) scale(.3);}}
      .cine-conf{position:absolute;left:50%;top:42%;width:10px;height:15px;border-radius:2px;z-index:25;opacity:0;background:hsl(var(--hue,45deg) 92% 60%);box-shadow:0 0 6px rgba(0,0,0,.2);}
      .cine-conf.go{animation:cineConf var(--dur,1.3s) cubic-bezier(.2,.55,.3,1) forwards;}
      @keyframes cineConf{0%{opacity:1;transform:translate(-50%,-50%) rotate(0deg);}12%{opacity:1;}100%{opacity:0;transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,0px) + 300px)) rotate(var(--rot,540deg));}}
      @media (prefers-reduced-motion: reduce){.cine.shake{animation:none !important;}.cine-cardback {animation:none !important;}}

      /* ================= NEW02 : HOLO PRISM (light) ================= */
      html,body,.oripa-wrap,.hero-zone,.top-hero{background:#ecebf9 !important;} 
      .oripa-wrap{color:#16141f !important;}
      .store-shelf{background:linear-gradient(180deg,#ffffff 0%,#f1edfa 76%,rgba(20,18,40,.16) 77%,#f1edfa 82%) !important;border-color:rgba(20,18,40,.12) !important;}
      .store-shelf::before{background:linear-gradient(90deg,#e0187f,#7a3df0 48%,#14c8e6) !important;color:#fff !important;}
      .shelf-image{background:radial-gradient(circle at 50% 25%,#ffffff 0 26%,#f4f1fb 66%,#ece7f7 100%) !important;box-shadow:inset 0 0 0 1px rgba(20,18,40,.07),0 8px 18px rgba(20,18,40,.07) !important;}
      .shelf-product,.hit-card,.daily-card{background:linear-gradient(180deg,#ffffff,#faf9fe) !important;border-color:rgba(20,18,40,.12) !important;box-shadow:0 8px 22px rgba(20,18,40,.07) !important;}
      .shelf-product:hover,.daily-card:hover{border-color:rgba(20,200,230,.65) !important;background:linear-gradient(180deg,rgba(20,200,230,.10),#ffffff) !important;box-shadow:0 16px 36px rgba(122,61,240,.18) !important;}
      .board,.wpe-summary>div,.modal,.item,.cost,.market-stats span,.winner-history-card{background:#fff  !important;}
      .oripa-nav{background:rgba(255,255,255,.82) !important;border-color:rgba(20,18,40,.12) !important;box-shadow:0 8px 22px rgba(20,18,40,.10) !important;}
      @media (min-width:861px){.oripa-nav{background:rgba(255,255,255,.82) !important;border-color:rgba(20,18,40,.12) !important;}
        .oripa-nav .navbtn{color:#16141f !important;}
        .oripa-topnav .wallet{background:rgba(255,255,255,.88) !important;border-color:rgba(20,18,40,.12) !important;}
        .oripa-topnav .wallet small{color:#6c6885 !important;}.oripa-topnav .wallet b{color:#d4179a !important;}}
      @media (max-width:860px){.oripa-nav .navbtn{color:#fff !important;text-shadow:0 1px 4px rgba(0,0,0,.7) !important;}
        .oripa-nav .navbtn.active{color:#08222a !important;text-shadow:none !important;}}
      .oripa-nav .navbtn.active,.oripa-nav .navbtn.active:hover{background:linear-gradient(90deg,#14c8e6,#7a3df0) !important;color:#fff !important;box-shadow:0 3px 14px rgba(122,61,240,.35) !important;}
      .oripa-nav .navbtn:hover{color:#d4179a !important;background:rgba(224,24,127,.09) !important;}
      .cta,.hit-tab.active,.hit-rarity,.toast,.stickybar .cta,.oripa-topnav .outline{background:linear-gradient(90deg,#14c8e6,#7a3df0) !important;color:#fff !important;border-color:transparent !important;}
      .rarity,.winner-history-card .grade{background:linear-gradient(90deg,#e0187f,#7a3df0) !important;color:#fff !important;}
      .progress{background:rgba(20,18,40,.12) !important;}
      .progress i{background:linear-gradient(90deg,#e0187f,#14c8e6) !important;}
      .legend i{background:#fff !important;border-color:rgba(20,18,40,.2) !important;}
      .legend .chosen i,.legend .hit i{background:#14c8e6 !important;border-color:#14c8e6 !important;}
      .pick{background:#fff !important;border-color:rgba(20,18,40,.14) !important;}
      .pick.used{background:#f0eef7 !important;border-color:#f0eef7 !important;color:#9a96ae !important;}
      .stickybar{background:#fff !important;color:#16141f !important;box-shadow:0 18px 44px rgba(20,18,40,.24) !important;}
      .modalback{background:rgba(20,18,40,.42) !important;}
      .close{color:#16141f !important;border-color:rgba(20,18,40,.16) !important;}
      .secondary{background:#fff !important;color:#16141f !important;border-color:rgba(20,18,40,.16) !important;}
      .w-to-top{background:linear-gradient(135deg,#14c8e6,#7a3df0) !important;color:#fff !important;border:0 !important;box-shadow:0 10px 26px rgba(20,18,40,.22) !important;}.modalback:has(#seal) {
  padding:0 !important;background:#ecebf9 !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  background:#ecebf9 !important;
}
      .modal:has(#seal){background:radial-gradient(circle at 50% 40%,#ffffff 0%,#f2ecfc 56%,#e6dff7 100%) !important;}
      .modal:has(#seal) .mtop>div{background:rgba(255,255,255,.82) !important;box-shadow:0 6px 18px rgba(20,18,40,.10) !important;}.modal:has(#seal) .mtop h2 {
  font-size:20px !important;font-weight:800 !important;text-align:center !important;color:#fff !important;
  color:#16141f !important;text-shadow:none !important;
}.modal:has(#seal) .mtop .wpe-eyebrow {
  display:block !important;text-align:center !important;color:#d4179a !important;
  color:#d4179a !important;text-shadow:none !important;
}.modal:has(#seal) .drag-hint {
  opacity:1 !important;color:#16141f !important;font-size:15px !important;font-weight:800 !important;letter-spacing:.02em !important;text-shadow:0 2px 6px rgba(0,0,0,.85) !important;bottom:26px !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;width:max-content !important;background:rgba(0,0,0,.4) !important;padding:7px 15px !important;border-radius:999px !important;
  color:#16141f !important;background:rgba(255,255,255,.78) !important;border:1px solid rgba(20,18,40,.12) !important;text-shadow:none !important;
}.drag-arrows .ar-shaft {
  stroke:#16141f;stroke-width:6;stroke-linecap:round;fill:none;
  stroke:#7a3df0 !important;
}.drag-arrows .ar-head {
  fill:#16141f;
  fill:#7a3df0 !important;
}.card-front:after {
  content:""; position:absolute; inset:0; pointer-events:none; background:rgba(14,16,24,.62); -webkit-backdrop-filter:blur(11px); backdrop-filter:blur(11px); opacity: calc(.74 + var(--p,0) * .26); transition: opacity .12s linear;
  background:rgba(22,24,34,.46); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); opacity: calc(.4 + var(--p,0) * .28);
  background:rgba(238,234,250,.5) !important;
}.modal.show-result:has(#seal) #postReveal {position:absolute !important;left:0 !important;right:0 !important;bottom:0 !important;display:block !important;width:100% !important;box-sizing:border-box !important;z-index:20 !important;overflow-y:auto !important;padding:12px 22px calc(14px + env(safe-area-inset-bottom)) !important;background:linear-gradient(to top, rgba(255,255,255,.95) 84%, rgba(255,255,255,.55) 94%, rgba(255,255,255,0)) !important;text-align:center !important;}
      .modal.show-result:has(#seal) #postReveal .result h2,.modal.show-result:has(#seal) #postReveal .result p{color:#16141f !important;}.cine-back {
  position:absolute;inset:0;z-index:0;opacity:0;background:#000;transition:opacity .35s ease;
  background:#ecebf9 !important;
}.cine-stream {
  position:absolute;inset:-20%;z-index:1;display:flex;flex-direction:column;gap:0;opacity:0;transform:rotate(-8deg) scale(1.45);filter:brightness(.8);transition:opacity .5s ease;pointer-events:none;
  filter:brightness(1) !important;
}.cine-white {
  position:absolute;inset:0;z-index:20;background:#fff;opacity:0;
  background:#fff !important;
}.cine-title {
  position:absolute;left:0;right:0;top:61%;text-align:center;z-index:26;font-weight:800;font-size:min(9.5vw,46px);color:#fff;letter-spacing:.02em;opacity:0;transform:scale(2.4);text-shadow:0 2px 0 #e4dcf6,0 0 28px rgba(224,24,127,.9),0 8px 24px rgba(0,0,0,.6);
  color:#16141f !important;text-shadow:0 0 16px rgba(20,200,230,.6),0 0 34px rgba(224,24,127,.4),0 2px 0 #fff !important;
}.cine-conf {
  position:absolute;left:50%;top:42%;width:10px;height:15px;border-radius:2px;z-index:25;opacity:0;background:hsl(var(--hue,45deg) 92% 60%);box-shadow:0 0 6px rgba(0,0,0,.2);
  background:hsl(calc(var(--hue,45deg) + 250deg) 88% 58%) !important;
}.fx-vignette {
  position:absolute;inset:0;z-index:11;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 46%,transparent 40%,rgba(0,0,0,.52) 100%);transition:opacity .6s ease;
  background:radial-gradient(ellipse at 50% 46%,transparent 42%,rgba(20,18,40,.22) 100%) !important;
}

      /* ===== NEW02 patch : °¡µ¶¼º ===== */
      .oripa-nav .navbtn.active,.oripa-nav .navbtn.active:hover,.navbtn.active{
        background:linear-gradient(90deg,#0a9fbe,#6a2fe0) !important;color:#fff !important;
        text-shadow:0 1px 2px rgba(0,0,0,.28) !important;box-shadow:0 4px 14px rgba(106,47,224,.32) !important;}
      .cta,.hit-tab.active,.hit-rarity,.toast,.stickybar .cta,.oripa-topnav .outline{
        background:linear-gradient(90deg,#0a9fbe,#6a2fe0) !important;color:#fff !important;}
      .rarity,.winner-history-card .grade{background:linear-gradient(90deg,#d4177f,#6a2fe0) !important;color:#fff !important;}
      .w-to-top{background:linear-gradient(135deg,#0a9fbe,#6a2fe0) !important;color:#fff !important;}
      .shelf-meta span,.archive-open,.market-value,.hit-card small strong,.shelf-meta small,.wpe-eyebrow{color:#b0138c !important;}
      .shelf-meta span,.archive-open{border-color:rgba(176,19,140,.5) !important;}.wpe-market-hero strong,.cost b,.oripa-topnav .wallet b{color:#b0138c !important;}
      .oripa-wrap{color:#16141f !important;}
      .oripa-wrap small,.notice-list li,.legend,.archive-recent span,.market-stats small{font-size: 13px; color:#5d5977 !important;}

      /* ===== NEW02 : bg_new2 Àüü ¹è°æ (parallax + blur, opacity .8) ===== */
      html { background: #ecebf9 !important; }
      body, .oripa-wrap, .hero-zone, .top-hero { background: transparent !important; }
      body::before {
        content: "";
        position: fixed;
        top: -80vh; left: -40px; right: -40px; height: 300vh;
        z-index: -1;
        background: url("/_template/service/images/07event_images/2026/08_pokemon/bg_new2.jpg") center center / 1920px auto no-repeat;
        filter: blur(18px);
        opacity: 0.3;
        transform: translate3d(0, var(--bgY, 0px), 0);
        will-change: transform;
        pointer-events: none;
      }
      /* event02 Ä«µå °³ºÀ Æ˾÷ ¿µ»ó ÇÊÅÍ ·¹À̾î */
      .seal-bgvideo, .seal-resultvideo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; pointer-events:none; transition:opacity .4s ease; }
      .seal-bgvideo { opacity:1; }
      .seal:has(.card-stage.opened) .seal-bgvideo { opacity:0; }
      .seal-resultvideo { opacity:0; }
      .modal.show-result:has(#seal) .seal-resultvideo { opacity:1; }
      .cine-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;pointer-events:none;transition:opacity .5s ease;}
      .cine.run .cine-video{opacity:.85;}
      .cine.charge .cine-video{opacity:1;}
      .cine.white .cine-video,.cine.reveal .cine-video,.cine.out .cine-video{opacity:0;}
      /* X(´Ý±â) ¹öÆ° Àß º¸ÀÌ°Ô */
      .close { width:42px !important; height:42px !important; border-radius:50% !important; background:rgba(20,18,40,.62) !important; color:#fff !important; border:2px solid rgba(255,255,255,.9) !important; font:900 24px/1 'Pretendard' !important; box-shadow:0 4px 14px rgba(0,0,0,.35) !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; cursor:pointer !important; }
      .close:hover { background:#e0187f !important; }
      .modal:has(#seal) .close { position:fixed !important; right:18px !important; top:18px !important; z-index:60 !important; }.modal:has(#seal) {
  position:fixed !important;inset:0 !important;width:100vw !important;height:100vh !important;max-width:none !important;max-height:none !important;min-height:100vh !important;margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:radial-gradient(circle at 50% 40%, #ffffff, #e4dcf6 74%) !important;overflow:hidden !important;display:flex !important;align-items:center !important;justify-content:center !important;
  background:radial-gradient(circle at 50% 40%,#ffffff 0%,#f2ecfc 56%,#e6dff7 100%) !important;
  animation:none !important;
}
      @keyframes sealVidFade { from { opacity:0; } }.seal-bgvideo {
  opacity:1;
  animation: sealVidFade .55s ease;
}
        .tcg-catalog-empty,.tcg-board-empty{box-sizing:border-box;width:100%;min-height:120px;padding:28px;border:1px dashed rgba(255,255,255,.35);border-radius:16px;background:rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#fff}
.tcg-catalog-empty b,.tcg-board-empty b{font-size:18px}
.tcg-catalog-empty span,.tcg-board-empty span{font-size:13px;opacity:.75}
.store-shelf>.tcg-catalog-empty{grid-column:1/-1}
.daily-card-row>.tcg-catalog-empty{flex:1 1 100%;min-height:220px}
.tcg-board-empty{min-height:220px}

      /* tcg-charge.html Àº --paper ¸¦ ¹è°æ»ö, --ink ¸¦ ±ÛÀÚ»öÀ¸·Î ¾´´Ù.
         ÀÌ ÆäÀÌÁö ÆÈ·¹Æ®´Â --paper °¡ ±ÛÀÚ»öÀ̹ǷΠ¿ªÇÒÀ» ¸ÂÃç ´Ù½Ã ÁöÁ¤ÇÑ´Ù.
         (tcg-charge.html Àº tcg-drop_test.html °ú °ø¿ëÀ̶ó °Çµå¸®Áö ¾Ê´Â´Ù) */














      /* Ä£±¸ÃÊ´ë ·¹À̾î(tcg-invite.html) - À§¿Í °°Àº ÀÌÀ¯·Î »ö ¿ªÇÒÀ» ¸ÂÃá´Ù */









      /* Ä£±¸ÃÊ´ë ¹öÆ° - Áö°© pill ¹Ù±ù, ÃæÀü ¹öÆ° ¿À¸¥ÂÊ¿¡ µ¶¸³ ¹èÄ¡.
         .wallet ÀÌ ¿ø·¡ topnav ¿ìÃø¿¡ absolute ·Î ºÙ¾î À־, ¹öÆ°À» pill ¾È¿¡ ³ÖÀ¸¸é
         pill ÀÌ ³Ð¾îÁ® °¡¿îµ¥ Á¤·ÄµÈ nav ¸¦ ħ¹üÇÑ´Ù. ±×·¡¼­ ·¡ÆÛ°¡ absolute ¸¦ ³Ñ°Ü¹Þ°í
         .wallet Àº ±× ¾È¿¡¼­ static ÀÌ µÈ´Ù. ¸ð¹ÙÀÏ(<=860px)Àº ¿ø·¡´ë·Î È帧 ¹èÄ¡. */
      .oripa-wrap .oripa-topnav .wallet-row  { position:absolute; right:0; top:50%;
                                               transform:translateY(-50%);
                                               display:flex; align-items:center; gap:8px; }
      .oripa-wrap .oripa-topnav .wallet-row .wallet {
                                               position:static !important; right:auto !important;
                                               top:auto !important; transform:none !important;
                                               margin:0 !important; }
      .oripa-wrap .oripa-topnav .invite-btn  { flex:0 0 auto; white-space:nowrap; }

      @media (max-width:860px){
        .oripa-wrap .oripa-topnav .wallet-row { position:static !important; transform:none !important;
                                                right:auto !important; top:auto !important;
                                                justify-content:center; margin:0 auto !important;
                                                flex-wrap:wrap; }
      }


/* ===== 0820 v2 : wk-surprise / wk-flow / we-notice / wpe-we-policy ===== */
.wk-surprise{position:relative;margin:14px 0 0;border:1px solid rgba(20,18,40,.12);border-radius:15px;overflow:hidden;background:linear-gradient(120deg,rgba(255,123,69,.08),#ffffff)}
.wk-toggle{appearance:none;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;width:100%;min-height:92px;padding:18px 22px;border:0;background:transparent;color:#16141f;text-align:left;cursor:pointer;font-family:inherit} 
.wk-toggle:focus-visible{outline:2px solid #ff7b45;outline-offset:-4px}
.wk-eyebrow{color:#d4179a;font:900 11px/1.4 'Pretendard';letter-spacing:.15em} 
.wk-copy h3{margin:4px 0 5px;font-size:21px;letter-spacing:-.03em}
.wk-desc{margin:0;color:#6c6885;font-size:12px;line-height:1.55}
.wk-desc em{color:#ff7b45;font-style:normal;font-weight:900}
.wk-meta{display:flex;align-items:center;gap:10px}
.wk-chip{display:inline-flex;align-items:center;padding:6px 11px;border-radius:999px;white-space:nowrap;font:900 11px 'Pretendard';color:#fff;background:linear-gradient(90deg,#e0187f,#7a3df0)}
.wk-arrow{width:30px;height:30px;border:1px solid rgba(255,123,69,.4);border-radius:50%;display:grid;place-items:center;color:#ff7b45;font-size:15px;transition:transform .2s ease}
.wk-toggle[aria-expanded="true"] .wk-arrow{transform:rotate(180deg)}
.wk-summary{margin:0;padding:0 22px 8px;color:#6c6885;font-size:11px} 
.wk-summary strong{color:#16141f}
.wk-disclaimer{display:block;margin:0;padding:0 22px 15px;color:#9a96ae;font-size:9px}
.wk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:0 18px 15px}
.wk-grid[hidden]{display:none}
.wk-slot{min-height:120px;border:1px dashed rgba(255,123,69,.42);border-radius:13px;background:#faf7ff;display:grid;place-items:center;align-content:center;padding:14px;text-align:center}
.wk-slot span{color:#6c6885;font:900 8px 'Pretendard';letter-spacing:.12em}
.wk-slot b{margin:6px 0;color:#ff7b45;font:900 40px 'Pretendard'}
.wk-slot strong{font-size:12px}
.wk-slot small{margin-top:4px;color:#9a96ae;font-size:9px}
.wk-product{min-height:190px;border:1px solid rgba(20,18,40,.12);border-radius:13px;background:#fff;padding:12px;text-align:center;box-shadow:0 8px 20px rgba(20,18,40,.07)}
.wk-product img{width:100%;height:130px;object-fit:contain}
.wk-product .wk-type{display:inline-flex;margin-top:4px;padding:3px 7px;border-radius:5px;background:#14c8e6;color:#08222a;font:900 8px 'Pretendard'}
.wk-product .wk-edition{display:block;margin-top:5px;color:#6c6885;font:800 8px 'Pretendard'}
.wk-product strong{display:block;margin-top:7px;font-size:12px}
.wk-empty{grid-column:1/-1;padding:18px;border:1px dashed rgba(20,18,40,.14);border-radius:13px;text-align:center;color:#6c6885;font-size:12px}
.wk-empty strong{display:block;margin-bottom:5px;color:#16141f;font-size:14px}
.wk-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 0}
.wk-flow article{padding:20px;border:1px solid rgba(20,18,40,.12);border-radius:14px;background:linear-gradient(180deg,#ffffff,#faf9fe);box-shadow:0 10px 24px rgba(20,18,40,.07)}
.wk-flow b{display:block;color:#d4179a;font:900 11px 'Pretendard';letter-spacing:.06em}
.wk-flow strong{display:block;margin:9px 0;font-size:18px;letter-spacing:-.02em;color:#16141f}
.wk-flow p{margin:0;color:#6c6885;font-size:12px;line-height:1.65}
.we-notice{margin:44px 0 22px;padding:20px 22px;border:1px solid rgba(20,18,40,.12);border-radius:14px;background:linear-gradient(90deg,rgba(20,200,230,.06),transparent 55%),#fff;color:#6c6885;font-size:13px;line-height:1.7}
.we-notice strong{display:block;margin-bottom:6px;color:#16141f;font-size:18px}
.wpe-we-policy{margin:0 0 110px;padding:26px;border:1px solid rgba(20,18,40,.12);border-radius:15px;background:#fff;box-shadow:0 12px 30px rgba(20,18,40,.08)}
.wpe-we-policy-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.wpe-we-policy-head .wpe-eyebrow{margin:0;color:#d4179a;font:900 11px 'Pretendard';letter-spacing:.15em}
.wpe-we-policy-head h2{margin:6px 0 0;font-size:24px;letter-spacing:-.04em;color:#16141f}
.wpe-we-policy-head .desc{margin:6px 0 0;color:#6c6885;font-size:13px}
.wpe-we-policy-chip{display:inline-flex;align-items:center;padding:6px 11px;border-radius:999px;white-space:nowrap;font:900 11px 'Pretendard';color:#fff;background:linear-gradient(90deg,#e0187f,#7a3df0)}
.wpe-we-policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wpe-we-policy-grid article{padding:16px;border:1px solid rgba(20,18,40,.1);border-radius:12px;background:#faf9fe}
.wpe-we-policy-grid strong{display:block;margin-bottom:7px;font-size:13px;color:#d4179a}
.wpe-we-policy-grid p{margin:0;color:#6c6885;font-size:12px;line-height:1.7}
.wpe-we-policy-grid b{color:#16141f}
.wpe-we-policy-detail{margin-top:14px;border:1px solid rgba(20,18,40,.12);border-radius:12px;background:#faf9fe}
.wpe-we-policy-detail summary{cursor:pointer;padding:14px 16px;font-size:13px;font-weight:900;color:#16141f}
.wpe-we-policy-detail>div{display:grid;gap:10px;padding:0 16px 16px}
.wpe-we-policy-detail p{margin:0;color:#6c6885;font-size:12px;line-height:1.75}
.wpe-we-policy-detail b{color:#16141f}
.wpe-we-policy-detail a{color:#0a9fbe;font-weight:800}
.wk-eyebrow,.wk-desc,.wk-summary,.wk-disclaimer,.wk-chip,.wk-slot span,.wk-slot strong,.wk-slot small,.wk-product strong,.wk-product .wk-type,.wk-product .wk-edition,.wk-empty,.wk-flow b,.wk-flow p,.we-notice,.wpe-we-policy-head .wpe-eyebrow,.wpe-we-policy-head .desc,.wpe-we-policy-chip,.wpe-we-policy-grid strong,.wpe-we-policy-grid p,.wpe-we-policy-detail summary,.wpe-we-policy-detail p{font-size:13px!important}
@media(max-width:620px){.wk-grid{grid-template-columns:repeat(3,1fr);gap:6px}.wk-toggle{min-height:88px;padding:14px}.wk-copy h3{font-size:17px}}
@media(max-width:700px){.wk-flow{grid-template-columns:1fr}}
@media(max-width:760px){.wpe-we-policy-grid{grid-template-columns:1fr}}


/* ===== 0820 v2 sync: Ä«µå °³ºÀ ¿¬Ãâ (seal/cine/fx) ½Å±Ô ±ÔÄ¢ ===== */
.seal:has(.card-stage.opened) .seal-resultvideo { opacity:1; }

/* °ø°³ ½ºÇÉ(flipInReveal) µ¿¾È Ä«µå µÞ¸é(card_jp.png)ÀÌ µ¹°í, ³¡¿¡¼­ ´ç÷ À̹ÌÁö°¡ § ³ª¿Â´Ù */
.card-front.revealed::before{
  content:""; position:absolute; inset:0; z-index:6; border-radius:inherit;
  background:var(--oripa-card-back) center/cover no-repeat, #101427;
  animation:revealBackSwap 0.55s cubic-bezier(.2,.78,.25,1) both;
  pointer-events:none;
}
@keyframes revealBackSwap{0%,98%{opacity:1}100%{opacity:0}}

/* ===== »Ì±â 2¾È: ¿µ»ó °³ºÀ (?fx=2) ===== */
.fx2-stage{position:relative;width:100%;aspect-ratio:16/9;max-height:72vh;border-radius:14px;overflow:hidden;background:#000;}
.fx2-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;}
.fx2-burst{position:absolute;left:50%;top:50%;width:10px;height:10px;z-index:1;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0;}
.fx2-burst.go{animation:fx2Burst .75s ease-out both;}
.fx2-burst.go::before{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);animation:fx2BurstRing .8s .05s ease-out both;}
@keyframes fx2Burst{0%{opacity:1;box-shadow:0 0 0 0 rgba(255,255,255,.95),0 0 26px 14px rgba(224,24,127,.85),0 0 60px 30px rgba(122,61,240,.6);}100%{opacity:0;box-shadow:0 0 130px 100px rgba(255,255,255,0),0 0 230px 160px rgba(224,24,127,0),0 0 330px 230px rgba(122,61,240,0);}}
@keyframes fx2BurstRing{0%{opacity:.9;width:12px;height:12px;box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 18px 6px rgba(224,24,127,.5);}100%{opacity:0;width:min(92%,560px);height:min(92%,560px);box-shadow:0 0 0 2px rgba(255,255,255,0),0 0 30px 12px rgba(224,24,127,0);}}
/* Ä«µå µîÀå ½Ã Áß¾Ó¿¡¼­ ¹ÛÀ¸·Î »¸´Â ¹ø°³ (°¢µµ --a, Å©±â --s ´Â JS ÀζóÀÎ) */
.fx2-reveal{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform:translateY(-5px);opacity:0;pointer-events:none;}
.fx2-reveal.show{opacity:1;animation:fx2CardPop .7s cubic-bezier(.18,.85,.3,1.15) both;}
.fx2-reveal.has-acts{pointer-events:auto;}
/* °ø°³ Ä«µå¿¡ ¿Ã¸®¸é º¸°ü/Áï½ÃÆǸŠ¹öÆ°ÀÌ Ä«µå À§·Î ¶á´Ù */
.fx2-acts{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(46%,325px);aspect-ratio:63/88;z-index:5;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;border-radius:12px;background:rgba(10,8,20,.58);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .22s;}
.fx2-reveal.has-acts img:hover~.fx2-acts,.fx2-acts:hover,.fx2-reveal.acts-on .fx2-acts{opacity:1;pointer-events:auto;}
.fx2-act{border:0;border-radius:999px;min-width:172px;padding:12px 18px;font:800 14px Pretendard,'Malgun Gothic',sans-serif;cursor:pointer;}
.fx2-act.keep{background:linear-gradient(90deg,#0a9fbe,#6a2fe0);color:#fff;box-shadow:0 8px 20px rgba(122,61,240,.35);}
.fx2-act.sell{background:#fff;color:#16141f;}
@media(max-width:700px){.fx2-acts{width:min(62%,260px);}}
.fx2-reveal img{width:min(46%,325px);border-radius:12px;box-shadow:0 0 0 2px rgba(122,61,240,.9),0 0 60px 14px rgba(224,24,127,.55),0 24px 54px rgba(0,0,0,.55);}
.fx2-reveal b{width:min(46%,325px);aspect-ratio:63/88;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;border-radius:14px;background:linear-gradient(160deg,#1d1633,#0d0a1c);color:#fff;font-size:clamp(16px,2.4vw,26px);line-height:1.45;word-break:keep-all;box-shadow:0 0 0 2px rgba(122,61,240,.9),0 0 60px 14px rgba(224,24,127,.55),0 24px 54px rgba(0,0,0,.55);}
.fx2-result{min-height:52px;margin-top:12px;display:flex;flex-direction:column;justify-content:center;text-align:center;color:#637589;font-size:14px;line-height:1.6;}
@keyframes fx2CardPop{0%{transform:scale(.25) rotate(-8deg);opacity:0;}55%{opacity:1;}78%{transform:scale(1.07) rotate(1.5deg);}100%{transform:scale(1) rotate(0);opacity:1;}}
@media(max-width:700px){.fx2-stage{aspect-ratio:9/14;}.fx2-reveal img{width:min(62%,260px);}}

/* ÃæÀü ·¹À̾î: ¸ð¹ÙÀÏ Ç®È­¸é ³Êºñ¸¦ ¸ÂÃá´Ù. Ä£±¸ÃÊ´ë´Â PC¿Í °°Àº Ä«µåÇüÀ» À¯ÁöÇÑ´Ù. */
@media(max-width:600px){.tcgchg-box{width:100% !important;max-width:100% !important;box-sizing:border-box !important}}

/* ===== »Ì±â ¸Þ´º: Á¦ÀÚ¸® °íÁ¤ + ½ºÅ©·Ñ ½Ã »ó´Ü Ç÷ÎÆà ¸Þ´º (´Ù¸¥ ÆäÀÌÁöÀÇ tcg-global-nav ¿Í µ¿ÀÏÇÑ ¸ð¾ç) ===== */
.oripa-topnav{position:relative !important;top:auto !important;}
.tcg-float-nav{position:fixed;top:12px;left:50%;transform:translateX(-50%) translateY(-10px);z-index:95;width:min(calc(100vw - 36px),1180px);opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease;}
.tcg-float-nav.show{opacity:1;pointer-events:auto;transform:translateX(-50%);}
.tcg-float-nav .oripa-nav{display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;background:rgba(255,255,255,.86) !important;border:1px solid rgba(20,18,40,.14) !important;border-radius:14px !important;padding:6px !important;box-shadow:0 8px 22px rgba(20,18,40,.07) !important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
.tcg-float-nav .navbtn{min-height:46px !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:0 10px !important;border-radius:9px !important;background:transparent !important;color:#6c6885 !important;font-size:13px !important;font-weight:800 !important;text-shadow:none !important;white-space:nowrap;}
.tcg-float-nav .navbtn:hover{color:#16141f !important;background:rgba(20,200,230,.09) !important;}
.tcg-float-nav .navbtn.active{background:linear-gradient(90deg,#14c8e6,#7a3df0) !important;color:#fff !important;box-shadow:none !important;} 
@media(max-width:900px){
  .tcg-float-nav{width:calc(100vw - 28px);}
  .tcg-float-nav .oripa-nav{display:flex !important;justify-content:space-between !important;flex-wrap:nowrap !important;gap:0 !important;border-radius:999px !important;padding:5px 8px !important;background:rgba(255,255,255,.94) !important;border:1px solid rgba(20,18,40,.10) !important;box-shadow:0 8px 22px rgba(20,18,40,.14) !important;}
  .tcg-float-nav .navbtn{flex:0 0 auto !important;min-height:35px !important;padding:7px 10px !important;font-size:13px !important;border-radius:999px !important;}
  .tcg-float-nav .navbtn.active{box-shadow:0 3px 14px rgba(122,61,240,.35) !important;}
}



/* [home-daily-card-fit 20260826] ¸ð¹ÙÀÏ È¨ daily-card: Èò ¿©¹é Á¦°ÅÇÏ°í À̹ÌÁö Å©±â¿¡ µü ¸ÂÃã(µÕ±Ù ¸ð¼­¸® À¯Áö) */

      /* ===== home.html Àü¿ë : w_pokemon_event ½ºÅ²(new02 / Holo Light) À§¿¡ ¾ñ´Â ÃÖ¼Ò ½ºÅ¸ÀÏ ===== */
      .home-oripa .wrap { padding-bottom: 40px; }
      .home-oripa {text-align: left; }
      /* ¹è³Ê(top-hero)°¡ hero-zone ¾È¿¡¼­ z-index:1 À̹ǷÎ, ÀÌÈÄ ÄÜÅÙÃ÷¸¦ ±× À§·Î ¿Ã¸°´Ù */
      .home-oripa .wrap > section { position: relative; z-index: 2; }
      .home-section { margin: 30px 0 0;}

      /* 7°³ ¸Þ´º : ¸ð¹ÙÀÏ¿¡¼­ ³ÑÄ¡Áö ¾Ê°Ô Ãà¼Ò */
      @media (max-width: 860px) {
        .home-oripa .oripa-nav .navbtn { font-size: 13px !important; padding: 8px 2px !important; }
      }

      /* ÇöÀç ¿î¿µ ±âÁØ (wpe-summary Àç»ç¿ë) */ 
      .home-rules { grid-template-columns: repeat(4, 1fr); }   
      .home-rules span { display: block; margin-top: 5px; color: #6c6885; font-size: 13px; font-weight: 400; line-height: 1.55; }
      .home-rules em { font-style: normal; color: #d4179a; font-weight: 800; }
      @media (max-width: 700px) { .home-rules { grid-template-columns: repeat(2, 1fr); } }   

      /* 4°¡Áö Âü¿© ¹æ½Ä */
      .home-play-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
      .home-play {
        --accent: #14c8e6;
        position: relative; overflow: hidden; min-height: 316px; padding: 20px; 
        border: 1px solid var(--line); border-radius: 15px;
        background: linear-gradient(180deg, #ffffff, #faf9fe);
        box-shadow: 0 10px 24px rgba(20,18,40,.07);
        transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;  
      }
      .home-play::after {
        content: ""; position: absolute; right: -56px; top: -56px; width: 156px; height: 156px;
        border-radius: 50%; background: color-mix(in srgb, var(--accent) 13%, transparent); pointer-events: none;
      }
      .home-play:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--accent) 45%, #ffffff); box-shadow: 0 16px 34px rgba(20,18,40,.13); }
      .home-play.is-draw    { --accent: #14c8e6; }
      .home-play.is-auction { --accent: #ff7b45; }
      .home-play.is-memory  { --accent: #7a3df0; }
      .home-play.is-lucky   { --accent: #d4179a; }

      .home-play__top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
      .home-play__no { margin: 0; color: var(--accent); font-size: 13px; font-weight: 900; letter-spacing: .06em; }
      .home-play__live { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: #16141f; font-size: 13px; font-weight: 800; }
      .home-play__live i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent); }
      .home-play h3 { position: relative; z-index: 2; margin: 14px 0 7px; font-size: 21px; font-weight: 800; letter-spacing: -.02em; }
      .home-play__desc { position: relative; z-index: 2; max-width: 268px; margin: 0; color: #6c6885; font-size: 13px; line-height: 1.65; }
      .home-play__tags { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 5px; margin-top: 14px; }
      .home-play__tags span { padding: 6px 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: #16141f; font-size: 13px; font-weight: 800; }
      .home-play__tags .hpt-break { flex-basis: 100%; height: 0; margin: 0; padding: 0; border: 0; }
      .home-play__cta { position: absolute; left: 20px; bottom: 20px; z-index: 3; display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; padding: 5px 18px;}

      /* Âü¿© ¹æ½Ä Ä«µå ÀÏ·¯½ºÆ® */
      .home-play__art { position: absolute; right: 16px; bottom: 18px; width: 190px; height: 200px; z-index: 1; pointer-events: none; }
      .home-play__art .stack-card { position: absolute; right: 46px; bottom: 4px; width: 96px; transform-origin: bottom center; filter: drop-shadow(0 12px 9px rgba(20,18,40,.24)); }
      .home-play__art .stack-card:nth-child(1) { transform: rotate(-13deg) translateX(-30px); }
      .home-play__art .stack-card:nth-child(2) { transform: rotate(10deg) translateX(27px); }
      .home-play__art .stack-card:nth-child(3) { transform: rotate(-1deg) translateY(-10px); }
      .home-play__slab { position: absolute; right: 8px; bottom: 0; width: 140px; padding: 10px 8px 8px; border: 5px solid #f4f2fb; border-radius: 15px; background: #fff; box-shadow: 0 13px 22px rgba(20,18,40,.2); transform: rotate(4deg); }
      .home-play__slab::before { content: "DAILY LOT"; display: block; margin-bottom: 6px; color: #d4179a; font-size: 13px; font-weight: 900; letter-spacing: .04em; }
      .home-play__slab img { width: 100%; display: block; border-radius: 7px; }
      .home-play__board { position: absolute; right: 6px; bottom: 6px; width: 172px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; transform: rotate(3deg); }
      .home-play__board img { width: 100%; height: 72px; object-fit: cover; border-radius: 6px; box-shadow: 0 4px 9px rgba(20,18,40,.18); }
      .home-play__board img:nth-child(2), .home-play__board img:nth-child(5) { filter: hue-rotate(200deg) saturate(.85); }
      .home-play__ring { position: absolute; right: 6px; bottom: 6px; width: 178px; height: 178px; border-radius: 50%; background: conic-gradient(from 15deg, #14c8e6, #7a3df0, #d4179a, #ff7b45, #14c8e6); filter: drop-shadow(0 12px 18px rgba(122,61,240,.24)); animation: homeSpin 12s linear infinite; }
      .home-play__ring::after { content: ""; position: absolute; inset: 13px; border-radius: 50%; background: #f4f2fb; }
      /* [lucky-reel 20260826] ·°Å°Ä«µå: µµ´Â Ä«µå Áß ¼±Åà īµå°¡ Áß¾Ó¿¡¼­ ¸ØÃç ±×´ë·Î Ä¿Áü */
      .home-play.is-lucky .lucky-reel { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 69px; height: 176px; overflow: hidden; z-index: 3; animation: reelFade 7.5s infinite; }
      .home-play.is-lucky .lucky-reel__strip { display: flex; flex-direction: column; animation: reelSpin 7.5s infinite; }
      .home-play.is-lucky .lucky-reel__strip img { display: block; width: 100%; height: 96px; object-fit: cover; }
      .home-play.is-lucky .lucky-winner { position: absolute; left: 50%; top: 50%; width: 90px; z-index: 5; border-radius: 6px; filter: drop-shadow(0 14px 20px rgba(122,61,240,.55)); opacity: 0; transform: translate(-50%, -50%) scale(1); animation: winnerPop 7.5s infinite; }
      @keyframes reelSpin {
        0%   { transform: translateY(0); animation-timing-function: cubic-bezier(.4,.02,.3,1); }
        27%  { transform: translateY(-728px); }
        100% { transform: translateY(-728px); }
      }
      @keyframes reelFade { 0%, 24% { opacity: 1; } 32%, 100% { opacity: .14; } }  
      @keyframes winnerPop {
        0%, 25% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
        27%       { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        31%       { opacity: 1; transform: translate(-50%, -50%) scale(1.3); } 
        34%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1.15); }
      }
      @media (prefers-reduced-motion: reduce){ .home-play.is-lucky .lucky-reel__strip, .home-play.is-lucky .lucky-winner, .home-play.is-lucky .lucky-reel { animation: none !important; } .home-play.is-lucky .lucky-winner { opacity: 1 !important; transform: translate(-50%, -50%) scale(1.15) !important; } .home-play.is-lucky .lucky-reel { opacity: .18 !important; } }
      /* PC(>=861px): ¼±Åà īµå ´õ Å©°Ô */
      @media (min-width: 861px){ .home-play.is-lucky .lucky-winner { animation-name: winnerPopPC; } }
      /* lucky-winner-mobile-w : ¸ð¹ÙÀÏ ¼±Åà īµå Æø Å°¿ò */
      @media (max-width: 860px){ .home-play.is-lucky .lucky-winner { width: 90px; } }
      @keyframes winnerPopPC {
        0%, 25% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
        27%       { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        31%       { opacity: 1; transform: translate(-50%, -50%) scale(1.7); }
        34%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1.5); }
      }
      .home-play__ring img { position: absolute; z-index: 2; left: 50%; top: 50%; width: 92px; transform: translate(-50%, -50%) rotate(-4deg); filter: drop-shadow(0 8px 8px rgba(20,18,40,.24)); }
      @keyframes homeSpin { to { transform: rotate(360deg); } }

      /* ¿À´ÃÀÇ HIT */
      .home-oripa .daily-hit-zone { margin: 30px 0 0; }
      .home-oripa .hit-zone-head p { line-height: 1.65; }
      .home-hit-actions { margin-top: 14px; display: flex; gap: 8px; flex-wrap: wrap; }
      .home-hit-actions .cta { border-radius: 999px; }
      /* w_pokemon_event¿Í µ¿ÀÏÇÑ ¸ð¹ÙÀÏ °¡·Î ½½¶óÀ̵å */
      @media (max-width: 860px) {
        /* ¡Ú -webkit-overflow-scrolling:touch ¸¦ »°´Ù. iOS 13 ºÎÅÍ´Â °ü¼º ½ºÅ©·ÑÀÌ ±âº»À̶ó
           ÀÖÀ¸³ª ¸¶³ªÀÎ ±¸Çü ¼Ó¼ºÀε¥, ¿¹ÀüºÎÅÍ iOS ¿¡¼­ °¡·Î ½ºÅ©·ÑÀÌ ¸ØÃß´Â
           ¹ö±×ÀÇ ´Ü°ñ ¿øÀÎÀ̾ú´Ù(¾ÆÀÌÆù¿¡¼­ Ȩ HIT Ä«µå¸¸ ¾È ¹Ð¸°´Ù´Â Á¦º¸).
           ´ë½Å tcg-nav.js ÀÇ bindTouchDrag() °¡ Ȩ Ä«µå ÁÙÀ» Á÷Á¢ ¹Î´Ù. */
        .home-oripa .daily-card-row { display: block !important; grid-template-columns: none !important; white-space: nowrap !important; overflow-x: auto !important; overflow-y: hidden !important; min-width: 0 !important; max-width: 100% !important; padding-bottom: 6px !important; }
        .home-oripa .daily-card { display: inline-block !important; white-space: normal !important; vertical-align: top !important; width: 40% !important; min-width: 40% !important; margin: 0 9px 0 0 !important; }
        .home-oripa .hit-zone-head { align-items: flex-start; flex-direction: column; gap: 8px; }
      }

      /* ¸¶Áö¸· CTA */
      .home-cta {
        position: relative; overflow: hidden; margin: 26px 0 10px; padding: 44px 30px; text-align: center;
        border: 1px solid var(--line); border-radius: 15px;
        background: linear-gradient(135deg, #ffffff 0%, #f4f2fb 58%, #ece8f7 100%);
        box-shadow: 0 10px 26px rgba(20,18,40,.08);
      }
      .home-cta::before, .home-cta::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
      .home-cta::before { left: -70px; top: -80px; width: 190px; height: 190px; background: rgba(20,200,230,.16); }
      .home-cta::after { right: -70px; bottom: -110px; width: 220px; height: 220px; background: rgba(122,61,240,.13); }
      .home-cta p.home-eyebrow { position: relative; margin: 0 0 8px; color: #d4179a; font-size: 13px; font-weight: 900; letter-spacing: .12em; }
      .home-cta h2 { position: relative; margin: 0 0 10px; font-size: 26px; font-weight: 800; letter-spacing: -.03em; }
      .home-cta p.home-cta__lead { position: relative; margin: 0 0 20px; color: #6c6885; font-size: 13px; line-height: 1.7; }
      .home-cta .cta { position: relative; border-radius: 999px; padding: 14px 26px; }

      @media (max-width: 760px) {
        .home-play-grid { grid-template-columns: 1fr; } 
        .home-play { min-height: 300px; padding: 18px; }
        .home-play__cta { left: 18px; bottom: 18px; }
        .home-play__art { right: 4px; transform: scale(.86); transform-origin: right bottom; }
        .home-cta { padding: 34px 18px; }
      }
@media (max-width: 860px){
  .oripa-wrap.home-oripa .daily-card img { height: auto !important; object-fit: contain !important; background: transparent !important; }
}


/* [main-hero-overlap 20260826] oripa-topnav Á¦°Å ÈÄ, mainÀ» hero ¹è³Ê¿¡ ´Ù½Ã °ãħ(Àüó·³) */
.oripa-wrap.home-oripa > main.wrap { margin-top: -400px !important; position: relative !important; z-index: 2 !important; }
@media (max-width: 860px){
  .oripa-wrap.home-oripa > main.wrap { margin-top: calc(-24vw - 20px) !important; }
}

/* [nav-hero-overlap 20260826] tcg-global-nav(¹ÝÅõ¸í pill Çì´õ)¸¦ »ó´Ü À̹ÌÁö¿Í °ãħ (pc+¸ð¹ÙÀÏ) */
.tcg-global-nav { z-index: 90 !important; }
body:has(.home-oripa) .tcg-global-nav { margin-bottom: -70px !important; }
@media (max-width: 860px){
  body:has(.home-oripa) .tcg-global-nav { margin-bottom: -56px !important; }
}

/* [wrap-match-header 20260826] PC: ÄÜÅÙÃ÷ .wrap ÆøÀ» Çì´õ(tcg-global-nav/topbar)¿Í µ¿ÀÏÇÏ°Ô ÅëÀÏ */
@media (min-width: 901px){
  .wrap {
    width: min(calc(100% - 36px), 1100px) !important;
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  } 
}

/* [tcg-page-unify 20260826] tcg-drop mainÀ» .tcg-page·Î ÅëÀÏ - auction°ú µ¿ÀÏ ½ºÅ¸ÀÏ */
.tcg-page { width: min(calc(100% - 36px), 1100px); margin: auto; padding: 28px 0 88px; font-size: 13px; }
@media (max-width: 900px){ .tcg-page { padding-top: 10px; } }
@media (max-width: 580px){ .tcg-page { width: calc(100% - 22px); padding: 10px 0 70px; } }

/* [hit-popup-mobile-fit 20260826] ¿À´ÃÀÇ HITÄ«µå Æ˾÷(market-compact) ¸ð¹ÙÀÏ È­¸é¹Û ³Ñħ ¼öÁ¤: dvh + Æø 100% + ½ºÅ©·Ñ */
@media (max-width: 900px){
  .modal.market-compact {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100vh - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
  }
}

/* [hit-popup-split-fix 20260826] ¿À´ÃÀÇ HITÄ«µå Æ˾÷: 2´ÜÀÌ ÇÑÁÙ·Î ³ÑÃÄ ¿À¸¥ÂÊÀÌ ¾Èº¸ÀÌ´ø ¹®Á¦ -> ¸ð¹ÙÀÏ 1´Ü ¼¼·Î */
@media (max-width: 900px){
  .modal.market-compact .card-market-detail { grid-template-columns: 1fr !important; gap: 16px !important; }
  .modal.market-compact .card-market-visual img { width: 100% !important; height: auto !important; max-height: 46vh !important; object-fit: contain !important; }
  .modal.market-compact .card-market-visual, .modal.market-compact .card-market-copy { min-width: 0 !important; margin: 10px 0 0 0; }
  .modal.market-compact .card-market-copy { overflow-wrap: anywhere !important; }
}
/* ===================== HOME ADD v2 (tcg-main-design.html) ===================== */
/* Pretendard °­Á¦ (ºòÆÄÀÏ °øÅë CSS »ó¼Ó µ¤¾î¾²±â ¹æÁö) */
.home-oripa, .home-oripa * { font-family: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif !important; }
.home-oripa .history-trigger span,
.home-oripa .history-calendar header small,
.home-oripa .history-results > small,
.home-oripa .history-legend span,
.home-oripa .history-win div > span,
.home-oripa .history-group > header span { font-family: ui-monospace, Consolas, monospace !important; }

/* ±×¸² ã±â(is-memory) Ä«µå µÚÁý±â */
.home-play.is-memory .home-play__board { perspective: 800px; }
.home-play.is-memory .mz-card { position: relative; aspect-ratio: .72; transform-style: preserve-3d; animation: mzFlip 6s infinite; }
.home-play.is-memory .mz-card.mz-match { animation: mzMatch 6s infinite; }
.home-play.is-memory .mz-card.mz-m2 { animation: mzMatch2 6s infinite; }
.home-play.is-memory .mz-card > span { position: absolute; inset: 0; border-radius: 6px; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; box-shadow: 0 4px 9px rgba(20,18,40,.18); }
.home-play.is-memory .mz-front { background: url("/_template/service/images/07event_images/2026/08_pokemon/card.png?v=20260831") center / cover, linear-gradient(135deg,#7a3df0,#14c8e6); }
.home-play.is-memory .mz-back { transform: rotateY(180deg); }
.home-play.is-memory .home-play__board .mz-back img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; box-shadow: none; }
.home-play.is-memory .mz-match .mz-back { animation: mzGlow 6s infinite; }
@keyframes mzFlip { 0%,8% { transform: rotateY(0); } 20%,38% { transform: rotateY(180deg); } 50%,100% { transform: rotateY(0); } }
@keyframes mzMatch { 0%,8% { transform: rotateY(0); } 20%,38% { transform: rotateY(180deg); } 50%,60% { transform: rotateY(0); } 66%,84% { transform: rotateY(180deg); } 91%,100% { transform: rotateY(0); } }
@keyframes mzMatch2 { 0%,8% { transform: rotateY(0); } 20%,38% { transform: rotateY(180deg); } 50%,66% { transform: rotateY(0); } 72%,84% { transform: rotateY(180deg); } 91%,100% { transform: rotateY(0); } }
@keyframes mzGlow { 0%,64% { box-shadow: 0 4px 9px rgba(20,18,40,.18); } 74%,82% { box-shadow: 0 0 0 3px #ffe14d, 0 0 16px rgba(255,225,77,.65); } 90%,100% { box-shadow: 0 4px 9px rgba(20,18,40,.18); } }

/* ¿À¸®ÆÄ(is-draw): µÞÀåºÎÅÍ Çϳª¾¿ ³»·Á¿À°í, °¡¿îµ¥ Ä«µå µÚÁýÇô °ø°³ */
.home-play.is-draw .home-play__art { perspective: 700px; }
.home-play.is-draw .home-play__art .stack-card:nth-child(1) { animation: hmDrop1 6s infinite; }
.home-play.is-draw .home-play__art .stack-card:nth-child(2) { animation: hmDrop2 6s infinite; }
.home-play.is-draw .home-play__art .stack-flip { position: absolute; right: 46px; bottom: 4px; width: 96px; aspect-ratio: .716; transform-origin: bottom center; perspective: 700px; filter: none !important; animation: hmDrop3 6s infinite; }
.home-play.is-draw .sf-inner { position: absolute; inset: 0; transform-style: preserve-3d; animation: hmFlip3 6s infinite; }
.home-play.is-draw .sf-inner > span { position: absolute; inset: 0; border-radius: 7px; overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden; box-shadow: 0 4px 10px rgba(20,18,40,.2); }
.home-play.is-draw .sf-front { background: url("/_template/service/images/07event_images/2026/08_pokemon/card.png?v=20260831") center / cover; }
.home-play.is-draw .sf-back { transform: rotateY(180deg); }
.home-play.is-draw .sf-back img { width: 100%; height: 100%; object-fit: cover; display: block; }
@keyframes hmDrop1 { 0% { opacity: 0; transform: translateY(-48px) rotate(-13deg) translateX(-30px); } 10% { opacity: 1; transform: translateY(0) rotate(-13deg) translateX(-30px); } 86% { opacity: 1; transform: translateY(0) rotate(-13deg) translateX(-30px); } 100% { opacity: 0; transform: translateY(-48px) rotate(-13deg) translateX(-30px); } }
@keyframes hmDrop2 { 0%,6% { opacity: 0; transform: translateY(-48px) rotate(10deg) translateX(27px); } 16% { opacity: 1; transform: translateY(0) rotate(10deg) translateX(27px); } 86% { opacity: 1; transform: translateY(0) rotate(10deg) translateX(27px); } 100% { opacity: 0; transform: translateY(-48px) rotate(10deg) translateX(27px); } }
@keyframes hmDrop3 { 0%,14% { opacity: 0; transform: translateY(-58px); } 26%,88% { opacity: 1; transform: translateY(-10px); } 100% { opacity: 0; transform: translateY(-58px); } }
@keyframes hmFlip3 { 0%,40% { transform: rotateY(0deg); } 56%,76% { transform: rotateY(180deg); } 88%,100% { transform: rotateY(0deg); } }

/* µ¥Àϸ® ¿Á¼Ç(is-auction): ¿À¸¥ÂÊ -> ¿ÞÂÊ ÆäÀ̵åÀÎ */
.home-play.is-auction .home-play__slab { transform-origin: 100% 100%; animation: hmAuc 5s infinite; }
@keyframes hmAuc { 0% { opacity: 0; transform: translate(10px,-14px) rotate(45deg); } 18% { opacity: 1; transform: translate(0,0) rotate(4deg); } 86% { opacity: 1; transform: translate(0,0) rotate(4deg); } 100% { opacity: 0; transform: translate(10px,-14px) rotate(45deg); } }

@media (prefers-reduced-motion: reduce){ .home-play.is-memory .mz-card, .home-play.is-draw .stack-card, .home-play.is-draw .stack-flip, .home-play.is-draw .sf-inner, .home-play.is-auction .home-play__slab { animation: none !important; } }
/* =================== /HOME ADD v2 =================== */
/* ===== ÁøÀÔ Æ˾÷ (pkm-popup) ===== */
.pkm-popup[hidden]{ display:none; } 
.pkm-popup{ position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding:18px; font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif; }
.pkm-popup__dim{ position:absolute; inset:0; background:rgba(10,8,20,.62); }
.pkm-popup__box{ position:relative; z-index:1; display:inline-flex; flex-direction:column; border-radius:16px;  animation:pkmPopIn .28s cubic-bezier(.2,.8,.3,1); }
.pkm-popup__img{ display:block; line-height:0; }
.pkm-popup__img img{ display:block; width:auto; height:auto; max-width:min(92vw,720px); max-height:calc(88vh - 52px); }
.pkm-popup__bar{ position:absolute; left:0; right:0; bottom:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px 12px; background:transparent; }
.pkm-popup__hide{padding: 0 0 10px 60px; font-weight: 600; letter-spacing: -0.5px; display:inline-flex; align-items:center; gap:7px; color:#202020; font-size:13px; cursor:pointer; user-select:none; } 
 
         

.pkm-popup__hide input{ width:16px; height:16px; accent-color:#d4179a; cursor:pointer; margin:0; }
.pkm-popup__close{width: 62px; height: 62px; border:0; background:#d41717; color:#fff; font-size:15px; font-weight:800; padding:9px 18px; border-radius:999px; cursor:pointer; white-space:nowrap; position: absolute; right: 8px; bottom: 4px; opacity: 1 }
.pkm-popup__close:hover{ background:#b8148a; }
@keyframes pkmPopIn{ from{ opacity:0; transform:translateY(14px) scale(.96); } to{ opacity:1; transform:none; } }
@media (max-width:768px){ .pkm-popup__img img{ max-width:92vw; max-height:calc(86vh - 52px); } }

  @media(max-width:768px){  
.pkm-popup__hide{padding: 0 0 5px 32px; }

.pkm-popup__close{width: 40px; height: 40px; padding: 0; font-size:13px; position: absolute; right: 4px; bottom: 0; }
}
  @media(max-width:320px){ 
.pkm-popup__hide{padding: 0 0 0.1vh 5vw; font-size: 4vw; } 
.pkm-popup__close{width: 11vw; height: 11vw; font-size: 4vw;}
}

/* [HIT hover bg override] ¹øÈ£»Ì±â ¿À´ÃÀÇ HIT Ä«µå hover ¹è°æ - 2731ÁÙ !important µ¤¾î¾²±â */
.daily-card:hover { background: linear-gradient(180deg, #dae6f2 0%, #eaf1f8 55%, #ffffff 100%) !important; }

/* »ó½Ã ¿À¸®ÆÄ Áø¿­´ë - ¹Ú½º À̹ÌÁö¡¤¸ÞŸ ¿©¹é Á¤¸® (20260829)
   1) À̹ÌÁö°¡ ÄÁÅ×ÀÌ³Ê ¹Ù´Ú¿¡ ºÙ¾î µå·Ó¼¨µµ°¡ À߸®°í ´ä´äÇß´Ù -> ¾Æ·¡ ¿©¹é È®º¸
   2) .shelf-meta ÀÇ ¾Æ·¡ padding ÀÌ 0 À̶ó KREAM ¸µÅ©°¡ Å׵θ®¿¡ ´ê¾Ò´Ù */
/* ¹Ú½º ¾ÆÆ®¸¦ Å°¿ì°í À§¾Æ·¡·Î ¼û ½¯ °ø°£À» ÁØ´Ù (À̹ÌÁö 150 -> 170px) */
.shelf-image{height:196px !important;padding:10px 0 16px !important;box-sizing:border-box !important}
.shelf-image img{height:170px !important}
.shelf-image::before{bottom:12px !important;opacity:.85 !important}
.shelf-meta{padding-bottom:12px !important}
.shelf-meta span{margin-bottom:6px !important}
/* KREAM ¸µÅ©´Â JS °¡ ÀζóÀÎ ½ºÅ¸ÀÏ·Î ºÙ¿©¼­ !important ·Î¸¸ À̱ä´Ù.
   inline-block À̶ó .shelf-meta ÀÇ À½¼ö ¸¶Áø Å¿¿¡ ¿ÞÂÊ ³¡À¸·Î »ßÁ®³ª°¬´Ù -> ºí·Ï °¡¿îµ¥ Á¤·Ä */
.tcg-kream-link{display:block !important;text-align:center !important;margin:2px 10px 0 !important;font-size:11px !important;opacity:.6 !important;text-decoration-color:rgba(20,18,40,.35) !important}
.shelf-product:hover .tcg-kream-link{opacity:.9 !important}

/* ===== ²Î ¸¶Àϸ®Áö ¹Ù (ºÎÈ­ÀåÄ¡ º´) =====
   ¿ÞÂÊ °íÁ¤. ¿À¸¥ÂÊ ¸ÇÀ§·Î ¹öÆ°°ú ÁÂ¿ì ´ëĪÀÌ µÇ°Ô ¸ÂÃá´Ù.
   ¡Ú ±âÁØÀº `.tcg-to-top` ÀÌ´Ù (right: max(16px, -606px + 50vw); bottom: 24px).
     ÀÌ ÆäÀÌÁö¿¡´Â `.w-to-top` ÀÌ ¾ø´Ù - ±×°Ç tcg-main-design.html Àü¿ëÀÌ°í
     Ä÷³ ±âÁصµ 1080px ¶ó ´Ù¸£´Ù. óÀ½¿¡ ±×°É º£²¼´Ù°¡ 10px ¾ÈÂÊÀ¸·Î µé¾î°¬´Ù.
     `-606px + 50vw` ´Â (100vw - 1212px)/2 ¿Í °°´Ù. µÎ °ªÀÌ °¥¸®¸é ´ëĪÀÌ ±úÁö´Ï
     .tcg-to-top ÂÊÀÌ ¹Ù²î¸é ¿©±âµµ °°ÀÌ ¹Ù²Ü °Í.
   ¡Ú ¼¼·Î´Â ÀϺη¯ ¾î±ß³ª ÀÖ´Ù. .tcg-to-top Àº bottom:24px Àε¥ º´Àº 74px -
     ¿î¿µ ¿äûÀ¸·Î 50px ¿Ã·È´Ù. Á¿츸 ´ëĪÀÌ°í ³ôÀÌ´Â ¸ÂÃßÁö ¾Ê´Â´Ù. */
.mileage-jar[hidden]{display:none !important}
.mileage-jar{
  --mileage-fill:0%;
  position:fixed; bottom:74px; left:max(16px, -606px + 50vw);
  z-index:60; display:flex; flex-direction:column; align-items:center; gap:6px;
  width:52px; padding:8px 6px 7px; box-sizing:border-box;
  border-radius:26px; border:1px solid rgba(20,18,40,.10);
  background:rgba(255,255,255,.92); box-shadow:0 10px 26px rgba(20,18,40,.18);
  cursor:default; -webkit-user-select:none; user-select:none;
}
.mileage-jar-body{position:relative; display:flex; flex-direction:column; align-items:center}
/* ºÎÈ­ÀåÄ¡ ¶Ñ²± */
.mileage-jar-cap{
  display:block; width:18px; height:7px; margin-bottom:-1px;
  border-radius:4px 4px 2px 2px; background:linear-gradient(180deg,#7a3df0,#5a27c4);
}
/* º´ - ¾Æ·¡°¡ ³ÐÀº ĸ½¶ */
.mileage-jar-glass{
  position:relative; display:block; width:30px; height:52px; overflow:hidden;
  border:2px solid rgba(20,18,40,.18); border-radius:10px 10px 15px 15px;
  background:linear-gradient(180deg,#f4f2fb,#ffffff);
}
/* Â÷¿À¸£´Â ¾×ü. ³ôÀ̸¸ JS °¡ ¹Ù²Û´Ù */
.mileage-jar-fill{
  position:absolute; left:0; right:0; bottom:0; height:var(--mileage-fill);
  background:linear-gradient(180deg,#14c8e6,#7a3df0);
  transition:height .4s ease;
}
.mileage-jar-count{font-size:12px; font-weight:800; line-height:1; color:#3a3652}
.mileage-jar-count small{font-size:10px; font-weight:600; opacity:.55}
/* ¸ð´ÞÀÌ ¿­¸®¸é ¼û±ä´Ù. .w-to-top °ú °°Àº ±ÔÄ¢ - °³ºÀ ¿¬Ãâ À§¿¡ º´ÀÌ ¶° ÀÖÀ¸¸é ¾È µÈ´Ù */
body:has(.modalback.open) .mileage-jar{display:none !important}
@media (max-width:860px){
  /* .w-to-top ÀÌ ¸ð¹ÙÀÏ¿¡¼­ bottom:84px ·Î ¿Ã¶ó°¡¹Ç·Î °°Àº ³ôÀÌ·Î ¸ÂÃá´Ù */
  .mileage-jar{left:12px; bottom:84px; width:46px; padding:7px 5px 6px}
  .mileage-jar-glass{width:26px; height:44px}
}

/* ===== ¸¶Àϸ®Áö 50 Áö±Þ Æ˾÷ =====
   °³ºÀ °á°ú ¸ð´Þ(z 9500) °ú ÁøÀÔ Æ˾÷(.pkm-popup, z 10000) À§¿¡ ¶á´Ù.
   °á°ú È­¸éÀ» µ¤¾î¾²Áö ¾Êµµ·Ï #back À» Àç»ç¿ëÇÏÁö ¾Ê°í º°µµ ·¹À̾î·Î µÐ´Ù. */
.mileage-popup[hidden]{display:none !important}
.mileage-popup{
  position:fixed; inset:0; z-index:10001; display:flex;
  align-items:center; justify-content:center; padding:18px;
}
.mileage-popup-dim{position:absolute; inset:0; background:rgba(10,8,20,.62)}
.mileage-popup-box{
  position:relative; z-index:1; width:min(92vw,340px); box-sizing:border-box;
  padding:26px 22px 20px; border-radius:18px; text-align:center;
  background:radial-gradient(circle at 50% 0%,#ffffff,#f2ecfc 78%);
  box-shadow:0 18px 44px rgba(10,8,20,.38);
  animation:mileagePopIn .28s cubic-bezier(.2,.8,.3,1);
}
.mileage-popup-icon{
  width:56px; height:56px; margin:0 auto 14px; border-radius:50%;
  background:linear-gradient(180deg,#14c8e6,#7a3df0);
  box-shadow:0 8px 20px rgba(122,61,240,.35);
}
.mileage-popup-box p{margin:0 0 18px; font-size:15px; font-weight:700; line-height:1.5; color:#221f3a}
.mileage-popup-box .cta{width:100%}
@keyframes mileagePopIn{from{opacity:0; transform:translateY(10px) scale(.96)}}