* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; background:#f0f2f5; color:#1a1a2e; display:flex; min-height:100vh; }

/* Sidebar */
.sidebar { width:240px; background:#1a1a2e; color:#fff; padding:0; position:fixed; top:0; left:0; height:100vh; overflow-y:auto; z-index:100; }
.sidebar-header { padding:1.2rem; border-bottom:1px solid rgba(255,255,255,.1); }
.sidebar-header h2 { font-size:1.1rem; font-weight:700; color:#fff; }
.sidebar-header h2 span { color:#e94560; }
.sidebar-header small { color:#8899aa; font-size:.75rem; }
.sidebar-nav { padding:.5rem 0; }
.sidebar-nav a { display:flex; align-items:center; gap:.75rem; padding:.7rem 1.2rem; color:#b0b8c8; text-decoration:none; font-size:.9rem; transition:.2s; }
.sidebar-nav a:hover { background:rgba(255,255,255,.08); color:#fff; }
.sidebar-nav a.active { background:rgba(233,69,96,.15); color:#e94560; border-right:3px solid #e94560; }
.sidebar-nav .icon { font-size:1.1rem; width:24px; text-align:center; }

/* Main */
.main { margin-left:240px; flex:1; padding:1.5rem 2rem; max-width:calc(100vw - 240px); }

/* Top bar */
.topbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem; }
.topbar h1 { font-size:1.5rem; font-weight:600; }
.topbar .badge { background:#e94560; color:#fff; padding:.15rem .6rem; border-radius:999px; font-size:.75rem; margin-left:.5rem; }

/* Cards */
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.card { background:#fff; border-radius:10px; padding:1.2rem 1.5rem; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.card .number { font-size:2rem; font-weight:700; color:#1a1a2e; }
.card .label { font-size:.8rem; color:#666; margin-top:.2rem; }
.card .action { display:inline-block; margin-top:.6rem; font-size:.8rem; color:#e94560; text-decoration:none; font-weight:500; }
.card.accent { border-left:4px solid #e94560; }
.card.accent2 { border-left:4px solid #0f3460; }

/* Filters */
.filters { background:#fff; border-radius:10px; padding:1rem 1.2rem; box-shadow:0 1px 3px rgba(0,0,0,.06); margin-bottom:1rem; display:flex; gap:.75rem; flex-wrap:wrap; align-items:center; }
.filters select,.filters input { padding:.5rem .75rem; border:1px solid #ddd; border-radius:6px; font-size:.85rem; }
.filters input[type=search] { min-width:200px; flex:1; }
.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem 1rem; border-radius:6px; font-size:.85rem; font-weight:500; border:none; cursor:pointer; text-decoration:none; transition:.2s; }
.btn-primary { background:#e94560; color:#fff; }
.btn-primary:hover { background:#d63851; }
.btn-secondary { background:#f0f2f5; color:#333; }
.btn-secondary:hover { background:#e0e3e8; }
.btn-sm { padding:.35rem .65rem; font-size:.8rem; }
.btn-danger { background:#fee; color:#c0392b; }
.btn-danger:hover { background:#fdd; }

/* Table */
.table-wrap { background:#fff; border-radius:10px; box-shadow:0 1px 3px rgba(0,0,0,.06); overflow:hidden; }
table { width:100%; border-collapse:collapse; }
thead th { background:#f8f9fa; text-align:left; padding:.75rem 1rem; font-size:.8rem; font-weight:600; color:#666; text-transform:uppercase; letter-spacing:.05em; border-bottom:2px solid #eee; }
tbody td { padding:.65rem 1rem; font-size:.85rem; border-bottom:1px solid #f0f0f0; }
tbody tr:hover { background:#fafbfc; }
td.actions { display:flex; gap:.35rem; }

/* Pagination */
.pagination { display:flex; justify-content:center; align-items:center; gap:.5rem; padding:1rem; }
.pagination a,.pagination span { padding:.35rem .75rem; border-radius:6px; font-size:.85rem; text-decoration:none; }
.pagination a { background:#f0f2f5; color:#333; }
.pagination a:hover { background:#e0e3e8; }
.pagination .current { background:#e94560; color:#fff; }

/* Form */
.form-card { background:#fff; border-radius:10px; padding:1.5rem 2rem; box-shadow:0 1px 3px rgba(0,0,0,.06); max-width:700px; }
.form-card .form-group { margin-bottom:1rem; }
.form-card label { display:block; font-size:.85rem; font-weight:500; color:#444; margin-bottom:.3rem; }
.form-card input,.form-card textarea,.form-card select { width:100%; padding:.6rem .8rem; border:1px solid #ddd; border-radius:6px; font-size:.9rem; }
.form-card textarea { min-height:80px; resize:vertical; }
.form-card .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-card .form-actions { display:flex; gap:.75rem; margin-top:1.5rem; padding-top:1rem; border-top:1px solid #eee; }

/* Route editor */
.route-editor { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.place-pool,.route-list { background:#fff; border-radius:10px; padding:1rem; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.place-pool h4,.route-list h4 { font-size:.9rem; margin-bottom:.5rem; color:#666; }
.place-pool input { width:100%; padding:.5rem; border:1px solid #ddd; border-radius:6px; margin-bottom:.5rem; font-size:.85rem; }
.place-pool .list,.route-list .list { max-height:450px; overflow-y:auto; min-height:200px; border:2px dashed #e0e0e0; border-radius:8px; padding:.25rem; }
.place-card { padding:.5rem .65rem; margin:.2rem 0; border:1px solid #eee; border-radius:6px; cursor:pointer; background:#fafbfc; transition:.2s; }
.place-card:hover { background:#f0f2f5; border-color:#ddd; }
.place-card .name { font-size:.85rem; font-weight:500; }
.place-card .cat { font-size:.75rem; color:#888; }
.place-card .drag-handle { cursor:grab; color:#bbb; font-size:1rem; user-select:none; }
.place-card .remove-btn { cursor:pointer; color:#e94560; font-size:.85rem; font-weight:600; margin-left:auto; }
.place-card.sortable-item { display:flex; align-items:center; gap:.5rem; }
.place-card.selected { background:#e94560; color:#fff; }
.place-card.selected .cat { color:rgba(255,255,255,.7); }

/* Empty state */
.empty { text-align:center; padding:3rem; color:#999; }
.empty .icon { font-size:3rem; margin-bottom:.5rem; }

/* Responsive */
.menu-toggle { display:none; }

@media(max-width:768px) {
  .menu-toggle { display:block; position:fixed; top:.6rem; left:.6rem; z-index:200; background:#e94560; color:#fff; border:none; border-radius:6px; font-size:1.3rem; padding:.35rem .6rem; cursor:pointer; }
  .sidebar { width:0; overflow:hidden; transition:width .2s; padding:0; }
  .sidebar.open { width:240px; padding:0; }
  .sidebar.open .sidebar-header, .sidebar.open .sidebar-nav { display:block; }
  .sidebar-header, .sidebar-nav { display:none; }
  .main { margin-left:0; max-width:100vw; padding-top:3rem; padding-left:.75rem; padding-right:.75rem; }

  .table-wrap { overflow-x:auto; }
  td.actions { flex-wrap:wrap; gap:.2rem; }
  td.actions .btn { font-size:.7rem; padding:.25rem .5rem; }

  .filters { flex-direction:column; align-items:stretch; }
  .filters select, .filters input[type=search] { width:100%; min-width:auto; }
  .filters .btn { width:100%; justify-content:center; }

  .topbar { flex-direction:column; align-items:flex-start; gap:.5rem; }
  .topbar h1 { font-size:1.2rem; }
  .topbar .btn-group { width:100%; }
  .topbar .btn-group .btn { flex:1; text-align:center; font-size:.8rem; }

  .cards { grid-template-columns:1fr; }
  .card { padding:1rem; }
  .card .number { font-size:1.5rem; }

  .form-card { padding:1rem; max-width:100%; }
  .form-card .form-row { grid-template-columns:1fr; }
  .form-card .form-actions { flex-direction:column; }
  .form-card .form-actions .btn { width:100%; justify-content:center; }

  .route-editor { grid-template-columns:1fr; gap:1rem; }
  .place-pool .list, .route-list .list { max-height:200px; min-height:100px; }
  .place-card { padding:.35rem .5rem; font-size:.8rem; }

  .pagination { flex-wrap:wrap; gap:.25rem; }
  .pagination a, .pagination span { padding:.25rem .5rem; font-size:.8rem; }

  .topbar .btn-group .tab-btn { font-size:.75rem; padding:.35rem .5rem; }
}
