.card{perspective:1000px;cursor:pointer;transition:transform .3s ease}.card:hover{transform:scale(1.05);box-shadow:0 10px 30px #0000004d}.card-inner{position:relative;width:100%;padding-top:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.25,.46,.45,.94)}.card.flipped .card-inner{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;backface-visibility:hidden;box-shadow:0 4px 15px #0003;transition:box-shadow .3s ease}.card-front{background:radial-gradient(circle at 20% 20%,#111827,#020617);border:1px solid rgba(148,163,184,.4)}.card-front:hover{box-shadow:0 8px 25px #0006}.card-back{transform:rotateY(180deg);overflow:hidden;border:1px solid rgba(148,163,184,.3);background:linear-gradient(135deg,#1e293b,#0f172a)}.card-back img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.card-back:hover img{transform:scale(1.1)}.board-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));grid-template-rows:repeat(4,1fr);gap:.5rem;animation:fadeIn 1s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.board-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (max-width: 640px){.board-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0f172ab3;display:flex;align-items:center;justify-content:center;z-index:30;border-radius:inherit}.modal{background:#020617;border-radius:16px;padding:1.5rem 2rem;border:1px solid rgba(148,163,184,.4);max-width:360px;width:100%;text-align:center;position:relative;overflow:hidden}.modal h2{margin-bottom:.5rem}.modal p{margin:.25rem 0;color:#cbd5f5}.modal-actions{margin-top:1rem;display:flex;justify-content:space-between;gap:.75rem}.modal-congrats h2{font-size:1.4rem}.highlight-time{margin-top:.5rem;font-weight:500}.highlight-time span{color:#f97316;font-weight:700}.fireworks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:-1}.firework{position:absolute;width:6px;height:6px;border-radius:999px;background:radial-gradient(circle,#f97316,transparent 60%);box-shadow:0 0 #f97316cc,0 0 #34d399cc,0 0 #38bdf8cc;animation:firework-burst 1.4s ease-out infinite;opacity:.8}.firework-1{top:15%;left:20%;animation-delay:0s}.firework-2{top:25%;right:15%;animation-delay:.3s}.firework-3{bottom:15%;left:50%;transform:translate(-50%);animation-delay:.6s}@keyframes firework-burst{0%{transform:scale(.2);box-shadow:0 0 #f97316e6,0 0 #34d399e6,0 0 #38bdf8e6;opacity:0}40%{transform:scale(1);box-shadow:0 -18px 0 2px #f97316e6,16px 10px 0 2px #34d399e6,-14px 12px 0 2px #38bdf8e6;opacity:1}80%{transform:scale(1.1);box-shadow:0 -26px #f9731600,22px 14px #34d39900,-20px 18px #38bdf800;opacity:0}to{transform:scale(.2);opacity:0}}.app-root{min-height:100vh;background:radial-gradient(circle at top,#020617,#000);color:#e5e7eb;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem;animation:appFadeIn 1.2s ease-out;position:relative;overflow:hidden}.app-root:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="200"><defs><style>text { font-family: Arial, sans-serif; font-size: 32px; font-weight: bold; fill: rgba(255, 255, 255, 0.15); text-shadow: 0 0 10px rgba(255, 255, 255, 0.3); }<\/style></defs><text x="50" y="50" transform="rotate(-25 50 50)">cutie team</text><text x="250" y="50" transform="rotate(-25 250 50)">cutie team</text><text x="50" y="150" transform="rotate(-25 50 150)">cutie team</text><text x="250" y="150" transform="rotate(-25 250 150)">cutie team</text></svg>');background-repeat:repeat;background-size:400px 200px;z-index:0;pointer-events:none}.app-root>*{position:relative;z-index:1}@keyframes appFadeIn{0%{opacity:0}to{opacity:1}}.app-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;animation:slideInFromTop .8s ease-out}@keyframes slideInFromTop{0%{transform:translateY(-30px);opacity:0}to{transform:translateY(0);opacity:1}}.app-header h1{font-size:1.8rem;margin:0}.subtitle{margin:.25rem 0 0;color:#9ca3af;font-size:.9rem}.app-main{flex:1;max-width:1200px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:1rem;animation:slideInFromBottom 1s ease-out .3s both;max-height:90vh}@keyframes slideInFromBottom{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.top-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.info{display:flex;align-items:center;gap:.5rem;color:#9ca3af;font-size:.9rem}.dot{font-size:.6rem}.board-wrapper{position:relative;border-radius:18px;overflow:hidden;padding:1rem;background:radial-gradient(circle at 20% 20%,#020617,#020617);border:1px solid rgba(148,163,184,.25);box-shadow:0 8px 32px #0000004d;transition:box-shadow .3s ease}.board-wrapper:hover{box-shadow:0 12px 40px #0006}.board-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;background:radial-gradient(circle at top,#0f172ae6,#0f172afa);display:flex;align-items:center;justify-content:center;text-align:center;padding:1rem;color:#e5e7eb;font-size:.95rem;animation:overlayFadeIn .5s ease-out}@keyframes overlayFadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.btn{padding:.55rem 1.2rem;border-radius:9999px;border:none;cursor:pointer;background:#111827;color:#e5e7eb;font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;border:1px solid rgba(148,163,184,.45);transition:all .3s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px #0000004d}.btn.primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);border-color:transparent}.btn.secondary{background:#020617}.btn:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 640px){.app-root{padding:1rem}.app-header{flex-direction:column;align-items:flex-start}}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Arial,sans-serif;background:#000;color:#e5e7eb}#root{min-height:100vh}
