[hidden] { display: none !important; }
.rb-weather { color: #111827; }

/* header */
.rb-weather .rbw-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rb-weather .rbw-title-wrap { display: flex; align-items: center; gap: 8px; }
.rb-weather .rbw-title { font-weight: 700; font-size: 20px; }
.rb-weather .rbw-meta { color: #6b7280; font-size: 12px; }

.rb-weather .rbw-ico-btn { background: transparent; border: 0; padding: 2px; cursor: pointer; color: #6b7280; line-height: 0; }
.rb-weather .rbw-ico-btn:hover { color: #111; }
.rb-weather .rbw-ico-btn[disabled] { opacity: .6; cursor: default; }
.rb-weather .rbw-ico-btn .size-6 { width: 20px; height: 20px; }

.rb-weather .rbw-body { margin-top: 8px; }

/* loading status */
.rb-weather .rbw-status { display: flex; align-items: center; gap: 8px; color: #6b7280; }
.rb-weather .rbw-spinner { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #e5e7eb; border-top-color: #111; display: inline-block; animation: rbw-spin .8s linear infinite; }
@keyframes rbw-spin { to { transform: rotate(360deg); } }

/* ? »ó´Ü(¾ÆÀÌÄÜ/¹®±¸/¿Âµµ) Á¤¸®: ´Ù´Ú´Ù´Ú ¹æÁö + ±ÕÇü */
.rb-weather .rbw-main{
  display: flex;                  /* grid -> flex */
  align-items: center;
  justify-content: flex-start;
  gap: 18px;                      /* ¾ÆÀÌÄܺí·Ï-¿Âµµ °£°Ý */
  margin: 14px 0 12px;            /* »ó´Ü ¿©¹é */
}

.rb-weather .rbw-pty{
  color: #6b7280;
  display: flex;
  flex-direction: column;         /* ¾ÆÀÌÄÜ À§, ¹®±¸ ¾Æ·¡ */
  align-items: center;
  gap: 6px;
  min-width: 96px;                /* ? ¿ÞÂÊ ºí·Ï Æø È®º¸(´Ù´Ú ¹æÁö) */
  text-align: center;
  line-height: 1.15;
  white-space: normal;
}

.rb-weather .rbw-pty .rbw-cond-icon{
  width: 56px;                    /* ¾ÆÀÌÄÜ Å©±â */
  height: 56px;
  vertical-align: middle;
}

.rb-weather .rbw-temp{
  font-size: 34px;                /* ¿Âµµ °­Á¶ */
  font-weight: 800;
  letter-spacing: -0.5px;
}

/* ? ÇÏ´Ü 3Ä­: ¿ìÃø ¿©¹é ¡°ÅÖ ºó ´À³¦¡± ÁÙÀÌ°í ±ÕÇü ¸ÂÃß±â */
.rb-weather .rbw-list{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

.rb-weather .rbw-list > div{
  padding: 10px 8px;
  border-radius: 10px;
  background: #f9fafb;            /* »ì¦ Ä«µå ´À³¦(¿øÄ¡ ¾ÊÀ¸¸é Á¦°Å °¡´É) */
  text-align: center;             /* ? °¡¿îµ¥ Á¤·Ä·Î ±ÕÇü */
}

.rb-weather .rbw-list dt{
  color: #6b7280;
  font-size: 12px;
  margin-bottom: 4px;
}

.rb-weather .rbw-list dd{
  font-weight: 700;
}

/* footer */
.rb-weather .rbw-footer { margin-top: 12px; display: flex; justify-content: flex-end; }
.rb-weather .rbw-btn { background: #111; color: #fff; border: 0; padding: 8px 12px; border-radius: 8px; cursor: pointer; }
.rb-weather .rbw-btn:hover { opacity: .9; }

/* compact */
.rb-weather.is-compact .rbw-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* refresh rotate while loading */
@keyframes rbw-rotate { to { transform: rotate(360deg); } }
.rb-weather.is-loading .rbw-ico-btn .size-6 { animation: rbw-rotate .9s linear infinite; transform-origin: 50% 50%; }

/* shimmer */
@keyframes rbw-shimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.rb-weather.is-loading [data-rbw="temp"],
.rb-weather.is-loading [data-rbw="pty"],
.rb-weather.is-loading [data-rbw="humidity"],
.rb-weather.is-loading [data-rbw="wind"],
.rb-weather.is-loading [data-rbw="rain1h"] {
  color: transparent !important;
  background: #f3f4f6;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}
.rb-weather.is-loading [data-rbw="temp"] { width: 88px; height: 36px; }
.rb-weather.is-loading [data-rbw="pty"] { width: 140px; height: 20px; }
.rb-weather.is-loading [data-rbw="humidity"],
.rb-weather.is-loading [data-rbw="wind"],
.rb-weather.is-loading [data-rbw="rain1h"] { width: 64px; height: 16px; }
.rb-weather.is-loading [data-rbw="temp"]::after,
.rb-weather.is-loading [data-rbw="pty"]::after,
.rb-weather.is-loading [data-rbw="humidity"]::after,
.rb-weather.is-loading [data-rbw="wind"]::after,
.rb-weather.is-loading [data-rbw="rain1h"]::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.7), rgba(255,255,255,0));
  animation: rbw-shimmer 1.2s infinite;
}