.yf-mock{--font-display:"Rajdhani",Impact,"Arial Black",sans-serif;--font-body:"Inter",system-ui,sans-serif;--void:#03040a;--void-2:#070817;--panel:rgba(5,10,26,0.78);--blue:#21d9ff;--blue-2:#1478ff;--purple:#a855f7;--pink:#ff37f5;--gold:#f8c94a;--text:#f7fbff;--muted:#aeb7d9}.yf-mock *{box-sizing:border-box}.yf-mock{background:#02040a;scroll-behavior:smooth;margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 18% 0,rgba(33,217,255,.18),transparent 30%),radial-gradient(circle at 82% 3%,rgba(168,85,247,.22),transparent 34%),linear-gradient(180deg,#02040a,#040517 48%,#010209);font-family:var(--font-body);overflow-x:hidden}.yf-mock img{-webkit-user-select:none;-moz-user-select:none;user-select:none}.yf-mock .yugi-page-bg{position:fixed;inset:0;z-index:-5;background-image:linear-gradient(180deg,rgba(2,4,10,.12),rgba(2,4,10,.9) 72%,rgba(2,4,10,.98)),url(/images/yugifun/assets/backgrounds/hero-arena-background.png);background-size:cover;background-position:top;background-repeat:no-repeat}.yf-mock .yugi-page-bg:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 32% 8%,rgba(33,217,255,.32),transparent 20%),radial-gradient(circle at 78% 10%,rgba(255,55,245,.22),transparent 24%),linear-gradient(90deg,rgba(0,0,0,.42),transparent 38%,rgba(0,0,0,.2));pointer-events:none}.yf-mock .yugi-page-bg:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(33,217,255,.055) 1px,transparent 0),linear-gradient(90deg,rgba(168,85,247,.045) 1px,transparent 0);background-size:56px 56px;opacity:.35;-webkit-mask-image:radial-gradient(circle at center,black,transparent 78%);mask-image:radial-gradient(circle at center,black,transparent 78%);pointer-events:none}.yf-mock .mockup-shell{width:min(1480px,calc(100vw - 28px));margin:14px auto 28px;min-height:calc(100vh - 28px);border-radius:20px;position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(3,5,14,.84),rgba(4,6,18,.68)),rgba(5,6,18,.52);border:1px solid rgba(88,196,255,.34);box-shadow:0 0 0 1px rgba(168,85,247,.16),0 0 48px rgba(33,217,255,.18),0 0 110px rgba(168,85,247,.18)}.yf-mock .mockup-shell:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(33,217,255,.08),transparent 30%,transparent 70%,rgba(168,85,247,.1)),radial-gradient(circle at 50% 0,rgba(255,255,255,.08),transparent 32%);pointer-events:none}.yf-mock .browser-topbar{height:46px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:0 22px;background:linear-gradient(90deg,rgba(2,4,10,.96),rgba(9,10,28,.92),rgba(3,4,14,.96));border-bottom:1px solid rgba(33,217,255,.22);box-shadow:0 0 22px rgba(33,217,255,.16);position:relative;z-index:5}.yf-mock .browser-controls{display:flex;align-items:center;gap:9px}.yf-mock .browser-dot{width:10px;height:10px;border-radius:999px}.yf-mock .browser-url{justify-self:center;width:min(520px,48vw);height:26px;border-radius:8px;border:1px solid rgba(255,255,255,.13);background:rgba(0,0,0,.35);color:rgba(232,245,255,.75);display:flex;align-items:center;justify-content:center;font-size:12px}.yf-mock .site-nav{height:92px;display:flex;align-items:center;gap:34px;padding:12px 42px 6px;position:relative;z-index:3}.yf-mock .site-logo{width:235px;max-width:25vw;filter:drop-shadow(0 0 18px rgba(168,85,247,.55))}.yf-mock .nav-links{flex:1;display:inline-flex;justify-content:center;align-items:stretch;flex-wrap:nowrap;gap:0;padding:5px;transform:translateY(-6px);border-radius:14px;background:linear-gradient(180deg,rgba(10,14,32,.88),rgba(5,7,18,.84));border:1px solid rgba(33,217,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 32px rgba(0,0,0,.48),0 0 24px rgba(33,217,255,.08);backdrop-filter:blur(14px)}.yf-mock .nav-links .nav-link{color:rgba(225,233,255,.86);font-family:var(--font-display);font-weight:800;font-size:clamp(10px,.82vw,12px);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:10px clamp(9px,1vw,14px);border-radius:10px;border:1px solid transparent;position:relative;text-shadow:none;transition:color .15s,background .15s,border-color .15s,box-shadow .15s}.yf-mock .nav-links .nav-link+.nav-link{box-shadow:inset 1px 0 0 rgba(33,217,255,.16)}.yf-mock .nav-links .nav-link:hover{color:#fff;background:rgba(33,217,255,.1);border-color:rgba(33,217,255,.22);text-shadow:0 0 10px rgba(33,217,255,.35)}.yf-mock .nav-links .nav-link.is-active{color:#ffe45f;background:linear-gradient(180deg,rgba(255,228,95,.24),rgba(255,228,95,.1));border-color:rgba(255,228,95,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 18px rgba(255,228,95,.2);z-index:1}.yf-mock .nav-links .nav-link.is-active:after{content:none}.yf-mock .nav-links .nav-link.is-active+.nav-link{box-shadow:none}.yf-mock .asset-button{display:inline-block;background-size:contain;background-position:50%;background-repeat:no-repeat;border:0;outline:0;color:transparent;cursor:pointer;transition:transform .18s ease,filter .18s ease}.yf-mock .asset-button:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.14) drop-shadow(0 0 14px rgba(33,217,255,.38))}.yf-mock .btn-connect{width:204px;height:68px;background-image:url(/images/yugifun/assets/buttons/button-connect-wallet.png)}.yf-mock .btn-play{width:220px;height:74px;background-image:url(/images/yugifun/assets/buttons/button-play-free.png)}.yf-mock .btn-view{width:226px;height:74px;background-image:url(/images/yugifun/assets/buttons/button-view-cards.png)}.yf-mock .btn-view-all{width:210px;height:70px;background-image:url(/images/yugifun/assets/buttons/button-view-all-cards.png)}.yf-mock .btn-explore{width:245px;height:78px;background-image:url(/images/yugifun/assets/buttons/button-explore-modes.png)}.yf-mock .btn-find{width:260px;height:86px;background-image:url(/images/yugifun/assets/buttons/button-find-match.png)}.yf-mock .hero{display:grid;grid-template-columns:.92fr 1.08fr;gap:12px;padding:8px 46px 24px;min-height:640px;position:relative}.yf-mock .hero-copy{padding-top:44px;position:relative;z-index:2}.yf-mock .badge-original{width:min(510px,100%);max-width:100%;height:56px;aspect-ratio:2819/310;background-image:url(/images/yugifun/assets/badges/badge-original-browser-based-anime-card-battle.png);background-size:contain;background-position:0;background-repeat:no-repeat;margin-bottom:22px}.yf-mock .hero-title{margin:0;font-family:var(--font-display);font-size:clamp(58px,8vw,136px);line-height:.78;letter-spacing:.005em;text-transform:uppercase;font-weight:900;max-width:675px;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.3),0 0 28px rgba(33,217,255,.36),0 0 56px rgba(168,85,247,.32)}.yf-mock .hero-title span{display:block}.yf-mock .hero-title .meme{color:#f5e5ff;text-shadow:0 0 16px rgba(255,255,255,.42),0 0 38px rgba(255,55,245,.7),0 0 70px rgba(168,85,247,.48);transform:skewX(-6deg)}.yf-mock .hero-title .arena{color:#bfefff;text-shadow:0 0 18px rgba(33,217,255,.9),0 0 46px rgba(20,120,255,.7)}.yf-mock .hero-subcopy{max-width:550px;margin-top:28px;color:rgba(235,242,255,.82);line-height:1.65;font-size:18px;font-style:italic;text-shadow:0 0 18px rgba(33,217,255,.18)}.yf-mock .hero-buttons{display:flex;align-items:center;gap:22px;margin-top:28px}.yf-mock .hero-badges{display:flex;gap:18px;align-items:center;margin-top:26px;flex-wrap:wrap}.yf-mock .micro-badge{height:38px;width:auto;background-size:contain;background-position:0;background-repeat:no-repeat;background-color:transparent}.yf-mock .badge-solana{aspect-ratio:1561/372;background-image:url(/images/yugifun/assets/badges/badge-built-on-solana.png)}.yf-mock .badge-free{aspect-ratio:1508/366;background-image:url(/images/yugifun/assets/badges/badge-free-to-play.png)}.yf-mock .hero-card-cluster{position:relative;min-height:610px;z-index:2}.yf-mock .hero-card{position:absolute;width:clamp(158px,14vw,240px);filter:drop-shadow(0 0 18px rgba(33,217,255,.22)) drop-shadow(0 20px 24px rgba(0,0,0,.55));transition:transform .22s ease,filter .22s ease}.yf-mock .hero-card:hover{z-index:20!important;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(1.06)!important;filter:drop-shadow(0 0 24px rgba(255,255,255,.3)) drop-shadow(0 0 38px rgba(33,217,255,.42))}.yf-mock .hero-card:first-child{--x:0px;--y:0px;--r:-7deg;left:5%;top:4%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:4}.yf-mock .hero-card:nth-child(2){--x:0px;--y:0px;--r:7deg;left:34%;top:6%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:5}.yf-mock .hero-card:nth-child(3){--x:0px;--y:0px;--r:13deg;left:64%;top:8%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:4}.yf-mock .hero-card:nth-child(4){--x:0px;--y:0px;--r:-6deg;left:6%;top:31%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:6}.yf-mock .hero-card:nth-child(5){--x:0px;--y:0px;--r:2deg;left:36%;top:30%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:7}.yf-mock .hero-card:nth-child(6){--x:0px;--y:0px;--r:6deg;left:66%;top:33%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:6}.yf-mock .hero-card:nth-child(7){--x:0px;--y:0px;--r:-8deg;left:0;top:58%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:3}.yf-mock .hero-card:nth-child(8){--x:0px;--y:0px;--r:-1deg;left:36%;top:61%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:4}.yf-mock .hero-card:nth-child(9){--x:0px;--y:0px;--r:8deg;left:67%;top:59%;transform:translate(var(--x),var(--y)) rotate(var(--r));z-index:3}.yf-mock .site-content{padding:0 36px 28px}.yf-mock .section-shell{position:relative;margin-bottom:16px}.yf-mock .collect-header{height:88px;display:grid;grid-template-columns:1fr auto;align-items:center;padding:0 24px;background:linear-gradient(90deg,rgba(4,10,26,.86),rgba(6,10,28,.52)),rgba(4,10,26,.7);border:1px solid rgba(33,217,255,.28);clip-path:polygon(1.2% 0,98.8% 0,100% 50%,98.8% 100%,1.2% 100%,0 50%);box-shadow:inset 0 0 25px rgba(33,217,255,.1),0 0 24px rgba(33,217,255,.13)}.yf-mock .section-title-row{display:flex;align-items:center;gap:15px}.yf-mock .section-icon{width:42px;height:42px;border:1px solid rgba(33,217,255,.38);border-radius:10px;display:grid;place-items:center;color:#bff5ff;box-shadow:inset 0 0 14px rgba(33,217,255,.18),0 0 18px rgba(33,217,255,.22)}.yf-mock .section-title{margin:0;font-family:var(--font-display);font-size:clamp(23px,3.2vw,38px);line-height:1;letter-spacing:.08em;font-weight:900;text-transform:uppercase;color:rgba(244,249,255,.96);text-shadow:0 0 16px rgba(33,217,255,.28)}.yf-mock .section-subtitle{margin:4px 0 0;color:rgba(190,207,238,.7);font-size:12px;letter-spacing:.04em}.yf-mock .card-strip{display:grid;grid-template-columns:repeat(9,minmax(86px,1fr));gap:12px;padding:18px 12px 14px;border:1px solid rgba(33,217,255,.2);background:rgba(4,8,22,.62);box-shadow:inset 0 0 38px rgba(33,217,255,.06)}.yf-mock .strip-card{width:100%;border-radius:7px;filter:drop-shadow(0 0 10px rgba(33,217,255,.15));transition:transform .18s ease,filter .18s ease}.yf-mock .strip-card:hover{transform:translateY(-8px) scale(1.06);filter:drop-shadow(0 0 18px rgba(255,255,255,.26))}.yf-mock .panel-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-top:16px}.yf-mock .ui-panel{min-height:305px;padding:24px;position:relative;border:1px solid rgba(33,217,255,.3);background:linear-gradient(180deg,rgba(8,13,34,.85),rgba(5,8,22,.74)),rgba(6,9,24,.75);clip-path:polygon(4% 0,96% 0,100% 8%,100% 92%,96% 100%,4% 100%,0 92%,0 8%);box-shadow:inset 0 0 38px rgba(33,217,255,.08),0 0 24px rgba(33,217,255,.12)}.yf-mock .ui-panel:before{content:"";position:absolute;inset:0;border:1px solid rgba(168,85,247,.25);clip-path:inherit;pointer-events:none}.yf-mock .panel-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px}.yf-mock .panel-heading h3{margin:0;font-family:var(--font-display);font-weight:900;font-size:30px;letter-spacing:.08em;color:rgba(245,249,255,.95);text-transform:uppercase;text-shadow:0 0 16px rgba(33,217,255,.28)}.yf-mock .panel-icon{width:45px;height:45px;-o-object-fit:contain;object-fit:contain;filter:drop-shadow(0 0 10px rgba(33,217,255,.38))}.yf-mock .mode-list{display:grid;gap:12px}.yf-mock .mode-item{border:1px solid rgba(248,201,74,.38);background:rgba(0,0,0,.24);padding:13px 16px;clip-path:polygon(3% 0,97% 0,100% 28%,100% 72%,97% 100%,3% 100%,0 72%,0 28%)}.yf-mock .mode-title{color:#ffe56d;font-family:var(--font-display);font-weight:900;letter-spacing:.08em;font-size:18px}.yf-mock .mode-copy{margin:2px 0 0;color:rgba(220,232,255,.74);font-size:12px;line-height:1.35}.yf-mock .reward-number{margin:20px 0 16px;font-size:clamp(42px,5vw,70px);color:#bff3ff;letter-spacing:.04em;font-weight:900;text-shadow:0 0 24px rgba(33,217,255,.55)}.yf-mock .reward-number,.yf-mock .reward-sub{font-family:var(--font-display);text-align:center}.yf-mock .reward-sub{color:#22d3ff;letter-spacing:.17em;font-weight:800}.yf-mock .bullet-list{display:grid;gap:12px;color:rgba(224,235,255,.82);font-size:14px;margin-top:18px}.yf-mock .bullet{display:flex;align-items:center;gap:10px}.yf-mock .bullet:before{content:"✦";display:grid;place-items:center;width:24px;height:24px;color:var(--gold);border:1px solid rgba(248,201,74,.45);border-radius:999px;box-shadow:0 0 12px rgba(248,201,74,.18)}.yf-mock .rewards-steps{display:grid;gap:19px;margin-top:22px}.yf-mock .reward-step{display:grid;grid-template-columns:54px 1fr;gap:14px;align-items:center}.yf-mock .step-hex{width:54px;height:54px;display:grid;place-items:center;color:#eaffff;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);border:1px solid rgba(33,217,255,.55);background:rgba(33,217,255,.08);box-shadow:inset 0 0 14px rgba(33,217,255,.14),0 0 15px rgba(33,217,255,.18)}.yf-mock .step-title{color:#bff3ff;font-family:var(--font-display);font-weight:900;letter-spacing:.08em;text-transform:uppercase}.yf-mock .step-copy{color:rgba(220,232,255,.74);font-size:13px;margin-top:3px}.yf-mock .bottom-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px;margin-top:18px}.yf-mock .lobby-panel{min-height:390px;position:relative;overflow:hidden;border:1px solid rgba(33,217,255,.28);background:linear-gradient(90deg,rgba(3,7,18,.9),rgba(11,11,38,.74)),rgba(3,6,18,.85);clip-path:polygon(3% 0,97% 0,100% 8%,100% 92%,97% 100%,3% 100%,0 92%,0 8%);box-shadow:0 0 24px rgba(33,217,255,.12),inset 0 0 44px rgba(33,217,255,.08)}.yf-mock .lobby-title{padding:18px 22px 0;font-family:var(--font-display);letter-spacing:.08em;font-size:22px;font-weight:900;text-transform:uppercase}.yf-mock .lobby-content{display:grid;grid-template-columns:185px 1fr;gap:12px;padding:14px 18px 18px}.yf-mock .lobby-sidebar{border:1px solid rgba(33,217,255,.22);background:rgba(0,0,0,.28);padding:14px}.yf-mock .player-tile{display:flex;gap:10px;align-items:center;margin-bottom:18px}.yf-mock .avatar{width:48px;height:48px;background:radial-gradient(circle at 35% 25%,#80efff,transparent 18%),linear-gradient(135deg,#123aff,#12091d);border:1px solid rgba(33,217,255,.55);box-shadow:0 0 14px rgba(33,217,255,.24)}.yf-mock .player-name{font-family:var(--font-display);font-size:13px;color:#e8f7ff;letter-spacing:.06em;font-weight:900}.yf-mock .player-rank{font-size:11px;color:#42e7ff}.yf-mock .side-menu{display:grid;gap:9px;color:rgba(223,236,255,.78);font-size:12px;text-transform:uppercase}.yf-mock .versus-stage{position:relative;min-height:300px;display:grid;place-items:center}.yf-mock .versus-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 22% 52%,rgba(33,217,255,.28),transparent 24%),radial-gradient(circle at 80% 50%,rgba(168,85,247,.28),transparent 28%);opacity:.9}.yf-mock .vs{position:relative;z-index:2;font-family:var(--font-display);font-size:105px;font-weight:900;line-height:.8;letter-spacing:-.04em;color:#fff;text-shadow:0 0 18px rgba(255,255,255,.36),0 0 34px rgba(168,85,247,.75),0 0 60px rgba(33,217,255,.55)}.yf-mock .news-panel{min-height:390px;border:1px solid rgba(33,217,255,.26);background:rgba(4,8,23,.78);padding:17px;clip-path:polygon(5% 0,95% 0,100% 7%,100% 93%,95% 100%,5% 100%,0 93%,0 7%)}.yf-mock .news-title{font-family:var(--font-display);font-weight:900;font-size:22px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}.yf-mock .news-list{display:grid;gap:12px}.yf-mock .news-item{display:grid;grid-template-columns:92px 1fr;gap:13px;border:1px solid rgba(248,201,74,.24);background:rgba(0,0,0,.22);padding:10px}.yf-mock .news-thumb{width:92px;height:70px;background:radial-gradient(circle at 50% 30%,rgba(248,201,74,.55),transparent 32%),linear-gradient(135deg,rgba(168,85,247,.35),rgba(0,0,0,.8));border:1px solid rgba(248,201,74,.22)}.yf-mock .news-season-badge{display:inline-block;margin-right:8px;padding:2px 7px;border-radius:999px;font-size:9px;font-weight:800;letter-spacing:.08em;color:#ffb347;border:1px solid rgba(255,179,71,.35);vertical-align:middle}.yf-mock .news-item-title{font-family:var(--font-display);font-weight:900;color:#dff7ff;letter-spacing:.07em;font-size:15px;text-transform:uppercase}.yf-mock .news-copy{color:rgba(220,232,255,.68);font-size:12px;line-height:1.35;margin-top:3px}.yf-mock .site-footer{display:flex;align-items:center;justify-content:space-between;padding:26px 0 8px;color:rgba(220,232,255,.58);font-size:12px}.yf-mock .socials{display:flex;gap:16px}.yf-mock .social-circle{width:42px;height:42px;border-radius:999px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:white;background:rgba(0,0,0,.25)}@media (max-width:1100px){.yf-mock .site-logo{width:170px}.yf-mock .site-nav{justify-content:space-between;padding-inline:24px}.yf-mock .hero{grid-template-columns:1fr;padding-inline:24px}.yf-mock .hero-card-cluster{min-height:610px}.yf-mock .bottom-grid,.yf-mock .panel-grid{grid-template-columns:1fr}.yf-mock .card-strip{grid-template-columns:repeat(3,1fr)}}@media (max-width:700px){.yf-mock .mockup-shell{width:calc(100vw - 12px);margin-top:6px;border-radius:14px}.yf-mock .browser-topbar{padding-inline:12px;gap:8px}.yf-mock .browser-url{width:44vw;font-size:10px}.yf-mock .btn-connect{width:152px;height:52px}.yf-mock .hero-title{font-size:clamp(52px,17vw,84px)}.yf-mock .hero-buttons{flex-direction:column;align-items:flex-start}.yf-mock .hero-card{width:32vw}.yf-mock .hero-card-cluster{min-height:470px}.yf-mock .collect-header{height:auto;min-height:94px;grid-template-columns:1fr;gap:10px;padding:16px}.yf-mock .section-title{font-size:26px}.yf-mock .lobby-content{grid-template-columns:1fr}.yf-mock .site-footer{flex-direction:column;gap:16px}}