@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Barlow+Condensed:wght@600;700&display=swap');
/* Font judul: kalau ada file title.woff2 / title.ttf / title.otf di folder ini, otomatis dipakai. Kalau tidak ada, pakai Anton. */
@font-face{font-family:'EventTitle';src:url('title.woff2') format('woff2'),url('title.ttf') format('truetype'),url('title.otf') format('opentype');font-display:swap}
:root{--bg:#000;--tx:#f1efe9;--mut:#8a8a85;--line:#262626;--ac:#e5383b;--ok:#3ecf8e;--warn:#f0b429;--bad:#ff5a5f}
*{box-sizing:border-box;border-radius:0}
body{margin:0;background:var(--bg);color:var(--tx);font:400 17px/1.5 'Barlow',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:440px;margin:0 auto;padding:32px 22px 80px}
.logo{display:block;width:100%;max-width:300px;margin:0 auto;mix-blend-mode:lighten}
.pres{text-align:center;margin:14px 0 2px;font-size:12px;font-weight:600;letter-spacing:.6em;text-indent:.6em;color:var(--mut)}
h1{font:700 44px/1.1 'EventTitle','Barlow Condensed',Impact,sans-serif;letter-spacing:.01em;text-align:center;margin:0 0 6px;text-transform:uppercase}
h1.hero{font-size:clamp(30px,11.5vw,48px);line-height:1.15;margin:6px 0 10px;white-space:nowrap}
.sub{color:var(--mut);margin:0 0 22px;text-align:center;font-size:15px}
.info{margin:26px 0 8px;border-top:2px solid var(--tx)}
.item{padding:14px 0;border-bottom:1px solid var(--line)}
.item small{display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:2px}
.item strong{display:block;font-size:22px;line-height:1.25;font-weight:600}
.item a{display:inline-block;margin-top:4px;font-size:14px;font-weight:500;color:var(--mut)}
.item a:hover{color:var(--tx)}
.item .price{color:var(--ac)}
.card{border-top:1px solid var(--line);padding:18px 0;margin:0}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}
.row:last-child{border-bottom:0}
.row>span:first-child{color:var(--mut);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.row>b{font-weight:600;text-align:right;font-size:19px}
label{display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin:24px 0 0}
input,select{width:100%;padding:12px 0;border:0;border-bottom:1px solid #444;background:transparent;color:var(--tx);font:500 20px 'Barlow',sans-serif;outline:0;appearance:none;-webkit-appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-position:calc(100% - 10px) 55%,calc(100% - 4px) 55%;background-size:6px 6px;background-repeat:no-repeat}
select option{background:#000;color:#fff}
input:focus,select:focus{border-bottom-color:var(--ac)}
input::placeholder{color:#555}
button,.btn{display:block;width:100%;padding:16px;border:2px solid var(--ac);background:var(--ac);color:#fff;font:700 24px 'Barlow Condensed',Impact,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-align:center;text-decoration:none;margin-top:32px}
button:hover:not(:disabled),.btn:hover{background:transparent;color:var(--ac)}
button.sec,.btn.sec{background:transparent;color:var(--tx);border:1px solid #555;font:600 15px 'Barlow',sans-serif;letter-spacing:.06em}
button.sec:hover:not(:disabled),.btn.sec:hover{border-color:#fff;background:transparent;color:var(--tx)}
button.sm{display:inline-block;width:auto;padding:6px 12px;margin:10px 8px 0 0}
td button.sm{margin:0 4px 4px 0}
button:disabled{opacity:.35;cursor:not-allowed}
.pill{display:inline-block;padding:0 8px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border:1px solid currentColor}
.pending{color:var(--warn)}.paid{color:var(--ok)}.expired,.rejected{color:var(--bad)}
.big{font:700 60px/1.05 'Barlow Condensed',Impact,sans-serif;letter-spacing:.02em;margin:4px 0 8px;color:var(--ac)}
.err{color:var(--bad);margin-top:14px;font-size:15px}
.note{color:var(--mut);font-size:14px;line-height:1.5;margin-top:18px}
.mut{color:var(--mut);font-size:15px}
.center{text-align:center}
.qr{background:#fff;padding:12px;display:inline-block;margin:10px 0}
.ticket{border:2px solid var(--tx);padding:18px;margin:18px 0;background:#000}
.ticket .adm{font-size:11px;font-weight:700;letter-spacing:.5em;color:var(--mut);border-bottom:1px dashed #555;padding-bottom:10px;margin-bottom:10px}
table{width:100%;border-collapse:collapse;font-size:15px}
td,th{padding:8px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:var(--mut);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.res{padding:22px;text-align:center;font:700 36px/1.1 'Barlow Condensed',Impact,sans-serif;letter-spacing:.05em;text-transform:uppercase;margin-top:14px;border:3px solid}
.res.valid{color:var(--ok)}.res.used{color:var(--warn)}.res.invalid{color:var(--bad)}
a{color:var(--tx)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.poster{aspect-ratio:1012/920;object-fit:cover;object-position:center top;display:block;width:calc(100% + 44px);max-width:none;margin:-32px -22px 0;-webkit-mask-image:linear-gradient(#000 62%,transparent);mask-image:linear-gradient(#000 62%,transparent)}
.poster.sm{aspect-ratio:auto;height:250px;object-fit:cover;object-position:center top;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.info{margin-top:-10px;position:relative;border-top:1px solid #333}
body{position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:-60px;z-index:-1;background:#000 url(bg.jpg?v=5) center top/cover no-repeat;filter:blur(46px) brightness(.42) contrast(1.1)}
.hello{text-align:center;margin:-6px 0 18px;font-size:17px}
.hello .st{display:block;margin-top:4px}
.st{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.st.pending,.st.checking{color:var(--warn)}.st.paid{color:var(--ok)}.st.expired,.st.rejected{color:var(--bad)}
.item .price{font-size:30px}
button.copy{display:inline-block;width:auto;margin:4px 0 0;padding:0;border:0;background:none;color:var(--mut);font:500 14px 'Barlow',sans-serif;letter-spacing:0;text-transform:none;text-decoration:underline;cursor:pointer}
button.copy:hover:not(:disabled){background:none;color:var(--tx)}
input[type=file]{border:0;padding:10px 0;font-size:15px;color:var(--mut)}
.ticket .tname{font-size:20px;font-weight:600;margin-bottom:4px}
.tag{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--ok)}
.adm-wrap{max-width:640px;padding-top:20px}
.adm-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:14px;margin-bottom:6px;border-bottom:1px solid var(--line);font-size:15px}
.adm-top a{color:var(--mut)}
.adm-top button.copy{margin:0}
.login{max-width:320px;margin:30px auto}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}
.stats div{padding:10px 0}
.stats strong{display:block;font:700 34px/1 'Barlow Condensed',sans-serif}
.stats small{color:var(--mut);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
button.tab{display:inline-block;width:auto;margin:0;padding:7px 12px;border:1px solid #333;background:transparent;color:var(--mut);font:600 14px 'Barlow',sans-serif;letter-spacing:0;text-transform:none}
button.tab.on,button.tab:hover:not(:disabled){border-color:var(--tx);color:var(--tx);background:transparent}
.ord{padding:14px 0;border-bottom:1px solid var(--line)}
.ord-h{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:18px}
.acts{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:8px;font-size:14px}
.acts a{color:var(--mut)}
.acts button.sm{margin:0;padding:7px 14px;font:700 14px 'Barlow',sans-serif;letter-spacing:.04em;text-transform:none}
.acts button.copy{margin:0}
.lb{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 12px 24px;overflow:auto}
.lb[hidden]{display:none}
.lb img{max-width:100%;max-height:calc(100vh - 110px);object-fit:contain;cursor:zoom-in;background:#111}
.lb.zoom{justify-content:flex-start;align-items:flex-start}
.lb.zoom img{max-width:none;max-height:none;width:220%;cursor:zoom-out}
.lb-cap{color:var(--tx);font-weight:600;margin-bottom:10px}
.lb-hint{color:var(--mut);font-size:13px;margin-top:8px}
.lb.zoom .lb-cap,.lb.zoom .lb-hint{display:none}
button.lb-x{position:fixed;top:8px;right:12px;width:auto;margin:0;padding:4px 12px;border:0;background:none;color:#fff;font:400 36px/1 'Barlow',sans-serif;z-index:51}
button.lb-x:hover:not(:disabled){background:none;color:var(--ac)}