html, body { margin: 0; padding: 0; overflow: hidden; background: #060f24; height: 100%; }
.nav-wrapper, .nav, footer{
    display: none !important;
}

    /* ── Shell ── */
    .fp-popup { position: fixed; inset: 0; background: #060f24; display: flex; flex-direction: column; overflow: hidden; }

    /* ════════════════════════════════════════
       SHARED HEADER  (same on both pages)
    ════════════════════════════════════════ */
    .fp-hdr {
      display: flex; align-items: center;
      padding: 0 16px; height: 58px;
      background: rgba(255,255,255,0.03);
      border-bottom: 1px solid rgba(201,140,58,0.12);
      flex-shrink: 0; gap: 10px;
    }
    /* Left zone */
    .fp-hdr-left { display: flex; align-items: center; flex-shrink: 0; }
    /* Center zone */
    .fp-hdr-center { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 0; overflow: hidden; }
    /* Right zone */
    .fp-hdr-right { display: flex; align-items: center; gap: 7px; flex-shrink: 0; margin-left: auto; }

    /* ← Back pill */
    .fp-back-btn {
      display: inline-flex; align-items: center; gap: 7px;
      background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14);
      color: rgba(255,255,255,0.65); padding: 7px 16px; border-radius: 20px;
      cursor: pointer; font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
      font-family: 'HelveticaGeo','FiraGO',sans-serif;
      white-space: nowrap; flex-shrink: 0; transition: 0.2s;
    }
    .fp-back-btn:hover { background: rgba(201,140,58,0.15); border-color: var(--gold); color: var(--gold); }

    /* ← → circle nav buttons */
    .fp-nav-btn {
      background: none; border: 1px solid rgba(255,255,255,0.14);
      color: rgba(255,255,255,0.5); width: 32px; height: 32px;
      border-radius: 50%; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; transition: 0.2s;
    }
    .fp-nav-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,140,58,0.1); }

    /* Center label */
    .fp-hdr-title {
      text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      font-family: 'HelveticaGeo','FiraGO',sans-serif;
      font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
      color: rgba(255,255,255,0.7);
    }
    .fp-hdr-num { color: var(--gold); font-size: 22px; letter-spacing: -0.01em; }

    /* Right action pills */
    .fp-action-btn {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 7px 14px; background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.14); border-radius: 20px; cursor: pointer;
      color: rgba(255,255,255,0.6);
      font-family: 'HelveticaGeo','FiraGO',sans-serif;
      font-size: 11px; font-weight: 700; letter-spacing: 0.04em;
      white-space: nowrap; transition: 0.2s; flex-shrink: 0;
    }
    .fp-action-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,140,58,0.1); }
    .fp-action-btn.fp-copied { border-color: #52c49a; color: #52c49a; background: rgba(82,196,154,0.1); }
    .fp-action-btn--close:hover { border-color: rgba(255,80,80,0.6); color: #ff5959; background: rgba(255,60,60,0.06); }

    /* ════════════════════════════════════════
       FLOOR VIEW LAYOUT
    ════════════════════════════════════════ */
    .fp-floor-view { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; position: relative; }
    .fp-floor-main { display: flex; flex-direction: row; flex: 1; min-height: 0; overflow: hidden; }

    /* ── 3×3 badge grid ── */
    .fp-body { flex: 1; display: grid; grid-template-columns: 72px 1fr 72px; grid-template-rows: 54px 1fr 54px; min-height: 0; overflow: hidden; }
    .fp-view { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 6px 4px; }
    .fp-view--top    { grid-column:2; grid-row:1; border-bottom: 1px solid rgba(255,255,255,0.05); }
    .fp-view--right  { grid-column:3; grid-row:2; border-left: 1px solid rgba(255,255,255,0.05); }
    .fp-view--bottom { grid-column:2; grid-row:3; border-top: 1px solid rgba(255,255,255,0.05); }
    .fp-view--left   { grid-column:1; grid-row:2; border-right: 1px solid rgba(255,255,255,0.05); }
    .fp-view--top, .fp-view--bottom { flex-direction: row; gap: 10px; padding: 4px 24px; justify-content: center; }
    .fp-view-icon { width: 36px; height: 36px; border-radius: 50%; background: rgba(201,140,58,0.1); border: 1.5px solid rgba(201,140,58,0.35); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--gold); }
    .fp-view-lbl { font-size: 7.5px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: rgba(255,255,255,0.4); font-family: 'HelveticaGeo','FiraGO',sans-serif; text-align: center; line-height: 1.3; white-space: nowrap; }
    .fp-view--top .fp-view-lbl, .fp-view--bottom .fp-view-lbl { font-size: 9px; text-align: left; letter-spacing: 0.1em; }

    /* ── Floor plan center ── */
    .fp-plan-area { grid-column: 2; grid-row: 2; position: relative; display: flex; align-items: center; justify-content: center; overflow: visible; padding: 10px; min-height: 0; }
    .fp-plan-wrap { position: relative; max-width: 100%; max-height: 100%; line-height: 0; }
    .fp-plan-img { max-width: 100%; max-height: calc(100vh - 58px - 108px - 120px); display: block; border-radius: 6px; object-fit: contain; }

    /* ── Apartment zones ── */
    .fp-apt-zone { position: absolute; border: 1.5px solid; border-radius: 3px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; box-sizing: border-box; transition: background 0.15s, border-color 0.15s; overflow: hidden; }
    .fp-apt-zone.z-f { background: rgba(82,196,154,0.10); border-color: rgba(82,196,154,0.55); }
    .fp-apt-zone.z-r { background: rgba(224,168,78,0.10); border-color: rgba(224,168,78,0.55); }
    .fp-apt-zone.z-s { background: rgba(110,120,140,0.08); border-color: rgba(110,120,140,0.28); cursor: not-allowed; }
    .fp-apt-zone.z-f:hover { background: rgba(82,196,154,0.26); }
    .fp-apt-zone.z-r:hover { background: rgba(224,168,78,0.26); }
    .fp-apt-zone.fp-zone-hover { background: rgba(201,140,58,0.38) !important; border-color: var(--gold) !important; border-width: 2.5px !important; box-shadow: 0 0 0 2px rgba(201,140,58,0.25); }
    .fp-zone-num { font-size: clamp(8px,1.1vw,11px); font-weight: 700; color: rgba(255,255,255,0.85); font-family: 'HelveticaGeo','FiraGO',sans-serif; text-align: center; pointer-events: none; white-space: nowrap; }
    .fp-zone-sz  { font-size: clamp(7px,0.9vw,9px); color: rgba(255,255,255,0.45); font-family: 'HelveticaGeo','FiraGO',sans-serif; pointer-events: none; }

    /* ── Special floor overlay ── */
    .fp-special-overlay { position: absolute; inset: 0; background: rgba(6,15,36,0.82); display: flex; align-items: center; justify-content: center; border-radius: 6px; }
    .fp-special-msg { color: rgba(255,255,255,0.6); font-size: 14px; font-family: 'HelveticaGeo','FiraGO',sans-serif; text-align: center; padding: 24px; line-height: 1.7; }

    /* ── Sidebar ── */
    .fp-apt-sidebar { width: 320px; flex-shrink: 0; display: flex; flex-direction: column; background: rgba(0,0,0,0.28); border-right: 1px solid rgba(255,255,255,0.06); overflow-y: auto; overflow-x: hidden; }
    .fp-apt-sidebar::-webkit-scrollbar { width: 3px; }
    .fp-apt-sidebar::-webkit-scrollbar-thumb { background: rgba(201,140,58,0.3); border-radius: 2px; }

    /* ── Floor selector ── */
    .fp-floor-select-wrap { display: flex; align-items: center; gap: 12px; padding: 13px 18px; border-bottom: 1px solid rgba(255,255,255,0.06); flex-shrink: 0; }
    .fp-floor-select {
      background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16);
      color: #fff; border-radius: 6px; padding: 8px 36px 8px 14px;
      font-family: 'HelveticaGeo','FiraGO',sans-serif; font-size: 18px; font-weight: 700;
      cursor: pointer; outline: none; transition: border-color 0.2s;
      -webkit-appearance: none; appearance: none; min-width: 72px;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.45)' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
      background-repeat: no-repeat; background-position: right 10px center;
    }
    .fp-floor-select:focus { border-color: var(--gold); }
    .fp-floor-select option { background: #0a1428; color: #fff; }
    .fp-floor-select-lbl { font-size: 18px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.45); font-family: 'HelveticaGeo','FiraGO',sans-serif; white-space: nowrap; }

    .fp-sidebar-lbl { padding: 11px 14px 9px; font-size: 18px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.45); font-family: 'HelveticaGeo','FiraGO',sans-serif; border-bottom: 1px solid rgba(255,255,255,0.05); flex-shrink: 0; }
    .fp-apt-list-bar { display: flex; flex-direction: column; gap: 8px; padding: 10px 10px 14px; flex: 1; }
    .fp-alb-msg { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 13px; color: rgba(255,255,255,0.28); text-align: center; padding: 20px 8px; font-family: 'HelveticaGeo','FiraGO',sans-serif; letter-spacing: 0.04em; line-height: 1.6; }
    .fp-alc { width: 100%; box-sizing: border-box; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.09); border-radius: 8px; padding: 13px 14px; cursor: pointer; display: flex; flex-direction: column; gap: 4px; transition: border-color 0.15s, background 0.15s; flex-shrink: 0; }
    .fp-alc:hover, .fp-alc.fp-alc-lit { background: rgba(201,140,58,0.13); border-color: rgba(201,140,58,0.5); }
    .fp-alc.fp-alc-sold { opacity: 0.38; cursor: not-allowed; }
    .fp-alc.fp-alc-reserved { opacity: 0.38; cursor: not-allowed; }
    .fp-alc-num  { font-size: 18px; font-weight: 700; color: var(--gold); font-family: 'HelveticaGeo','FiraGO',sans-serif; }
    .fp-alc-sz   { font-size: 18px; font-weight: 700; color: #fff; font-family: 'HelveticaGeo','FiraGO',sans-serif; }
    .fp-alc-type { font-size: 13px; color: rgba(255,255,255,0.42); font-family: 'HelveticaGeo','FiraGO',sans-serif; letter-spacing: 0.03em; }
    .fp-alc-stat { font-size: 18px; font-weight: 700; letter-spacing: 0.04em; font-family: 'HelveticaGeo','FiraGO',sans-serif; margin-top: 2px; }

    /* ── Floor number list sidebar (right) ── */
    .fp-floor-num-sidebar { width: 132px; flex-shrink: 0; display: flex; flex-direction: column; background: rgba(0,0,0,0.28); border-left: 1px solid rgba(255,255,255,0.06); overflow: hidden; }
    .fp-floor-num-title { padding: 11px 0 9px; font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.3); font-family: 'HelveticaGeo','FiraGO',sans-serif; text-align: center; border-bottom: 1px solid rgba(255,255,255,0.05); flex-shrink: 0; }
    .fp-floor-num-list { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 5px 0; }
    .fp-floor-num-list::-webkit-scrollbar { width: 3px; }
    .fp-floor-num-list::-webkit-scrollbar-thumb { background: rgba(201,140,58,0.3); border-radius: 2px; }
    .fp-fnum-item { display: flex; align-items: center; justify-content: center; height: 36px; font-family: 'HelveticaGeo','FiraGO',sans-serif; font-size: 18px; font-weight: 700; color: rgba(255,255,255,0.38); cursor: pointer; transition: color 0.15s, background 0.15s; margin: 1px 10px; border-radius: 4px; flex-shrink: 0; }
    .fp-fnum-item:hover { color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.07); }
    .fp-fnum-item.fp-fnum-active { color: var(--gold); background: rgba(201,140,58,0.14); }
    .g-center{
      font-size: 14px !important;
      height: 60px !important;
      line-height: 60px !important;
      margin-top: 0 !important;
    }

    /* ── Responsive ── */
    @media (max-width: 1000px) { .fp-apt-sidebar { width: 280px; } }
    @media (max-width: 720px) {
      .fp-floor-num-sidebar { display: none; }
      /* Plan on top, sidebar below */
      .fp-floor-main { flex-direction: column-reverse; overflow: hidden; }

      /* Sidebar: vertical layout, scrollable apt list */
      .fp-apt-sidebar {
        width: 100%;
        height: auto;
        max-height: 44vh;
        min-height: 0;
        border-right: none;
        border-top: 1px solid rgba(255,255,255,0.06);
        flex-direction: column;
        overflow-x: hidden;
        overflow-y: auto;
        flex-shrink: 0;
      }
      .fp-floor-select-wrap { flex-shrink: 0; }
      .fp-sidebar-lbl { flex-shrink: 0; }

      /* Vertical apt list */
      .fp-apt-list-bar {
        flex-direction: column;
        padding: 8px 10px 14px;
        gap: 6px;
        flex: unset;
        overflow: visible;
      }
      .fp-alc { min-width: unset; width: 100%; flex-shrink: unset; }

      /* Plan grid — compact side badges */
      .fp-body { grid-template-columns: 48px 1fr 48px; grid-template-rows: 42px 1fr 42px; }
      .fp-view-icon { width: 28px; height: 28px; }
      .fp-view-icon svg { width: 14px; height: 14px; }
      .fp-view-lbl { font-size: 6.5px; }
      .fp-hdr { height: 48px; padding: 0 10px; gap: 6px; }
      .fp-back-btn { padding: 6px 10px; font-size: 10px; }
      .fp-action-btn { padding: 6px 10px; font-size: 10px; }
    }
    @media (max-width: 560px) {
      .fp-action-btn span.fp-btn-label { display: none; }
      .fp-action-btn { padding: 6px 10px; }
    }
    @media (max-width: 480px) {
      .fp-apt-sidebar { max-height: 40vh; }
      .fp-body { grid-template-columns: 36px 1fr 36px; grid-template-rows: 36px 1fr 36px; }
      .fp-view-lbl { display: none; }
    }