:root {
  color-scheme: light;
  --ink: #1f2933;
  --muted: #687385;
  --line: #05070a;
  --measure: #e32219;
  --measure-dark: #b51d14;
  --panel: rgba(255, 255, 255, 0.9);
  --paper: #f4f6f2;
  --brick: #c66a55;
  --sand: #d9c89f;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
}

body {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", Arial, sans-serif;
  color: var(--ink);
  background:
    linear-gradient(130deg, rgba(120, 174, 232, 0.16), transparent 34%),
    linear-gradient(320deg, rgba(198, 106, 85, 0.14), transparent 35%),
    var(--paper);
}

button {
  font: inherit;
}

.app {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(10px, 1.5vh, 16px);
  width: 100vw;
  height: 100dvh;
  padding: clamp(10px, 1.8vw, 22px);
}

.topbar {
  display: grid;
  grid-template-columns: minmax(170px, 280px) minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  min-height: 56px;
}

.brand {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.brand strong {
  font-size: clamp(18px, 2.2vw, 28px);
  line-height: 1;
}

.brand span {
  color: var(--muted);
  font-size: clamp(12px, 1.3vw, 14px);
  white-space: nowrap;
}

.tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.tab {
  height: clamp(38px, 5.4vh, 48px);
  min-width: 0;
  border: 1px solid rgba(31, 41, 51, 0.14);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.72);
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.tab:hover {
  transform: translateY(-1px);
}

.tab.is-active {
  color: #fff;
  border-color: rgba(31, 41, 51, 0);
  background: #253444;
  box-shadow: 0 12px 26px rgba(37, 52, 68, 0.22);
}

.stage {
  display: grid;
  grid-template-columns: minmax(210px, 280px) minmax(0, 1fr);
  gap: clamp(10px, 1.5vw, 18px);
  min-height: 0;
}

.info,
.viewport {
  min-height: 0;
  border: 1px solid rgba(31, 41, 51, 0.12);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 18px 45px rgba(25, 31, 38, 0.1);
}

.info {
  display: grid;
  align-content: start;
  gap: clamp(12px, 2vh, 20px);
  padding: clamp(14px, 2.1vw, 24px);
}

.eyebrow {
  margin: 0;
  color: var(--brick);
  font-size: 13px;
  font-weight: 700;
}

.info h1 {
  margin: 0;
  font-size: clamp(24px, 4vw, 42px);
  line-height: 1.05;
  letter-spacing: 0;
}

.info p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: clamp(13px, 1.6vw, 16px);
  line-height: 1.7;
}

.info dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.info dl div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(31, 41, 51, 0.11);
}

.info dt {
  color: var(--muted);
  font-size: 13px;
}

.info dd {
  margin: 0;
  font-size: clamp(16px, 2vw, 20px);
  font-weight: 800;
}

.zone-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ink);
  font-size: clamp(12px, 1.4vw, 14px);
}

.zone-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.zone-list span,
.zone-numbers circle,
.room-numbers circle,
.model-pin {
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.22));
}

.zone-list span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--line);
  font-weight: 800;
}

.viewport {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: clamp(10px, 1.4vw, 18px);
}

.view {
  position: absolute;
  inset: clamp(10px, 1.4vw, 18px);
  display: grid;
  place-items: center;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.985);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.view.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
}

.drawing {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.site-shell {
  fill: #f8f9fa;
  stroke: #4a5568;
  stroke-width: 3;
  stroke-dasharray: 12 8;
}

.lawn-field {
  fill: url("#lawnGrid");
  stroke: #a8b5a0;
  stroke-width: 1.5;
}

.exterior-lawn {
  fill: url("#lawnGrid");
  stroke: #a8b5a0;
  stroke-width: 1.5;
}

.front-courtyard-plan {
  fill: url("#paverPattern");
  stroke: #8e8e8e;
  stroke-width: 2;
  filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.08));
}

.courtyard-joints {
  fill: none;
  stroke: rgba(120, 120, 120, 0.2);
  stroke-width: 0.8;
}

.driveway-plan {
  fill: none;
  stroke: #bfc4c2;
  stroke-width: 56;
  stroke-linecap: round;
}

.driveway-edge {
  fill: none;
  stroke: #8f9794;
  stroke-width: 2;
  stroke-dasharray: 9 7;
}

.driveway-edge-inner {
  stroke: rgba(255, 255, 255, 0.64);
  stroke-width: 2.4;
  stroke-dasharray: 10 8;
}

.driveway-light-strip {
  fill: none;
  stroke: rgba(255, 248, 220, 0.72);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-dasharray: 12 18;
}

.garage-ramp-plan {
  fill: #aeb5b2;
  stroke: #737c7a;
  stroke-width: 2;
}

.retaining-wall-plan {
  fill: url("#stoneWallPattern");
  stroke: #888;
  stroke-width: 2;
}

.wall-cap-plan {
  fill: #ccc;
  stroke: #999;
  stroke-width: 1.2;
}

.garage-opening-plan {
  fill: #2d3748;
  stroke: #a0a0a0;
  stroke-width: 2;
}

.side-garage-opening {
  fill: #232c36;
  stroke: #c1c8cf;
  stroke-width: 3;
}

.ramp-wall-plan {
  fill: none;
  stroke: url("#stoneWallPattern");
  stroke-width: 18;
  stroke-linecap: round;
  filter: drop-shadow(0 5px 5px rgba(0, 0, 0, 0.12));
}

.ramp-wall-low {
  stroke-width: 10;
  opacity: 0.9;
}

.entry-plaza,
.terrace {
  fill: url("#paverPattern");
  stroke: #8e8e8e;
  stroke-width: 2;
}

.entry-axis-plan {
  fill: none;
  stroke: rgba(70, 80, 90, 0.28);
  stroke-width: 1.4;
  stroke-dasharray: 8 8;
  stroke-linecap: round;
}

.kitchen-path-plan {
  fill: none;
  stroke: #d7d0c3;
  stroke-width: 34;
  stroke-linecap: round;
  filter: drop-shadow(0 5px 7px rgba(0, 0, 0, 0.08));
}

.kitchen-path-edge {
  fill: none;
  stroke: rgba(120, 112, 101, 0.55);
  stroke-width: 1.8;
  stroke-dasharray: 7 8;
  stroke-linecap: round;
}

.kitchen-court-plan {
  fill: url("#paverPattern");
  stroke: #8a8377;
  stroke-width: 2;
}

.kitchen-court-joints {
  fill: none;
  stroke: rgba(100, 94, 85, 0.22);
  stroke-width: 0.8;
}

.kitchen-link-plan {
  fill: none;
  stroke: #8a8377;
  stroke-width: 5;
  stroke-linecap: round;
}

.entry-stairs-plan {
  fill: none;
  stroke: #999;
  stroke-width: 1.5;
  stroke-linecap: round;
}

.landscape-island {
  fill: #c5d0b8;
  stroke: none;
}

.garden-stone {
  fill: #c0c0c0;
  stroke: #a0a0a0;
  stroke-width: 1.2;
}

.yard-lamps circle {
  fill: #ddd;
  stroke: #888;
  stroke-width: 1.5;
}

.site-axis {
  fill: none;
  stroke: rgba(100, 110, 120, 0.25);
  stroke-width: 1.5;
  stroke-dasharray: 8 10;
  stroke-linecap: round;
}

.planting-bed {
  fill: #d5e9c9;
  stroke: #87a078;
  stroke-width: 2.5;
}

.tree-canopy {
  fill: #75a765;
  stroke: #426b3b;
  stroke-width: 3;
}

.tree-core {
  fill: #4f7b48;
  stroke: none;
}

.shrub-row circle {
  fill: #8eb97b;
  stroke: #5f8755;
  stroke-width: 1.5;
}

.house-footprint {
  fill: #f0ede8;
  stroke: #2d3748;
  stroke-width: 3;
  filter: url("#planShadow");
}

.house-main-plan {
  fill: #f0ede8;
  stroke: #2d3748;
  stroke-width: 2.5;
}

.front-balcony-plan,
.side-balcony-plan {
  fill: #e8e4dc;
  stroke: #4a5568;
  stroke-width: 2;
}

.front-balcony-rail-plan,
.side-balcony-rail-plan {
  fill: none;
  stroke: #4a5568;
  stroke-width: 3;
  stroke-linecap: round;
}

.plan-grid-line {
  fill: none;
  stroke: rgba(45, 55, 72, 0.2);
  stroke-width: 1.5;
  stroke-dasharray: 8 6;
}

.front-window-plan,
.side-window-plan,
.side-door-plan {
  fill: none;
  stroke: #4a6a7a;
  stroke-width: 6;
  stroke-linecap: round;
}

.side-door-plan,
.front-door-plan {
  stroke: #5a4030;
}

.exterior-labels text,
.exterior-measure text,
.labels text,
.dimension-lines text {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  fill: #2d3748;
}

.exterior-labels text {
  font-size: 20px;
  font-weight: 600;
  fill: #4a5568;
}

.exterior-labels .label-title {
  font-size: 28px;
  font-weight: 700;
  fill: #2d3748;
}

.exterior-labels .label-small {
  font-size: 18px;
  font-weight: 500;
  fill: #718096;
}

.zone-numbers circle {
  fill: #edf2f7;
  stroke: #4a5568;
  stroke-width: 3;
}

.zone-numbers text {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 22px;
  font-weight: 700;
  fill: #2d3748;
  dominant-baseline: central;
}

.exterior-measure path,
.scale-bar path {
  fill: none;
  stroke: var(--measure);
  stroke-width: 3;
  stroke-linecap: round;
}

.exterior-measure .dimension-total {
  stroke: var(--measure);
  stroke-width: 3.5;
}

.exterior-measure .dimension-segment {
  stroke: var(--measure);
  stroke-width: 2.8;
}

.exterior-measure .dimension-setback {
  stroke: var(--measure);
  stroke-width: 2.8;
}

.exterior-measure text,
.scale-bar text,
.north-arrow text {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  fill: #e53e3e;
  font-weight: 700;
}

.exterior-measure text {
  font-size: 18px;
}

.exterior-measure .segment-text {
  font-size: 14px;
  fill: #e53e3e;
}

.scale-bar text {
  font-size: 14px;
  fill: #4a5568;
}

.north-arrow path {
  fill: #4a5568;
}

.north-arrow text {
  font-size: 20px;
  fill: #4a5568;
  font-weight: 700;
}

.room {
  fill: #ffffff;
}

.bathroom-zones .bath-zone {
  stroke: rgba(31, 41, 51, 0.42);
  stroke-width: 0.035;
  vector-effect: non-scaling-stroke;
}

.bath-storage {
  fill: #f3eadb;
}

.bath-shower {
  fill: #dceff2;
}

.bath-vanity {
  fill: #eef4e8;
}

.bath-toilet {
  fill: #f5f1ec;
}

.bath-tub {
  fill: #e8f0f7;
}

.bath-mirror {
  fill: none;
  stroke: #78909c;
  stroke-width: 0.035;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 3 2;
}

.bathroom-zones .bath-partition,
.bathroom-zones .bath-fixture {
  fill: none;
  stroke: #4f5f6f;
  stroke-width: 0.04;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.bathroom-zones .bath-fixture-fill {
  fill: #ffffff;
  stroke: #4f5f6f;
  stroke-width: 0.035;
  vector-effect: non-scaling-stroke;
}

.bathroom-zones text {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.18px;
  font-weight: 800;
  fill: #263238;
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.92);
  stroke-width: 0.08px;
  stroke-linejoin: round;
}

.walls path,
.openings path,
.stairs path,
.stairs rect {
  fill: none;
  stroke: var(--line);
  stroke-width: 0.7;
  vector-effect: non-scaling-stroke;
  stroke-linecap: butt;
}

.walls path {
  stroke-width: 1;
}

.walls .outer-boundary {
  stroke-width: 1.8;
}

.walls .partition-dashed {
  stroke: #8a3d2e;
  stroke-width: 2.2;
  stroke-dasharray: 10 7;
  stroke-linecap: butt;
}

.walls .room-4-7-divider {
  stroke-width: 2.6;
  stroke-dasharray: 11 7;
}

.partition-overlays path {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.partition-overlays .partition-mask {
  stroke: #fff;
  stroke-width: 5;
  stroke-linecap: square;
}

.partition-overlays .partition-dashed {
  stroke: var(--line);
  stroke-width: 3.1;
  stroke-dasharray: 10 7;
  stroke-linecap: butt;
}

.partition-overlays .room-4-7-divider {
  stroke-width: 3.6;
  stroke-dasharray: 11 7;
}

.openings path {
  stroke-width: 0.5;
}

.door-swing .door-leaf,
.door-swing .door-jamb {
  stroke-width: 0.75;
}

.door-swing .door-threshold {
  stroke-width: 0.35;
  stroke-dasharray: 0.08 0.05;
}

.door-swing .door-arc {
  stroke-width: 0.38;
  stroke-linecap: round;
}

.main-double-door .door-threshold {
  stroke-width: 0.65;
  stroke-dasharray: none;
}

.main-double-door .door-size-label {
  font-family: "SimSun", "Songti SC", serif;
  font-size: 0.19px;
  font-weight: 800;
  fill: #8a3d2e;
  paint-order: stroke fill;
  stroke: #fff;
  stroke-width: 0.08;
  stroke-linejoin: round;
}

.main-double-door .door-option-label {
  font-size: 0.17px;
  fill: #4f5f6f;
}

.stairs path,
.stairs rect {
  stroke-width: 0.5;
}

.stairs .stair-box,
.stairs .stair-run {
  fill: #fff;
  stroke-width: 0.85;
}

.stairs .stair-gap,
.stairs .stair-landing {
  fill: #f1f3f5;
  stroke-width: 0.5;
}

.stairs .stair-treads {
  stroke-width: 0.4;
}

.stairs .stair-diagonal {
  stroke-width: 0.45;
}

.stairs .stair-turn {
  stroke-width: 0.6;
  stroke-linecap: round;
}

.stairs .stair-stringer {
  stroke-width: 0.7;
}

.stairs .stair-arrow {
  stroke-width: 0.55;
  stroke-linecap: round;
}

.stairs text {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.28px;
  font-weight: 800;
  fill: var(--line);
  dominant-baseline: central;
}

.stairs .stair-size-label,
.stairs .stair-total-label {
  font-family: "SimSun", "Songti SC", serif;
  font-size: 0.19px;
  fill: #8a3d2e;
  paint-order: stroke fill;
  stroke: #fff;
  stroke-width: 0.08;
  stroke-linejoin: round;
}

.stairs .stair-total-label {
  font-size: 0.22px;
}

.stairs .stair-lower-label,
.stairs .stair-landing-label,
.lucky-labels .stair-room-size-label {
  font-size: 0.17px;
}

.lucky-labels .stair-room-size-label {
  paint-order: stroke fill;
  stroke: #fff;
  stroke-width: 0.09;
  stroke-linejoin: round;
}

.labels text {
  font-size: 0.19px;
}

.labels .large-label {
  font-size: 0.42px;
}

.lucky-labels text {
  font-family: "SimSun", "Songti SC", serif;
  font-size: 0.19px;
  font-weight: 800;
  fill: #8a3d2e;
  paint-order: stroke fill;
  stroke: #fff;
  stroke-width: 0.08;
  stroke-linejoin: round;
}

.room-numbers circle {
  fill: #fff;
  stroke: var(--line);
  stroke-width: 0.075;
  vector-effect: non-scaling-stroke;
}

.room-numbers text {
  font-family: "Arial", sans-serif;
  font-size: 0.34px;
  font-weight: 800;
  fill: var(--line);
  dominant-baseline: central;
}

.floor1-numbers circle {
  stroke: #d7dce2;
  stroke-width: 0.035;
}

.floor1-numbers text {
  font-size: 0.34px;
  font-weight: 900;
}

/* 壁挂空调位（与「一层立体」模型同坐标 · 冷灰蓝，便于与黑色墙线区分） */
.ac-units rect {
  fill: #cfdae2;
  stroke: #2f6f8f;
  stroke-width: 0.03px;
}

.ac-units text {
  font-size: 0.17px;
  font-weight: 700;
  fill: #2f6f8f;
  dominant-baseline: central;
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.92);
  stroke-width: 0.07px;
}

.dimension-lines path {
  fill: none;
  stroke: var(--measure);
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}

.dimension-lines text {
  font-size: 0.4px;
  font-weight: 700;
  fill: var(--measure-dark);
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.9);
  stroke-width: 0.08px;
  stroke-linejoin: round;
}

.room-width-dimensions path {
  fill: none;
  stroke: var(--measure);
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}

.room-width-dimensions text {
  font-family: "SimSun", "Songti SC", serif;
  font-size: 0.4px;
  font-weight: 700;
  fill: var(--measure-dark);
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.9);
  stroke-width: 0.08px;
  stroke-linejoin: round;
}

.house3d {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 6px;
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 248, 229, 0.95) 0, rgba(255, 248, 229, 0) 30%),
    linear-gradient(180deg, #e8f3f5 0%, #f3f2e8 58%, #d8e4d1 100%);
  cursor: grab;
}

.house3d:active {
  cursor: grabbing;
}

.house3d canvas {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.house3d-status {
  position: absolute;
  right: 16px;
  top: 14px;
  margin: 0;
  padding: 6px 10px;
  border: 1px solid rgba(31, 41, 51, 0.12);
  border-radius: 999px;
  color: #3b4754;
  background: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  font-weight: 700;
  pointer-events: none;
}

.bath3d-toggle {
  position: absolute;
  left: 16px;
  top: 14px;
  display: flex;
  gap: 8px;
  z-index: 3;
}

.bath3d-btn {
  padding: 6px 14px;
  border: 1px solid rgba(31, 50, 62, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #2c3e4c;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.bath3d-btn:hover {
  background: rgba(255, 255, 255, 0.95);
}

.bath3d-btn.is-active {
  background: #1d3a4c;
  border-color: #1d3a4c;
  color: #f2f7fa;
}

.house3d-dimensions {
  position: static;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px 14px;
  align-items: start;
  width: auto;
  margin: 0 12px 12px;
  padding: 10px 12px;
  border: 1px solid rgba(31, 41, 51, 0.12);
  border-radius: 6px;
  color: #1f2933;
  background: rgba(255, 255, 255, 0.88);
  pointer-events: none;
}

.house3d-dimensions strong {
  font-size: 13px;
  line-height: 1.1;
}

.house3d-dimensions dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px 14px;
  margin: 0;
}

.house3d-dimensions div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 7px;
  align-items: baseline;
}

.house3d-dimensions dt {
  color: #687385;
  font-size: 12px;
}

.house3d-dimensions dd {
  min-width: 0;
  margin: 0;
  color: #1f2933;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

@media (max-width: 880px) {
  .app {
    padding: 10px;
  }

  .topbar {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .stage {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .info {
    grid-template-columns: 1fr auto;
    gap: 8px 14px;
    padding: 12px;
  }

  .info h1,
  .info p {
    grid-column: 1;
  }

  .info dl {
    grid-column: 2;
    grid-row: 1 / span 3;
    min-width: 150px;
  }
}

@media (max-width: 620px) {
  .tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tab {
    height: 34px;
    font-size: 13px;
  }

  .brand span,
  .info p:not(.eyebrow) {
    display: none;
  }

  .info {
    grid-template-columns: 1fr;
  }

  .info dl {
    display: none;
  }

  .zone-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .exterior-plan {
    height: min(100%, 320px);
  }

  .view[data-panel="model3d"] {
    inset: 10px;
  }

  .house3d-status {
    display: none;
  }

  .house3d-dimensions {
    grid-template-columns: 1fr;
    margin: 0 8px 8px;
  }

  .house3d-dimensions dl {
    grid-template-columns: 1fr;
  }

  .exterior-labels text {
    stroke-width: 8px;
  }
}

/* ===== 一层卫生间详图 ===== */
.bath-detail .bd-wet {
  fill: #d5ebf2;
}

.bath-detail .bd-dry {
  fill: #eef4e8;
}

.bath-detail .bd-glass {
  fill: none;
  stroke: #1f7fa0;
  stroke-width: 2.4;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-dam {
  fill: none;
  stroke: #c48b6a;
  stroke-width: 1.8;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-div {
  fill: none;
  stroke: #90a4b0;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 0.05 0.04;
}

.bath-detail .bd-drain {
  fill: #ffffff;
  stroke: #3f5563;
  stroke-width: 1.3;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-drain-x {
  fill: none;
  stroke: #3f5563;
  stroke-width: 1.1;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-slope {
  fill: none;
  stroke: #1f7fa0;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-fixture {
  fill: none;
  stroke: #4f5f6f;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bath-detail .bd-fixture-fill {
  fill: #ffffff;
  stroke: #4f5f6f;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-mirror {
  fill: none;
  stroke: #78909c;
  stroke-width: 2.2;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 0.09 0.05;
}

.bath-detail .bd-overhead {
  fill: none;
  stroke: #9aa7b4;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 0.07 0.045;
}

.bath-detail .bd-win {
  fill: #ffffff;
  stroke: none;
}

.bath-detail .bd-win-line {
  fill: none;
  stroke: #37474f;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.bath-detail .bd-label {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.115px;
  font-weight: 800;
  fill: #263238;
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.92);
  stroke-width: 0.03px;
  stroke-linejoin: round;
}

.bath-detail .bd-small {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.09px;
  font-weight: 600;
  fill: #546e7a;
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.95);
  stroke-width: 0.024px;
  stroke-linejoin: round;
}

.bath-detail .bd-zone-t {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.17px;
  font-weight: 900;
  letter-spacing: 0.01px;
  fill: #35505e;
  paint-order: stroke fill;
  stroke: rgba(255, 255, 255, 0.92);
  stroke-width: 0.045px;
}

.bath-detail .bd-note {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 0.10px;
  font-weight: 600;
  fill: #455a64;
}

.bath-detail .dimension-lines text {
  font-size: 0.155px;
  font-weight: 700;
}