.hv-nt-wrap{
  --hv-cream:#f4dfab;
  --hv-paper:#fff4cf;
  --hv-orange:#d56b1f;
  --hv-brown:#4b2a18;
  --hv-ink:#24170f;
  box-sizing:border-box;
  width:100%;
  max-width:820px;
  margin:14px auto;
  padding:12px;
  color:var(--hv-ink);
  border:3px solid var(--hv-brown);
  border-radius:14px;
  background:linear-gradient(180deg,#f5d995,#e8bd69);
  box-shadow:0 6px 14px rgba(50,28,14,.28), inset 0 0 0 2px rgba(255,247,210,.75);
  font-family:Arial,Helvetica,sans-serif;
}
.hv-nt-wrap *{box-sizing:border-box}

/* Compacte retro kop */
.hv-nt-sign{
  position:relative;
  margin:0 0 10px;
  padding:9px 12px 8px;
  text-align:center;
  border:2px solid #3d2113;
  border-radius:10px;
  background:linear-gradient(180deg,#d97126,#a8461e);
  box-shadow:0 3px 0 #5c2d17, inset 0 0 0 1px rgba(255,220,139,.65);
  color:#fff3cf;
  text-shadow:1px 1px 0 #4c2515;
}
.hv-nt-sign-small{display:none}
.hv-nt-sign strong{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:25px;
  line-height:1.05;
  letter-spacing:.3px;
}
.hv-nt-sign-range{
  display:block;
  margin-top:4px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.2px;
  color:#ffe7aa;
}

/* Vijf compacte rijen: hoes | artiest | songnummer */
.hv-nt-list{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:2px solid #6d3e22;
  border-radius:10px;
  background:var(--hv-paper);
}
.hv-nt-row{
  display:grid;
  grid-template-columns:64px minmax(0,.9fr) minmax(0,1.25fr);
  gap:12px;
  align-items:center;
  min-width:0;
  min-height:72px;
  padding:6px 10px;
  background:rgba(255,250,229,.96);
  border:0;
  border-bottom:1px solid rgba(87,48,27,.28);
}
.hv-nt-row:nth-child(even){background:rgba(247,225,174,.72)}
.hv-nt-row:last-child{border-bottom:0}
.hv-nt-row[hidden]{display:none!important}

.hv-nt-cover{
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:2px solid #5b3420;
  border-radius:7px;
  background:#efe1bd;
  box-shadow:2px 2px 5px rgba(45,24,12,.28);
}
.hv-nt-cover img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  background:#efe1bd;
}
.hv-nt-cover-fallback{
  display:none;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#e2bd6d,#c77b31);
  color:#542d19;
  font-family:Georgia,"Times New Roman",serif;
  font-size:31px;
  font-weight:700;
}
.hv-nt-cover-fallback.is-visible{display:flex}

.hv-nt-artist,
.hv-nt-title{
  min-width:0;
  overflow-wrap:anywhere;
}
.hv-nt-artist{
  color:#7a321c;
  font-family:Georgia,"Times New Roman",serif;
  font-size:16px;
  line-height:1.15;
  font-weight:800;
}
.hv-nt-title{
  color:#281b13;
  font-size:15px;
  line-height:1.2;
  font-weight:700;
}
.hv-nt-title-cell{
  min-width:0;
}
.hv-nt-request-button{
  display:inline-block;
  margin-top:6px;
  padding:5px 10px;
  border:2px solid #4b2818;
  border-radius:14px;
  background:#d56b1f;
  color:#fff6d8;
  font-size:11px;
  line-height:1;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 2px 0 #5b301b;
}
.hv-nt-request-button:hover,
.hv-nt-request-button:focus{
  color:#fff6d8;
  text-decoration:none;
  filter:brightness(1.08);
}

.hv-nt-pager{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:10px;
}
.hv-nt-page-button{
  appearance:none;
  border:2px solid #4b2818;
  border-radius:16px;
  padding:6px 12px;
  background:#d56b1f;
  color:#fff6d8;
  font-size:12px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 2px 0 #5b301b;
}
.hv-nt-page-button:hover:not(:disabled){filter:brightness(1.08)}
.hv-nt-page-button:disabled{opacity:.38;cursor:default}
.hv-nt-page-status{
  min-width:88px;
  text-align:center;
  color:#5a351f;
  font-size:11px;
  font-weight:800;
}

.hv-nt-message{padding:16px;text-align:center;border:2px dashed #986137;border-radius:9px;background:#fff4cf;font-weight:700}
.hv-nt-error{color:#8d2417}

/* Admin */
.hv-nt-admin-layout{display:grid;grid-template-columns:minmax(320px,430px) minmax(0,1fr);gap:24px;align-items:start;max-width:1400px}
.hv-nt-admin-settings,.hv-nt-admin-preview-wrap{background:#fff;border:1px solid #dcdcde;border-radius:8px;padding:18px}
.hv-nt-form label{font-weight:600}
.hv-nt-date-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hv-nt-date-row label,.hv-nt-full,.hv-nt-map-grid label{display:flex;flex-direction:column;gap:5px}
.hv-nt-form input[type=date],.hv-nt-form input[type=text],.hv-nt-form input[type=number],.hv-nt-form select{width:100%;max-width:none}
.hv-nt-dbbox{margin-top:18px;padding-top:12px;border-top:1px solid #ddd}
.hv-nt-dbbox h2{margin-top:0}
.hv-nt-map-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.hv-nt-full{margin:12px 0}
.hv-nt-shortcode-box{margin-top:18px;padding:14px;border-radius:8px;background:#fff4d7;border:1px solid #d8a55d}
.hv-nt-shortcode-box code{font-size:14px}
.hv-nt-admin-preview{margin:0;max-width:none}
.hv-nt-form.is-compact .hv-nt-date-row{margin-top:8px}

@media (max-width:900px){
  .hv-nt-admin-layout{grid-template-columns:1fr}
}
@media (max-width:520px){
  .hv-nt-wrap{padding:8px;border-width:2px;border-radius:11px}
  .hv-nt-sign strong{font-size:22px}
  .hv-nt-row{grid-template-columns:56px minmax(0,.9fr) minmax(0,1.15fr);gap:8px;padding:6px;min-height:64px}
  .hv-nt-cover{width:54px;height:54px}
  .hv-nt-artist{font-size:14px}
  .hv-nt-title{font-size:13px}
  .hv-nt-request-button{margin-top:5px;padding:5px 8px;font-size:10px}
  .hv-nt-page-button{padding:6px 9px;font-size:11px}
  .hv-nt-page-status{min-width:72px;font-size:10px}
}
@media (max-width:360px){
  .hv-nt-row{grid-template-columns:50px minmax(0,.9fr) minmax(0,1.1fr);gap:6px}
  .hv-nt-cover{width:48px;height:48px}
  .hv-nt-artist{font-size:13px}
  .hv-nt-title{font-size:12px}
  .hv-nt-request-button{padding:4px 7px;font-size:10px}
  .hv-nt-date-row,.hv-nt-map-grid{grid-template-columns:1fr}
}
