/* Public-site popup layouts: share APDRC's typography, navy, blue and mint. */
.conference-popups[hidden], .conference-popups [hidden] { display: none !important; }
.conference-popups {
    --popup-blue: var(--apdrc-blue, #2457d6);
    --popup-navy: var(--apdrc-navy, #001038);
    --popup-mint: var(--apdrc-mint, #35c6bd);
    --popup-width: min(540px, calc(100vw - 32px));
    position: fixed; inset: 0; z-index: 2500; pointer-events: none;
    color: var(--ink, #10213a); font: 14px/1.6 "Pretendard Variable", Pretendard, sans-serif;
}
.conference-popups *, .conference-popups *::before, .conference-popups *::after { box-sizing: border-box; }
.conference-popups button { font: inherit; cursor: pointer; }
.conference-popups button:disabled { cursor: wait; opacity: .6; }
.conference-popups button:focus-visible, .conference-popups a:focus-visible { outline: 3px solid var(--popup-mint); outline-offset: 3px; }
.conference-popups-backdrop { display: none; position: absolute; inset: 0; background: #00103899; pointer-events: auto; }
.conference-popups-panel {
    position: absolute; top: 24px; left: 24px; width: var(--popup-width);
    max-height: calc(100dvh - 48px); display: flex; flex-direction: column;
    background: var(--surface, #fff); border: 1px solid var(--line, #dce3ec);
    border-radius: 13px; box-shadow: 0 24px 80px #00103840; pointer-events: auto; overflow: hidden;
}
.conference-popups-header {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 6px 22px; background: var(--popup-navy); color: #fff; flex-shrink: 0;
}
.conference-popups-icon { display: inline-grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; padding: 0; border: 1px solid var(--line, #dce3ec); border-radius: 5px; background: transparent; color: inherit; font-size: 20px !important; line-height: 1; }
.conference-popups-header .conference-popups-icon { width: 32px; height: 32px; border: 1px solid #b8c7df; }
.conference-popups-header .conference-popups-icon svg { display: block; width: 18px; height: 18px; }
.conference-popups-header .conference-popups-icon:hover { border-color: #fff; background: #ffffff18; }
.conference-popups-stage { display: grid; min-height: 0; overflow: hidden; }
.conference-popup-card { grid-area: 1 / 1; min-width: 0; min-height: 0; max-height: 56dvh; background: var(--surface, #fff); overflow: auto; overscroll-behavior: contain; }
.conference-popup-content { padding: 0; overflow-wrap: anywhere; }
.conference-popup-html { display: flow-root; }
.conference-popup-html p { margin: 0 0 12px; }
.conference-popup-html > :last-child { margin-bottom: 0; }
.conference-popup-html img, .conference-popup-image { display: block; width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 !important; object-fit: contain; }
.conference-popup-html figure { margin: 0; }
.conference-popup-html table { max-width: 100%; width: 100%; }
.conference-popup-html td, .conference-popup-html th { overflow-wrap: anywhere; }
.conference-popup-html iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }
.conference-popup-html a { color: var(--popup-blue); text-decoration: underline; }
.conference-popup-details { display: flex; justify-content: space-between; gap: 16px; margin-top: 18px; padding: 11px 15px; border-radius: 5px; color: #fff; background: var(--popup-blue); font-weight: 600; }
.conference-popup-details:hover { color: #fff; background: var(--apdrc-blue2, #004f98); text-decoration: none; }
.conference-popups-controls { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 20px; border-top: 1px solid var(--line, #dce3ec); flex-shrink: 0; }
.conference-popups-controls .conference-popups-icon:hover { color: var(--popup-blue); background: var(--surface-soft, #f3f6fa); }
.conference-popups-counter { min-width: 50px; text-align: center; color: var(--muted, #66758b); font-variant-numeric: tabular-nums; }
.conference-popups-counter [data-popup-current] { color: var(--popup-blue); font-weight: 700; }
.conference-popups-pause { border: 0; background: transparent; color: var(--muted, #66758b); text-decoration: underline; padding: 7px; }
.conference-popups-hide { padding: 6px 0; border: 0; background: transparent; color: #ffffffd9; font-size: 13px !important; line-height: 20px; text-align: left; }
.conference-popups-hide:hover { color: var(--popup-mint); text-decoration: underline; }
.conference-popups-error { flex-shrink: 0; margin: 0; padding: 10px 20px; color: #b42318; background: #fff1f0; font-size: 13px; }
.conference-popup-image-error { padding: 16px; color: var(--muted, #66758b); border: 1px dashed var(--line, #dce3ec); }
.conference-popups[data-layout="2"] .conference-popups-panel,
.conference-popups[data-layout="4"] .conference-popups-panel { top: 50%; left: 50%; transform: translate(-50%, -50%); }
.conference-popups[data-layout="3"] .conference-popups-panel { left: auto; right: 24px; }

/* The deck floats freely, with back cards peeking below the reading surface. */
.conference-popups[data-layout="4"] .conference-popup-card { border-radius: 8px; height: min(48dvh, 430px); max-height: 48dvh; transform-origin: center bottom; transition: transform .38s cubic-bezier(.22, 1, .36, 1), opacity .38s; }
.conference-popups[data-layout="4"] .conference-popup-card[data-position="center"] { z-index: 3; transform: translateY(0); }
.conference-popups[data-layout="4"] .conference-popup-card[data-position="right"] { z-index: 2; transform: translateY(12px) scale(.96); }
.conference-popups[data-layout="4"] .conference-popup-card[data-position="left"] { z-index: 1; transform: translateY(24px) scale(.92); }

/* Three-card layouts share navigation and header actions, without duplicating content. */
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"], [data-layout="8"]) .conference-popups-backdrop { display: block; }
.conference-popups:is([data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-panel { top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(1160px, calc(100vw - 64px)); }
.conference-popups:is([data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popup-card { border-radius: 8px; height: min(48dvh, 430px); }
/* Central card layouts float their cards and actions directly over the backdrop. */
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-backdrop { background: #001038b8; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-panel { background: transparent; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-header { padding: 0 0 12px; background: transparent; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-hide { color: #fff; text-shadow: 0 1px 4px #00103880; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-hide:hover { color: var(--popup-mint); }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-stage { padding: 0; background: transparent; overflow: visible; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popup-card { border: 0; box-shadow: 0 12px 32px #00103840; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-controls { margin-top: 18px; padding: 0; border: 0; background: transparent; color: #fff; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-controls .conference-popups-icon { width: 40px; height: 40px; border-radius: 50%; border-color: #ffffffa6; background: #00103840; color: #fff; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-controls .conference-popups-icon:hover { border-color: #fff; background: #ffffff26; color: #fff; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-counter,
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-counter [data-popup-current],
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-pause { color: #fff; text-shadow: 0 1px 4px #00103880; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-counter { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 58px; height: 32px; padding: 0 8px; border-radius: 16px; background: #00103899; text-shadow: none; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-pause { min-width: 64px; height: 40px; padding: 0 12px; border: 1px solid #ffffff80; border-radius: 20px; background: #00103840; text-decoration: none; }
.conference-popups:is([data-layout="4"], [data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-pause:hover { color: #fff; border-color: #fff; background: #ffffff26; }
.conference-popups[data-layout="4"] .conference-popups-controls { margin-top: 42px; }
.conference-popups[data-layout="5"] .conference-popups-stage { display: flex; gap: 20px; justify-content: center; }
.conference-popups[data-layout="5"] .conference-popup-card { flex: 1 1 0; max-width: 520px; }
.conference-popups[data-layout="5"] .conference-popup-card[data-position="left"] { order: 0; }
.conference-popups[data-layout="5"] .conference-popup-card[data-position="center"] { order: 1; }
.conference-popups[data-layout="5"] .conference-popup-card[data-position="right"] { order: 2; }
.conference-popups:is([data-layout="6"], [data-layout="7"]) .conference-popups-stage { perspective: 1200px; }
.conference-popups:is([data-layout="6"], [data-layout="7"]) .conference-popup-card { width: min(50%, 500px); justify-self: center; transition: transform .4s, opacity .4s; }
.conference-popups:is([data-layout="6"], [data-layout="7"]) .conference-popup-card[data-position="center"] { z-index: 3; }
.conference-popups[data-layout="6"] .conference-popup-card[data-position="left"] { transform: translateX(-55%) rotate(-5deg) scale(.85); opacity: .65; }
.conference-popups[data-layout="6"] .conference-popup-card[data-position="right"] { transform: translateX(55%) rotate(5deg) scale(.85); opacity: .65; }
.conference-popups[data-layout="7"] .conference-popup-card[data-position="left"] { transform: translateX(-62%) rotateY(35deg) scale(.82); opacity: .65; }
.conference-popups[data-layout="7"] .conference-popup-card[data-position="right"] { transform: translateX(62%) rotateY(-35deg) scale(.82); opacity: .65; }
.conference-popups:is([data-layout="5"], [data-layout="6"], [data-layout="7"])[data-count="1"] .conference-popups-panel { width: var(--popup-width); }
.conference-popups:is([data-layout="6"], [data-layout="7"])[data-count="1"] .conference-popup-card { width: 100%; }
.conference-popups[data-layout="5"][data-count="2"] .conference-popups-panel { width: min(900px, calc(100vw - 32px)); }
.conference-popups[data-layout="8"] .conference-popups-panel { left: auto; right: 0; top: 0; height: 100dvh; max-height: 100dvh; border-radius: 0; border-right: 0; animation: conference-popup-drawer .35s ease-out; }
.conference-popups[data-layout="8"] .conference-popups-stage { flex: 1; }
.conference-popups[data-layout="8"] .conference-popup-card { max-height: none; }
@keyframes conference-popup-drawer { from { transform: translateX(100%); } to { transform: translateX(0); } }
@media (max-width: 700px) {
    .conference-popups[data-layout="4"] .conference-popups-controls { margin-top: 18px; }
    .conference-popups-panel, .conference-popups[data-layout="3"] .conference-popups-panel { left: 16px; right: auto; top: 16px; max-height: calc(100dvh - 32px); }
    .conference-popups:is([data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popups-panel { width: calc(100vw - 32px); }

    .conference-popups:is([data-layout="5"], [data-layout="6"], [data-layout="7"]) .conference-popup-card { width: 100%; height: min(48dvh, 430px); }
    .conference-popups-header { padding: 6px 16px; }
    .conference-popups[data-layout="8"] .conference-popups-panel { left: auto; right: 0; top: 0; width: 100%; max-height: 100dvh; }
}
@media (prefers-reduced-motion: reduce) {
    .conference-popups *, .conference-popups *::before { animation: none !important; transition: none !important; }
}
