:focus,:focus-visible{outline:0 #0000!important}*{-webkit-tap-highlight-color:transparent}body{color:#333;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#1a1d24;min-height:100dvh;font-family:Inter,system-ui,-apple-system,sans-serif;overflow-x:hidden}#root{min-height:100dvh}:root{--navy:#2d3250;--navy-light:#3a4068;--navy-dark:#232842;--green:#a3b828;--green-light:#b8cf3a;--green-dark:#8a9e1e;--bg:#1a1d24;--bg-gradient:linear-gradient(160deg, #1a1d24 0%, #292e3a 40%, #1a1d24 100%);--white:#fff;--text-primary:#1a1d2e;--text-secondary:#5c6078;--text-on-dark:#fff;--text-muted:#8e92a4;--red:#e85454;--red-light:#f06868;--gold:gold;--gold-warm:#f0c24a;--silver:#b0b8c8;--bronze:#cd8e54;--shadow-sm:0 2px 8px #2d325014;--shadow-md:0 4px 20px #2d32501f;--shadow-lg:0 8px 40px #2d32502e;--shadow-card:0 6px 24px #2d325026;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--transition-fast:.15s ease;--transition-base:.3s ease;--transition-slow:.5s ease;--max-width:480px;--tap-target:48px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{color:var(--text-primary);background:var(--bg-gradient);min-height:100dvh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size:16px;line-height:1.5;overflow-x:hidden}#root{flex-direction:column;min-height:100dvh;display:flex}button{cursor:pointer;font-family:inherit;font-size:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:none}button:focus-visible{outline:none}img{max-width:100%;display:block}.app{width:100%;max-width:var(--max-width);background:linear-gradient(160deg,#1a1d24 0%,#292e3a 40%,#1a1d24 100%);flex-direction:column;flex:1;margin:0 auto;padding:0 20px;display:flex;position:relative}.step-container{flex-direction:column;flex:1;transition:opacity .4s,transform .4s;display:flex}.step-container.fade-in{animation:.4s both fadeIn}.step-container.fade-out{opacity:0;pointer-events:none;transform:translateY(-8px)}.progress-bar-container{z-index:100;position:fixed;top:0;left:0;right:0}.progress-bar-track{background:#ffffff14;height:5px}.progress-bar-fill{background:linear-gradient(90deg, var(--green-dark), var(--green), var(--green-light));border-radius:0 4px 4px 0;height:100%;transition:width .6s cubic-bezier(.22,1,.36,1);position:relative}.progress-bar-fill:after{content:"";background:linear-gradient(90deg,#0000,#fff6);border-radius:0 4px 4px 0;width:20px;position:absolute;top:0;bottom:0;right:0}.progress-bar-label{color:#fff9;z-index:100;background:#ffffff1a;border-radius:20px;padding:2px 10px;font-size:12px;font-weight:600;position:fixed;top:10px;right:16px}.encouragement{color:var(--text-on-dark);box-shadow:var(--shadow-lg);z-index:150;opacity:0;pointer-events:none;white-space:nowrap;background:#292e3a;border:1px solid #a3b828;border-radius:60px;padding:12px 24px;font-size:15px;font-weight:600;transition:opacity .3s,transform .3s;position:fixed;bottom:100px;left:50%;transform:translate(-50%)translateY(20px)}.encouragement.show{animation:2.5s cubic-bezier(.22,1,.36,1) forwards toastIn}.welcome-screen{text-align:center;opacity:0;flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;padding:40px 20px;transition:opacity .6s,transform .6s;display:flex;transform:translateY(12px)}.welcome-screen.visible{opacity:1;transform:translateY(0)}.welcome-logo{margin-bottom:24px;animation:.6s .1s both fadeIn}.logo-image{width:180px;height:auto;margin:0 auto 8px;display:block}.logo-text{letter-spacing:3px;text-transform:uppercase;color:var(--navy);font-size:11px;font-weight:800}.logo-text .green{color:var(--green)}.welcome-title{color:var(--navy);margin-bottom:12px;font-size:32px;font-weight:800;line-height:1.15;animation:.6s .3s both fadeIn}.welcome-subtitle{color:var(--text-secondary);max-width:340px;margin-bottom:36px;font-size:17px;line-height:1.55;animation:.6s .4s both fadeIn}.welcome-steps{flex-direction:column;gap:14px;width:100%;max-width:300px;margin-bottom:36px;animation:.6s .45s both fadeIn;display:flex}.welcome-step{text-align:left;align-items:center;gap:14px;display:flex}.step-number{background:linear-gradient(135deg, var(--navy), var(--navy-light));width:36px;height:36px;color:var(--white);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:15px;font-weight:800;display:flex}.step-text{color:var(--text-primary);font-size:15px;font-weight:600}.start-button{min-height:var(--tap-target);color:var(--white);background:linear-gradient(135deg, var(--green-dark), var(--green));transition:transform var(--transition-fast), box-shadow var(--transition-base);border-radius:60px;justify-content:center;align-items:center;gap:10px;padding:16px 48px;font-size:18px;font-weight:700;animation:.6s .5s both fadeIn,2.5s ease-in-out 1.5s infinite pulse;display:inline-flex;box-shadow:0 4px 20px #a3b82859}.start-button:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 6px 28px #a3b82873}.start-button:active{transform:translateY(0)scale(.98);box-shadow:0 2px 12px #a3b8284d}.welcome-hint{color:var(--text-muted);margin-top:40px;font-size:13px;animation:.6s .7s both fadeIn}.elimination-round{flex-direction:column;flex:1;padding-bottom:24px;display:flex}.elimination-header{text-align:center;padding:24px 0 16px}.elimination-title{color:var(--text-on-dark);margin-bottom:4px;font-size:22px;font-weight:800}.elimination-instruction{color:#fff9;margin-bottom:12px;font-size:15px}.elimination-instruction .emphasis{color:var(--red);letter-spacing:.5px;font-weight:800}.elimination-progress{flex-direction:column;align-items:center;gap:6px;display:flex}.rank-badge-prompt{color:#fff9;font-size:13px}.rank-badge-prompt strong{color:var(--green);font-weight:800}.elimination-progress .progress-bar{background:#ffffff14;border-radius:3px;width:100%;max-width:220px;height:6px;overflow:hidden}.elimination-progress .progress-fill{background:linear-gradient(90deg, var(--green-dark), var(--green));border-radius:3px;height:100%;transition:width .5s cubic-bezier(.22,1,.36,1)}.progress-text{color:#ffffff80;font-size:12px;font-weight:600}.elimination-grid{flex-direction:column;gap:10px;padding:8px 0;display:flex}.elimination-card{background:var(--navy);color:var(--text-on-dark);border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-sm);transition:transform var(--transition-fast), box-shadow var(--transition-base), opacity var(--transition-base);-webkit-tap-highlight-color:transparent;min-height:var(--tap-target);padding:20px;animation:.35s cubic-bezier(.22,1,.36,1) both slideUp;position:relative;overflow:hidden}.elimination-card:first-child{animation-delay:30ms}.elimination-card:nth-child(2){animation-delay:60ms}.elimination-card:nth-child(3){animation-delay:90ms}.elimination-card:nth-child(4){animation-delay:.12s}.elimination-card:nth-child(5){animation-delay:.15s}.elimination-card:nth-child(6){animation-delay:.18s}.elimination-card:nth-child(7){animation-delay:.21s}.elimination-card:nth-child(8){animation-delay:.24s}.elimination-card:nth-child(9){animation-delay:.27s}.elimination-card:nth-child(10){animation-delay:.3s}.elimination-card:hover{box-shadow:var(--shadow-md);transform:translate(-4px)}.elimination-card:active{transform:scale(.97)}.elimination-card.eliminating{animation:.7s cubic-bezier(.55,0,1,.45) forwards eliminateCard}.rank-badge-overlay{z-index:2;border-radius:var(--radius-md);background:#a3b828d9;justify-content:center;align-items:center;animation:.2s both fadeIn;display:flex;position:absolute;inset:0}.rank-badge-number{color:var(--white);text-shadow:0 2px 8px #0003;font-size:28px;font-weight:900}.elimination-card-content{z-index:1;position:relative}.card-name{margin-bottom:2px;font-size:16px;font-weight:700;line-height:1.3}.card-subtitle{opacity:.7;margin-bottom:4px;font-size:13px;font-weight:500}.card-description{opacity:.65;font-size:13px;font-weight:400;line-height:1.4}.eliminated-tray{border-radius:var(--radius-md);background:#292e3a;border:1px solid #ffffff14;margin-top:20px;padding:14px 16px;animation:.3s both fadeIn}.eliminated-label{color:#ffffff80;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-size:12px;font-weight:700}.eliminated-chips{flex-wrap:wrap;gap:6px;display:flex}.eliminated-chip{color:#ffffffb3;background:#ffffff14;border-radius:20px;padding:4px 12px;font-size:12px;font-weight:600;animation:.3s both fadeIn;display:inline-block}.final-rank{flex-direction:column;flex:1;padding-bottom:24px;display:flex}.final-rank-header{text-align:center;padding:24px 0 16px}.final-rank-title{color:var(--text-on-dark);margin-bottom:4px;font-size:22px;font-weight:800}.final-rank-instruction{color:#fff9;font-size:15px}.final-rank-instruction strong{color:var(--green);font-weight:800}.final-rank-instruction.complete-text{color:var(--green);font-size:17px;font-weight:700}.final-rank-layout{flex-direction:column;flex:1;gap:24px;display:flex}.ranked-slots{flex-direction:column;gap:8px;display:flex}.ranked-slot{border-radius:var(--radius-md);box-shadow:var(--shadow-sm);min-height:56px;transition:background var(--transition-base), box-shadow var(--transition-base);background:#292e3a;border:2px solid #0000;align-items:center;gap:12px;padding:14px 16px;display:flex}.ranked-slot.slot-gold{background:linear-gradient(135deg,#ffd7001f,#292e3a);border-color:#ffd7004d}.ranked-slot.slot-silver{background:linear-gradient(135deg,#b0b8c81f,#292e3a);border-color:#b0b8c84d}.ranked-slot.slot-bronze{background:linear-gradient(135deg,#cd8e541f,#292e3a);border-color:#cd8e544d}.ranked-slot.filled{box-shadow:var(--shadow-md)}.ranked-slot.empty{opacity:.7;border-style:dashed;border-color:#ffffff1f}.slot-number{background:var(--green);width:36px;height:36px;color:var(--white);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.slot-gold .slot-number{background:linear-gradient(135deg, #e8b230, var(--gold));box-shadow:0 2px 8px #ffd70066}.slot-silver .slot-number{background:linear-gradient(135deg, #94a0b4, var(--silver));box-shadow:0 2px 8px #b0b8c866}.slot-bronze .slot-number{background:linear-gradient(135deg, #b87a44, var(--bronze));box-shadow:0 2px 8px #cd8e5466}.slot-rank-text{font-size:14px;font-weight:800}.slot-content{flex:1;min-width:0}.slot-card-info{flex-direction:column;gap:1px;display:flex}.slot-card-info.slide-in{animation:.4s cubic-bezier(.22,1,.36,1) both slideInFromRight}.slot-card-name{color:var(--text-on-dark);font-size:15px;font-weight:700}.slot-card-subtitle{color:#ffffff80;font-size:12px}.slot-placeholder{color:#ffffff59;font-size:14px;font-style:italic}.unranked-cards{flex-direction:column;gap:8px;display:flex}.unranked-label{color:#ffffff80;text-transform:uppercase;letter-spacing:1px;text-align:center;font-size:13px;font-weight:700}.unranked-grid{flex-direction:column;gap:10px;display:flex}.unranked-card{background:var(--navy);color:var(--text-on-dark);border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-sm);transition:transform var(--transition-fast), box-shadow var(--transition-base), opacity var(--transition-base);-webkit-tap-highlight-color:transparent;min-height:var(--tap-target);padding:18px 20px;animation:.35s cubic-bezier(.22,1,.36,1) both slideUp}.unranked-card:hover{box-shadow:var(--shadow-md);transform:translate(-4px)}.unranked-card:active{transform:scale(.97)}.unranked-card.assigning{animation:.5s cubic-bezier(.55,0,1,.45) forwards eliminateCard}.see-results-container{justify-content:center;padding:24px 0;animation:.5s both fadeIn;display:flex}.see-results-btn{min-height:var(--tap-target);color:var(--white);background:linear-gradient(135deg, var(--green-dark), var(--green));transition:transform var(--transition-fast), box-shadow var(--transition-base);width:100%;max-width:var(--max-width);border-radius:60px;justify-content:center;align-items:center;gap:8px;padding:16px 48px;font-size:18px;font-weight:700;animation:2.5s ease-in-out infinite pulse;display:inline-flex;box-shadow:0 4px 20px #a3b82859}.see-results-btn:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 6px 28px #a3b82873}.see-results-btn:active{transform:translateY(0)scale(.98);box-shadow:0 2px 12px #a3b8284d}.results{flex-direction:column;flex:1;align-items:center;padding:24px 0 40px;animation:.5s both fadeIn;display:flex;position:relative}.results.confetti-active{overflow:visible}.confetti-container{pointer-events:none;z-index:200;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.confetti-piece{top:-10px;left:var(--x,50vw);background:var(--color,var(--gold));width:10px;height:10px;animation:confettiFall 3s cubic-bezier(.25, .46, .45, .94) var(--delay,0s) forwards;transform:rotate(var(--rotation,0deg));border-radius:2px;position:absolute}.results-header{text-align:center;margin-bottom:24px;animation:.6s .2s both fadeIn}.results-title{color:var(--text-on-dark);margin-bottom:4px;font-size:26px;font-weight:800}.results-subtitle{color:#ffffff80;font-size:14px}.top-value-showcase{background:linear-gradient(145deg, var(--navy), var(--navy-dark));border-radius:var(--radius-xl);text-align:center;width:100%;color:var(--text-on-dark);box-shadow:var(--shadow-lg);margin-bottom:24px;padding:32px 24px;animation:.5s cubic-bezier(.22,1,.36,1) .3s both slideUp;position:relative;overflow:hidden}.top-value-showcase:before{content:"";pointer-events:none;background:radial-gradient(circle,#a3b8281f 0%,#0000 60%);width:200%;height:200%;position:absolute;top:-50%;left:-50%}.trophy-icon{margin-bottom:8px;font-size:56px;animation:2s ease-in-out infinite pulse;display:block}.top-value-name{margin-bottom:4px;font-size:28px;font-weight:800;line-height:1.2;position:relative}.top-value-subtitle{opacity:.7;margin-bottom:8px;font-size:14px;position:relative}.top-value-description{opacity:.75;margin-bottom:12px;font-size:15px;line-height:1.5;position:relative}.top-value-label{letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-size:12px;font-weight:700;position:relative}.results-list{flex-direction:column;gap:8px;width:100%;margin-bottom:28px;list-style:none;display:flex}.result-item{border-radius:var(--radius-md);align-items:center;gap:14px;padding:16px;animation:.4s cubic-bezier(.22,1,.36,1) both slideUp;display:flex}.result-item:first-child{animation-delay:.4s}.result-item:nth-child(2){animation-delay:.5s}.result-item:nth-child(3){animation-delay:.6s}.result-item:nth-child(4){animation-delay:.7s}.result-item:nth-child(5){animation-delay:.8s}.result-item:nth-child(6){animation-delay:.85s}.result-item:nth-child(7){animation-delay:.9s}.result-item:nth-child(8){animation-delay:.95s}.result-item:nth-child(9){animation-delay:1s}.result-item:nth-child(10){animation-delay:1.05s}.result-item.result-top-three:first-child{background:linear-gradient(135deg,#ffd7001f,#ffd7000d);border:1px solid #ffd70040}.result-item.result-top-three:nth-child(2){background:linear-gradient(135deg,#b0b8c81f,#b0b8c80d);border:1px solid #b0b8c840}.result-item.result-top-three:nth-child(3){background:linear-gradient(135deg,#cd8e541f,#cd8e540d);border:1px solid #cd8e5440}.result-item.result-lower{background:#ffffff0a;border:1px solid #ffffff0f}.result-badge{width:40px;height:40px;color:var(--white);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;font-weight:800;display:flex}.result-badge.badge-gold{background:linear-gradient(135deg, #e8b230, var(--gold));box-shadow:0 2px 8px #ffd70066}.result-badge.badge-silver{background:linear-gradient(135deg, #94a0b4, var(--silver));box-shadow:0 2px 8px #b0b8c866}.result-badge.badge-bronze{background:linear-gradient(135deg, #b87a44, var(--bronze));box-shadow:0 2px 8px #cd8e5466}.result-badge.badge-default{background:var(--navy-light)}.result-badge-content{font-size:16px;line-height:1}.result-info{flex:1;min-width:0}.result-name{color:var(--text-on-dark);margin-bottom:2px;font-size:16px;font-weight:700}.result-description{color:#ffffff8c;font-size:13px;line-height:1.4}.reflection-section{width:100%;margin-bottom:20px;animation:.5s .9s both fadeIn}.reflection-label{color:var(--text-on-dark);margin-bottom:8px;font-size:14px;font-weight:700;display:block}.reflection-textarea{width:100%;min-height:100px;color:var(--text-on-dark);border-radius:var(--radius-md);resize:vertical;transition:border-color var(--transition-base), box-shadow var(--transition-base);background:#292e3a;border:2px solid #ffffff1a;padding:14px 16px;font-family:inherit;font-size:15px;line-height:1.5}.reflection-textarea::placeholder{color:#6b6f7b}.reflection-textarea:focus{border-color:var(--green);outline:none;box-shadow:0 0 0 3px #a3b82826}.results-actions{gap:12px;width:100%;animation:.5s 1s both fadeIn;display:flex}.download-btn{min-height:var(--tap-target);color:var(--white);background:linear-gradient(135deg, var(--green-dark), var(--green));transition:transform var(--transition-fast), box-shadow var(--transition-base);border-radius:60px;flex:1;justify-content:center;align-items:center;gap:8px;padding:14px 24px;font-size:16px;font-weight:700;display:inline-flex;box-shadow:0 4px 16px #a3b8284d}.download-btn:hover{transform:translateY(-1px);box-shadow:0 6px 24px #a3b82866}.download-btn:active{transform:translateY(0)scale(.98)}.restart-btn{min-height:var(--tap-target);color:var(--text-on-dark);transition:transform var(--transition-fast), box-shadow var(--transition-base), border-color var(--transition-base);background:0 0;border:2px solid #fff3;border-radius:60px;flex:1;justify-content:center;align-items:center;gap:8px;padding:14px 24px;font-size:16px;font-weight:700;display:inline-flex}.restart-btn:hover{border-color:#fff6;transform:translateY(-1px)}.restart-btn:active{transform:translateY(0)scale(.98)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes cardEnter{0%{opacity:0;transform:translateY(30px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes swipeRight{0%{opacity:1}to{opacity:0;transform:translate(150%)rotate(20deg)}}@keyframes swipeLeft{0%{opacity:1}to{opacity:0;transform:translate(-150%)rotate(-20deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}@keyframes eliminateCard{0%{opacity:1;transform:translate(0)scale(1)}30%{opacity:1;transform:translate(10px)scale(1.02)}to{opacity:0;transform:translate(-120%)scale(.8)rotate(-8deg)}}@keyframes confettiFall{0%{opacity:1;transform:translateY(-10vh)rotate(0)}80%{opacity:1}to{opacity:0;transform:translateY(110vh)rotate(720deg)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(20px)scale(.9)}15%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}85%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-10px)scale(.95)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-8px)}60%{transform:translateY(-4px)}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width>=481px){.app{max-width:520px;padding:0 28px}.welcome-title{font-size:38px}.elimination-grid,.unranked-grid{gap:12px}}@media (width>=768px){.app{max-width:560px;padding:0 32px}.welcome-title{font-size:42px}.welcome-subtitle{max-width:400px;font-size:18px}.results-title{font-size:30px}.top-value-name{font-size:32px}}@media (width<=480px){:root{--max-width:100%}.app{padding:0 16px}.welcome-title{font-size:26px}.welcome-subtitle{font-size:15px}.start-button{padding:14px 36px;font-size:16px}.card-name{font-size:14px}.card-description{font-size:12px}.elimination-title,.final-rank-title{font-size:20px}.top-value-name{font-size:24px}.result-badge{width:34px;height:34px;font-size:14px}}@media (height>=800px){.welcome-screen{padding:60px 20px}.start-button{margin-top:8px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.start-button,.see-results-btn{animation:none}}@media (prefers-color-scheme:dark){:root{--shadow-sm:0 2px 8px #0003;--shadow-md:0 4px 20px #0000004d;--shadow-lg:0 8px 40px #0006;--shadow-card:0 6px 24px #00000059}}