*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#173c3f;color:#f5e7cf}body{font-family:'Songti SC','Noto Serif SC','SimSun',serif;min-height:100svh;overflow-x:hidden}.scene{position:fixed;inset:0;background:#173c3f url('assets/table.webp') center/cover no-repeat;z-index:0}.shade{position:fixed;inset:0;background:linear-gradient(0deg,#08232633,transparent 35%,#08232622);pointer-events:none;z-index:1}.layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr);min-height:100svh}.layout.has-selection{grid-template-columns:minmax(0,1fr) 330px}.table{padding:32px;min-width:0;min-height:100svh;display:flex;align-items:center;justify-content:center}.deck{width:100%;max-width:1360px;display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:14px;align-items:center}.card{position:relative;width:100%;aspect-ratio:1001/1570;padding:0;border:0;background:transparent;cursor:pointer;perspective:1000px;transform:rotate(var(--angle));transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .5s;isolation:isolate;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.card:hover{transform:translateY(-5px) rotate(0) scale(1.07);z-index:3}.card:focus-visible{outline:2px solid #f8e8ad;outline-offset:4px;border-radius:5px}.card-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1.35s cubic-bezier(.22,.68,.2,1)}.face{position:absolute;inset:0;border-radius:5px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 5px 10px #001c22aa,0 1px 2px #fff5}.face img{width:100%;height:100%;display:block;object-fit:cover}.veiled{transform:translateZ(1px)}.veiled img{filter:blur(6.5px) brightness(.76) saturate(.72);transform:scale(1.13)}.veil{position:absolute;inset:0;background:linear-gradient(135deg,#d7c4f212,#dce5d80a);border:1px solid #f7dfb14a;border-radius:5px}.unveiled{transform:rotateY(180deg)}.unveiled:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,#fff9df66 44%,transparent 60%);transform:translateX(-140%);pointer-events:none}.revealed .card-inner{transform:rotateY(180deg)}.card.active{transform:translateY(-3px) rotate(0) scale(1.07);z-index:4}.card.active .face{box-shadow:0 6px 18px #00151fbb,0 0 0 1px #eacf87dd,0 0 24px #e5dba655}.placeholder .veiled img{filter:blur(5.5px) brightness(.83);transform:scale(1.12)}.card.revealing:before,.card.revealing:after{content:'';position:absolute;inset:-12px;border:1px solid #f7dfb4;border-radius:50%;pointer-events:none;animation:halo 1.7s ease-out both;box-shadow:0 0 18px #f4d89c77}.card.revealing:after{animation-delay:.2s;inset:-22px}.revealing .unveiled:after{animation:sheen 1.3s .55s ease-in-out both}.story{height:100svh;position:sticky;top:0;display:flex;align-items:center;padding:32px 32px 32px 10px;background:linear-gradient(90deg,transparent,#09292ee6 28%,#09292ef5)}[hidden]{display:none!important}.story-inner{width:100%;text-align:left}.selected-art{display:block;width:min(100%,230px);height:auto;aspect-ratio:1001/1570;object-fit:cover;margin:0 0 27px;border-radius:9px;box-shadow:0 12px 32px #00161f77}h1{font-size:32px;font-weight:400;line-height:1.4;letter-spacing:5px;margin:0 0 7px}.english{font-family:Baskerville,Georgia,serif;font-style:italic;font-size:21px;color:#d7c1d8;margin:0 0 20px;line-height:1.4}.intro{font-size:13px;line-height:2.1;color:#e4decb;margin:0;letter-spacing:.5px}.status{font-size:13px;line-height:1.8;color:#d2c6b3;letter-spacing:1px;margin:0}.arriving{animation:arrive .6s ease both}#magic{position:fixed;inset:0;z-index:8;pointer-events:none;width:100%;height:100%}@keyframes halo{0%{opacity:0;transform:scale(.7) rotate(-30deg)}25%{opacity:.9}100%{opacity:0;transform:scale(1.7) rotate(30deg)}}@keyframes sheen{from{transform:translateX(-140%)}to{transform:translateX(140%)}}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-height:760px) and (min-width:1001px){.story{padding-top:20px;padding-bottom:20px}.selected-art{width:180px;margin-bottom:18px}h1{font-size:27px}.english{font-size:18px;margin-bottom:14px}.intro{font-size:12px}}@media(max-width:1000px){.table{padding:26px}.deck{grid-template-columns:repeat(10,minmax(0,1fr));max-width:none;gap:12px}.layout.has-selection{grid-template-columns:minmax(0,1fr) 280px}.has-selection .deck{grid-template-columns:repeat(8,minmax(0,1fr))}.story{padding:22px 25px 22px 5px}.selected-art{width:200px}h1{font-size:27px}}@media(max-width:680px){.table{padding:24px 18px;align-items:flex-start}.deck{grid-template-columns:repeat(6,minmax(0,1fr));gap:11px 9px}.layout.has-selection{display:block}.has-selection .deck{grid-template-columns:repeat(6,minmax(0,1fr))}.has-selection .table{padding-bottom:300px}.scene{background-position:33% center}.story{position:fixed;top:auto;bottom:0;left:0;right:0;height:auto;max-height:48svh;overflow-y:auto;padding:22px;background:linear-gradient(120deg,#10343af8,#09292efc);box-shadow:0 -15px 60px #00151f66;z-index:5}.story-inner{display:grid;grid-template-columns:110px minmax(0,1fr);column-gap:20px;align-content:start}.selected-art{grid-column:1;grid-row:1/5;width:110px;border-radius:5px;margin:0}h1{grid-column:2;font-size:23px;letter-spacing:3px;margin:0 0 4px}.english{grid-column:2;font-size:17px;margin:0 0 10px}.intro,.status{grid-column:2;font-size:12px;line-height:1.85}.card:hover{transform:rotate(var(--angle))}.card.active{transform:rotate(0) scale(1.07)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.card-number{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:Baskerville,Georgia,serif;font-size:clamp(12px,1.6vw,22px);font-weight:400;line-height:1;color:#fff0cb;text-shadow:0 2px 9px #05262c,0 0 18px #072d32;pointer-events:none;font-variant-numeric:tabular-nums}.card-number-small{inset:auto 5px 5px auto;min-width:21px;height:21px;padding:3px 5px;border-radius:4px;font-size:10px;background:#12373bd9;color:#fff0cb;text-shadow:none}@media(max-width:680px){.card-number{font-size:14px}.card-number-small{font-size:9px;min-width:17px;height:17px;right:3px;bottom:3px;padding:2px 3px}}

.series-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;padding:18px 20px 4px;height:154px}.brand-logo{display:block;width:420px;max-width:85vw;height:132px;object-fit:contain}.layout{min-height:calc(100svh - 154px)}.table{min-height:calc(100svh - 154px);padding:18px 32px 34px}.story{height:100svh}.face img,.selected-art,.brand-logo{-webkit-user-drag:none;-webkit-touch-callout:none;user-select:none;pointer-events:none}.card{-webkit-touch-callout:none;user-select:none}@media(max-width:1000px){.series-header{height:138px}.brand-logo{height:116px;width:380px}.deck{grid-template-columns:repeat(10,minmax(0,1fr))}.has-selection .deck{grid-template-columns:repeat(8,minmax(0,1fr))}.table{padding:18px 26px 28px}}@media(max-width:680px){.series-header{height:128px;padding:12px 16px 4px}.brand-logo{height:112px;width:340px;max-width:92vw}.deck,.has-selection .deck{grid-template-columns:repeat(6,minmax(0,1fr))}.table{min-height:calc(100svh - 128px);padding:14px 18px 24px}.story{height:auto;max-height:48svh}.has-selection .table{padding-bottom:320px}}

.lock-mark{position:absolute;left:50%;top:calc(50% + 17px);width:13px;height:16px;transform:translateX(-50%);color:#e6d5b6;pointer-events:none;filter:drop-shadow(0 1px 3px #0a2936)}.lock-mark svg{display:block;width:100%;height:100%}.locked-feedback .card-inner{animation:lockedTremor .65s ease-in-out}.locked{cursor:pointer}@keyframes lockedTremor{0%,100%{transform:rotateY(0)}20%{transform:translateX(-3px) rotateY(-12deg)}40%{transform:translateX(3px) rotateY(12deg)}60%{transform:translateX(-2px) rotateY(-8deg)}80%{transform:translateX(1px) rotateY(5deg)}}@media(max-width:680px){.lock-mark{top:calc(50% + 12px);width:10px;height:12px}}
