*{box-sizing:border-box}
:root{
  --bg:#0e1821; --panel:#101e2a; --muted:#9fb3c8; --text:#e6f0ff;
  --brand:#7ad8f7; --accent:#7ef9c4; --chip:#152838; --chipOn:#1f394d; --ring:#1a3a50;
}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 'Inter',system-ui,Segoe UI,Roboto,Arial}
a{color:var(--brand);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:20px}
.row{display:flex;align-items:center}
.wrap{flex-wrap:wrap}
.gap{gap:12px}
.between{justify-content:space-between}
.center{align-items:center}
.topbar{position:sticky;top:0;background:#0c1520;border-bottom:1px solid #0e2a3f;z-index:10}
.brand{font-weight:700}
.two-worlds{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:16px}
@media(max-width:980px){.two-worlds{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid #0f324b;border-radius:16px;padding:18px}
.h2{margin:0 0 8px 0;font-size:20px}
.muted{color:var(--muted);margin:4px 0 16px 0}
.btn{background:var(--brand);color:#042435;padding:8px 14px;border-radius:10px;font-weight:600;display:inline-block}
.btn.ghost{background:#0f2a3a;color:var(--text);border:1px solid #10405d}
.badge{display:inline-block;background:#0f2a3a;color:var(--muted);padding:4px 8px;border-radius:999px;font-size:12px;margin-bottom:6px}
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 18px}
.quote-row{display:flex;justify-content:space-between;background:#0f2433;border:1px solid #12374f;border-radius:10px;padding:8px 10px}
.qtag{color:var(--muted)}
.qnum{font-weight:700}
.floors-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.floor-card{background:#0f2433;border:1px solid #12374f;border-radius:14px;padding:12px}
.floor-card.wide{grid-column:span 2}
/* Dating */
.filters .chip{background:var(--chip);border:1px solid #12374f;color:var(--text);padding:6px 10px;border-radius:999px;cursor:pointer}
.filters .chip.active{background:var(--chipOn)}
.filters .chip.ghost{background:transparent}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
@media(max-width:980px){.cards{grid-template-columns:1fr}}
.card{background:#0f2433;border:1px solid #12374f;border-radius:14px;overflow:hidden}
.card .photo{height:140px;background:#08121a url('../images/p1.jpg') center/cover no-repeat}
.card .body{padding:10px}
.card .row-meta{display:flex;justify-content:space-between;align-items:center;margin:6px 0}
.card .tags{display:flex;gap:8px;flex-wrap:wrap}
.tag{background:#102a3a;border:1px solid #12374f;color:#a4c9dd;font-size:12px;padding:2px 8px;border-radius:999px}
.actions{display:flex;gap:10px;margin-top:10px}
.wave{background:var(--accent);color:#0a2834;border-radius:10px;padding:6px 10px;font-weight:700}
.view{background:#0f2a3a;color:var(--text);border:1px solid #13435f;border-radius:10px;padding:6px 10px}
/* Drawer */
.drawer{position:fixed;inset:0;background:rgba(5,10,15,.6);display:grid;place-items:center}
.drawer.hidden{display:none}
.drawer-content{width:min(720px,92vw);max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--ring);border-radius:16px;padding:18px;position:relative}
.close{position:absolute;top:8px;right:8px;background:#0f2a3a;border:1px solid #12374f;color:var(--muted);border-radius:8px;padding:4px 8px;cursor:pointer}
.footer{color:var(--muted);text-align:center;padding:26px 0}

.field{background:#0f2433;border:1px solid #12374f;color:#cfe8ff;border-radius:10px;padding:8px 10px}