/*
 * Mệnh Lý A Sinh
 * TV-CANONICAL-3A
 * Canonical Tu Vi chart visual layer.
 *
 * Runtime is still disabled.
 * PNG export is intentionally excluded from this file.
 */

.mlas-tuvi-canonical.la-so-container {
  --android-phu-tinh-font: 5.20px;

  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(4, 236px);

  position: relative;

  width: min(720px, 100%);
  max-width: 720px;

  box-sizing: border-box;

  gap: 2px;

  margin: 10px auto 0;

  border: 2px solid #555;
  background: #ccc;

  color: #222;

  font-family: Arial, sans-serif;
}


.mlas-tuvi-canonical .cung-so {
  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  min-width: 0;

  box-sizing: border-box;

  padding: 6px 6px 28px;

  overflow: hidden;

  border-radius: 2px;
  background: #fff;

  font-size: 11px;
}


.mlas-tuvi-canonical .cung-top-row {
  display: flex;
  flex-direction: column;

  align-items: center;
  justify-content: flex-start;

  width: 100%;

  gap: 2px;

  padding-bottom: 3px;

  border-bottom: 1px solid #eee;
}


.mlas-tuvi-canonical .ten-cung-chinh {
  order: 1;

  padding: 2px 4px;

  border-radius: 2px;

  background: #e3f2fd;
  color: #1565c0;

  font-size: 12px;
  font-weight: 700;

  text-align: center;
  text-transform: uppercase;
}


.mlas-tuvi-canonical .chinh-tinh-box {
  order: 2;

  display: flex;
  flex-direction: column;

  align-items: center;

  width: 100%;

  gap: 1px;

  font-size: 11px;
  font-weight: 700;

  line-height: normal;

  text-align: center;
  text-transform: uppercase;
}


.mlas-tuvi-canonical .tu-hoa-box {
  min-height: 14px;

  margin-top: 2px;

  font-size: 11px;
  font-weight: 700;

  line-height: 1.25;

  text-align: center;
  text-transform: uppercase;
}


.mlas-tuvi-canonical .phu-tinh-container {
  display: flex;

  width: 100%;
  min-height: 0;

  flex-grow: 1;

  justify-content: space-between;

  gap: 4px;

  margin-top: 3px;
  padding-bottom: 4px;

  overflow-x: hidden;
  overflow-y: auto;

  overscroll-behavior: contain;

  scrollbar-width: thin;
  scrollbar-color: #aab4b9 #f2f2f2;
}


.mlas-tuvi-canonical
.phu-tinh-container::-webkit-scrollbar {
  width: 7px;
}


.mlas-tuvi-canonical
.phu-tinh-container::-webkit-scrollbar-track {
  border-radius: 4px;
  background: #f2f2f2;
}


.mlas-tuvi-canonical
.phu-tinh-container::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background: #aab4b9;
}


.mlas-tuvi-canonical .cat-tinh-col,
.mlas-tuvi-canonical .sat-tinh-col {
  display: flex;
  flex-direction: column;

  width: 50%;
  min-width: 0;

  gap: 0;

  font-size: 11px;
  font-weight: 700;

  line-height: 1.18;
}


.mlas-tuvi-canonical .cat-tinh-col {
  text-align: left;
}


.mlas-tuvi-canonical .sat-tinh-col {
  text-align: right;
}


.mlas-tuvi-canonical .dai-han-box {
  position: absolute;

  top: 4px;
  right: 5px;

  color: #333;

  font-size: 10px;
  font-weight: 700;
}


.mlas-tuvi-canonical .dai-han-can-chi-box {
  position: absolute;

  z-index: 3;

  top: 5px;
  left: 5px;

  color: #333;

  font-size: 9px;
  font-weight: 600;

  line-height: 1;

  white-space: nowrap;

  pointer-events: none;
}


.mlas-tuvi-canonical
.dai-han-can-chi-box.is-compact {
  letter-spacing: -0.1px;
}


.mlas-tuvi-canonical
.dai-han-can-chi-box.is-tight {
  font-size: 8px;
}


.mlas-tuvi-canonical .tieu-han-box {
  position: absolute;

  top: 18px;
  left: 5px;

  padding: 1px 3px;

  border-radius: 2px;

  color: #777;

  font-size: 9px;
  font-weight: 700;

  line-height: 1.15;
}


.mlas-tuvi-canonical .tieu-han-box:empty {
  display: none;
}


.mlas-tuvi-canonical .tieu-han-active {
  border: 1px solid #d6a84f;
  background: #fff1d6;
  color: #222;
}


.mlas-tuvi-canonical .nguyet-han-box {
  position: absolute;

  z-index: 3;

  bottom: 2px;
  left: 5px;

  color: #555;

  font-size: 9px;
  font-weight: 600;

  line-height: 1;

  white-space: nowrap;

  pointer-events: none;
}


.mlas-tuvi-canonical .nguyet-han-compact {
  display: none;
}


.mlas-tuvi-canonical .cung-dia-chi {
  position: absolute;

  right: 5px;
  bottom: 2px;

  color: #c2c2c2;

  font-size: 9px;
  font-weight: 600;

  text-transform: uppercase;
}


.mlas-tuvi-canonical .cung-cuc-vong {
  position: absolute;

  bottom: 14px;
  left: 50%;

  width: 70%;

  transform: translateX(-50%);

  font-size: 10px;
  font-style: italic;
  font-weight: 700;

  line-height: 1.15;

  text-align: center;
}


.mlas-tuvi-canonical .thien-ban-giua {
  grid-column: 2 / span 2;
  grid-row: 2 / span 2;

  position: relative;

  display: flex;
  flex-direction: column;

  align-items: center;
  justify-content: flex-start;

  box-sizing: border-box;

  padding: 34px 12px 12px;

  overflow: hidden;

  border: 1px dashed #b92b27;

  background: #fffdf6;
}


.mlas-tuvi-canonical .tb-title {
  margin-bottom: 2px;

  color: #b92b27;

  font-size: 16px;
  font-weight: 700;

  letter-spacing: 1px;

  text-transform: uppercase;
}


.mlas-tuvi-canonical .tb-name {
  margin-bottom: 6px;

  color: #1565c0;

  font-size: 14px;
  font-weight: 700;
}


.mlas-tuvi-canonical .tb-info-line {
  margin-bottom: 3px;

  color: #333;

  font-size: 12px;
  font-weight: 500;
}


.mlas-tuvi-canonical .tb-note-line {
  margin-top: 4px;

  color: #0b2265;

  font-size: 11px;
  font-weight: 700;

  text-align: center;
}


.mlas-tuvi-canonical .tb-note-row {
  display: block;
}


.mlas-tuvi-canonical table {
  width: 100%;

  margin-top: 6px;

  border-collapse: collapse;
  table-layout: fixed;

  background: #fff;

  font-size: 11px;

  text-align: center;
}


.mlas-tuvi-canonical th,
.mlas-tuvi-canonical td {
  padding: 4px;

  border: 1px solid #ddd;
}


.mlas-tuvi-canonical th {
  background: #f5f5f5;
  color: #444;

  font-weight: 700;
}


.mlas-tuvi-canonical .tb-can-chi-stack {
  display: inline-flex;
  flex-direction: column;

  align-items: center;
  justify-content: center;

  line-height: 1.05;
}


.mlas-tuvi-canonical
.tb-can-chi-stack span {
  display: block;

  font-weight: 700;
}


.mlas-tuvi-canonical .tieu-han-thien-ban {
  position: absolute;

  inset: 0;

  color: #333;

  font-size: 10px;
  font-weight: 700;

  pointer-events: none;
}


.mlas-tuvi-canonical
.tieu-han-center-label {
  position: absolute;

  transform: translate(-50%, -50%);

  padding: 1px 3px;

  border-radius: 2px;

  white-space: nowrap;

  text-align: center;
}


.mlas-tuvi-canonical
.tieu-han-center-active {
  border: 0;

  background: transparent;
  color: #d32f2f;

  padding: 1px 3px;

  line-height: inherit;
}


.mlas-tuvi-canonical .khong-vong-layer {
  position: absolute;

  z-index: 8;

  inset: 0;

  pointer-events: none;
}


.mlas-tuvi-canonical .khong-vong-label {
  position: absolute;

  transform: translate(-50%, -50%);

  padding: 2px 5px;

  border: 1px solid #fff;
  border-radius: 2px;

  background: #111;
  color: #fff;

  box-shadow: 0 1px 3px rgba(0,0,0,.25);

  font-size: 11px;
  font-weight: 700;

  line-height: 1.05;

  text-align: center;
}


.mlas-tuvi-canonical
.khong-vong-label.khong-vong-center-top {
  transform: translate(-50%, 2px);
}


.mlas-tuvi-canonical
.khong-vong-label.khong-vong-center-bottom {
  transform:
    translate(
      -50%,
      calc(-100% - 2px)
    );
}


/* Five-element palette */
.mlas-tuvi-canonical .hanh-moc {
  color: #00882d !important;
}

.mlas-tuvi-canonical .hanh-hoa {
  color: #d32f2f !important;
}

.mlas-tuvi-canonical .hanh-tho {
  color: #dfa100 !important;
}

.mlas-tuvi-canonical .hanh-kim {
  color: #758283 !important;
}

.mlas-tuvi-canonical .hanh-thuy {
  color: #0b2265 !important;
}


/*
 * Desktop chart geometry.
 */
@media (min-width:701px) {

  .mlas-tuvi-canonical.la-so-container {
    grid-template-rows:
      repeat(4,236px);

    height: auto;
    max-height: none;

    gap: 2px;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container {
    min-height: 0;

    overflow-x: hidden;
    overflow-y: auto;
  }


  .mlas-tuvi-canonical
  .cat-tinh-col,
  .mlas-tuvi-canonical
  .sat-tinh-col {
    font-size: 10px;

    line-height: 1.12;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua table {
    width: 84%;

    margin-top: 4px;

    font-size: 10px;

    line-height: 1.12;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th,
  .mlas-tuvi-canonical
  .thien-ban-giua td {
    padding: 2px 3px;

    line-height: 1.12;
  }
}


/*
 * Mobile canonical surface.
 *
 * Uses the final app row-aware auxiliary-star system.
 * The two sides share the same full-width visual row.
 */
@media (max-width:700px) {

  .mlas-tuvi-canonical.la-so-container {
    --android-phu-tinh-font: 5.20px;

    width: 100%;
    max-width: 100%;

    grid-template-rows:
      repeat(4,176px);

    gap: 0;

    margin-top: 6px;

    border-width: 1px;

    overflow: hidden;

    -webkit-text-size-adjust: none;
    text-size-adjust: none;
  }


  .mlas-tuvi-canonical .cung-so {
    padding: 3px 2px 10px;

    border-radius: 0;

    box-shadow:
      inset 0 0 0 1px #c8c8c8;

    font-size: 9px;
  }


  .mlas-tuvi-canonical
  .cung-top-row {
    padding-top: 9px;
  }


  .mlas-tuvi-canonical
  .ten-cung-chinh {
    padding: 1px 2px;

    font-size: 10px;
  }


  .mlas-tuvi-canonical
  .chinh-tinh-box {
    font-size: 9px;

    line-height: 1.1;
  }


  .mlas-tuvi-canonical
  .tu-hoa-box {
    min-height: 9px;

    margin-top: 1px;

    font-size: 7px;

    line-height: 1.02;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container,
  .mlas-tuvi-canonical
  .phu-tinh-container.is-smart-grid {
    display: grid !important;

    grid-template-columns:
      minmax(0,1fr) !important;

    grid-template-rows:
      auto !important;

    align-items:
      start !important;

    column-gap: 0 !important;
    row-gap: 0 !important;

    box-sizing:
      border-box !important;

    margin-top:
      2px !important;

    padding:
      0 2px 2px !important;

    overflow:
      hidden !important;

    overscroll-behavior:
      auto !important;

    scrollbar-width:
      none !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container::-webkit-scrollbar {
    display: none !important;

    width: 0 !important;
    height: 0 !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container > .cat-tinh-col,
  .mlas-tuvi-canonical
  .phu-tinh-container > .sat-tinh-col,
  .mlas-tuvi-canonical
  .phu-tinh-container.is-smart-grid > .cat-tinh-col,
  .mlas-tuvi-canonical
  .phu-tinh-container.is-smart-grid > .sat-tinh-col {
    display: flex !important;
    flex-direction: column !important;

    grid-area:
      1 / 1 !important;

    flex:
      none !important;

    width:
      100% !important;

    min-width:
      0 !important;

    max-width:
      100% !important;

    box-sizing:
      border-box !important;

    gap:
      0 !important;

    margin:
      0 !important;

    padding:
      0 !important;

    overflow:
      hidden !important;

    font-family:
      Roboto,
      "Noto Sans",
      Arial,
      sans-serif !important;

    font-size:
      var(--android-phu-tinh-font) !important;

    font-style:
      normal !important;

    font-weight:
      600 !important;

    line-height:
      1.26 !important;

    letter-spacing:
      0 !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container > .cat-tinh-col {
    align-items:
      flex-start !important;

    text-align:
      left !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container > .sat-tinh-col {
    align-items:
      flex-end !important;

    text-align:
      right !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container
  .cat-tinh-col > span,
  .mlas-tuvi-canonical
  .phu-tinh-container
  .sat-tinh-col > span {
    display:
      block !important;

    width:
      max-content !important;

    min-width:
      0 !important;

    max-width:
      none !important;

    box-sizing:
      border-box !important;

    margin:
      0 !important;

    padding:
      0 !important;

    overflow:
      hidden !important;

    white-space:
      nowrap !important;

    overflow-wrap:
      normal !important;

    word-break:
      normal !important;

    text-overflow:
      clip !important;

    font:
      inherit !important;

    line-height:
      inherit !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container .sao-ten,
  .mlas-tuvi-canonical
  .phu-tinh-container .sao-trang-thai {
    font:
      inherit !important;

    white-space:
      inherit !important;
  }


  .mlas-tuvi-canonical
  .cung-cuc-vong {
    bottom: 12px;

    width: 82%;

    font-family:
      Roboto,
      "Noto Sans",
      Arial,
      sans-serif !important;

    font-size:
      var(--android-phu-tinh-font) !important;

    font-style:
      normal !important;

    font-weight:
      600 !important;

    line-height:
      1.26 !important;
  }


  .mlas-tuvi-canonical
  .cung-dia-chi {
    font-size: 7px;
  }


  .mlas-tuvi-canonical
  .dai-han-box {
    font-size:
      7px !important;
  }


  .mlas-tuvi-canonical
  .dai-han-can-chi-box {
    top: 3px;
    left: 3px;

    font-size:
      6px !important;
  }


  .mlas-tuvi-canonical
  .dai-han-can-chi-box.is-tight {
    font-size:
      5.5px !important;
  }


  .mlas-tuvi-canonical
  .tieu-han-box {
    top: 13px;
    left: 3px;

    font-size: 7px;
  }


  .mlas-tuvi-canonical
  .nguyet-han-box {
    bottom: 2px;
    left: 3px;

    font-size: 7px;
  }


  .mlas-tuvi-canonical
  .nguyet-han-full {
    display: none;
  }


  .mlas-tuvi-canonical
  .nguyet-han-compact {
    display: inline;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua {
    padding:
      30px 4px 5px;

    overflow:
      hidden;
  }


  .mlas-tuvi-canonical
  .tb-title,
  .mlas-tuvi-canonical
  .tb-name,
  .mlas-tuvi-canonical
  .tb-info-line,
  .mlas-tuvi-canonical
  .tb-note-line,
  .mlas-tuvi-canonical
  .thien-ban-giua table,
  .mlas-tuvi-canonical
  .thien-ban-giua th,
  .mlas-tuvi-canonical
  .thien-ban-giua td,
  .mlas-tuvi-canonical
  .tb-can-chi-stack,
  .mlas-tuvi-canonical
  .tb-can-chi-stack span {
    font-family:
      "Noto Serif",
      serif !important;
  }


  .mlas-tuvi-canonical
  .tb-title {
    margin-bottom:
      1px !important;

    font-size: 12px;

    font-weight:
      600 !important;

    line-height:
      1.10 !important;

    letter-spacing:
      0 !important;
  }


  .mlas-tuvi-canonical
  .tb-name {
    margin-bottom:
      2px !important;

    font-size: 8px;

    font-weight:
      500 !important;

    line-height:
      1.16 !important;
  }


  .mlas-tuvi-canonical
  .tb-info-line,
  .mlas-tuvi-canonical
  .tb-note-line,
  .mlas-tuvi-canonical
  .thien-ban-giua table,
  .mlas-tuvi-canonical
  .thien-ban-giua th,
  .mlas-tuvi-canonical
  .thien-ban-giua td {
    color:
      #000 !important;

    font-size:
      7px !important;

    font-weight:
      700 !important;
  }


  .mlas-tuvi-canonical
  .tb-info-line {
    margin-top:
      0 !important;

    margin-bottom:
      4px !important;

    line-height:
      1.30 !important;
  }


  .mlas-tuvi-canonical
  .tb-note-line {
    margin-top:
      0 !important;

    margin-bottom:
      4px !important;

    line-height:
      1.30 !important;
  }


  .mlas-tuvi-canonical
  .tb-note-row {
    display:
      block !important;

    margin:
      0 0 4px !important;

    line-height:
      1.30 !important;
  }


  .mlas-tuvi-canonical
  .tb-note-row:last-child {
    margin-bottom:
      0 !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua table {
    width:
      78% !important;

    margin-top:
      4px !important;

    margin-bottom:
      4px !important;

    table-layout:
      fixed !important;

    line-height:
      1.30 !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th,
  .mlas-tuvi-canonical
  .thien-ban-giua td {
    padding:
      2px 1px !important;

    line-height:
      1.30 !important;

    white-space:
      nowrap !important;

    overflow-wrap:
      normal !important;

    word-break:
      normal !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th:first-child,
  .mlas-tuvi-canonical
  .thien-ban-giua td:first-child {
    width:
      30% !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th:not(:first-child),
  .mlas-tuvi-canonical
  .thien-ban-giua td:not(:first-child) {
    width:
      17.5% !important;
  }


  .mlas-tuvi-canonical
  .tb-can-chi-stack {
    display:
      inline-flex !important;

    flex-direction:
      column !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    line-height:
      1.15 !important;

    white-space:
      nowrap !important;
  }


  .mlas-tuvi-canonical
  .tb-can-chi-stack span {
    display:
      block !important;

    line-height:
      1.15 !important;

    white-space:
      nowrap !important;
  }


  .mlas-tuvi-canonical
  .tieu-han-thien-ban {
    font-size: 7px;
  }


  .mlas-tuvi-canonical
  .khong-vong-label {
    padding: 1px 4px;

    font-size: 9px;
  }


  /*
   * Final mobile palette from the app.
   */
  .mlas-tuvi-canonical
  .phu-tinh-container .hanh-moc,
  .mlas-tuvi-canonical
  .cung-cuc-vong .hanh-moc {
    color:
      #00B04A !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container .hanh-hoa,
  .mlas-tuvi-canonical
  .cung-cuc-vong .hanh-hoa {
    color:
      #F02B2C !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container .hanh-tho,
  .mlas-tuvi-canonical
  .cung-cuc-vong .hanh-tho {
    color:
      #DB9000 !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container .hanh-kim,
  .mlas-tuvi-canonical
  .cung-cuc-vong .hanh-kim {
    color:
      #73777C !important;
  }


  .mlas-tuvi-canonical
  .phu-tinh-container .hanh-thuy,
  .mlas-tuvi-canonical
  .cung-cuc-vong .hanh-thuy {
    color:
      #000000 !important;
  }
}


@media
  (max-width:700px)
  and (min-height:800px) {

  .mlas-tuvi-canonical.la-so-container {
    grid-template-rows:
      repeat(4,188px);
  }
}


@media (max-width:399px) {

  .mlas-tuvi-canonical
  .thien-ban-giua table {
    width:
      84% !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th:first-child,
  .mlas-tuvi-canonical
  .thien-ban-giua td:first-child {
    width:
      31% !important;
  }


  .mlas-tuvi-canonical
  .thien-ban-giua th:not(:first-child),
  .mlas-tuvi-canonical
  .thien-ban-giua td:not(:first-child) {
    width:
      17.25% !important;
  }
}


/* =========================================================
   TV-CANONICAL-4C1 SOURCE CREDIT
   ========================================================= */

.mlas-tuvi-canonical
.tb-source-line{
  margin:6px 0 0;
  text-align:center;

  font-family:
    "Noto Serif",
    serif;

  font-size:11px;
  font-weight:500;
  line-height:1.2;

  letter-spacing:.05px;

  color:#4b5563;
}


@media(max-width:700px){

  .mlas-tuvi-canonical
  .tb-source-line{
    margin-top:3px;
    font-size:8px;
    line-height:1.15;
  }
}

/* TV-CANONICAL-4C1 SOURCE CREDIT END */