@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@600;700&display=swap";*{box-sizing:border-box}body{color:#e2e8f0;background:linear-gradient(135deg,#0f172a,#020617);margin:0;font-family:system-ui,sans-serif}.container{text-align:center;max-width:1200px;margin:0 auto;padding:clamp(16px,4vw,40px)}.site-title{letter-spacing:.05em;background:linear-gradient(135deg,#6a0f3c,#8b1c62,#ff4ecd,#4caf50) 0 0/300% 300%;-webkit-text-fill-color:transparent;text-shadow:0 0 clamp(4px,1vw,8px) #8b1c62b3,0 0 clamp(8px,2vw,16px) #ff4ecd99,0 0 clamp(12px,3vw,24px) #4caf5080;-webkit-background-clip:text;font-family:Fredoka,sans-serif;font-size:clamp(2rem,6vw,4rem);font-weight:700;transition:all .3s;animation:5s infinite gradientMove;transform:perspective(600px)rotateX(10deg)}.site-title:hover{transform:perspective(600px)rotateX(0)scale(1.05)}.subtitle{color:#94a3b8;font-size:clamp(.9rem,2.5vw,1.1rem)}.grid{grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:clamp(12px,3vw,24px);margin-top:clamp(20px,5vw,40px);display:grid}.card,.tool-card{background:#1e293b;border-radius:16px;padding:clamp(16px,3vw,25px);transition:transform .2s,box-shadow .2s}.card:hover,.tool-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #0000004d}textarea,input,select{color:#fff;background:#020617;border:1px solid #334155;border-radius:8px;width:100%;margin-top:6px;padding:clamp(8px,2vw,12px);font-size:clamp(.9rem,2.5vw,1rem)}button{color:#000;cursor:pointer;background:#38bdf8;border:none;border-radius:8px;padding:clamp(8px,2vw,12px) clamp(12px,3vw,18px);font-size:clamp(.9rem,2.5vw,1rem);transition:all .2s}button:hover{opacity:.85}button:disabled{opacity:.6;cursor:not-allowed}.unit-row{flex-wrap:wrap;gap:10px;display:flex}.result-card{background:#020617;border:1px solid #38bdf8;border-radius:12px;margin-top:clamp(16px,4vw,25px);padding:clamp(12px,3vw,20px);font-size:clamp(1rem,3vw,1.4rem);font-weight:700}.history{text-align:left;margin-top:clamp(20px,5vw,30px)}.history-item{color:#94a3b8;border-bottom:1px solid #334155;padding:8px;font-size:clamp(.8rem,2.5vw,.95rem)}.wheel-container{text-align:center}.wheel-canvas{aspect-ratio:1;border:2px solid #000;width:min(90vw,400px);height:auto}.input-container{margin-top:clamp(12px,3vw,20px)}.instructions{color:#94a3b8;margin-bottom:6px;font-size:clamp(.8rem,2.5vw,.95rem)}.name-textarea{width:min(90%,360px);height:clamp(70px,15vw,100px);margin:0 auto;display:block}.spin-button{margin-top:10px}.winner-text{color:#22c55e;margin-top:clamp(12px,3vw,20px);font-size:clamp(1.1rem,3vw,1.5rem);font-weight:700}@keyframes gradientMove{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}
