@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Chakra+Petch:wght@400;700&display=swap";:root{--purple: #5a2ea6;--purple-dark: #2b1b4a;--green: #22c55e;--yellow: #fbbf24}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--purple);color:#fff;font-family:Chakra Petch,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.btn{background:var(--green);color:#0a0a0a;padding:12px 20px;border-radius:16px;border:3px solid #0a0a0a;box-shadow:4px 4px #0a0a0a;font-weight:800;letter-spacing:.06em;cursor:pointer;transition:transform .05s ease-in}.btn:hover{transform:translate(-1px,-1px)}.btn:active{transform:translate(1px,1px)}.btn.secondary{background:var(--yellow)}.chip{background:var(--yellow);border:2px solid #0a0a0a;width:40px;height:40px;border-radius:12px;font-weight:900;font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer}.qty{min-width:48px;text-align:center;font-weight:900;font-size:20px;padding:8px 12px;border:2px solid #fff3;border-radius:8px;background:#ffffff10}.font-mono{font-family:"Press Start 2P",cursive}.min-h-screen{min-height:100vh}.bg-\[\#5a2ea6\]{background-color:var(--purple)}.text-white{color:#fff}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1 1 auto}.justify-between{justify-content:space-between}.items-center{align-items:center}.p-4{padding:1rem}.p-6{padding:1.5rem}.gap-6{gap:1.5rem}.space-x-3>*+*{margin-left:.75rem}.text-2xl{font-size:1.5rem}.text-4xl{font-size:2rem}.font-extrabold{font-weight:900}.tracking-widest{letter-spacing:.35em}.tracking-wider{letter-spacing:.1em}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mt-3{margin-top:.75rem}.mt-6{margin-top:1.5rem}.min-w-\[200px\]{min-width:200px}.rounded-3xl{border-radius:1.25rem}.rounded-2xl{border-radius:1rem}.border-2{border-width:2px}.border-4{border-width:4px}.border-white\/10{border-color:#ffffff1a}.border-white\/20{border-color:#fff3}.bg-\[\#2b1b4a\]{background-color:var(--purple-dark)}.shadow-2xl{box-shadow:0 20px 40px #00000059}.w-full{width:100%}.max-w-xl{max-width:48rem}.w-56{width:14rem}.h-56{height:14rem}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.object-cover{object-fit:cover}.underline{text-decoration:underline}.progress{height:12px;width:100%;background:#ffffff26;border-radius:9999px;border:2px solid #0a0a0a;overflow:hidden;box-shadow:inset 0 0 0 2px #00000026}.progress-bar{height:100%;background:var(--green)}.card{width:100%;max-width:960px;background:#221735;border-radius:24px;padding:24px;box-shadow:0 30px 60px #0006;border:2px solid rgba(255,255,255,.08)}@media(max-width:768px){.card{padding:16px;border-radius:16px}}.content{display:grid;grid-template-columns:1fr 1.2fr;gap:28px;align-items:center}@media(max-width:768px){.content{grid-template-columns:1fr;gap:20px}}.preview{width:340px;height:340px;border-radius:20px;border:4px solid rgba(255,255,255,.2);background:linear-gradient(135deg,#ffffff0d,#ffffff05);object-fit:cover;justify-self:center;box-shadow:0 12px 32px #0006;-webkit-user-select:none;user-select:none}@media(max-width:768px){.preview{width:100%;max-width:340px;height:auto;aspect-ratio:1}}.supply-info{margin-bottom:16px}.supply-text{font-size:13px;opacity:.9;margin-bottom:8px;font-weight:700}.progress-bar-inline{width:100%;height:10px;background:#ffffff14;border-radius:999px;overflow:hidden;border:2px solid rgba(255,255,255,.1)}.progress-fill-inline{height:100%;background:linear-gradient(90deg,#ff7a18,#ffb800);transition:width .5s ease-in-out}.phase{display:flex;align-items:center;justify-content:space-between;background:#14101f;padding:14px 16px;border-radius:16px;border:2px solid rgba(255,255,255,.08);box-shadow:0 8px #00000059;margin-bottom:12px}@media(max-width:768px){.phase{padding:12px 14px}}.phase-title{font-weight:900;letter-spacing:.06em}.status{font-size:12px;padding:4px 10px;border-radius:999px;border:2px solid #0a0a0a;font-weight:800}.status.open{background:#8ff0ff;color:#05202a}.status.ended{background:#ef4444;color:#fff}.meta{font-size:14px;opacity:.9;margin-bottom:18px}@media(max-width:768px){.meta{font-size:13px}}.qty-row{display:flex;align-items:center;gap:12px;margin-bottom:16px}.round{width:44px;height:44px;border-radius:9999px;border:3px solid #0a0a0a;background:#fbbf24;font-weight:900;font-size:20px;cursor:pointer;box-shadow:3px 3px #0a0a0a}.qty-display{min-width:56px;text-align:center;font-weight:900;font-size:20px;padding:10px 14px;border:2px solid #fff3;border-radius:10px;background:#ffffff10}.cta{width:100%;background:#ff7a18;color:#0a0a0a;padding:18px 20px;border-radius:18px;border:3px solid #0a0a0a;box-shadow:6px 6px #0a0a0a;font-weight:900;font-size:17px;letter-spacing:.06em;cursor:pointer;transition:transform .05s,background .2s,opacity .2s}.cta:hover:not(:disabled){transform:translateY(-2px);background:#fdba74;box-shadow:8px 8px #0a0a0a}.cta:active:not(:disabled){transform:translateY(2px);box-shadow:2px 2px #0a0a0a}.cta:disabled{opacity:.6;cursor:not-allowed;background:#94a3b8}@media(max-width:768px){.cta{padding:16px 18px;font-size:15px;box-shadow:4px 4px #0a0a0a}.cta:hover:not(:disabled){box-shadow:5px 5px #0a0a0a}}
