:root{
  --gold:#d8b45a;
  --gold2:#f6e3a7;
  --ink:#1b1b1b;
  --card:rgba(255,255,255,.86);
  --line:rgba(0,0,0,.10);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial;
  color:var(--ink);
  min-height:100vh;
  background:#0b1220;
}
.bg{
  position:fixed; inset:0;
  background:
    radial-gradient(1200px 700px at 50% 10%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%),
    radial-gradient(900px 500px at 50% 90%, rgba(255,224,160,.22), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #0b1220, #0b1220);
}
.wrap{position:relative; max-width:1100px; margin:0 auto; padding:28px 16px 40px;}
.hero{text-align:center; padding:22px 14px 10px;}
.badge{
  display:inline-block; padding:7px 14px; border:1px solid rgba(255,255,255,.35);
  border-radius:999px; color:#fff; background:rgba(255,255,255,.10);
  backdrop-filter: blur(6px); letter-spacing:.5px; font-weight:600; margin-bottom:8px;
}
.hero h1{margin:6px 0 6px; font-size:34px; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35); letter-spacing:1px;}
.sub{margin:0; color:rgba(255,255,255,.85);}

.card{
  background:var(--card); border:1px solid rgba(255,255,255,.55);
  border-radius:18px; padding:16px; box-shadow:0 16px 40px rgba(0,0,0,.25);
  margin:14px 0;
}
h2{margin:0 0 12px; font-size:18px; letter-spacing:.3px;}
label{display:block; font-size:13px; color:rgba(0,0,0,.70);}
input{
  width:100%; margin-top:6px; padding:11px 12px; border-radius:12px;
  border:1px solid var(--line); background:rgba(255,255,255,.9); outline:none;
}
input:focus{border-color:rgba(216,180,90,.75); box-shadow:0 0 0 4px rgba(216,180,90,.18);}
.grid3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px;}
.span3{grid-column:1/-1;}
.actions{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px;}
button{
  border:0; padding:11px 14px; border-radius:12px; cursor:pointer; font-weight:700;
  background:linear-gradient(180deg, var(--gold2), var(--gold)); color:#2c2107;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
button.secondary{background:rgba(0,0,0,.08); color:#222; box-shadow:none;}
.hint{font-size:12px; color:rgba(0,0,0,.60);}
.gridCards{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.list{display:flex; flex-direction:column; gap:10px;}
.item{border:1px solid var(--line); border-radius:14px; padding:12px; background:rgba(255,255,255,.95);}
.itemTop{display:flex; align-items:flex-start; justify-content:space-between; gap:10px;}
.title{font-weight:800; margin:0;}
.meta{margin:6px 0 0; font-size:12px; color:rgba(0,0,0,.65);}
.rowBtns{display:flex; gap:8px; flex-wrap:wrap;}
.pill{
  display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:6px 10px;
  background:rgba(216,180,90,.14); border:1px solid rgba(216,180,90,.35);
  font-size:12px; margin-top:8px;
}
.foot{text-align:center; color:rgba(255,255,255,.8); margin-top:12px;}
@media (max-width: 900px){
  .gridCards{grid-template-columns:1fr;}
  .grid3{grid-template-columns:1fr;}
}