*{box-sizing:border-box} :root{--ink:#172a2a;--cream:#f7f3e9;--paper:#fffdf7;--mint:#a9e6d1;--teal:#3b9f88;--yellow:#ffd76a;--blue:#b9d9ee;--line:3px solid var(--ink);--shadow:6px 6px 0 var(--ink)} body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,22px);border-bottom:2px solid var(--ink);background:var(--paper)}.brand{display:flex;align-items:center;gap:10px;font:700 21px "Space Grotesk";letter-spacing:-.8px}.brand-mark{width:34px;height:34px;border:2px solid var(--ink);background:var(--yellow);display:grid;place-items:center;border-radius:10px;box-shadow:2px 2px 0 var(--ink)}.brand-dot,.highlight{color:var(--teal)}nav{display:flex;gap:28px;font-weight:700;font-size:14px}nav a:hover,.back-link:hover{color:var(--teal)}.page{max-width:1160px;margin:auto;padding:42px 24px 80px}.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;min-height:360px;padding:30px 5% 50px;background:var(--mint);border:var(--line);border-radius:28px;box-shadow:var(--shadow);overflow:hidden}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#54736b}.eyebrow-dot{display:inline-block;width:8px;height:8px;background:var(--teal);border-radius:50%;margin-right:6px}.hero h1,.admin-head h1,.auth-card h1,.form-page h1,.verify-card h1{font:700 clamp(38px,5vw,60px)/1.04 "Space Grotesk";letter-spacing:-2.5px;margin:18px 0}.hero-copy p{max-width:460px;line-height:1.7;color:#38554e;margin-bottom:25px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:13px 19px;border:2px solid var(--ink);border-radius:12px;font-weight:800;font-size:13px;cursor:pointer;transition:transform .18s,box-shadow .18s;box-shadow:3px 3px 0 var(--ink)}.button:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}.button:disabled{opacity:.55;cursor:not-allowed;transform:none}.button-dark{background:var(--ink);color:white}.button-teal{background:var(--teal);color:white}.button-light{background:var(--paper)}.button-full{width:100%}.hero-art{height:275px;position:relative;display:grid;place-items:center}.sun{position:absolute;width:220px;height:220px;background:var(--yellow);border:var(--line);border-radius:50%;right:15%;top:12px}.gift{position:absolute;z-index:1;display:grid;place-items:center;border:var(--line);border-radius:25px;box-shadow:var(--shadow);font-size:74px}.gift-one{width:155px;height:155px;background:#fff8e6;transform:rotate(-9deg);right:29%;top:55px}.gift-two{width:82px;height:82px;background:var(--blue);font-size:40px;right:8%;bottom:25px;transform:rotate(11deg)}.scribble{position:absolute;z-index:2;left:1%;top:20px;font:700 24px/1 "Space Grotesk";transform:rotate(-12deg);color:#d56b4e;text-shadow:1px 1px white}.spark{position:absolute;right:5%;top:8px;font-size:42px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:68px 0 22px}.section-heading h2,.past-section h2{font:700 32px "Space Grotesk";margin:8px 0 0;letter-spacing:-1.3px}.live-pill,.tag,.status{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--ink);border-radius:30px;padding:7px 11px;font-size:10px;font-weight:800;background:var(--paper)}.live-pill i{width:7px;height:7px;background:var(--teal);border-radius:50%}.giveaway-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:22px}.giveaway-card,.side-card,.mini-card,.stat-card,.auth-card,.form-page,.verify-card{background:var(--paper);border:var(--line);border-radius:22px;box-shadow:var(--shadow)}.giveaway-card{padding:27px}.card-top,.side-top{display:flex;justify-content:space-between;align-items:center}.tag{background:var(--yellow);border:1px solid var(--ink);padding:6px 10px}.card-number{font:700 12px "Space Grotesk";color:#82928c}.giveaway-card h3{font:700 30px "Space Grotesk";letter-spacing:-1px;margin:22px 0 7px}.muted{color:#70817b;line-height:1.6;font-size:14px}.prize-panel{display:flex;align-items:center;gap:15px;background:#f1f8f1;border:2px dashed #7ba99a;border-radius:15px;padding:14px;margin:25px 0}.prize-icon{font-size:31px}.prize-panel small,.stats small,.stat-card small{display:block;font-size:9px;letter-spacing:1px;font-weight:800;color:#74847e}.prize-panel strong{display:block;font:700 17px "Space Grotesk";margin-top:4px}.prize-qty{margin-left:auto;text-align:right}.prize-qty strong{font-size:24px}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #e6e8df;padding:0 0 20px}.stats>div+div{border-left:1px solid #e6e8df;padding-left:20px}.stats strong{font:700 24px "Space Grotesk";display:block;margin-bottom:3px}.deadline{display:flex;justify-content:space-between;align-items:center;padding:19px 0}.deadline strong{display:block;font:700 19px "Space Grotesk";margin-top:5px}.deadline-icon{font-size:30px}.join-form label,.stack-form label{display:block;font-size:12px;font-weight:800;margin-bottom:8px}.join-row{display:flex;gap:10px}.join-row input,.stack-form input,.stack-form textarea{min-width:0;width:100%;border:2px solid #cbd6ce;background:#fff;border-radius:10px;padding:13px 14px;outline:none}.join-row input:focus,.stack-form input:focus,.stack-form textarea:focus{border-color:var(--teal)}.join-row .button{white-space:nowrap}.form-message,.form-hint{font-size:11px;color:#80908a;margin:10px 0 0}.form-message.success{color:#23836e}.form-message.error,.error-box{color:#b34d3b}.closed-note{padding:14px;background:#fff3d2;border:1px solid #e7c76d;border-radius:10px;font-size:12px;font-weight:700}.side-card{padding:25px;position:relative;overflow:hidden;background:#e7f1ed;display:flex;flex-direction:column;align-items:center}.tiny-star{font-size:25px;color:var(--teal)}.spinner-wrap{position:relative;width:235px;height:235px;margin:20px auto 10px;display:grid;place-items:center}.spinner{width:205px;height:205px;border:8px solid var(--ink);border-radius:50%;background:conic-gradient(var(--yellow) 0 60deg,var(--mint) 60deg 120deg,var(--blue) 120deg 180deg,#f4c5a9 180deg 240deg,var(--mint) 240deg 300deg,var(--yellow) 300deg);display:grid;place-items:center;box-shadow:inset 0 0 0 7px var(--paper),5px 5px 0 var(--ink);position:relative;transition:transform .3s}.spinner:before{content:"";position:absolute;inset:25px;border:2px dashed #4d7168;border-radius:50%}.spinner span{font:700 16px "Space Grotesk";background:var(--paper);border:2px solid var(--ink);border-radius:10px;padding:9px;z-index:1;max-width:150px;overflow:hidden;text-overflow:ellipsis}.spinner-pointer{position:absolute;top:-5px;z-index:3;color:var(--ink);font-size:25px;text-shadow:1px 2px white}.spinner-center{position:absolute;bottom:9px;background:var(--ink);color:white;border:3px solid var(--paper);border-radius:50%;width:43px;height:43px;display:grid;place-items:center;font:700 11px "Space Grotesk";z-index:2}.spin-caption{text-align:center;font-size:11px;color:#667d74;max-width:270px;line-height:1.6}.side-foot{font-size:9px;letter-spacing:1.5px;font-weight:800;margin-top:auto;padding-top:15px}.side-foot span{color:#d28e34}.winner-list{width:100%;display:grid;gap:7px}.winner-item{padding:10px;background:#fffdf7;border:1.5px solid var(--ink);border-radius:9px;font-size:12px}.winner-item small{display:block;margin-top:4px;color:#73817c;font-size:10px}.winner-stop{transform:rotate(4deg)}.winner-burst{position:absolute;top:12px;right:-4px;background:var(--yellow);border:3px solid var(--ink);padding:8px 12px;font:700 17px "Space Grotesk";transform:rotate(9deg);box-shadow:3px 3px 0 var(--ink);animation:pop .35s ease-out}@keyframes pop{from{transform:scale(.4) rotate(-20deg)}to{transform:scale(1) rotate(9deg)}}.empty-state{text-align:center;padding:65px 20px;background:var(--paper);border:var(--line);border-radius:22px;box-shadow:var(--shadow)}.empty-state>div{font-size:48px}.empty-state h3,.empty-state h1{font:700 27px "Space Grotesk"}.past-section{margin-top:70px}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:20px}.mini-card{padding:20px;box-shadow:3px 3px 0 var(--ink)}.mini-card h3{font:700 18px "Space Grotesk"}.mini-card p,.mini-card small{color:#71817b;font-size:12px}.modal-backdrop{display:none;position:fixed;inset:0;z-index:20;background:#172a2a99;align-items:center;justify-content:center;padding:20px}.modal-backdrop.show{display:flex;animation:fade .2s ease}@keyframes fade{from{opacity:0}to{opacity:1}}.modal-card{width:min(420px,100%);padding:32px;background:var(--paper);border:3px solid var(--ink);border-radius:24px;box-shadow:8px 8px 0 var(--yellow);text-align:center}.modal-icon{margin:0 auto 12px;width:48px;height:48px;border:2px solid var(--ink);border-radius:15px;background:var(--yellow);display:grid;place-items:center;font-size:25px}.modal-card h2{font:700 29px/1.15 "Space Grotesk";letter-spacing:-1px}.modal-card p{font-size:13px;color:#71817b;line-height:1.6;margin-bottom:22px}.modal-card .button{margin-top:10px}.modal-small{display:block;color:#9aa49e;font-size:10px;margin-top:15px}.footer{text-align:center;padding:24px;font-size:11px;color:#819089}.footer span{color:#d56b4e}.auth-card,.form-page,.verify-card{max-width:560px;margin:40px auto;padding:32px}.auth-card h1,.form-page h1,.verify-card h1{font-size:40px}.stack-form{display:grid;gap:17px;margin-top:25px}.stack-form label input,.stack-form label textarea{display:block;margin-top:8px}.stack-form textarea{resize:vertical}.back-link{display:inline-block;font-size:12px;font-weight:800;margin:0 0 25px}.error-box{padding:12px;background:#ffefeb;border:1px solid #efb9ad;border-radius:9px;font-size:12px;margin:15px 0}.admin-head{display:flex;justify-content:space-between;align-items:center}.admin-head h1{font-size:42px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:25px 0 40px}.stat-card{padding:19px;box-shadow:3px 3px 0 var(--ink)}.stat-card strong{display:block;font:700 32px "Space Grotesk";margin-top:9px}.admin-toolbar{display:flex;justify-content:space-between;align-items:center;margin:25px 0 15px}.admin-toolbar h2{font:700 22px "Space Grotesk"}.toolbar-actions{display:flex;gap:10px}.table-wrap{overflow-x:auto;border:var(--line);border-radius:16px;background:var(--paper);box-shadow:4px 4px 0 var(--ink)}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;min-width:680px}th{background:#e7f1ed;font-size:10px;letter-spacing:.8px;text-transform:uppercase}th,td{padding:15px;border-bottom:1px solid #e8e9e1}td strong,td small{display:block}td small{color:#89948e;margin-top:4px}.action-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.action-links a,.text-button{font-size:11px;font-weight:800;color:#328d79}.text-button{border:0;background:none;padding:0;cursor:pointer}.text-button.danger{color:#bc5747}.empty-cell{text-align:center;color:#87938d;padding:30px}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-hint{line-height:1.6}.verify-card{max-width:600px}.winner-result{margin-top:25px;padding:20px;background:#e7f1ed;border:2px solid var(--ink);border-radius:14px}.winner-result h2{font:700 24px "Space Grotesk"}.winner-result p{font-size:13px}.winner-result .button{margin-top:10px}
@media(max-width:800px){.hero{grid-template-columns:1fr;padding:30px 25px}.hero-art{height:220px}.giveaway-layout{grid-template-columns:1fr}.side-card{min-height:410px}.stats-grid{grid-template-columns:repeat(2,1fr)}.mini-grid{grid-template-columns:1fr 1fr}.admin-toolbar{align-items:flex-start;gap:15px;flex-direction:column}.admin-head h1{font-size:34px}}
@media(max-width:520px){.topbar{height:65px;padding:0 18px}nav{gap:15px;font-size:12px}.page{padding:25px 16px 55px}.hero{border-radius:20px;box-shadow:4px 4px 0 var(--ink)}.hero h1{font-size:43px}.hero-art{height:190px}.sun{width:170px;height:170px}.gift-one{width:125px;height:125px;font-size:60px;right:30%}.gift-two{width:65px;height:65px;font-size:32px}.section-heading{margin-top:52px;align-items:flex-start;gap:10px;flex-direction:column}.section-heading h2,.past-section h2{font-size:27px}.giveaway-card{padding:20px}.giveaway-card h3{font-size:25px}.join-row{flex-direction:column}.join-row .button{width:100%}.mini-grid{grid-template-columns:1fr}.stats strong{font-size:21px}.stats>div+div{padding-left:12px}.stats small{font-size:8px}.auth-card,.form-page,.verify-card{padding:23px;margin:20px auto}.two-fields{grid-template-columns:1fr}.admin-head{align-items:flex-start}.admin-head h1{font-size:31px}.toolbar-actions{flex-wrap:wrap}.modal-card{padding:26px 22px}.live-pill{font-size:9px}}

/* Registration privacy + synced draw phases */
.field-gap{margin-top:14px}
.join-form>input:not([type="hidden"]){display:block;margin-top:7px;width:100%;border:2px solid #cbd6ce;background:#fff;border-radius:10px;padding:13px 14px;outline:none}
.join-form>input:focus{border-color:var(--teal)}
.join-submit{margin-top:16px}
.privacy-note{margin:8px 0 0;color:#87958e;font-size:10px;line-height:1.5}
.registration-locked{display:flex;align-items:center;gap:13px;padding:15px;background:#e9f7ef;border:2px solid var(--ink);border-radius:13px;box-shadow:3px 3px 0 var(--ink)}
.registration-locked strong,.registration-locked small{display:block}
.registration-locked strong{font:700 15px "Space Grotesk"}
.registration-locked small{color:#657a70;font-size:11px;line-height:1.5;margin-top:3px}
.lock-mark{flex:0 0 34px;width:34px;height:34px;border:2px solid var(--ink);border-radius:50%;background:var(--mint);display:grid;place-items:center;font-weight:900}
.table-warning{max-width:230px;color:#a65b25!important;line-height:1.4}
.notice{margin:0 0 22px;padding:12px 15px;background:#fff1cb;border:2px solid var(--ink);border-radius:12px;font-size:12px;font-weight:700;box-shadow:3px 3px 0 var(--ink)}
.winner-item{box-shadow:2px 2px 0 var(--ink)}
.winner-burst{background:var(--yellow);color:var(--ink);border:3px solid var(--ink);border-radius:8px;padding:8px 12px;font-size:17px;letter-spacing:.4px;box-shadow:4px 4px 0 var(--ink);text-shadow:1px 1px #fff}
.spinner{will-change:transform}
@media(max-width:520px){
  .join-form>input:not([type="hidden"]){width:100%}
  .registration-locked{align-items:flex-start}
  .winner-item{overflow-wrap:anywhere}
}

/* ===== Polesan tampilan (v2) ===== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
.page{width:100%;flex:1}
.topbar{position:sticky;top:0;z-index:10}
nav a{padding:6px 2px;border-bottom:3px solid transparent}
nav a.active{border-bottom-color:var(--teal)}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:8px}
::selection{background:var(--yellow)}
.button:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}
.join-form input{display:block;width:100%;border:2px solid #cbd6ce;background:#fff;border-radius:10px;padding:13px 14px;outline:none;margin-bottom:4px;font-size:16px}
.join-form input:focus{border-color:var(--teal);box-shadow:0 0 0 4px #3b9f8826}
.join-form .field-gap{margin-top:14px}
.join-form .join-submit{margin-top:16px}
.stack-form input,.stack-form textarea,.join-row input{font-size:16px}
#countdown{font-variant-numeric:tabular-nums}
.giveaway-card,.side-card,.mini-card,.stat-card{transition:transform .2s,box-shadow .2s}
.mini-card:hover,.stat-card:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.winner-item{animation:pop2 .35s ease-out}
@keyframes pop2{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.notice{max-width:1160px}
.registration-locked{display:flex;gap:12px;align-items:center}
tbody tr:nth-child(even){background:#fbfaf3}
tbody tr:hover{background:#f1f8f1}
code{font-family:"Space Grotesk",monospace;background:#e7f1ed;border:1.5px solid var(--ink);border-radius:7px;padding:3px 8px;font-weight:700;letter-spacing:1px}
.empty-state{max-width:640px;margin:20px auto}
.empty-state p{color:#70817b;line-height:1.6}
.empty-state .button{margin-top:10px}
.error-box{font-weight:700}
.form-message.success,.form-message.error{font-weight:700}
.footer{padding:28px 24px 34px}
@media(max-width:800px){
  .section-heading{flex-direction:column;align-items:flex-start;gap:14px}
  .stats strong{font-size:20px}
  .admin-head{flex-direction:column;align-items:flex-start;gap:14px}
  .toolbar-actions{flex-wrap:wrap}
  .two-fields{grid-template-columns:1fr}
}
@media(max-width:520px){
  .giveaway-card{padding:20px}
  .giveaway-card h3{font-size:25px}
  .mini-grid,.stats-grid{grid-template-columns:1fr}
  .stats>div+div{padding-left:12px}
  .prize-panel{flex-wrap:wrap}
  .auth-card,.form-page,.verify-card{padding:22px;margin:20px auto}
  .join-row{flex-direction:column}
  .modal-card{padding:24px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ===== Roda undian: roda berputar, username tetap tegak & terbaca ===== */
.spinner{background:none!important;border:0!important;box-shadow:none!important;transition:none!important;transform:none!important}
.spinner:before{display:none!important}
.spinner-disc{position:absolute;inset:0;border:8px solid var(--ink);border-radius:50%;
  background:conic-gradient(var(--yellow) 0 45deg,var(--mint) 45deg 90deg,var(--blue) 90deg 135deg,#f4c5a9 135deg 180deg,var(--yellow) 180deg 225deg,var(--mint) 225deg 270deg,var(--blue) 270deg 315deg,#f4c5a9 315deg 360deg);
  box-shadow:inset 0 0 0 7px var(--paper),5px 5px 0 var(--ink);will-change:transform}
.spinner-disc:before{content:"";position:absolute;inset:25px;border:2px dashed #4d7168;border-radius:50%}
.spinner.spinning .spinner-disc{filter:saturate(1.2)}
.spinner span#spinner-name{position:relative;z-index:2;min-width:110px;max-width:160px;white-space:nowrap;text-align:center;font-size:15px;padding:10px 12px;box-shadow:3px 3px 0 var(--ink)}
.spinner span#spinner-name.is-winner{background:var(--yellow);animation:pop .35s ease-out}
.winner-stop{transform:none!important}