/* Responsive layout and interactions for the independent static replica. */
html,body{height:100%;margin:0;padding:0}
body{background:#211c30;color:#1c1c1c}
.Profile{height:100%;overflow-x:hidden;overflow-y:auto;position:relative;isolation:isolate}
.Profile .MuiContainer-root{width:100%;max-width:600px;box-sizing:border-box;margin-left:auto;margin-right:auto}
.Profile .MuiGrid-container{display:flex;flex-wrap:wrap;box-sizing:border-box;width:100%;flex-direction:row}
.Profile .MuiGrid-root{box-sizing:border-box;min-width:0}
.Profile .MuiBadge-root{position:relative;display:inline-flex;vertical-align:middle;flex-shrink:0}
.Profile .MuiBadge-badge{display:none}
.Profile .MuiButtonBase-root{display:inline-flex;align-items:center;justify-content:center;position:relative;box-sizing:border-box;-webkit-tap-highlight-color:transparent;outline:0;border:0;margin:0;cursor:pointer;user-select:none;vertical-align:middle;text-decoration:none;color:inherit}
.Profile .MuiIconButton-root{flex:0 0 auto;padding:0;overflow:visible;border-radius:50%;color:#6b7280;background:#f3f4f6}
.Profile .MuiButton-root{font-weight:500;font-size:12px;line-height:1.4;text-transform:uppercase;min-width:64px;padding:6px 12px;height:32px;background:#f3f4f6;color:#374151}
.Profile .MuiTouchRipple-root{display:none}
.Profile .MuiPaper-root{background:#211c30;border-radius:25px;box-shadow:none;color:#f7f4ff;overflow:hidden}
.Profile [data-top-chrome]{position:fixed;top:0;left:50%;transform:translateX(-50%);width:calc(100% - 40px);max-width:560px;z-index:20;pointer-events:none;box-sizing:content-box;transition:opacity 220ms linear}
.Profile [data-top-chrome] button{pointer-events:auto}
.Profile .Links.carousel{overscroll-behavior-x:contain;scroll-behavior:smooth;touch-action:pan-x pan-y}
.Profile .Links.carousel.dragging{scroll-behavior:auto;cursor:grabbing;user-select:none}
.Profile .Links.carousel.dragging a{pointer-events:none}
.Profile .Links [role=button]{touch-action:manipulation}
.Profile a:focus-visible,.Profile button:focus-visible,.Profile [role=button]:focus-visible,.Profile .carousel:focus-visible{outline:3px solid #f7f4ff;outline-offset:3px}
.Profile .VideoBackground{object-fit:cover;transition:opacity 300ms ease}
.Profile .VideoBackground.is-playing{opacity:1!important}
dialog{width:460px;max-width:calc(100vw - 48px);max-height:calc(100dvh - 48px);padding:30px;box-sizing:border-box;border:0;border-radius:25px;background:#f7f4ff;color:#211c30;font:400 16px/1.5 Poppins,sans-serif;box-shadow:0 15px 70px #0005}
dialog::backdrop{background:#0008}
dialog.menu-drawer{position:fixed;inset:0 auto 0 0;margin:0;padding:56px 0 0;width:300px;max-width:90vw;height:100dvh;max-height:100dvh;border-radius:0;background:#211c30;color:#f7f4ff;box-shadow:none}
dialog.menu-drawer .dialog-close{color:#f7f4ff;right:10px;top:10px}
dialog.menu-drawer .dialog-links{gap:0}
dialog.menu-drawer .dialog-links a{font-size:20px;line-height:normal;font-weight:600;padding:16px;background:transparent;border:0;border-radius:25px}
dialog.menu-drawer .dialog-links a:hover{opacity:.7;filter:none}
dialog h2{font-size:24px;line-height:1.25;font-weight:700;margin:6px 35px 20px 0}
dialog p{margin:0 0 20px}
.dialog-close{position:absolute;right:14px;top:10px;width:36px;height:36px;font:28px/1 sans-serif;border:0;border-radius:50%;cursor:pointer;background:transparent;color:#211c30}
.dialog-links{display:flex;flex-direction:column;gap:9px}
.dialog-links a,.dialog-action{display:block;width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid #211c30;border-radius:14px;background:#211c30;color:#f7f4ff;text-decoration:none;text-align:left;font:600 14px/1.4 Poppins,sans-serif;cursor:pointer}
.dialog-links a:hover,.dialog-action:hover{filter:brightness(1.15)}
.dialog-url{width:100%;box-sizing:border-box;padding:10px;border:1px solid #a99abc;border-radius:10px;background:#fff;color:#211c30;font:400 13px/1.5 Poppins,sans-serif;margin-bottom:12px}
#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:100;background:#f7f4ff;color:#211c30;border-radius:20px;padding:10px 20px;font:600 13px Poppins,sans-serif;box-shadow:0 4px 24px #0004;display:none}
#notice.visible{display:block}
@media(max-width:450px){dialog{padding:24px}dialog.menu-drawer{width:215px}.Profile .MuiContainer-root{padding-left:20px!important;padding-right:20px!important}.Profile [data-top-chrome]{max-width:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.Profile :is(#videos, #app, #socials) { scroll-margin-top: 66px; }
.om-shortcuts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 12px;
}
.om-shortcuts a, .om-youtube, .om-carousel-controls button, .om-video-filters button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #f7f4ff63;
  border-radius: 999px;
  background: #211c30;
  color: #f7f4ff;
  font: 600 12px/1.2 Poppins, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
.om-shortcuts a { min-height: 44px; padding: 0 4px; }
.om-youtube { min-height: 32px; padding: 0 12px; background: #f7f4ff; color: #211c30; }
.om-menu-brand { display: flex; align-items: center; gap: 10px; margin: 0 16px 16px; }
.om-menu-brand img { flex: none; }
dialog.menu-drawer .dialog-links a { font-size: 15px; min-height: 44px; }
.om-carousel-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin: 8px 0 2px;
}
.om-carousel-controls button { min-width: 44px; min-height: 44px; padding: 0 12px; }
.om-carousel-controls button[data-carousel-step] { padding: 0; font-size: 20px; }
.om-carousel-controls button:disabled { opacity: .55; cursor: default; }
.om-shortcuts a:hover, .om-carousel-controls button:enabled:hover { background: #352b4a; }
.om-video-dialog { width: 510px; }
.om-video-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.om-video-filters button { min-height: 40px; padding: 0 11px; }
.om-video-filters button[aria-pressed="true"] { background: #e8ddff; color: #211c30; border-color: #211c30; }
.om-video-list { list-style: none; margin: 12px 0 0; padding: 0; }
.om-video-list a, .om-video-pick a {
  display: block;
  padding: 12px 4px;
  border-bottom: 1px solid #211c302e;
  color: #211c30;
  font-weight: 600;
}
.om-video-pick:empty { display: none; }
.om-video-pick { margin-top: 12px; padding: 0 10px; border-radius: 10px; background: #e8ddff; }
