@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;900&family=Crimson+Pro:ital,wght@0,300;0,400;0,600;1,400&display=swap');

:root {
  --bg:#06080f;--bg-card:#0d1220;--border:#1e2a42;
  --gold:#d4a800;--gold-l:#f5c800;--gold-d:#8a6e00;--gold-bg:#1a1400;
  --cb:#6a5000;--text:#ddd4c0;--text-m:#7a7060;--text-b:#f5e8cc;
  --green:#40d090;--red:#f04060;--blue:#4080f0;
  --r:6px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:'Crimson Pro',Georgia,serif;font-size:17px;line-height:1.6;min-height:100vh;}
body::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 80% 50% at 50% -10%,#d4a80012 0%,transparent 60%);pointer-events:none;z-index:0;}

.chunjo-banner{position:relative;z-index:99;width:100%;background:linear-gradient(135deg,#1a1400,#2a2000,#1a1400);border-bottom:2px solid var(--cb);text-align:center;padding:.5rem 1rem;font-family:'Cinzel',serif;font-size:.72rem;color:#c8a000;letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:1rem;}
.flag svg{width:26px;height:18px;border:1px solid var(--cb);border-radius:2px;}

nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;height:60px;background:rgba(6,8,15,.97);border-bottom:1px solid var(--border);backdrop-filter:blur(12px);}
.nav-logo{font-family:'Cinzel',serif;font-weight:900;font-size:1.2rem;color:var(--text-b);text-decoration:none;display:flex;align-items:center;gap:.4rem;}
.nav-logo span{color:var(--gold-l);}
.nav-links{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;}
.nav-links a{color:var(--text-m);text-decoration:none;font-family:'Cinzel',serif;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;transition:color .2s;}
.nav-links a:hover,.nav-links a.active{color:var(--gold-l);}

.btn{display:inline-flex;align-items:center;gap:.3rem;padding:.55rem 1.2rem;border-radius:var(--r);font-family:'Cinzel',serif;font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:all .2s;text-decoration:none;border:none;}
.btn-gold{background:linear-gradient(135deg,#c89800,#f5c800,#c89800);background-size:200%;background-position:100%;color:#1a1000;}
.btn-gold:hover{background-position:0%;box-shadow:0 0 20px #d4a80040;}
.btn-outline{background:transparent;color:var(--gold);border:1px solid var(--gold-d);}
.btn-outline:hover{border-color:var(--gold-l);color:var(--gold-l);}
.btn-danger{background:#660000;color:#fff;}
.btn-danger:hover{background:#880000;}
.btn-success{background:#004428;color:var(--green);border:1px solid #007744;}
.btn-sm{padding:.28rem .7rem;font-size:.68rem;}
.btn-xs{padding:.18rem .5rem;font-size:.62rem;}

.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.4rem;position:relative;overflow:hidden;}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.45;}

.form-group{margin-bottom:1.1rem;}
.form-label{display:block;font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-m);margin-bottom:.35rem;}
.form-control{width:100%;padding:.6rem .85rem;background:#0a0e1a;border:1px solid var(--border);border-radius:var(--r);color:var(--text-b);font-family:'Crimson Pro',serif;font-size:1rem;transition:border-color .2s;}
.form-control:focus{outline:none;border-color:var(--gold-d);box-shadow:0 0 0 3px #d4a80018;}
.form-control option{background:var(--bg-card);}

.alert{padding:.75rem 1rem;border-radius:var(--r);margin-bottom:1rem;font-size:.9rem;}
.alert-error{background:#2a0a0a;border:1px solid #aa2222;color:#f09090;}
.alert-success{background:#0a2a18;border:1px solid #2a7a4a;color:#80d4a0;}

.badge{display:inline-block;padding:.18rem .55rem;border-radius:4px;font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.07em;text-transform:uppercase;font-weight:600;}
.b-pending{background:#3a3000;color:#f0c040;border:1px solid #6a5800;}
.b-active{background:#003020;color:var(--green);border:1px solid #006040;}
.b-done{background:#001530;color:var(--blue);border:1px solid #003080;}
.b-rejected{background:#300010;color:var(--red);border:1px solid #800030;}
.b-open{background:#003010;color:#40d060;border:1px solid #006030;}
.b-full{background:#222;color:#777;border:1px solid #444;}
.b-party{background:#1a0030;color:#c060f0;border:1px solid #5000a0;}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
@media(max-width:720px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

main{position:relative;z-index:1;}
.wrap{max-width:1060px;margin:0 auto;padding:0 1.2rem;}
.page-wrap{max-width:960px;margin:0 auto;padding:2.5rem 1.2rem;}
.section{padding:3.5rem 0;}
.section-title{font-family:'Cinzel',serif;font-size:1.8rem;font-weight:900;color:var(--text-b);text-align:center;margin-bottom:.4rem;}
.section-title span{color:var(--gold-l);}
.section-sub{text-align:center;color:var(--text-m);margin-bottom:2rem;font-style:italic;}

/* HERO */
.hero{padding:5rem 0 3rem;text-align:center;}
.hero-tag{font-family:'Cinzel',serif;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem;display:flex;align-items:center;justify-content:center;gap:.6rem;}
.hero-title{font-family:'Cinzel',serif;font-size:clamp(2.2rem,5.5vw,4rem);font-weight:900;line-height:1.1;color:var(--text-b);margin-bottom:1.2rem;text-shadow:0 0 40px #d4a80025;}
.hero-title span{color:var(--gold-l);}
.hero-sub{color:var(--text-m);font-size:1.1rem;font-style:italic;max-width:480px;margin:0 auto 2rem;}
.hero-cta{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;}
.stats-bar{display:flex;justify-content:center;gap:2.5rem;flex-wrap:wrap;padding:1.8rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:2rem 0;}
.stat{text-align:center;}
.stat-v{font-family:'Cinzel',serif;font-size:1.8rem;font-weight:900;color:var(--gold-l);}
.stat-l{font-size:.72rem;color:var(--text-m);letter-spacing:.08em;text-transform:uppercase;}

/* SLOT CARDS */
.slot-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.3rem;position:relative;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s;}
.slot-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.5;}
.slot-card:hover:not(.full){transform:translateY(-3px);border-color:var(--gold-d);box-shadow:0 6px 24px #d4a80015;}
.slot-card.party-open{border-color:#5000a0;box-shadow:0 0 0 1px #5000a055;}
.slot-card.party-open::before{background:linear-gradient(90deg,transparent,#c060f0,transparent);}
.slot-card.full{opacity:.55;}
.slot-time{font-family:'Cinzel',serif;font-size:1.6rem;font-weight:900;color:var(--text-b);line-height:1;}
.slot-approx{font-size:.75rem;color:var(--text-m);font-style:italic;margin-top:.15rem;}
.slot-by{font-size:.75rem;color:var(--text-m);margin-top:.2rem;}
.slot-players{display:flex;gap:.35rem;flex-wrap:wrap;margin:1rem 0 .8rem;}
.pdot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-family:'Cinzel',serif;}
.pdot.taken{background:#1a2a00;border:1px solid #3a5800;color:#80c040;}
.pdot.empty{background:#0a0e1a;border:1px dashed #2a3a52;color:#2a3a52;}
.slot-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;padding-top:.8rem;border-top:1px solid var(--border);}
.slot-saving{font-size:.78rem;color:var(--green);font-style:italic;}

/* EQP CARDS */
.eq-card{border:2px solid var(--border);border-radius:var(--r);padding:1.1rem;cursor:pointer;transition:all .2s;background:var(--bg-card);position:relative;}
.eq-card:hover{border-color:var(--gold-d);}
.eq-card.selected{border-color:var(--gold);background:var(--gold-bg);}
.eq-card.selected::after{content:'✓';position:absolute;top:.5rem;right:.7rem;color:var(--gold-l);font-size:1.1rem;}
.eq-title{font-family:'Cinzel',serif;font-size:.9rem;color:var(--text-b);margin-bottom:.3rem;}
.eq-bonus{color:var(--gold-l);font-size:.85rem;margin-bottom:.2rem;}
.eq-desc{color:var(--text-m);font-size:.8rem;line-height:1.4;margin-bottom:.5rem;}
.eq-price{font-family:'Cinzel',serif;font-size:.85rem;color:var(--gold-l);}
.eq-deposit{font-size:.75rem;color:var(--text-m);}

/* PKG SELECTOR */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1.2rem;}
.pkg-opt{border:2px solid var(--border);border-radius:var(--r);padding:.9rem;cursor:pointer;transition:all .2s;background:var(--bg-card);text-align:center;}
.pkg-opt:hover{border-color:var(--gold-d);}
.pkg-opt.selected{border-color:var(--gold);background:var(--gold-bg);}
.pkg-icon{font-size:1.5rem;margin-bottom:.3rem;}
.pkg-name{font-family:'Cinzel',serif;font-size:.8rem;color:var(--text-b);}
.pkg-price{color:var(--gold-l);font-size:.75rem;margin-top:.2rem;}
.pkg-save{color:var(--green);font-size:.7rem;font-style:italic;}

/* PARTY BADGE */
.party-badge{display:inline-flex;align-items:center;gap:.3rem;background:#1a0030;border:1px solid #5000a0;border-radius:4px;padding:.2rem .6rem;font-size:.72rem;color:#c060f0;font-family:'Cinzel',serif;}

/* STATUS TIMELINE */
.timeline{position:relative;padding-left:1.8rem;margin:1.5rem 0;}
.timeline::before{content:'';position:absolute;left:.45rem;top:0;bottom:0;width:2px;background:var(--border);}
.t-step{position:relative;margin-bottom:1.3rem;}
.t-step::before{content:'';position:absolute;left:-1.45rem;top:.3rem;width:11px;height:11px;border-radius:50%;background:var(--border);border:2px solid var(--border);}
.t-step.done::before{background:var(--gold);border-color:var(--gold-d);}
.t-step.active::before{background:var(--gold-l);border-color:var(--gold);box-shadow:0 0 8px var(--gold);}
.t-title{font-family:'Cinzel',serif;font-size:.88rem;color:var(--text-b);}
.t-step.done .t-title,.t-step.active .t-title{color:var(--gold-l);}
.t-desc{color:var(--text-m);font-size:.82rem;}

/* REVIEW */
.review-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.1rem;margin-bottom:.7rem;}
.stars-input{display:flex;gap:.3rem;}
.star{font-size:1.3rem;cursor:pointer;transition:transform .15s;opacity:.3;}
.star.on{opacity:1;}
.star:hover{transform:scale(1.2);}

/* ADMIN */
.tab-bar{display:flex;gap:.2rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem;}
.tab-btn{padding:.45rem 1rem;font-family:'Cinzel',serif;font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;border:none;background:transparent;color:var(--text-m);border-bottom:2px solid transparent;transition:all .15s;}
.tab-btn.active{color:var(--gold-l);border-bottom-color:var(--gold);}
.tab{display:none;}.tab.active{display:block;}

.filter-bar{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.2rem;}
.filter-btn{padding:.3rem .8rem;border-radius:4px;font-family:'Cinzel',serif;font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--text-m);transition:all .15s;}
.filter-btn.active,.filter-btn:hover{border-color:var(--gold);color:var(--gold-l);}

.slot-admin{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.1rem;margin-bottom:.7rem;position:relative;overflow:hidden;}
.slot-admin::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.35;}
.booking-row{background:#0a0e1a;border-radius:4px;padding:.45rem .75rem;margin-bottom:.3rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.4rem;font-size:.83rem;}

.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;}
th{font-family:'Cinzel',serif;font-size:.67rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-m);padding:.7rem .9rem;border-bottom:1px solid var(--border);text-align:left;}
td{padding:.7rem .9rem;border-bottom:1px solid #0d1525;font-size:.9rem;}
tr:hover td{background:#0f1825;}

.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.1rem;text-align:center;}
.stat-card-v{font-family:'Cinzel',serif;font-size:1.9rem;font-weight:900;color:var(--gold-l);}
.stat-card-l{font-size:.7rem;color:var(--text-m);letter-spacing:.08em;text-transform:uppercase;margin-top:.2rem;}
.bar-chart{display:flex;align-items:flex-end;gap:.4rem;height:100px;margin-top:.8rem;}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:.2rem;}
.bar{width:100%;background:var(--gold-d);border-radius:3px 3px 0 0;min-height:3px;}
.bar-lbl{font-size:.6rem;color:var(--text-m);text-align:center;}

/* MODAL */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);backdrop-filter:blur(4px);z-index:999;display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity .22s;}
.overlay.open{opacity:1;pointer-events:all;}
.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:1.8rem;width:100%;max-width:500px;transform:translateY(18px);transition:transform .22s;position:relative;max-height:92vh;overflow-y:auto;}
.overlay.open .modal{transform:translateY(0);}
.modal-title{font-family:'Cinzel',serif;font-size:1.2rem;color:var(--text-b);margin-bottom:1.3rem;}
.modal-close{position:absolute;top:.9rem;right:.9rem;background:none;border:none;color:var(--text-m);font-size:1.2rem;cursor:pointer;}
.modal-close:hover{color:var(--text-b);}

.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;}
.auth-box{width:100%;max-width:380px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:2.2rem;}
.auth-logo{text-align:center;font-family:'Cinzel',serif;font-size:1.3rem;font-weight:900;color:var(--text-b);margin-bottom:1.8rem;display:flex;align-items:center;justify-content:center;gap:.4rem;}
.auth-logo span{color:var(--gold-l);}

footer{position:relative;z-index:1;text-align:center;padding:1.8rem;border-top:1px solid var(--border);color:var(--text-m);font-size:.82rem;}
.spinner{width:30px;height:30px;border:3px solid var(--border);border-top-color:var(--gold);border-radius:50%;animation:spin .65s linear infinite;margin:2rem auto;}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
.fade-up{animation:fadeUp .45s ease both;}