/* Shared guest journeys. Scoped to these dialogs, with no external artwork. */
.omu-auth-dialog { position: fixed; inset: 0; z-index: 120; overflow-y: auto; overscroll-behavior: contain; color: #242427; font-family: Pretendard, -apple-system, BlinkMacSystemFont, sans-serif; }
.omu-auth-dialog.hidden { display: none !important; }
.omu-auth-backdrop { position: fixed; inset: 0; background: rgba(25, 25, 29, .42); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.omu-auth-center { position: relative; display: grid; place-items: center; min-height: 100dvh; width: 100%; padding: 28px; pointer-events: none; }
.omu-auth-panel { pointer-events: auto; position: relative; width: min(760px, 100%); display: grid; grid-template-columns: .85fr 1.15fr; overflow: hidden; border-radius: 24px; border: 1px solid rgba(255,255,255,.7); background: #fff; box-shadow: 0 28px 100px rgba(27, 24, 28, .22); animation: omuAuthEnter .25s cubic-bezier(.2,.8,.2,1); }
.omu-auth-dialog *, .omu-auth-dialog *::before, .omu-auth-dialog *::after { box-sizing: border-box; }
.omu-auth-close { display: grid; place-items: center; position: absolute; z-index: 2; top: 12px; right: 12px; width: 40px; height: 40px; min-width: 40px; min-height: 40px; padding: 0; border: 0; border-radius: 50%; background: #f3f3f5; color: #727278; cursor: pointer; }
.omu-auth-close svg { width: 19px; height: 19px; }
.omu-auth-close:hover { background: #e8e8ec; color: #242427; }
.omu-auth-dialog :is(button,a):focus-visible { outline:3px solid var(--omu-primary, #6D3BE8); outline-offset: 4px; }
.omu-auth-dialog button { font-family: inherit; }
.omu-auth-art { min-width: 0; position: relative; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 32px 28px; background:var(--omu-primary-soft, #F5F1FD); border-right:1px solid var(--omu-primary-soft-strong, #EBE4FC); }
.omu-auth-brand { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 1; font-weight: 700; letter-spacing: -.3px; color: #4a4244; }
.omu-auth-brand svg { width: 25px; height: 25px; color:var(--omu-primary, #6D3BE8); }
.omu-auth-art-caption { margin: 0; color:var(--omu-primary, #6D3BE8); font-size: 11px; letter-spacing: 1.7px; font-weight: 650; line-height: 1.8; }
.omu-auth-record { position: relative; display: grid; place-items: center; width: 220px; height: 228px; margin: 28px auto 20px; transform: translateX(-7px); }
.omu-auth-record::before { content: ''; position: absolute; width: 190px; height: 190px; border-radius: 50%; background: repeating-radial-gradient(circle at center, #26262b 0 2px, #323238 3px 4px); transform: translateX(36px); box-shadow: 9px 10px 22px #2a202c21; }
.omu-auth-record::after { content: ''; position: absolute; width: 43px; height: 43px; background:var(--omu-primary-border, #DCD0F9); border:16px solid var(--omu-primary, #6D3BE8); border-radius: 50%; transform: translateX(36px); }
.omu-auth-sleeve { position: absolute; z-index: 1; top: 20px; left: 0; display: flex; flex-direction: column; justify-content: space-between; width: 170px; height: 190px; padding: 20px; border:1px solid var(--omu-primary-border, #DCD0F9); background:var(--omu-primary-border, #DCD0F9); color:var(--omu-primary-ink, #572FBA); box-shadow:0 14px 30px rgba(var(--omu-primary-rgb, 109, 59, 232), 0.1255); transform: rotate(-7deg); }
.omu-auth-sleeve > span { font-size: 10px; letter-spacing: 2px; font-weight: 700; }
.omu-auth-sleeve > svg { width: 42px; height: 42px; stroke-width: 1.1; }
.omu-auth-sleeve > strong { font-size: 19px; line-height: 1.25; font-weight: 650; letter-spacing: -.8px; }
.omu-auth-content { padding: 58px 40px 32px; min-width: 0; }
.omu-auth-eyebrow { margin: 0 0 13px; color:var(--omu-primary, #6D3BE8); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; }
.omu-auth-title { margin: 0 0 13px; color: #242427; font-size: 29px; line-height: 1.3; font-weight: 730; letter-spacing: -1.2px; word-break: keep-all; }
.omu-auth-description { margin: 0 0 27px; color: #73737a; font-size: 13px; line-height: 1.75; word-break: keep-all; }
.omu-auth-providers { display: grid; gap: 10px; }
.omu-auth-providers [data-omu-provider] { display: flex; align-items: center; justify-content: center; position: relative; width: 100%; min-height: 51px; gap: 11px; padding: 13px 16px; border: 1px solid #e2e2e7; border-radius: 11px; background: #fff; color: #303035; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.omu-auth-providers [data-omu-provider] > svg { position: absolute; left: 17px; width: 19px; height: 19px; flex-shrink: 0; }
.omu-auth-providers [data-omu-provider="naver"] > svg { width: 16px; height: 16px; left: 19px; color: #03a650; }
.omu-auth-providers [data-omu-provider="kakao"] > svg { color: #352d21; }
.omu-auth-providers [data-omu-provider="kakao"] { background: #fee500; border-color: #fee500; color: #292719; }
.omu-auth-providers [data-omu-provider]:hover { background: #f7f7f9; }
.omu-auth-providers [data-omu-provider="kakao"]:hover { background: #f3db00; }
.omu-auth-providers [data-omu-provider]:active, .omu-auth-primary:active { transform: scale(.985); }
.omu-auth-footnote { margin: 22px 0 0; color: #87878e; font-size: 11px; line-height: 1.8; word-break: keep-all; }
.omu-auth-legal { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 11px; }
.omu-auth-legal a { color: #797980; font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
.omu-auth-legal a:hover { color: #242427; }
.omu-feature-benefits { display: grid; gap: 13px; margin: 25px 0 30px; padding: 0; list-style: none; }
.omu-feature-benefits li { display: flex; align-items: center; gap: 10px; color: #4e4e55; font-size: 13px; line-height: 1.5; }
.omu-feature-benefits li::before { content: ''; width: 15px; height: 15px; flex: 0 0 15px; border:1px solid var(--omu-primary-border, #DCD0F9); border-radius: 50%; background:var(--omu-primary-soft, #F5F1FD); box-shadow: inset 0 0 0 4px #fff; }
.omu-auth-primary { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 50px; padding: 13px 18px; border:1px solid var(--omu-primary, #6D3BE8); border-radius: 11px; background:var(--omu-primary, #6D3BE8); color: #fff; font-size: 14px; font-weight: 650; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.omu-auth-primary:hover { background:var(--omu-primary-hover, #5D32C5); }
.omu-auth-primary svg { width: 17px; height: 17px; }
.omu-auth-secondary { display: block; width: 100%; padding: 16px 8px 0; border: 0; background: transparent; color: #77777f; font-size: 12px; line-height: 1.5; cursor: pointer; }
.omu-auth-secondary strong { margin-left: 5px; color: #424248; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.omu-feature-visual { position: relative; display: grid; place-items: center; width: 100%; min-height: 224px; margin: 20px 0; }
.omu-feature-object { position: relative; display: grid; place-items: center; width: 176px; height: 190px; border:1px solid var(--omu-primary-border, #DCD0F9); border-radius: 14px; background: #fbf7f5; box-shadow:0 15px 30px rgba(var(--omu-primary-rgb, 109, 59, 232), 0.0863); transform: rotate(-5deg); }
.omu-feature-object > svg { width: 61px; height: 61px; stroke:var(--omu-primary, #6D3BE8); stroke-width: 1.3; }
.omu-feature-object > span { position: absolute; bottom: 22px; color:var(--omu-primary, #6D3BE8); font-size: 10px; letter-spacing: 1.6px; font-weight: 600; }
.omu-feature-wave { position: absolute; bottom: 62px; display: flex; align-items: center; gap: 4px; height: 22px; opacity: .5; }
.omu-feature-wave i { display: block; width: 3px; height: var(--bar, 12px); border-radius: 4px; background:var(--omu-primary, #6D3BE8); }
.omu-feature-object > svg { transform: translateY(-17px); }
.omu-feature-visual::before { content: ''; position: absolute; width: 176px; height: 190px; border:1px solid var(--omu-primary-border, #DCD0F9); border-radius: 14px; background:var(--omu-primary-soft-strong, #EBE4FC); transform: rotate(6deg) translate(12px,2px); }
[data-feature="songs"] .omu-feature-object { background:var(--omu-primary-border, #DCD0F9); }
[data-feature="songs"] .omu-feature-visual::before { background:var(--omu-primary-border, #DCD0F9); }
[data-feature="albums"] .omu-feature-object { background: #e9d9cb; border-color: #d6c5b6; }
[data-feature="albums"] .omu-feature-visual::before { background: #b98f7c; border-color: #b98f7c; }
[data-feature="albums"] .omu-feature-object > svg { stroke: #8b604d; }
[data-feature="release"] .omu-feature-object { background: #35363c; border-color: #35363c; }
[data-feature="release"] .omu-feature-object > svg { stroke:var(--omu-primary-soft-strong, #EBE4FC); }
[data-feature="release"] .omu-feature-object > span { color:var(--omu-primary-border, #DCD0F9); }
[data-feature="release"] .omu-feature-wave i { background:var(--omu-primary-border, #DCD0F9); }
[data-feature="tools"] .omu-feature-object { background: #e4e7e4; border-color: #c8d0ca; }
[data-feature="tools"] .omu-feature-object > svg { stroke: #647b6c; }

/* Explicitly override the older shared utility skin for the redesigned login. */
body.omu-interface-v2 .omu-auth-dialog .omu-auth-brand { justify-content: flex-start; gap: 8px; min-height: 25px; height: auto; margin: 0; }
body.omu-interface-v2 .omu-auth-dialog .omu-auth-description { margin: 0 0 27px; text-align: left; font-size: 13px; line-height: 1.75; }
body.omu-interface-v2 .omu-auth-dialog .omu-auth-primary { font-size: 14px; font-weight: 650; line-height: 1.5; }
body.omu-interface-v2 .omu-auth-dialog .omu-auth-secondary { font-size: 12px; font-weight: 400; line-height: 1.5; }
html body.omu-interface-v2 #loginModal [data-omu-backdrop] { background: rgba(25,25,29,.42) !important; -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
html body.omu-interface-v2 #loginModal [data-omu-modal-center] { max-width: none !important; padding: 28px !important; }
html body.omu-interface-v2 #loginModal [data-omu-modal-panel] { display: grid; grid-template-columns: .85fr 1.15fr; width: min(760px,100%); max-height: none !important; padding: 0 !important; overflow: hidden; border-radius: 24px !important; background: #fff !important; color: #242427 !important; box-shadow: 0 28px 100px rgba(27,24,28,.22) !important; }
html body.omu-interface-v2 #loginModal #loginModalTitle { color: #242427 !important; font-size: 29px; font-weight: 730; line-height: 1.3; letter-spacing: -1.2px; }
html body.omu-interface-v2 #loginModal .omu-auth-eyebrow { color:var(--omu-primary, #6D3BE8) !important; }
html body.omu-interface-v2 #loginModal .omu-auth-description { color: #73737a !important; }
html body.omu-interface-v2 #loginModal .omu-auth-art-caption { color:var(--omu-primary, #6D3BE8) !important; }
html body.omu-interface-v2 #loginModal .omu-auth-footnote { color: #87878e !important; }
html body.omu-interface-v2 #loginModal [data-omu-provider] { min-height: 51px !important; border-radius: 11px !important; background: #fff !important; color: #303035 !important; border: 1px solid #e2e2e7 !important; }
html body.omu-interface-v2 #loginModal [data-omu-provider="kakao"] { background: #fee500 !important; border-color: #fee500 !important; color: #292719 !important; }
html body.omu-interface-v2 #loginModal [data-omu-provider]:hover { background: #f7f7f9 !important; }
html body.omu-interface-v2 #loginModal [data-omu-provider="kakao"]:hover { background: #f3db00 !important; }
html body.omu-interface-v2 #loginModal [data-omu-modal-panel] .omu-auth-close { width: 40px; min-width: 40px; height: 40px; min-height: 40px; background: #f3f3f5 !important; color: #727278 !important; }
@keyframes omuAuthEnter { from { opacity: 0; transform: translateY(10px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 650px) {
  .omu-auth-center, html body.omu-interface-v2 #loginModal [data-omu-modal-center] { padding: 16px !important; }
  .omu-auth-panel, html body.omu-interface-v2 #loginModal [data-omu-modal-panel] { grid-template-columns: 1fr; max-width: 420px; border-radius: 20px !important; }
  .omu-auth-art { min-height: 0; padding: 22px 26px; border: 0; border-bottom:1px solid var(--omu-primary-soft-strong, #EBE4FC); }
  .omu-auth-record { display: none; }
  .omu-auth-art-caption { margin: 10px 0 0; font-size: 9px; letter-spacing: 1.2px; }
  .omu-auth-content { padding: 28px 26px; }
  .omu-auth-title, html body.omu-interface-v2 #loginModal #loginModalTitle { font-size: 26px; letter-spacing: -.9px; }
  .omu-auth-description { margin-bottom: 22px; font-size: 13px; }
  .omu-auth-close { background: #ffffffc9; }
  .omu-feature-visual { position: absolute; right: 32px; top: 0; width: 94px; min-height: 116px; height: 116px; margin: 0; }
  .omu-feature-object { width: 62px; height: 69px; border-radius: 7px; }
  .omu-feature-object > svg { width: 29px; height: 29px; transform: none; }
  .omu-feature-object > span, .omu-feature-wave { display: none; }
  .omu-feature-visual::before { width: 62px; height: 69px; border-radius: 7px; transform: rotate(6deg) translate(5px,0); }
  #omuCreatePreview .omu-auth-art { min-height: 116px; justify-content: center; padding-right: 128px; }
  #omuCreatePreview .omu-auth-close { top: 8px; right: 8px; background: transparent; }
  #omuCreatePreview .omu-auth-content { padding-top: 29px; }
  #omuCreatePreview .omu-auth-eyebrow { padding-right: 30px; }
  .omu-feature-benefits { margin: 23px 0 27px; }
}
@media (max-width: 360px) {
  .omu-auth-content { padding: 26px 21px; }
  .omu-auth-title, html body.omu-interface-v2 #loginModal #loginModalTitle { font-size: 24px; }
  .omu-auth-providers [data-omu-provider] { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .omu-auth-panel { animation: none; } .omu-auth-dialog button { transition: none; } }
