/* Shared navigation and dialogs. Service navigation lives in one top header. */
.hiru-suite {
  position: relative;
  color: #f5f7fa;
  font:
    500 14px/1.6 "Hiru Pretendard",
    system-ui,
    sans-serif;
  text-align: left;
}
.hiru-suite * {
  box-sizing: border-box;
}
.hiru-suite button,
.hiru-suite a {
  font: inherit;
  cursor: pointer;
}
.hiru-suite-trigger {
  display: inline-flex;
  gap: 16px;
  align-items: center;
  min-height: 44px;
  padding: 9px 15px;
  background: #1b2533;
  color: #f5f7fa;
  border: 1px solid #354254;
  border-radius: 8px;
  white-space: nowrap;
}
.hiru-suite-trigger:hover {
  border-color: #d4fa87;
}
.hiru-suite-trigger[aria-expanded="true"] {
  color: #d4fa87;
}
.hiru-suite-panel {
  position: absolute;
  z-index: 60;
  right: 0;
  top: calc(100% + 12px);
  width: min(360px, calc(100vw - 32px));
  border: 1px solid #344154;
  border-radius: 14px;
  background: #101824;
  box-shadow: 0 20px 60px #03091040;
  padding: 20px;
  color: #f5f7fa;
}
.hiru-suite-panel[hidden] {
  display: none !important;
}
.hiru-suite-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.hiru-suite-head strong {
  font-size: 15px;
  color: #f5f7fa;
}
.hiru-suite-close {
  width: 44px;
  height: 44px;
  border: 1px solid #354254;
  background: transparent;
  border-radius: 8px;
  color: #f5f7fa;
  font-size: 24px !important;
}
.hiru-suite-account {
  padding: 20px 0;
}
.hiru-suite-account small {
  font-size: 12px;
  color: #b0bdcf;
}
.hiru-suite-email {
  display: block;
  margin-top: 7px;
  overflow-wrap: anywhere;
  font-size: 15px;
  font-weight: 600;
}
.hiru-suite-status {
  font-size: 13px;
  color: #b0bdcf;
  line-height: 1.8;
  margin: 8px 0 0;
}
.hiru-suite-signin,
.hiru-suite-logout {
  width: 100%;
  min-height: 44px;
  padding: 10px;
  border: 1px solid #425038;
  border-radius: 8px;
  background: #d4fa87;
  color: #14220d;
}
.hiru-suite-logout {
  background: #1b2533;
  color: #f5f7fa;
  border-color: #354254;
}
.hiru-suite-premium {
  display: block;
  margin-top: 16px;
  padding-top: 15px;
  border-top: 1px solid #354254;
  font-size: 13px !important;
  text-decoration: none;
  color: #d4fa87;
}
.hiru-suite :focus-visible {
  outline: 3px solid #d4fa87;
  outline-offset: 3px;
}
img[data-hiru-original] {
  cursor: zoom-in;
}
dialog.hiru-original-viewer {
  border: 0;
  border-radius: 14px;
  padding: 16px;
  max-width: 96vw;
  max-height: 94dvh;
  background: #101824;
  color: #fff;
  margin: auto;
  overflow: auto;
}
dialog.hiru-original-viewer::backdrop,
dialog.hiru-prompt-dialog::backdrop {
  background: #07101dcc;
  backdrop-filter: blur(5px);
}
.hiru-original-viewer img {
  display: block;
  max-width: 90vw;
  max-height: 78dvh;
  object-fit: contain;
  margin: auto;
  border-radius: 8px;
}
.hiru-original-viewer-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 12px;
  font-size: 14px;
}
.hiru-original-viewer-close {
  width: 44px;
  height: 44px;
  border: 1px solid #536174;
  border-radius: 8px;
  background: transparent;
  color: white;
  font: 400 24px system-ui;
  cursor: pointer;
}
