/* ---------- خانه سه‌بعدی ---------- */
body{overflow:hidden;background:#171310}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
#scene.dragging{cursor:grabbing}

.h3-top{
  position:fixed;top:0;right:0;left:0;z-index:20;display:flex;align-items:center;gap:1rem;
  padding:.7rem 1rem;background:linear-gradient(180deg,rgba(23,19,16,.85),transparent);
}
.h3-home{
  background:rgba(250,246,239,.12);border:1px solid rgba(250,246,239,.25);color:#F3EBDD;
  padding:.45rem 1rem;border-radius:999px;font-weight:700;font-size:.85rem;backdrop-filter:blur(6px);transition:all .2s;
}
.h3-home:hover{background:var(--gold);border-color:var(--gold)}
.h3-title{color:#F3EBDD;font-weight:800;font-size:.95rem;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.h3-modes{margin-inline-start:auto;display:flex;gap:.4rem}
.h3-modes button{
  background:rgba(250,246,239,.12);border:1px solid rgba(250,246,239,.25);color:#F3EBDD;
  padding:.45rem .9rem;border-radius:999px;font-weight:700;font-size:.82rem;backdrop-filter:blur(6px);transition:all .2s;
}
.h3-modes button:hover{border-color:var(--gold)}
.h3-modes button.on{background:var(--gold);border-color:var(--gold);color:#fff}

.h3-rooms{
  position:fixed;bottom:.9rem;right:50%;transform:translateX(50%);z-index:20;
  display:flex;gap:.45rem;flex-wrap:wrap;justify-content:center;max-width:96vw;
  background:rgba(23,19,16,.55);backdrop-filter:blur(8px);border:1px solid rgba(250,246,239,.15);
  padding:.5rem .6rem;border-radius:999px;
}
.h3-rooms button{
  color:#F3EBDD;background:rgba(250,246,239,.08);border:1px solid transparent;
  padding:.4rem .9rem;border-radius:999px;font-weight:700;font-size:.82rem;transition:all .2s;white-space:nowrap;
}
.h3-rooms button:hover{background:rgba(250,246,239,.2)}
.h3-rooms button.on{background:var(--gold);color:#fff}

.h3-dpad{
  position:fixed;bottom:4.6rem;left:1rem;z-index:20;display:grid;grid-template-columns:repeat(3,52px);
  grid-template-rows:repeat(2,52px);gap:6px;opacity:.85;
}
.h3-dpad button{
  background:rgba(250,246,239,.14);border:1px solid rgba(250,246,239,.3);color:#F3EBDD;
  border-radius:14px;font-size:1.1rem;backdrop-filter:blur(4px);transition:background .15s;
}
.h3-dpad button:active{background:var(--gold)}
.h3-dpad button[data-d=f]{grid-column:2;grid-row:1}
.h3-dpad button[data-d=l]{grid-column:1;grid-row:2}
.h3-dpad button[data-d=b]{grid-column:2;grid-row:2}
.h3-dpad button[data-d=r]{grid-column:3;grid-row:2}

.h3-card{
  position:fixed;bottom:5rem;left:1rem;z-index:25;width:min(360px,90vw);
  background:rgba(28,23,19,.92);backdrop-filter:blur(10px);border:1px solid rgba(194,154,75,.4);
  border-radius:20px;padding:1.2rem 1.3rem;color:#F3EBDD;box-shadow:0 24px 60px rgba(0,0,0,.5);
  transform:translateY(16px);opacity:0;pointer-events:none;transition:all .3s ease;
}
.h3-card.open{transform:none;opacity:1;pointer-events:auto}
.h3-card h3{font-size:1.1rem;margin:.2rem 0 .5rem;color:#EBD6A4}
.h3-card p{font-size:.88rem;color:#D8CCB6;line-height:1.9}
.h3-card-kicker{font-size:.74rem;font-weight:800;color:var(--gold);letter-spacing:.4px}
.h3-card-close{position:absolute;top:.7rem;left:.8rem;color:#D8CCB6;background:rgba(250,246,239,.1);width:30px;height:30px;border-radius:10px}

#minimap{
  position:fixed;top:4rem;left:1rem;z-index:20;border-radius:16px;
  border:1px solid rgba(250,246,239,.25);box-shadow:0 18px 40px rgba(0,0,0,.45);background:#1E1915;
}

/* لودر */
.h3-loader{
  position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:1rem;
  background:radial-gradient(900px 500px at 50% 20%,rgba(194,154,75,.18),transparent),rgba(20,16,13,.96);
  transition:opacity .6s ease;
}
.h3-loader.hide{opacity:0;pointer-events:none}
.h3-loader-card{
  width:min(520px,94vw);background:rgba(250,246,239,.05);border:1px solid rgba(250,246,239,.14);
  border-radius:26px;padding:2rem 1.8rem;text-align:center;color:#F3EBDD;backdrop-filter:blur(8px);
}
.h3-loader-logo{font-size:3rem;margin-bottom:.4rem}
.h3-loader-card h2{font-weight:900;font-size:1.4rem}
.h3-loader-card>p{color:#C9BCA4;font-size:.9rem;margin-top:.4rem}
.h3-guide{text-align:right;margin:1.1rem 0;font-size:.86rem;color:#D8CCB6;display:grid;gap:.35rem}
.h3-keys{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin-bottom:1.2rem}
.h3-keys span{background:rgba(250,246,239,.08);border:1px solid rgba(250,246,239,.15);border-radius:999px;padding:.3rem .8rem;font-size:.75rem;color:#C9BCA4}
.h3-loader-card .btn[disabled]{opacity:.6}

@media(max-width:700px){
  .h3-title{display:none}
  .h3-rooms{bottom:.6rem;padding:.4rem}
  .h3-rooms button{padding:.35rem .7rem;font-size:.76rem}
  .h3-card{bottom:8.6rem}
  #minimap{width:170px;height:244px}
}
