:root{
  --bg: #08090c;
  --bg-alt: #0f1114;
  --surface: #15171c;
  --border: #2a2d35;
  --red: #d62828;
  --red-glow: rgba(214,40,40,0.35);
  --red-soft: rgba(214,40,40,0.12);
  --gold: #d4af37;
  --gold-soft: rgba(212,175,55,0.14);
  --gold-glow: rgba(212,175,55,0.35);
  --ink: #f2efe9;
  --ink-soft: #a6a8b3;
  --ink-faint: #63666f;
  --lock: #9b6bd6;
  --lock-soft: rgba(155,107,214,0.14);
  --lock-glow: rgba(155,107,214,0.35);
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 1000px 500px at 50% -150px, rgba(214,40,40,0.10), transparent),
    radial-gradient(ellipse 700px 400px at 100% 100%, rgba(212,175,55,0.05), transparent),
    var(--bg);
  font-family:'Inter', sans-serif;
  color:var(--ink);
  min-height:100vh;
}
.wrap{max-width:780px; margin:0 auto; padding:2.5rem 1.5rem 5rem;}
header{text-align:center; margin-bottom:1.5rem;}
.eyebrow{
  font-size:0.72rem; letter-spacing:0.28em; text-transform:uppercase;
  color:var(--red); margin-bottom:0.7rem; text-shadow:0 0 12px var(--red-glow);
}
header h1{
  font-family:'Cinzel', serif; font-weight:900; font-size:2.6rem; margin:0;
  letter-spacing:0.03em;
  background:linear-gradient(180deg, #fff 0%, var(--gold) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 0 30px rgba(212,175,55,0.25);
}
header .sub{font-size:0.85rem; color:var(--ink-faint); margin-top:0.5rem;}

.nav-row{display:flex; justify-content:center; gap:0.6rem; margin-bottom:1.6rem;}
.nav-link{
  font-size:0.8rem; font-weight:700; letter-spacing:0.04em; text-decoration:none;
  color:var(--ink-soft); background:var(--surface); border:1px solid var(--border);
  border-radius:20px; padding:0.5rem 1.2rem; transition:all 0.2s ease;
}
.nav-link:hover{border-color:var(--gold); color:var(--gold);}
.nav-link.danger{color:var(--red); border-color:var(--red);}

.date-row{display:flex; justify-content:center; margin-bottom:1.6rem;}
.date-row .field{max-width:220px; width:100%;}

.field label{
  display:block; font-size:0.7rem; color:var(--ink-faint); text-transform:uppercase;
  letter-spacing:0.08em; margin-bottom:0.35rem; text-align:center;
}
input[type="date"], input[type="text"], input[type="password"], textarea{
  width:100%; font-family:'Inter', sans-serif; font-size:0.92rem; padding:0.65rem 0.8rem;
  border:1px solid var(--border); border-radius:8px; background:var(--bg-alt);
  color:var(--ink); outline:none;
}
input:focus, textarea:focus{
  border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-soft), 0 0 16px rgba(212,175,55,0.15);
}
textarea{min-height:80px; resize:vertical; margin-bottom:0.8rem;}

.admin-panel{
  background:linear-gradient(180deg, rgba(214,40,40,0.05), var(--surface) 40%);
  border:1px solid var(--red); border-radius:16px; padding:1.6rem; margin-bottom:2.2rem;
  box-shadow:0 0 40px rgba(214,40,40,0.12), inset 0 0 40px rgba(214,40,40,0.03);
}
.admin-panel-title{
  font-family:'Cinzel', serif; font-weight:700; font-size:1.15rem; color:var(--red);
  margin:0 0 1.2rem; text-shadow:0 0 12px var(--red-glow); letter-spacing:0.02em;
}
.admin-section-label{
  font-family:'Cinzel', serif; font-size:0.9rem; color:var(--gold); margin:1.6rem 0 0.8rem;
  padding-top:1.2rem; border-top:1px dashed var(--border); letter-spacing:0.03em;
}
.field-row{display:flex; gap:0.7rem; margin-bottom:0.8rem; flex-wrap:wrap;}
.field-row .field{flex:1; min-width:140px;}
.field-row .field label{text-align:left;}

.type-toggle{display:flex; gap:0.5rem;}
.type-btn{
  flex:1; padding:0.6rem 0.7rem; border-radius:8px; border:1px solid var(--border);
  background:var(--bg-alt); color:var(--ink-soft); font-size:0.85rem; font-weight:700; cursor:pointer;
  transition:all 0.15s ease;
}
.type-btn.active[data-type="private"]{background:var(--lock-soft); color:var(--lock); border-color:var(--lock); box-shadow:0 0 12px var(--lock-glow);}
.type-btn.active[data-type="public"]{background:var(--gold-soft); color:var(--gold); border-color:var(--gold); box-shadow:0 0 12px var(--gold-glow);}

.composer-footer{display:flex; justify-content:flex-end;}
button{font-family:'Inter', sans-serif; cursor:pointer; border-radius:8px; border:none;}
.btn-primary{
  background:linear-gradient(180deg, var(--red), #a01f1f); color:#fff; font-weight:700;
  font-size:0.9rem; padding:0.65rem 1.5rem; letter-spacing:0.03em;
  box-shadow:0 4px 16px rgba(214,40,40,0.35); transition:filter 0.15s ease, transform 0.1s ease;
}
.btn-primary:hover{filter:brightness(1.1);}
.btn-primary:active{transform:scale(0.97);}
.btn-primary:disabled{opacity:0.5;}

.stats-row{display:flex; gap:0.8rem; margin-bottom:1.2rem; flex-wrap:wrap;}
.stat{flex:1; min-width:90px; background:var(--bg-alt); border:1px solid var(--border); border-radius:10px; padding:0.7rem 0.9rem; text-align:center;}
.stat .num{font-family:'Cinzel', serif; font-size:1.4rem; color:var(--gold); display:block; text-shadow:0 0 10px rgba(212,175,55,0.3);}
.stat.private .num{color:var(--lock); text-shadow:0 0 10px var(--lock-glow);}
.stat .lbl{font-size:0.66rem; color:var(--ink-faint); text-transform:uppercase; letter-spacing:0.06em;}

.admin-search{margin-bottom:0.9rem;}
.admin-table{border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg-alt);}
.admin-row{display:grid; grid-template-columns:80px 1fr auto; gap:0.8rem; align-items:start; padding:0.8rem 1rem; border-bottom:1px solid var(--border);}
.admin-row:last-child{border-bottom:none;}
.admin-row-meta{font-size:0.7rem; color:var(--ink-faint); line-height:1.4;}
.admin-row-type{display:inline-block; font-size:0.62rem; font-weight:700; padding:0.08rem 0.4rem; border-radius:4px; margin-top:0.2rem;}
.admin-row-type.public{background:var(--gold-soft); color:var(--gold);}
.admin-row-type.private{background:var(--lock-soft); color:var(--lock);}
.admin-row-text{font-size:0.88rem; line-height:1.5; white-space:pre-wrap; word-break:break-word;}
.admin-row-actions{display:flex; flex-direction:column; gap:0.35rem;}
.icon-btn{background:var(--surface); border:1px solid var(--border); color:var(--ink-soft); font-size:0.72rem; font-weight:600; padding:0.3rem 0.6rem; border-radius:6px; cursor:pointer; white-space:nowrap;}
.icon-btn:hover{border-color:var(--gold); color:var(--gold);}
.icon-btn.danger:hover{border-color:var(--red); color:var(--red);}

.edit-area{width:100%; margin-top:0.5rem;}
.edit-actions{display:flex; gap:0.5rem; margin-top:0.5rem;}
.btn-small{font-size:0.78rem; padding:0.4rem 0.9rem; background:var(--surface); color:var(--ink); border:1px solid var(--border);}
.btn-small:hover{border-color:var(--gold);}
.empty-admin{padding:1.2rem; text-align:center; color:var(--ink-faint); font-size:0.85rem;}

.box{border:1px solid var(--border); border-radius:16px; background:var(--surface); margin-bottom:1.6rem; overflow:hidden;}
.box-header{padding:1rem 1.3rem; font-family:'Cinzel', serif; font-weight:700; font-size:1.05rem; display:flex; align-items:center; justify-content:space-between; letter-spacing:0.02em;}
.box.private{border-color:rgba(155,107,214,0.4); box-shadow:0 0 30px rgba(155,107,214,0.06);}
.box.private .box-header{background:linear-gradient(90deg, var(--lock-soft), transparent); color:var(--lock); text-shadow:0 0 10px var(--lock-glow);}
.box.public{border-color:rgba(212,175,55,0.4); box-shadow:0 0 30px rgba(212,175,55,0.06);}
.box.public .box-header{background:linear-gradient(90deg, var(--gold-soft), transparent); color:var(--gold); text-shadow:0 0 10px rgba(212,175,55,0.3);}
.count-badge{font-family:'Inter', sans-serif; font-size:0.75rem; font-weight:800; background:rgba(255,255,255,0.06); padding:0.18rem 0.65rem; border-radius:20px;}

.item{padding:0.85rem 1.3rem; border-top:1px solid var(--border); font-size:0.9rem; line-height:1.55; white-space:pre-wrap;}
.item-time{font-size:0.72rem; color:var(--ink-faint); margin-bottom:0.25rem; letter-spacing:0.02em;}
.empty-note{padding:1.1rem 1.3rem; font-size:0.85rem; color:var(--ink-faint);}

.login-box{max-width:360px; margin:4rem auto; background:var(--surface); border:1px solid var(--red); border-radius:16px; padding:2rem; box-shadow:0 0 40px rgba(214,40,40,0.12);}
.login-box h2{font-family:'Cinzel', serif; color:var(--red); text-align:center; margin-top:0;}
.login-box .field{margin-bottom:1rem;}
.login-error{color:var(--red); font-size:0.85rem; text-align:center; margin-bottom:1rem;}
.login-box .btn-primary{width:100%;}
