*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,'Noto Sans Thai',sans-serif;color:#fff;background:#08030f}a{text-decoration:none;color:inherit}button,input,textarea{font:inherit}.bg{min-height:100vh;background:radial-gradient(circle at 15% 10%,rgba(255,60,170,.38),transparent 32%),radial-gradient(circle at 88% 18%,rgba(110,42,255,.45),transparent 34%),linear-gradient(135deg,#07000c,#180821 48%,#09020f);position:relative;overflow-x:hidden}.bg:before{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(#000,transparent 85%);pointer-events:none}.wrap{width:min(1180px,94vw);margin:auto}.hero{min-height:100vh;display:grid;place-items:center;text-align:center;padding:34px 0}.logo{width:min(520px,82vw);filter:drop-shadow(0 0 24px rgba(255,54,166,.7)) drop-shadow(0 18px 40px rgba(0,0,0,.45))}.tag{font-size:clamp(20px,4vw,42px);font-weight:900;margin:20px 0 8px;text-shadow:0 0 22px #ff3cab}.sub{opacity:.82;font-size:18px}.btn{border:0;border-radius:999px;padding:13px 24px;font-weight:900;cursor:pointer;display:inline-flex;gap:8px;align-items:center;justify-content:center;background:linear-gradient(90deg,#ff3cab,#7c3cff);color:white;box-shadow:0 0 24px rgba(255,60,171,.55);transition:.18s}.btn:hover{transform:translateY(-2px)}.btn.dark{background:rgba(255,255,255,.11);box-shadow:none;border:1px solid rgba(255,255,255,.18)}.btn.ok{background:linear-gradient(90deg,#10b981,#77ffcb)}.btn.no{background:linear-gradient(90deg,#ef4444,#ff8b8b)}.quick{position:fixed;right:18px;top:18px;display:flex;gap:10px;z-index:10}.section{padding:70px 0}.section h1{text-align:center;font-size:clamp(30px,5vw,58px);margin:0 0 28px;text-shadow:0 0 22px #ff3cab}.templates{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{min-height:210px;border-radius:28px;padding:18px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.09);backdrop-filter:blur(14px);position:relative;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35)}.card:after{content:'';position:absolute;inset:auto -20% -45% -20%;height:90%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 58%);transform:rotate(-10deg)}.card .emoji{font-size:42px}.card h3{font-size:23px;margin:18px 0 6px}.card p{opacity:.78;margin:0 0 18px;min-height:42px}.pick{position:absolute;left:18px;right:18px;bottom:16px;z-index:2}.tpl-neon{background:linear-gradient(135deg,rgba(255,45,171,.28),rgba(58,28,255,.25))}.tpl-romance{background:linear-gradient(135deg,rgba(255,108,180,.35),rgba(255,207,231,.16))}.tpl-kiss{background:linear-gradient(135deg,rgba(207,0,85,.35),rgba(255,80,120,.16))}.tpl-whisper{background:linear-gradient(135deg,rgba(85,37,180,.32),rgba(255,255,255,.08))}.tpl-heartbeat{background:linear-gradient(135deg,rgba(255,26,92,.32),rgba(123,34,255,.20))}.tpl-dark{background:linear-gradient(135deg,rgba(17,5,22,.9),rgba(135,13,72,.32))}.tpl-blur{background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,0,170,.16))}.tpl-type{background:linear-gradient(135deg,rgba(0,0,0,.55),rgba(39,235,255,.12))}.tpl-frame{background:linear-gradient(135deg,rgba(255,98,0,.25),rgba(255,0,200,.25))}.tpl-float{background:linear-gradient(135deg,rgba(126,58,242,.24),rgba(236,72,153,.24))}.tpl-stage{background:linear-gradient(135deg,#2d22e8,#ff3cab)}.tpl-soft{background:linear-gradient(135deg,rgba(255,61,113,.3),rgba(255,255,255,.12))}.formbox,.panel{width:min(760px,94vw);margin:34px auto;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:28px;padding:26px;backdrop-filter:blur(18px);box-shadow:0 22px 70px rgba(0,0,0,.42)}.panel{width:min(1200px,96vw)}label{display:block;margin:14px 0 8px;font-weight:900}input,textarea,select{width:100%;border:1px solid rgba(255,255,255,.20);border-radius:18px;background:rgba(0,0,0,.32);color:#fff;padding:14px 16px;outline:none}textarea{min-height:160px;resize:vertical}.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.preview{margin-top:18px;border-radius:24px;padding:24px;text-align:center;min-height:150px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.15)}.preview b{font-size:clamp(26px,4vw,48px);line-height:1.15}.muted{opacity:.7}.nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0}.brand{font-weight:900;font-size:24px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;background:rgba(0,0,0,.25);border-radius:18px;overflow:hidden}.table th,.table td{padding:13px;border-bottom:1px solid rgba(255,255,255,.12);text-align:left;vertical-align:top}.badge{border-radius:999px;padding:6px 11px;background:rgba(255,255,255,.14);font-weight:900;white-space:nowrap}.screen{margin:0;min-height:100vh;background:#00ff00;overflow:hidden}.stage{position:relative;width:100vw;height:100vh;background:#00ff00}.show-logo{position:absolute;left:28px;top:20px;width:min(280px,28vw);filter:drop-shadow(0 8px 20px rgba(0,0,0,.25));z-index:2}.display-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1050px,86vw);min-height:420px;border-radius:46px;padding:44px;display:grid;place-items:center;text-align:center;color:white;background:linear-gradient(135deg,#150018,#421056);box-shadow:0 0 70px rgba(255,45,171,.9),0 30px 90px rgba(0,0,0,.45);border:3px solid rgba(255,255,255,.28);animation:pop .6s ease}.display-card .d-emoji{font-size:84px;filter:drop-shadow(0 0 20px #fff)}.display-card .message{font-size:clamp(42px,7vw,92px);font-weight:1000;line-height:1.12;text-shadow:0 0 24px rgba(255,255,255,.45);word-break:break-word}.display-card .sender{font-size:clamp(22px,3vw,40px);margin-top:24px;color:#ffeb3b;font-weight:900}.display-card.tpl-kiss:before,.display-card.tpl-soft:before{content:'💋';position:absolute;right:48px;top:28px;font-size:90px;transform:rotate(-12deg)}.display-card.tpl-heartbeat{animation:pop .5s ease,beat 1.2s infinite}.display-card.tpl-blur .message{animation:unblur 2.2s ease}.display-card.tpl-type .message{border-right:6px solid #fff;animation:cursor .7s infinite}.display-card.tpl-stage{background:#3c2be6;border:6px solid #111;box-shadow:12px 14px 0 rgba(0,0,0,.65)}.display-card.tpl-frame{box-shadow:0 0 0 8px #ff3cab,0 0 55px #ff3cab,0 0 90px #7c3cff;background:#09020f}.display-card.tpl-romance{background:linear-gradient(135deg,#ff4dae,#7c3cff)}.display-card.tpl-dark{background:linear-gradient(135deg,#060006,#3d001f)}.display-card.tpl-whisper{background:rgba(20,0,35,.82);backdrop-filter:blur(18px)}.display-card.tpl-float{animation:pop .5s ease,floaty 4s infinite ease-in-out}.wait{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(34px,5vw,72px);font-weight:900;color:#111}.ticker{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#111;font-weight:900;font-size:24px}.qrbox{position:absolute;right:24px;bottom:24px;background:white;color:#111;border-radius:18px;padding:14px;font-weight:900;text-align:center}.qrbox img{width:132px;height:132px;display:block}.toast{padding:13px 16px;border-radius:16px;margin:12px 0;background:rgba(16,185,129,.18);border:1px solid rgba(16,185,129,.45)}.toast.err{background:rgba(239,68,68,.18);border-color:rgba(239,68,68,.45)}@keyframes pop{from{opacity:0;transform:translate(-50%,-50%) scale(.82)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes beat{50%{transform:translate(-50%,-50%) scale(1.035)}}@keyframes unblur{from{filter:blur(18px);opacity:.2}to{filter:blur(0);opacity:1}}@keyframes cursor{50%{border-color:transparent}}@keyframes floaty{50%{margin-top:-28px}}@media(max-width:900px){.templates{grid-template-columns:repeat(2,1fr)}.quick{position:static;justify-content:center;padding-top:18px}.display-card{min-height:340px;padding:28px}.show-logo{width:180px}}@media(max-width:560px){.templates{grid-template-columns:1fr}.row{display:block}.row .btn{margin-top:8px;width:100%}.table th:nth-child(1),.table td:nth-child(1){display:none}}

/* V2 BEAUTY UPGRADE */
body{letter-spacing:.1px}.bg{background:radial-gradient(circle at 16% 8%,rgba(255,0,142,.42),transparent 28%),radial-gradient(circle at 78% 12%,rgba(255,217,92,.18),transparent 25%),radial-gradient(circle at 88% 72%,rgba(105,42,255,.38),transparent 35%),linear-gradient(135deg,#050007,#160019 45%,#080010)}
.bg:after{content:'LOVE • SECRET • NIGHT •';position:fixed;left:-5vw;bottom:8vh;font-size:12vw;font-weight:1000;letter-spacing:.12em;color:rgba(255,255,255,.025);white-space:nowrap;pointer-events:none;transform:rotate(-8deg)}
.logo{animation:logoGlow 3.5s ease-in-out infinite}.card{transition:.25s transform,.25s box-shadow}.card:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 25px 70px rgba(255,34,166,.28),0 18px 50px rgba(0,0,0,.45)}
.card h3{letter-spacing:.02em}.card:before{content:'';position:absolute;inset:-2px;border-radius:30px;padding:2px;background:linear-gradient(135deg,rgba(255,255,255,.6),rgba(255,50,174,.6),rgba(124,60,255,.55),rgba(255,214,90,.45));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.55;pointer-events:none}.card .emoji{filter:drop-shadow(0 0 16px rgba(255,255,255,.55))}.tpl-glass{background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,42,170,.14));box-shadow:inset 0 0 50px rgba(255,255,255,.08),0 20px 60px rgba(0,0,0,.35)}.tpl-gold{background:linear-gradient(135deg,rgba(255,214,90,.28),rgba(255,50,166,.22),rgba(48,8,82,.55))}.tpl-neon{background:linear-gradient(135deg,rgba(255,0,153,.42),rgba(90,35,255,.34))}.tpl-stage{background:linear-gradient(135deg,#ff2cae 0%,#3c2be6 52%,#00ffd5 120%)}
.formbox,.panel{box-shadow:0 22px 90px rgba(255,0,153,.18),0 30px 90px rgba(0,0,0,.48)}input:focus,textarea:focus{border-color:#ff3cab;box-shadow:0 0 0 4px rgba(255,60,171,.15),0 0 25px rgba(255,60,171,.18)}
.display-card.tpl-glass{background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,50,174,.22));backdrop-filter:blur(16px);box-shadow:0 0 70px rgba(255,255,255,.35),0 0 110px rgba(255,50,174,.65)}.display-card.tpl-gold{background:linear-gradient(135deg,#241000,#5f0039 44%,#120022);border-color:#ffd95c;box-shadow:0 0 0 7px rgba(255,217,92,.45),0 0 70px rgba(255,217,92,.55),0 0 120px rgba(255,44,174,.55)}.display-card.tpl-neon .message,.display-card.tpl-frame .message{color:#fff;text-shadow:0 0 12px #fff,0 0 28px #ff2cae,0 0 55px #7c3cff}.display-card.tpl-gold .message{color:#fff7c2;text-shadow:0 0 18px rgba(255,217,92,.8),0 0 44px rgba(255,44,174,.65)}.display-card.tpl-soft .message{color:#ffe3f1}.display-card.tpl-stage .message{text-shadow:6px 6px 0 rgba(0,0,0,.38),0 0 24px rgba(255,255,255,.32)}
@keyframes logoGlow{0%,100%{filter:drop-shadow(0 0 18px rgba(255,54,166,.65)) drop-shadow(0 18px 40px rgba(0,0,0,.45))}50%{filter:drop-shadow(0 0 34px rgba(255,54,166,.95)) drop-shadow(0 0 26px rgba(124,60,255,.75)) drop-shadow(0 18px 40px rgba(0,0,0,.45))}}
