@import "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap";*{box-sizing:border-box}body{color:#ffffffde;background-color:#121212;margin:0;padding:0;font-family:Roboto,sans-serif;overflow-x:hidden}.app-container{color:#fff;background-color:#121212;flex-direction:column;min-height:100vh;font-family:Roboto,sans-serif;display:flex}.header{text-align:center;background:linear-gradient(135deg,#1f1c2c,#928dab);padding:2rem 1rem 1rem;box-shadow:0 4px 6px #0000004d}.header h1{background:-webkit-linear-gradient(#f9d423,#ff4e50);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0 0 .5rem;font-size:2rem}.header p{color:#ddd;margin:0}.global-settings{background:#1e1e1e;border-bottom:2px solid #333;justify-content:center;align-items:center;gap:1rem;padding:1rem;display:flex}.global-settings label{color:#aaa;font-weight:700}.global-settings select{color:#fff;background:#2a2a2a;border:1px solid #444;border-radius:6px;outline:none;padding:.5rem;font-size:1rem}.search-section{background:#1a1a1a;border-bottom:1px solid #333;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem;display:flex}.search-form{gap:.5rem;width:100%;max-width:500px;display:flex}.search-form input{color:#fff;background:#222;border:1px solid #444;border-radius:6px;flex:1;padding:.75rem 1rem;font-size:1rem}.search-form button{color:#fff;cursor:pointer;background:#3a7bd5;border:none;border-radius:6px;padding:0 1.5rem;font-size:1rem;font-weight:700;transition:background .2s}.search-form button:hover:not(:disabled){background:#3a6073}.search-form button:disabled{opacity:.6;cursor:not-allowed}.search-results-container{background:#222;border:1px solid #444;border-radius:8px;width:100%;max-width:800px;overflow:hidden}.search-results-header{background:#333;justify-content:space-between;align-items:center;padding:.75rem 1rem;font-weight:700;display:flex}.search-results-header button{color:#ff4e50;cursor:pointer;background:0 0;border:none;font-size:1rem;font-weight:700}.search-results{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;max-height:350px;padding:1rem;display:grid;overflow-y:auto}.search-results::-webkit-scrollbar{width:8px}.search-results::-webkit-scrollbar-thumb{background:#555;border-radius:4px}.search-item{cursor:pointer;border-radius:6px;flex-direction:column;align-items:center;gap:.5rem;padding:.5rem;transition:background .2s;display:flex}.search-item:hover{background:#333}.search-item img{border-radius:4px;width:100%;box-shadow:0 2px 4px #00000080}.search-item span{text-align:center;font-size:.85rem;line-height:1.2}.gallery-content{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:2rem}.loading{text-align:center;color:#aaa;margin-top:2rem;font-size:1.2rem}.card-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));justify-items:center;gap:3rem;display:grid}.grid-item{justify-content:center;width:100%;display:flex}.card-container{width:100%;max-width:350px;position:relative}.card-controls-overlay{z-index:10;background:#141414d9;border-radius:20px;gap:.8rem;padding:.4rem .8rem;display:flex;position:absolute;bottom:-45px;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #00000080}.control-btn{color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.1rem;font-weight:700;transition:transform .2s,background .2s;display:flex}.control-btn:disabled{opacity:.3;cursor:not-allowed}.control-btn:not(:disabled):hover{transform:scale(1.15)}.move-btn{background:#3a7bd5}.move-btn:not(:disabled):hover{background:#3a6073}.delete-btn-new{background:#ff4e50;font-size:1.3rem}.delete-btn-new:not(:disabled):hover{background:#d43f40}.control-placeholder{width:32px;height:32px}@media (width<=600px){.header{padding:1rem .5rem}.header h1{font-size:1.5rem}.global-settings{flex-direction:column;gap:.5rem}.search-section,.gallery-content{padding:1rem}.card-grid{grid-template-columns:repeat(2,1fr);gap:3rem 1rem}.card-controls-overlay{gap:.4rem;padding:.3rem .6rem;bottom:-38px}.control-btn,.control-placeholder{width:28px;height:28px;font-size:.9rem}.delete-btn-new{font-size:1.1rem}}:root{--card-aspect:.686;--card-radius:4.55% / 3.5%;--card-edge:#ffe78f;--card-back:#004a80;--card-glow:#ccfffb}.card{width:100%;max-width:350px;z-index:calc(var(--card-scale,1) * 2);will-change:transform, visibility, z-index;transform-style:preserve-3d;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;outline:1px solid #0000;margin:0 auto;transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .3s;transform:translateZ(.01px)}.card:not(.active):hover{--card-scale:1.05!important;--card-opacity:.5!important;--rotate-x:5deg!important;--rotate-y:-5deg!important}.card.interacting{z-index:calc(var(--card-scale,1) * 120);transition:none}.backdrop-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:9990;opacity:0;pointer-events:none;background:#000000d9;width:100vw;height:100vh;transition:opacity .8s ease-out;position:fixed;top:0;left:0}.backdrop-overlay.visible{opacity:1;pointer-events:auto}.backdrop-overlay.shrinking{opacity:0;pointer-events:none}.card-wrapper{justify-content:center;width:100%;display:flex;position:relative}.card.card-expanded{touch-action:none;--card-scale:var(--expand-scale,1.5)!important;transform:translate3d(var(--expand-x,0), var(--expand-y,0), 200px)!important;z-index:99999!important}.card.card-shrinking{--card-scale:1!important;z-index:99999!important;transform:translateZ(.01px)!important}.card.card-expanded:not(.card-shrinking) .card__rotator{animation:.8s cubic-bezier(.2,.8,.2,1) spinCard}.card.card-expanded.card-shrinking .card__rotator{animation:.8s cubic-bezier(.2,.8,.2,1) forwards spinCardReverse}@keyframes spinCard{0%{transform:rotateY(calc(var(--rotate-y,0) - 720deg)) rotateX(var(--rotate-x,0))}to{transform:rotateY(var(--rotate-y,0)) rotateX(var(--rotate-x,0))}}@keyframes spinCardReverse{0%{transform:rotateY(var(--rotate-y,0)) rotateX(var(--rotate-x,0))}to{transform:rotateY(calc(var(--rotate-y,0) + 720deg)) rotateX(var(--rotate-x,0))}}.card__translater,.card__rotator{perspective:600px;will-change:transform, box-shadow;transform-origin:50%;transform-style:preserve-3d;display:grid}.card__translater{transform:translate3d(var(--translate-x,0), var(--translate-y,0), calc(var(--card-scale,1) * 150px)) scale(var(--card-scale,1));transition:transform .8s cubic-bezier(.2,.8,.2,1);position:relative}.card__rotator{transform:rotateY(var(--rotate-y,0)) rotateX(var(--rotate-x,0));pointer-events:auto;appearance:none;cursor:pointer;background:0 0;border:none;padding:0;transition:box-shadow .4s,opacity .33s ease-out;box-shadow:0 0 3px -1px #0000,0 0 2px 1px #0000,0 0 5px #0000,0 10px 20px -5px #000,0 2px 15px -5px #000,0 0 20px #0000}.card.active .card__rotator{box-shadow:0 0 3px -1px white, 0 0 3px 1px var(--card-edge), 0 0 12px 2px var(--card-glow), 0px 10px 20px -5px black, 0 0 40px -30px var(--card-glow), 0 0 50px -20px var(--card-glow);transition:box-shadow .1s ease-out}.card__rotator *{width:100%;aspect-ratio:var(--card-aspect);border-radius:var(--card-radius);transform-style:preserve-3d;grid-area:1/1;display:grid;overflow:hidden}.card__back{background-color:var(--card-back);backface-visibility:visible;transform:rotateY(180deg)translateZ(1px)}.card__front,.card__front *{backface-visibility:hidden}.card__front{transform:translateZ(.01px)}.card__front img{object-fit:cover;width:100%;height:100%;transition:filter .2s}.card__shine{z-index:3;opacity:var(--card-opacity,0);mix-blend-mode:color-dodge;background:0 0;transition:opacity .2s;display:grid;overflow:hidden;transform:translateZ(1px)}.card__glare{background-image:radial-gradient(farthest-corner circle at var(--pointer-x,50%) var(--pointer-y,50%), #fffc 10%, #ffffffa6 20%, #00000080 90%);opacity:var(--card-opacity,0);mix-blend-mode:overlay;transition:opacity .2s;overflow:hidden;transform:translateZ(1.41px)}.card[data-rarity=holo] .card__shine{background-image:linear-gradient(115deg, transparent 20%, var(--card-glow) 36%, #ffffff80 43%, transparent 45%, transparent 55%, var(--card-glow) 64%, #ffffff80 70%, transparent 80%);background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .5);background-size:300% 300%}.card[data-rarity=reverse-holo] .card__shine{background-image:linear-gradient(115deg, transparent 20%, var(--card-glow) 36%, #ffffff80 43%, transparent 45%, transparent 55%, var(--card-glow) 64%, #ffffff80 70%, transparent 80%);background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .4);background-size:300% 300%}.card[data-rarity=reverse-holo] .card__front:after{content:"";pointer-events:none;position:absolute;inset:10% 10% 45%;box-shadow:inset 0 0 20px #00000080}.card[data-rarity=cosmos] .card__shine{background-image:radial-gradient(circle at var(--pointer-x) var(--pointer-y), #fffc, transparent 20%), linear-gradient(45deg, red, #ff0, #0f0, #0ff, #00f, #f0f);background-size:150% 150%;background-position:calc(var(--pointer-from-left) * 100%) calc(var(--pointer-from-top) * 100%);mix-blend-mode:color-dodge;filter:brightness(.8)contrast(1.5);opacity:calc(var(--card-opacity) * .6)}.card[data-rarity=v] .card__shine{background-image:repeating-linear-gradient(45deg,#b53fe480 0%,#cc2a2480 10%,#1d962380 20%);background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .5);background-size:300% 300%}.card[data-rarity=vmax] .card__shine{background-image:repeating-linear-gradient(-33deg, #cc2a24 0%, #6c82da 10%, #2d9a93 20%, #1d9623 30%, #b53fe4 40%, #cc2a24 50%), radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #98e4f199 0%, #a2e7c199 25%, #b184db99 50%, #e0909699 75%);background-blend-mode:difference, luminosity;background-size:1100% 1100%,200% 200%;background-position:var(--pointer-x) var(--pointer-y), center;mix-blend-mode:color-dodge;filter:brightness(1.2)contrast(1.5);opacity:calc(var(--card-opacity) * .6)}.card[data-rarity=vstar] .card__shine{background-image:repeating-linear-gradient(80deg, #ffdf80 0%, #f73 10%, #ffdf80 20%), radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #ff99 0%, transparent 60%);background-blend-mode:hard-light;background-size:400% 400%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .5)}.card[data-rarity=secret] .card__shine{background-image:conic-gradient(from 0deg, red, #ff0, #0f0, #0ff, #00f, #f0f, red), radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #000000fa 10%, #f2f2f226 90%);background-blend-mode:soft-light;mix-blend-mode:color-dodge;filter:brightness(1.1)contrast(1.5);opacity:calc(var(--card-opacity) * .4);background-position:50%;background-size:200% 200%}.card[data-rarity=amazing] .card__shine{background-image:repeating-conic-gradient(#f33 0%,#3f3 5%,#33f 10%,#f33 15%);background-size:300% 300%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:overlay;opacity:calc(var(--card-opacity) * .6)}.card[data-rarity=radiant] .card__shine{background-image:repeating-linear-gradient(90deg,#b53fe4cc 0%,#cc2a24cc 20%,#1d9623cc 40%,#b53fe4cc 60%);background-size:400% 400%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:hard-light;opacity:calc(var(--card-opacity) * .6)}.card[data-rarity=rainbow] .card__front img{filter:contrast(.8)brightness(1.1)saturate(.8)}.card[data-rarity=rainbow] .card__shine{background-image:linear-gradient(135deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);background-size:200% 200%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .5)}.card[data-rarity=trainer-gallery] .card__shine{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #ffe699cc 0%, transparent 60%);mix-blend-mode:overlay;filter:brightness(1.2)contrast(1.5);opacity:calc(var(--card-opacity) * .7)}.card[data-rarity=shiny] .card__shine{background-image:radial-gradient(circle at var(--pointer-x) var(--pointer-y), #ffffffe6 0%, transparent 10%), radial-gradient(circle at var(--pointer-x) var(--pointer-y), #fffc 0%, transparent 8%);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .6)}.card[data-rarity=ygo-secret] .card__shine{background-image:repeating-linear-gradient(-45deg,#0000 0% 2%,#fff6 2.5%,#0000 3%,#ffffff1a 4%,#0000 4.5%),linear-gradient(135deg,#f33 0%,#ff3 20%,#3f3 40%,#3ff 60%,#33f 80%,#f3f 100%);background-size:150% 150%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;filter:brightness(.9)contrast(1.6);opacity:calc(var(--card-opacity) * .5)}.card[data-rarity=ygo-secret] .card__glare{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #fffc 0%, transparent 60%);mix-blend-mode:overlay;opacity:calc(var(--card-opacity) * .5)}.card[data-rarity=ygo-ultimate] .card__front{filter:drop-shadow(0 0 1px #000c)brightness(.9)contrast(1.2)}.card[data-rarity=ygo-ultimate] .card__shine{background-image:linear-gradient(45deg,#ffd7001a 0%,#ffd70066 30%,#fffc 50%,#ffd70066 70%,#ffd7001a 100%);background-size:250% 250%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:hard-light;opacity:calc(var(--card-opacity) * .5)}.card[data-rarity=ygo-ghost] .card__front img{filter:grayscale(80%)brightness(1.5)contrast(.8);transition:filter .2s}.card[data-rarity=ygo-ghost].active .card__front img{filter:grayscale(calc(80% - (var(--pointer-from-center) * 80%))) brightness(calc(1.5 - (var(--pointer-from-center) * .5))) contrast(calc(.8 + (var(--pointer-from-center) * .7)))}.card[data-rarity=ygo-ghost] .card__shine{background-image:linear-gradient(115deg,#f669 0%,#ff69 20%,#6f69 40%,#6ff9 60%,#66f9 80%,#f6f9 100%);background-size:300% 300%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * var(--pointer-from-center) * 1.2)}.card[data-rarity=ygo-prismatic] .card__shine{background-image:repeating-linear-gradient(#0000 98%,#fff6 99%,#0000 100%),repeating-linear-gradient(90deg,#0000 0%,#fff6 1%,#0000 2%),linear-gradient(135deg,#f33 0%,#ff3 20%,#3f3 40%,#3ff 60%,#33f 80%,#f3f 100%);background-size:15% 15%,15% 15%,200% 200%;background-position:center, center, var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;filter:brightness(1.2)contrast(1.5);opacity:calc(var(--card-opacity) * .4)}.card[data-rarity=ygo-gold] .card__front:after{content:"";pointer-events:none;mix-blend-mode:overlay;position:absolute;inset:0;box-shadow:inset 0 0 15px 5px #ffd700cc}.card[data-rarity=ygo-gold] .card__shine{background-image:linear-gradient(135deg,#ffd70000 20%,#ffd70080 50%,#ffd70000 80%);background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .6);background-size:200% 200%}.card[data-rarity=mtg-foil] .card__shine{background-image:linear-gradient(115deg,#ff000080 0%,#ffff0080 15%,#00ff0080 30%,#00ffff80 45%,#0000ff80 60%,#ff00ff80 75%,#ff000080 100%);background-size:300% 300%;background-position:var(--pointer-x) var(--pointer-y);mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * .4)}