:root{ --bg:#0b1220; --panel:#0f172aee; --text:#e5e7eb; --accent:#10b981; }
*{ box-sizing:border-box; }
html,body,#map{ height:100%; margin:0; }
body{ background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu; }

header{ position:fixed; top:0; left:0; right:0; height:56px; display:flex; gap:12px; align-items:center; padding:0 12px; background:#0b1220cc; backdrop-filter:blur(8px); z-index:10; }
.brand{ font-weight:700; }
.nav a{ color:#fff; text-decoration:none; margin-right:12px; opacity:.9 }
#btnInstall{ margin-left:auto; }

.panel{ position:fixed; top:64px; left:12px; right:12px; background:var(--panel); border-radius:16px; padding:12px; z-index:10; box-shadow:0 10px 30px #0006; }
.panel.hidden{ display:none; }

#loginBox input{ width:100%; margin:6px 0; padding:10px; border-radius:10px; border:none; background:#0b122040; color:var(--text); }
#loginBox button, #tools button, #sheet button, select, .btn-link{
  background:var(--accent); color:#04120d; border:none; padding:10px 12px; border-radius:12px; font-weight:700; cursor:pointer;
}
.btn-link{ display:inline-block; text-decoration:none; }

#tools{ display:flex; }
.row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }

#map{ position:fixed; top:56px; bottom:0; left:0; right:0; }

.sheet{ position:fixed; left:0; right:0; bottom:0; background:#0f172a; border-top-left-radius:20px; border-top-right-radius:20px; padding:16px; z-index:11; box-shadow:0 -10px 30px #0009; }
.sheet.hidden{ display:none; }
#sheetContent{ max-height:50vh; overflow:auto; }
.leaflet-popup-content{ color:#111; }

/* Stickers / labels */
.labels-grid{ display:grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap:12px; margin-top:12px; }
.label-card{ background:#fff; color:#111; border-radius:14px; padding:10px; display:flex; gap:10px; align-items:center; }
.label-card small{ display:block; color:#444; }
.label-card .qr{ width:120px; height:120px; flex:0 0 120px; border:1px solid #ddd; border-radius:8px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.print-hint{ opacity:.8; margin: 8px 0; }

@media print{
  header, .panel, .print-hint, .controls { display:none !important; }
  body{ background:#fff; color:#000; }
  .labels-grid{ grid-template-columns: repeat(2, 1fr); gap:8px; }
  .label-card{ border:1px solid #000; }
}