/* Shared navigation and dialogs. Service navigation lives in one top header. */
.hiru-suite {
  position: relative;
  color: #0b1a22;
  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: 40px;
  padding: 9px 17px;
  background: transparent;
  color: #0b1a22;
  border: 1px solid #9fcdbd;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.hiru-suite-trigger:hover {
  background: #73e2c02e;
}
.hiru-suite-trigger[aria-expanded="true"] {
  color: #0b7f63;
}
.hiru-suite-panel {
  position: absolute;
  z-index: 60;
  right: 0;
  top: calc(100% + 12px);
  width: min(360px, calc(100vw - 32px));
  border: 1px solid #d3e3dc;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 20px 60px #0b1a2226;
  padding: 20px;
  color: #0b1a22;
}
.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: #0b1a22;
}
.hiru-suite-close {
  width: 44px;
  height: 44px;
  border: 1px solid #d3e3dc;
  background: transparent;
  border-radius: 8px;
  color: #0b1a22;
  font-size: 24px !important;
}
.hiru-suite-account {
  padding: 20px 0;
}
.hiru-suite-account small {
  font-size: 12px;
  color: #58707a;
}
.hiru-suite-email {
  display: block;
  margin-top: 7px;
  overflow-wrap: anywhere;
  font-size: 15px;
  font-weight: 600;
}
.hiru-suite-status {
  font-size: 13px;
  color: #58707a;
  line-height: 1.8;
  margin: 8px 0 0;
}
.hiru-suite-signin,
.hiru-suite-logout {
  width: 100%;
  min-height: 44px;
  padding: 10px;
  border: 1px solid #73e2c0;
  border-radius: 8px;
  background: #73e2c0;
  color: #08231b;
}
.hiru-suite-logout {
  background: #ffffff;
  color: #0b1a22;
  border-color: #d3e3dc;
}
.hiru-suite-premium {
  display: block;
  margin-top: 16px;
  padding-top: 15px;
  border-top: 1px solid #d3e3dc;
  font-size: 13px !important;
  text-decoration: none;
  color: #0b7f63;
}
.hiru-suite :focus-visible {
  outline: 3px solid #73e2c0;
  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: #f5faf8;
  color: #0b1a22;
  margin: auto;
  overflow: auto;
}
dialog.hiru-original-viewer::backdrop,
dialog.hiru-prompt-dialog::backdrop {
  background: #0b1a2266;
  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 #d3e3dc;
  border-radius: 8px;
  background: transparent;
  color: #0b1a22;
  font: 400 24px system-ui;
  cursor: pointer;
}

/* Crossing to the owner world (hiruai.com): a burst in the destination palette, then navigation.
   Same overlay as app/unify.css on the company site; driven by hiruai-suite.js. */
.world-jump { position: fixed; inset: 0; z-index: 9999; pointer-events: none; overflow: hidden; }
.world-jump-disc { position: absolute; left: var(--x); top: var(--y); width: 40px; height: 40px; margin: -20px 0 0 -20px; border-radius: 50%; background: var(--bg); box-shadow: 0 0 0 6px var(--accent); transform: scale(0); }
.world-jump.is-on .world-jump-disc { animation: world-disc 0.58s cubic-bezier(0.3, 0.7, 0.2, 1) forwards; }
@keyframes world-disc { to { transform: scale(140); box-shadow: 0 0 0 0 var(--accent); } }
.world-jump i { position: absolute; left: var(--x); top: var(--y); width: 12px; height: 12px; margin: -6px; border-radius: 3px; opacity: 0; transform: rotate(var(--a)) translateX(0) scale(var(--s)); }
.world-jump.is-on i { animation: world-spark 0.62s ease-out forwards; }
@keyframes world-spark { 0% { opacity: 1; transform: rotate(var(--a)) translateX(0) scale(var(--s)); } 100% { opacity: 0; transform: rotate(var(--a)) translateX(var(--d)) scale(0.2); } }
.world-jump-label { position: absolute; left: 50%; top: 50%; margin: 0; transform: translate(-50%, -50%) translateY(16px); color: var(--ink); font: 700 15px/1.4 "Hiru Pretendard", system-ui, sans-serif; letter-spacing: -0.02em; opacity: 0; }
.world-jump.is-on .world-jump-label { animation: world-label 0.45s 0.2s ease-out forwards; }
@keyframes world-label { to { opacity: 1; transform: translate(-50%, -50%); } }