:root{--ink:#07090b;--paper:#e8e5d8;--muted:#7f8989;--cyan:#5ce6df;--amber:#e0ad55;--card-width:min(340px, calc(100vw - 48px));--display:"Bodoni 72", Didot, "Noto Serif SC", serif;--mono:"SFMono-Regular", Consolas, monospace}*{box-sizing:border-box}html{background:var(--ink);min-width:320px}body{min-height:100svh;color:var(--paper);font-family:var(--mono);letter-spacing:0;background:radial-gradient(circle at 22% 18%,#37868b21,#0000 30%),radial-gradient(circle at 78% 84%,#bd80301a,#0000 28%),linear-gradient(135deg,#0d1114 0%,#060709 48%,#11100d 100%);margin:0;overflow-x:hidden}body:before{pointer-events:none;content:"";opacity:.22;background-color:#0000;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:42px 42px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle,#000,#0000 82%);mask-image:radial-gradient(circle,#000,#0000 82%)}.gallery{grid-template-rows:auto 1fr auto;width:min(1120px,100% - 40px);min-height:100svh;margin:0 auto;padding:24px 0 18px;display:grid}.gallery-header,.gallery-footer{color:var(--muted);letter-spacing:.15em;justify-content:space-between;align-items:center;font-size:9px;display:flex}.gallery-header h1{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.collection-mark{color:#c8ccc6;align-items:center;gap:10px;display:flex}.collection-glyph{border:1px solid var(--cyan);width:11px;height:11px;box-shadow:inset 0 0 0 2px var(--ink);background:var(--cyan);transform:rotate(45deg)}.card-stage{perspective:1200px;isolation:isolate;place-items:center;min-height:590px;display:grid;position:relative}.ambient-halo{aspect-ratio:1;opacity:.42;filter:blur(26px);width:min(435px,100vw - 8px);transform:translate3d(var(--halo-x,0px), 0, -80px);background:radial-gradient(circle,#40d1cd2b,#c288360f 42%,#0000 69%);border-radius:50%;position:absolute}.ground-shadow{z-index:0;width:84%;height:42px;opacity:var(--shadow-opacity,.48);filter:blur(var(--shadow-blur,22px));transform:translate3d(var(--shadow-x,0px), var(--shadow-y,18px), -100px) scaleX(var(--shadow-scale,1));background:#000000c7;border-radius:50%;position:absolute;bottom:-18px;left:8%}.card-interaction{width:var(--card-width);aspect-ratio:17/24;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transform-style:preserve-3d;outline:none;position:relative}.holo-card{--rotate-x:0deg;--rotate-y:0deg;--pointer-x:50%;--pointer-y:50%;--pointer-from-center:0;--background-x:0px;--background-y:0px;--character-x:0px;--character-y:0px;--info-x:0px;--info-y:0px;--light-x:50%;--light-y:50%;--outline-shine-position:50%;--outline-shine-opacity:.22;--card-background-image:none;--foil-noise-image:none;--character-outline-width:3px;--character-outline-glow:.14;--character-outline-shine:.92;--character-outline-dark:#5c3510;--character-outline-base:#9a641c;--character-outline-mid:#d9a82e;--character-outline-bright:#ffd76a;--character-outline-highlight:#fff4bd;--character-outline-mirror:#a9fbff;--character-outline-prism:#efb4ff;--glare-opacity:.16;--foil-opacity:.42;z-index:1;width:100%;height:100%;transform:rotateX(var(--rotate-x)) rotateY(var(--rotate-y)) scale(var(--card-scale,1));transform-style:preserve-3d;will-change:transform;background:#0b1214;border:1px solid #e7e2c78c;border-radius:24px;outline:none;transition:opacity .17s,filter .17s;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff73,inset 0 -1px #000c}.holo-card:focus-visible{box-shadow:0 0 0 3px var(--ink), 0 0 0 5px var(--cyan), 0 28px 70px #00000080}.holo-card.is-switching{opacity:0;filter:blur(8px)saturate(.58)}.holo-card:after{z-index:11;pointer-events:none;content:"";opacity:0;background:radial-gradient(circle 54px at var(--pointer-x) var(--pointer-y), #ffffff7a, #52e5dc29 36%, transparent 72%);mix-blend-mode:screen;transition:opacity .14s;position:absolute;inset:0}.holo-card.is-touching:after{opacity:.82}.layer{pointer-events:none;position:absolute;inset:0}.card-base{z-index:1;background-image:var(--card-background-image), radial-gradient(circle at 67% 34%, var(--base-color-1,#39c9c442), transparent 25%), radial-gradient(circle at 28% 62%, var(--base-color-2,#d1873730), transparent 34%), linear-gradient(145deg, var(--base-color-3,#172429) 0%, var(--base-color-4,#080d12) 46%, var(--base-color-5,#161315) 75%, var(--base-color-6,#06090b) 100%);background-position:center, calc(50% + var(--background-x)) calc(50% + var(--background-y)), center, center;background-repeat:no-repeat;background-size:cover,130% 130%,cover,cover;transform:translateZ(0)}.card-base:after{content:"";background:linear-gradient(110deg,#ffffff0d,#0000 28% 72%,#ffd2800f);border:1px solid #dfc18147;border-radius:18px;position:absolute;inset:10px}.energy-layer{z-index:2;transform:translate3d(calc(0px - var(--background-x)), calc(0px - var(--background-y)), 8px)}.orbit{border:1px solid var(--energy-color-1,#70e5db33);width:260px;height:112px;box-shadow:0 0 18px color-mix(in srgb, var(--energy-color-1,#70e5db) 28%, transparent);border-radius:50%;position:absolute;top:35%;left:50%;transform:translate(-50%,-50%)rotate(-28deg)}.orbit-two{border-color:var(--energy-color-2,#e0ad552b);width:205px;height:205px;transform:translate(-50%,-50%)rotate(48deg)}.energy-core{background:radial-gradient(ellipse, var(--energy-color-1,#66f2e736), transparent 65%);filter:blur(12px);border-radius:50%;width:138px;height:178px;position:absolute;top:37%;left:50%;transform:translate(-50%,-50%)}.star-field{opacity:.65;background-image:radial-gradient(circle,#ffffffd9 0 1px,#0000 1.5px),radial-gradient(circle,#5be2dbcc 0 1px,#0000 1.5px);background-position:0 0,17px 23px;background-size:41px 43px,59px 61px;position:absolute;inset:34px 24px 126px;-webkit-mask-image:linear-gradient(#000,#0000 92%);mask-image:linear-gradient(#000,#0000 92%)}.character-layer{z-index:3;transform:translate3d(var(--character-x), var(--character-y), 44px);transform-style:preserve-3d;will-change:transform;inset:58px -10px 112px}.character-source{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;position:absolute;inset:0}.character-source.is-missing{display:none}.character-aura{background:radial-gradient(ellipse, var(--energy-color-1,#45e0d661), var(--energy-color-2,#7b59c81a) 47%, transparent 69%);filter:blur(22px);border-radius:50%;position:absolute;inset:18% 18% 5%}.character-placeholder{clip-path:polygon(50% 0,90% 24%,76% 82%,50% 100%,24% 82%,10% 24%);background:linear-gradient(145deg,#53d5cd61,#4336695c 54%,#dca44d4d);border:1px solid #72eee36b;width:124px;height:164px;position:absolute;top:19%;left:50%;transform:translate(-50%)}.character-placeholder span{clip-path:inherit;border:1px solid #ffffff47;position:absolute;inset:18px}.character-outline-glow{z-index:1;opacity:var(--character-outline-glow);filter:brightness(0)saturate()sepia()saturate(7)hue-rotate(357deg)blur(3px);transform:translateZ(0)scale(1.01)}.character-outline-fallback{z-index:2;opacity:.7;filter:brightness(0) saturate(100%) sepia(1) saturate(6) hue-rotate(355deg) drop-shadow(var(--character-outline-width) 0 0 var(--character-outline-mid)) drop-shadow(calc(0px - var(--character-outline-width)) 0 0 var(--character-outline-dark)) drop-shadow(0 var(--character-outline-width) 0 var(--character-outline-base)) drop-shadow(0 calc(0px - var(--character-outline-width)) 0 var(--character-outline-bright));transform:translateZ(1px)}.character-gold-outline{z-index:3;filter:url(#character-gold-filter) contrast(var(--outline-metal-contrast,1.05));transform:translateZ(2px)}.character-outline-shine-window{z-index:4;opacity:var(--outline-shine-opacity);-webkit-mask-image:radial-gradient(ellipse 34% 42% at var(--light-x) var(--light-y), #000 0 18%, transparent 64%), linear-gradient(112deg, transparent calc(var(--outline-shine-position) - 9%), #000 calc(var(--outline-shine-position) - 2%) calc(var(--outline-shine-position) + 2%), transparent calc(var(--outline-shine-position) + 8%));-webkit-mask-image:radial-gradient(ellipse 34% 42% at var(--light-x) var(--light-y), #000 0 18%, transparent 64%), linear-gradient(112deg, transparent calc(var(--outline-shine-position) - 9%), #000 calc(var(--outline-shine-position) - 2%) calc(var(--outline-shine-position) + 2%), transparent calc(var(--outline-shine-position) + 8%));mask-image:radial-gradient(ellipse 34% 42% at var(--light-x) var(--light-y), #000 0 18%, transparent 64%), linear-gradient(112deg, transparent calc(var(--outline-shine-position) - 9%), #000 calc(var(--outline-shine-position) - 2%) calc(var(--outline-shine-position) + 2%), transparent calc(var(--outline-shine-position) + 8%));position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.character-outline-shine{opacity:var(--character-outline-shine);filter:url(#character-outline-shine-filter)drop-shadow(0 0 1px #ffeeb18c)drop-shadow(0 0 2px #66e8ef40)}.character-image{z-index:5;filter:drop-shadow(0 18px 18px #0000007a) drop-shadow(0 0 12px var(--energy-color-1,#4ce0d733));transform:translateZ(3px)}.filter-definitions{width:0;height:0;position:fixed;overflow:hidden}.info-layer{z-index:9;color:#f2f0e7;text-shadow:0 1px 3px #000c,0 0 12px #00000073;transform:translate3d(var(--info-x), var(--info-y), 58px);will-change:transform;flex-direction:column;padding:28px 26px 23px;display:flex}.card-heading{justify-content:space-between;align-items:flex-start;display:flex}.micro-label{color:#a9b6b2;letter-spacing:.17em;font-size:7px;display:block}.card-heading h2{font-family:var(--display);letter-spacing:0;margin:7px 0 2px;font-size:42px;font-weight:600;line-height:.82}.card-heading h2 [data-field=accent]{color:var(--amber)}.card-heading h2 .title-main{color:inherit}.card-heading p{color:#91a19f;letter-spacing:.13em;margin:8px 0 0;font-size:7px}.level-badge{clip-path:polygon(50% 0,92% 24%,92% 76%,50% 100%,8% 76%,8% 24%);text-align:center;background:#050a0c8c;border:1px solid #e0ad5585;place-content:center;width:47px;height:47px;display:grid}.level-badge span{letter-spacing:.1em;font-size:6px}.level-badge strong{color:#f2d38e;font:19px/1 var(--display)}.attribute-rail{color:#9baba8;letter-spacing:.12em;transform-origin:0 100%;gap:14px;margin:auto 0 96px;font-size:6px;display:flex;transform:rotate(-90deg)translateY(-15px)}.attribute-rail span{border-left:1px solid #5be2db7a;padding-left:7px}.attribute-rail b{color:#e5e4db;font-size:9px}.attribute-rail i{font-style:normal}.card-copy{background:linear-gradient(90deg,#070c0fe0,#070c0f61);border-top:1px solid #dddac747;margin-top:auto;padding-top:16px}.card-copy p{color:#c7cbc4;max-width:238px;margin:7px 0 12px;font-family:Songti SC,Noto Serif SC,serif;font-size:10px;line-height:1.55}.card-meta{color:#909d9a;letter-spacing:.1em;justify-content:space-between;align-items:flex-end;font-size:7px;display:flex}.signature{color:#e2be77;font:italic 18px/1 Snell Roundhand,cursive;transform:rotate(-7deg)}.frame-layer{z-index:6;border-radius:inherit;background:linear-gradient(135deg, var(--frame-color-1), var(--frame-color-2) 20%, var(--frame-color-3) 52%, var(--frame-color-4) 78%, var(--frame-color-5)) border-box;-webkit-mask-composite:xor;filter:saturate(var(--frame-saturation,.8));border:7px solid #0000;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-origin:padding-box,border-box;mask-origin:padding-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.frame-layer:before{border-radius:inherit;content:"";background:radial-gradient(circle at var(--pointer-x) var(--pointer-y), #ffffffd9, transparent 34%);mix-blend-mode:screen;position:absolute;inset:-7px}.frame-layer:after{content:"";border:1px solid #e5d3a44d;border-radius:12px;position:absolute;inset:15px;box-shadow:inset 0 0 18px #ffffff0d}.foil-layer{z-index:7;opacity:var(--foil-opacity);background:radial-gradient(ellipse 62% 44% at var(--pointer-x) var(--pointer-y), #ffffff85, var(--foil-color-1) 21%, var(--foil-color-3) 43%, transparent 70%), repeating-linear-gradient(118deg, transparent 0 13px, var(--foil-color-1) 14px, var(--foil-color-3) 16px, var(--foil-color-4) 18px, transparent 20px 34px), conic-gradient(from var(--foil-angle,115deg) at var(--pointer-x) var(--pointer-y), transparent, var(--foil-color-1), var(--foil-color-2), var(--foil-color-3), var(--foil-color-4), transparent 76%);background-size:150% 150%,180% 180%,145% 145%;background-position:var(--pointer-x) var(--pointer-y), calc(50% + var(--background-x)) calc(50% + var(--background-y)), var(--pointer-x) var(--pointer-y);mix-blend-mode:screen;filter:saturate(var(--foil-saturation,1.22)) contrast(1.04);-webkit-mask-image:radial-gradient(ellipse 86% 75% at var(--pointer-x) var(--pointer-y), #000 4%, #000000b8 38%, transparent 86%), linear-gradient(to bottom, transparent 7%, #000 28% 88%, transparent);-webkit-mask-image:radial-gradient(ellipse 86% 75% at var(--pointer-x) var(--pointer-y), #000 4%, #000000b8 38%, transparent 86%), linear-gradient(to bottom, transparent 7%, #000 28% 88%, transparent);mask-image:radial-gradient(ellipse 86% 75% at var(--pointer-x) var(--pointer-y), #000 4%, #000000b8 38%, transparent 86%), linear-gradient(to bottom, transparent 7%, #000 28% 88%, transparent);background-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.glare-layer{z-index:8;opacity:var(--glare-opacity);background:radial-gradient(ellipse 34% 27% at var(--pointer-x) var(--pointer-y), #ffffffe6, #fff3 34%, transparent 72%), linear-gradient(var(--glare-angle,105deg), transparent 36%, #ffffff14 43%, #ffffff94 49%, #ffffff14 55%, transparent 63%);background-position:center, calc(var(--pointer-x) - 50%) calc(var(--pointer-y) - 50%);mix-blend-mode:screen;background-repeat:no-repeat;background-size:100% 100%,175% 175%}.texture-layer{z-index:10;opacity:var(--texture-opacity,.25);background-image:var(--foil-noise-image), repeating-linear-gradient(96deg, #ffffff21 0 1px, transparent 1px 4px), repeating-radial-gradient(circle at 40% 30%, #ffffff21 0 1px, transparent 1px 7px);mix-blend-mode:soft-light;background-size:180px 180px,auto,auto}.gallery-footer i{background:#ffffff1a;flex:1;height:1px;margin:0 14px}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.card-switcher{z-index:14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#060a0cdb;border:1px solid #5ce6df47;border-radius:2px;grid-template-columns:1fr auto 1fr;min-width:230px;min-height:34px;display:grid;position:absolute;bottom:8px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 8px 24px #00000038}.card-nav{color:#9da8a5;min-width:76px;font:600 7px/1 var(--mono);letter-spacing:.12em;cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;gap:8px;padding:0 9px;transition:color .15s,background .15s;display:flex}.card-nav-prev{border-right:1px solid #ffffff1a}.card-nav-next{border-left:1px solid #ffffff1a}.card-nav:hover,.card-nav:focus-visible{color:var(--paper);background:#5ce6df17;outline:none}.card-nav:disabled{cursor:wait;opacity:.38}.card-switch-index{min-width:58px;color:var(--cyan);font:600 7px/1 var(--mono);letter-spacing:.12em;place-items:center;display:grid}.card-nav-arrow{color:var(--amber);font-size:12px}.mobile-controls{display:none}.touch-hint{color:#71807e;letter-spacing:.12em;align-items:center;gap:9px;margin:0;font-size:7px}.touch-hint b{color:var(--cyan);font-weight:500}.motion-control{justify-items:end;gap:3px;display:grid}.motion-toggle{color:#91a19f;min-height:27px;font:600 7px/1 var(--mono);letter-spacing:.1em;background:#080e10d1;border:1px solid #5ce6df4d;border-radius:999px;align-items:center;gap:7px;padding:4px 9px;display:flex}.motion-toggle:disabled{cursor:not-allowed;opacity:.48}.motion-signal{border:1px solid;border-radius:50%;width:9px;height:9px;position:relative}.motion-signal i{border-radius:inherit;opacity:.34;background:currentColor;position:absolute;inset:2px}.motion-status{color:#667472;text-align:right;letter-spacing:.04em;max-width:154px;font-size:6px;line-height:1.35}.motion-control[data-state=active] .motion-toggle,.motion-control[data-state=calibrating] .motion-toggle{color:var(--cyan);border-color:#5ce6dfa8;box-shadow:0 0 18px #5ce6df1f}.motion-control[data-state=active] .motion-signal i{opacity:1;box-shadow:0 0 7px}.motion-control[data-state=denied] .motion-toggle,.motion-control[data-state=silent] .motion-toggle{color:var(--amber);border-color:#e0ad5573}@media (height<=660px) and (width>=640px){:root{--card-width:300px}.card-stage{min-height:510px}}@media (width<=560px){.gallery{width:calc(100% - 28px);padding-top:18px}.gallery-header p{display:none}.card-stage{min-height:580px}.gallery-footer{font-size:7px}}@media (hover:none) and (pointer:coarse){.card-switcher{bottom:44px}.mobile-controls{justify-content:space-between;align-items:center;gap:14px;width:100%;transition:opacity .14s;display:flex;position:absolute;bottom:0}.card-stage:has(.is-touching) .mobile-controls{opacity:.35}}@media (prefers-reduced-motion:reduce){.holo-card,.character-layer,.info-layer{will-change:auto;transition:none}.foil-layer{opacity:.24}.glare-layer{opacity:.12}.character-outline-shine-window{opacity:.24}}
