*{box-sizing:border-box;font-family:"Prompt","Kanit","Segoe UI",sans-serif}
:root{--pink:#ff7894;--dark:#da4260;--cream:#fff1d3;--brown:#624046;--line:#ffd0dc;--paper:rgba(255,255,255,.93)}
body{margin:0;min-height:100vh;color:var(--brown);background:radial-gradient(circle at 10% 5%,#fff 0 8%,transparent 9%),radial-gradient(circle at 90% 18%,#fff2b8 0 7%,transparent 8%),linear-gradient(180deg,#fff8ef,#ffe4ec 60%,#fff4f7);overflow-x:hidden}
.container{width:min(1160px,100%);margin:auto;padding:26px 18px 44px}
.petal{position:fixed;top:-10vh;font-size:34px;opacity:.65;animation:fall 10s linear infinite;pointer-events:none}.p1{left:8%}.p2{left:58%;animation-delay:2s}.p3{left:84%;animation-delay:5s}@keyframes fall{to{transform:translateY(115vh) rotate(360deg)}}
.hero{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
.badge{display:inline-block;background:white;color:var(--dark);border:2px solid var(--line);border-radius:999px;padding:8px 15px;font-weight:900;box-shadow:0 8px 18px rgba(218,66,96,.13)}
h1{font-size:clamp(36px,6vw,62px);margin:10px 0 5px;color:var(--pink);text-shadow:3px 4px 0 #fff}h2,h3{color:var(--dark);margin-top:0}p{line-height:1.7}
nav{display:flex;gap:10px;flex-wrap:wrap}nav a{background:white;color:var(--dark);border:2px solid var(--line);border-radius:18px;text-decoration:none;padding:11px 15px;font-weight:900}
.layout{display:grid;grid-template-columns:430px 1fr;gap:24px;align-items:start}.machine-box{display:grid;place-items:center}
.machine{position:relative;width:400px;max-width:100%;height:625px;background:linear-gradient(180deg,#ff9caf,#f15a76);border:10px solid white;border-radius:52px 52px 30px 30px;box-shadow:0 26px 55px rgba(218,66,96,.27),inset 0 -14px 0 rgba(0,0,0,.08);padding:22px}
.lights{display:flex;align-items:center;justify-content:center;gap:14px}.lights span{width:32px;height:32px;background:#fff6a5;border:5px solid #fff;border-radius:50%;box-shadow:0 0 16px #fff3a8}.lights b{background:var(--cream);border:5px solid white;border-radius:25px;color:var(--dark);text-align:center;font-size:28px;line-height:1.05;padding:12px 28px;box-shadow:0 8px 0 rgba(0,0,0,.09)}
.glass{position:relative;width:300px;height:270px;margin:24px auto 18px;background:radial-gradient(circle at 35% 25%,white 0 16%,#fff8fc 35%,#ffd2df 100%);border:10px solid white;border-radius:50%;overflow:hidden;box-shadow:inset 0 12px 30px rgba(255,255,255,.8),inset 0 -15px 25px rgba(218,66,96,.16)}
.shine{position:absolute;width:86px;height:38px;left:52px;top:34px;background:rgba(255,255,255,.75);border-radius:50%;transform:rotate(-25deg)}
.ball{position:absolute;width:60px;height:44px;display:grid;place-items:center;background:#fff4a8;border:4px solid rgba(130,90,70,.15);border-radius:999px;font-size:25px;animation:float 3s ease-in-out infinite}.b1{left:42px;top:70px}.b2{right:42px;top:56px;background:#dff9ff;animation-delay:.2s}.b3{left:118px;top:126px;background:#ffe1ef;animation-delay:.4s}.b4{right:76px;bottom:48px;background:#e7ffd8;animation-delay:.6s}.b5{left:52px;bottom:50px;background:#eee3ff;animation-delay:.8s}.b6{left:126px;bottom:18px;background:#fff7d6;animation-delay:1s}@keyframes float{50%{transform:translateY(-13px) rotate(8deg)}}
.controls{display:flex;justify-content:center;align-items:center;gap:22px}.coin{width:84px;height:108px;background:white;border-radius:22px;display:grid;place-items:center;align-content:center;gap:9px;color:var(--dark);font-weight:1000;box-shadow:inset 0 -8px 0 rgba(0,0,0,.08)}.coin em{width:52px;height:8px;background:var(--dark);border-radius:999px}.coin strong{font-style:normal}
.handle{width:126px;height:126px;border:9px solid white;border-radius:50%;background:var(--cream);position:relative;cursor:pointer;box-shadow:0 10px 0 rgba(0,0,0,.12);transition:transform .8s ease}.handle:before{content:"";width:30px;height:30px;background:var(--pink);position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}.handle:after{content:"";width:16px;height:56px;background:var(--pink);position:absolute;left:50%;top:13px;border-radius:999px;transform:translateX(-50%)}.handle.spin{transform:rotate(720deg)}
.capsule{position:absolute;left:50%;bottom:78px;width:72px;height:54px;display:grid;place-items:center;opacity:0;background:#fff7b8;border:5px solid white;border-radius:999px;font-size:30px;transform:translate(-50%,-70px) scale(.2)}.capsule.show{animation:drop .85s ease forwards}@keyframes drop{0%{opacity:0;transform:translate(-50%,-90px) scale(.2) rotate(-30deg)}70%{opacity:1;transform:translate(-50%,16px) scale(1.1) rotate(12deg)}100%{opacity:1;transform:translate(-50%,0) scale(1) rotate(0deg)}}
.tray{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);width:230px;height:58px;background:white;border-radius:20px;display:grid;place-items:center;color:var(--dark);font-weight:1000;box-shadow:inset 0 7px 0 rgba(0,0,0,.08)}
.panel{display:grid;gap:18px}.card{background:var(--paper);border:3px solid white;border-radius:30px;padding:24px;box-shadow:0 18px 38px rgba(150,75,95,.14)}label{display:block;font-weight:900;margin:12px 0 8px}input,select{width:100%;border:2px solid var(--line);outline:none;border-radius:17px;padding:14px 16px;background:white;font-size:16px}input:focus,select:focus{border-color:var(--pink)}
.main-btn,.soft-btn,.danger-btn{width:100%;border:0;border-radius:18px;padding:15px 18px;margin-top:14px;font-size:18px;font-weight:1000;cursor:pointer}.main-btn{color:white;background:linear-gradient(180deg,#ff91a6,#ef5874);box-shadow:0 8px 0 #cc4056}.main-btn:active{transform:translateY(5px);box-shadow:0 3px 0 #cc4056}.soft-btn{color:var(--dark);background:var(--cream);border:2px solid #ffd884}.danger-btn{color:white;background:#b93d4c}
.result{min-height:150px;margin-top:18px;display:grid;place-items:center;text-align:center;background:white;border:3px dashed var(--line);border-radius:24px;padding:18px}.result.loading{animation:pulse .65s infinite alternate}@keyframes pulse{from{opacity:.55;transform:scale(.99)}to{opacity:1;transform:scale(1.01)}}.icon{font-size:46px}.result h3,.result p{margin:3px 0}
.grid2,.admin-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.list,.admin-list{display:grid;gap:9px}.item{background:#fffaf7;border:1px dashed var(--line);border-radius:15px;padding:11px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:15px}.item small{color:#9b7474}.admin-row{background:#fffaf7;border:1px dashed var(--line);border-radius:17px;padding:12px;display:grid;grid-template-columns:70px 1fr 80px 95px 120px 60px;gap:8px;align-items:center}.admin-row button{border:0;background:var(--dark);color:white;padding:12px 8px;border-radius:13px;font-weight:900;cursor:pointer}.full{grid-column:1/-1}.hidden{display:none!important}.login-box{max-width:520px;margin:auto}.history-box{max-height:360px;overflow:auto}
.coupon-card{margin-top:18px;background:linear-gradient(135deg,#fff,#fff0f5);border:3px solid #fff;border-radius:24px;padding:18px;box-shadow:0 10px 25px rgba(218,66,96,.15)}.coupon-top{display:flex;gap:12px;align-items:center}.coupon-top span{font-size:46px}.coupon-top h3,.coupon-top p{margin:0}.fake-qr{width:118px;height:118px;margin:16px auto;background:repeating-linear-gradient(45deg,#222 0 7px,#fff 7px 14px);border:10px solid white;box-shadow:0 0 0 2px #222}
@media(max-width:920px){.hero{display:block;text-align:center}nav{justify-content:center;margin-top:12px}.layout,.admin-layout,.grid2{grid-template-columns:1fr}.machine{transform:scale(.92);margin:-22px 0 -24px}.admin-row{grid-template-columns:1fr}}
@media print{body *{visibility:hidden}.coupon-card,.coupon-card *{visibility:visible}.coupon-card{position:absolute;left:0;top:0;width:100%;box-shadow:none}}