/* Loaded last: the official Illustrator identity and the final sign-in treatment. */
:root { --official-red: #e81717; --official-ink: #111111; --official-line: #e5e5e7; }

.officialLockup {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0;
  color: var(--official-ink) !important;
  white-space: nowrap;
}
.officialLockup > .officialWolf {
  display: block !important;
  flex: 0 0 auto !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}
.officialLockup > .officialType {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 2px !important;
  min-width: 0;
  line-height: 1 !important;
}
.officialLockup > .officialType > img {
  display: block !important;
  width: 80px !important;
  height: auto !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}
.officialLockup > .officialType > b {
  display: block !important;
  margin: 0 1px 0 0 !important;
  color: var(--official-red) !important;
  font-family: "Arial Black", Impact, Haettenschweiler, sans-serif !important;
  font-size: 13px !important;
  font-style: italic !important;
  font-weight: 950 !important;
  line-height: .76 !important;
  letter-spacing: -.075em !important;
  text-transform: uppercase !important;
}

.brand { min-width: 151px !important; padding: 0 !important; justify-content: flex-start !important; overflow: visible !important; }
.topbarLockup { min-width: 145px !important; }
.topbarLockup > .officialWolf { width: 42px !important; height: 42px !important; }
.topbarLockup > .officialType > img { width: 82px !important; }
.topbarLockup > .officialType > b { font-size: 13px !important; }
.footerLockup { gap: 11px !important; }
.footerLockup > .officialWolf { width: 47px !important; height: 47px !important; }
.footerLockup > .officialType > img { width: 94px !important; }
.footerLockup > .officialType > b { font-size: 15px !important; }

.searchWrap { align-items: center !important; gap: 8px !important; }
html.dcDesktopV2 .searchWordmark,
.searchWordmark {
  display: grid !important;
  place-items: center !important;
  width: 31px !important;
  min-width: 31px !important;
  height: 31px !important;
  flex: 0 0 31px !important;
  overflow: visible !important;
}
html.dcDesktopV2 .searchWordmark > img,
.searchWordmark > img { width: 29px !important; height: 29px !important; object-fit: contain !important; }
html.dcDesktopV2 .searchDivider,
.searchDivider { display: block !important; width: 1px !important; height: 22px !important; flex: 0 0 1px !important; margin: 0 2px !important; background: #d9d9dd !important; }
.searchWrap > svg { position: static !important; flex: 0 0 17px !important; }
.searchWrap input { position: static !important; min-width: 0 !important; }

#logout.ownerSignOut {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 94px !important;
  min-height: 42px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(232,23,23,.22) !important;
  border-radius: 13px !important;
  color: #c91414 !important;
  background: rgba(232,23,23,.055) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  white-space: nowrap;
}
#logout.ownerSignOut:hover { border-color: rgba(232,23,23,.42) !important; background: rgba(232,23,23,.1) !important; }
#logout.ownerSignOut svg { width: 17px; height: 17px; flex: 0 0 auto; }

/* Full-access accounts add a profile chip to the original six-column toolbar.
   Keep every control on one row, then collapse the lower-value sync label on
   laptop widths so the navigation never wraps. */
@media (min-width: 861px) {
  .topbar {
    grid-template-columns: auto auto minmax(180px,1fr) auto auto auto auto !important;
  }
}
@media (min-width: 861px) and (max-width: 1450px) {
  .topbar {
    grid-template-columns: auto auto minmax(170px,1fr) auto auto auto !important;
  }
  #refreshLibrary { display: none !important; }
  #logout.ownerSignOut {
    width: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
  }
  #logout.ownerSignOut span { display: none !important; }
}

.scMobileBrand { gap: 7px !important; }
.scMobileBrand > .officialWolf { width: 38px !important; height: 38px !important; }
.scMobileBrand > .officialType { margin: 0 !important; }
.scMobileBrand > .officialType > img { width: 70px !important; height: auto !important; }
.scMobileBrand > .officialType > b { margin-top: 1px !important; font-size: 10px !important; }
.guestBrand { gap: 8px !important; }
.guestBrand > .officialWolf { width: 42px !important; height: 42px !important; }
.guestBrand > .officialType > img { width: 75px !important; height: auto !important; }
.guestBrand > .officialType > b { font-size: 11px !important; }

/* The sign-in page is one continuous, light workspace—not a card over a dark splash. */
.loginOverlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 40000 !important;
  display: none !important;
  overflow: auto !important;
  place-items: stretch !important;
  padding: 0 !important;
  color: #111 !important;
  background: #fff !important;
}
.loginOverlay.show { display: grid !important; }
.loginOverlay::before { display: none !important; }
.loginExperience {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr) !important;
  width: 100% !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
.loginIdentity {
  position: relative !important;
  display: grid !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: clamp(26px,3.2vw,52px) !important;
  border-right: 1px solid var(--official-line) !important;
  color: #111 !important;
  background:
    linear-gradient(rgba(17,17,17,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17,17,17,.032) 1px, transparent 1px),
    radial-gradient(circle at 48% 44%, rgba(232,23,23,.09), transparent 37%),
    #f6f6f7 !important;
  background-size: 56px 56px, 56px 56px, auto, auto !important;
}
.loginIdentity::before,
.loginIdentity::after {
  content: "+" !important;
  position: absolute !important;
  color: rgba(17,17,17,.24) !important;
  font: 13px/1 ui-monospace, SFMono-Regular, Menlo, monospace !important;
}
.loginIdentity::before { top: 22%; left: 8%; }
.loginIdentity::after { right: 8%; bottom: 22%; }
.loginIdentityTop,
.loginIdentityBottom {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #747980 !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: .18em !important;
}
.loginIdentityTop { align-self: start !important; }
.loginIdentityTop i,
.loginPanelFoot i { display: inline-block !important; width: 6px !important; height: 6px !important; margin-right: 7px !important; border-radius: 50% !important; background: var(--official-red) !important; box-shadow: 0 0 0 4px rgba(232,23,23,.1) !important; }
.loginIdentityBottom { align-self: end !important; padding-top: 22px !important; border-top: 1px solid rgba(17,17,17,.1) !important; }
.loginHeroMark {
  position: relative !important;
  z-index: 1 !important;
  align-self: center !important;
  display: grid !important;
  place-items: center !important;
  min-height: min(62vh,660px) !important;
}
.loginHorseFrame {
  position: absolute !important;
  display: grid !important;
  place-items: center !important;
  width: min(48vw,620px) !important;
  aspect-ratio: 1 !important;
  border: 1px solid rgba(232,23,23,.13) !important;
  border-radius: 50% !important;
}
.loginHorseFrame::before,
.loginHorseFrame::after { content: "" !important; position: absolute !important; inset: 11% !important; border: 1px solid rgba(17,17,17,.065) !important; border-radius: 50% !important; }
.loginHorseFrame::after { inset: 25% !important; }
.loginHorseFrame img {
  width: 58% !important;
  height: 58% !important;
  object-fit: contain !important;
  filter: drop-shadow(0 24px 45px rgba(232,23,23,.14)) !important;
  animation: loginWolfFloat 6s ease-in-out infinite !important;
}
.loginHeroType {
  position: absolute !important;
  right: clamp(4px,2vw,30px) !important;
  bottom: clamp(22px,5vh,66px) !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 5px !important;
  text-align: right !important;
}
.loginHeroType > img { display: block !important; width: clamp(285px,32vw,520px) !important; height: auto !important; }
.loginHeroType strong {
  color: var(--official-red) !important;
  font-family: "Arial Black", Impact, Haettenschweiler, sans-serif !important;
  font-size: clamp(56px,7vw,112px) !important;
  font-style: italic !important;
  font-weight: 950 !important;
  line-height: .72 !important;
  letter-spacing: -.085em !important;
}
.loginScan { position: absolute !important; right: 0 !important; bottom: 0 !important; left: 0 !important; height: 3px !important; overflow: hidden !important; background: rgba(17,17,17,.06) !important; }
.loginScan i { display: block !important; width: 24% !important; height: 100% !important; background: var(--official-red) !important; animation: loginScan 3.4s ease-in-out infinite !important; }

.loginCard {
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(44px,6vw,96px) clamp(38px,7vw,104px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #111 !important;
  background: #fff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.loginCard > * { width: min(470px,100%) !important; }
.loginPanelMark { display: inline-flex !important; margin: 0 0 clamp(44px,6vh,72px) !important; }
.loginPanelMark > .officialWolf { width: 46px !important; height: 46px !important; }
.loginPanelMark > .officialType > img { width: 88px !important; }
.loginPanelMark > .officialType > b { font-size: 14px !important; }
.loginPanelHead > span { color: var(--official-red) !important; font-size: 9px !important; font-weight: 950 !important; letter-spacing: .2em !important; }
.loginPanelHead h1 {
  max-width: 440px !important;
  margin: 18px 0 12px !important;
  color: #111 !important;
  font-size: clamp(48px,5.2vw,78px) !important;
  font-weight: 850 !important;
  line-height: .9 !important;
  letter-spacing: -.072em !important;
}
.loginPanelHead p { margin: 0 0 clamp(38px,5vh,58px) !important; color: #71767c !important; font-size: 12px !important; }
.loginCard label { color: #555b62 !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .15em !important; }
.loginCard label > span { display: block !important; }
.loginCard input {
  width: 100% !important;
  min-height: 62px !important;
  margin-top: 10px !important;
  padding: 0 18px !important;
  border: 1px solid #dfe0e3 !important;
  border-radius: 15px !important;
  color: #111 !important;
  background: #f7f7f8 !important;
  box-shadow: inset 0 1px 0 rgba(0,0,0,.02) !important;
  font-size: 16px !important;
  letter-spacing: .03em !important;
}
.loginCard input::placeholder { color: #a2a6ab !important; }
.loginCard input:focus { border-color: rgba(232,23,23,.55) !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(232,23,23,.075) !important; }
.loginCard .button { display: flex !important; align-items: center !important; justify-content: space-between !important; min-height: 60px !important; margin-top: 14px !important; padding: 0 18px !important; border-radius: 15px !important; font-size: 11px !important; font-weight: 900 !important; }
.loginCard .button i { font-size: 17px !important; font-style: normal !important; transition: transform .2s ease; }
.loginCard .button:hover i { transform: translateX(3px); }
.loginCard .loginOwnerButton { border-color: var(--official-red) !important; color: #fff !important; background: var(--official-red) !important; box-shadow: 0 12px 32px rgba(232,23,23,.18) !important; }
.loginCard .loginOwnerButton:hover { background: #cf1111 !important; }
.loginOr { margin: 22px 0 2px !important; color: #999da2 !important; }
.loginOr::before,.loginOr::after { background: #e3e4e6 !important; }
.loginCard .guestButton { border-color: #dfe0e3 !important; color: #111 !important; background: #f5f5f7 !important; box-shadow: none !important; }
.loginCard .guestButton:hover { border-color: rgba(232,23,23,.26) !important; color: var(--official-red) !important; background: #fff7f7 !important; }
.loginError { min-height: 22px !important; padding-top: 12px !important; color: var(--official-red) !important; font-size: 10px !important; font-weight: 750 !important; }
.loginPanelFoot { display: flex !important; justify-content: space-between !important; margin-top: 40px !important; padding-top: 18px !important; border-top: 1px solid #ececef !important; color: #9a9ea3 !important; font-size: 8px !important; font-weight: 850 !important; letter-spacing: .14em !important; }
.loginPanelFoot span:last-child { color: #686d73 !important; }
.loginPanelFoot i { width: 5px !important; height: 5px !important; margin-right: 6px !important; background: #27a65b !important; box-shadow: 0 0 0 4px rgba(39,166,91,.09) !important; }

@keyframes loginWolfFloat { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-12px) rotate(1deg); } }
@keyframes loginScan { 0% { transform: translateX(-110%); } 55%,100% { transform: translateX(520%); } }

@media (max-width: 900px) {
  .loginExperience { grid-template-columns: 1fr !important; overflow: visible !important; }
  .loginIdentity { min-height: 39dvh !important; padding: calc(18px + env(safe-area-inset-top)) 22px 18px !important; border-right: 0 !important; border-bottom: 1px solid var(--official-line) !important; }
  .loginIdentityBottom { display: none !important; }
  .loginHeroMark { min-height: 29dvh !important; }
  .loginHorseFrame { width: min(70vw,350px) !important; }
  .loginHeroType { right: 18px !important; bottom: 5px !important; }
  .loginHeroType > img { width: clamp(190px,48vw,340px) !important; }
  .loginHeroType strong { font-size: clamp(38px,10vw,68px) !important; }
  .loginCard { justify-content: flex-start !important; padding: 34px 22px calc(30px + env(safe-area-inset-bottom)) !important; }
  .loginPanelMark { display: none !important; }
  .loginPanelHead > span { display: none !important; }
  .loginPanelHead h1 { margin-top: 0 !important; font-size: clamp(40px,12vw,58px) !important; }
  .loginPanelHead p { margin-bottom: 28px !important; }
  .loginCard input { min-height: 58px !important; }
  .loginCard .button { min-height: 56px !important; }
  .loginPanelFoot { margin-top: 24px !important; }
}

@media (max-width: 767px) {
  .scMobileTop { grid-template-columns: minmax(0,1fr) auto !important; gap: 1px !important; }
  .scIconButton { width: 44px !important; height: 44px !important; }
  .scOwnerSignOut { display: none !important; }
  .brand { min-width: 112px !important; }
  .topbarLockup { min-width: 108px !important; gap: 6px !important; }
  .topbarLockup > .officialWolf { width: 36px !important; height: 36px !important; }
  .topbarLockup > .officialType > img { width: 66px !important; }
  .topbarLockup > .officialType > b { font-size: 10px !important; }
}

@media (max-width: 560px) {
  .loginIdentity { min-height: 35dvh !important; }
  .loginIdentityTop b { display: none !important; }
  .loginHeroMark { min-height: 25dvh !important; }
  .loginHorseFrame { width: min(62vw,250px) !important; }
  .loginHorseFrame img { width: 56% !important; height: 56% !important; }
  .loginHeroType { right: 14px !important; bottom: 4px !important; }
  .loginHeroType > img { width: clamp(170px,48vw,230px) !important; }
  .loginHeroType strong { font-size: clamp(32px,10vw,46px) !important; }
  .loginCard { padding-top: 28px !important; }
  .loginPanelHead p { margin-bottom: 23px !important; }
  .loginPanelFoot { display: none !important; }
}

@media (max-width: 360px) {
  .scMobileTop { grid-template-columns: minmax(0,1fr) auto !important; padding-right: 7px !important; padding-left: 9px !important; }
  .scMobileBrand { gap: 5px !important; }
  .scMobileBrand > .officialWolf { width: 34px !important; height: 34px !important; }
  .scMobileBrand > .officialType > img { width: 61px !important; }
  .scMobileBrand > .officialType > b { font-size: 9px !important; }
  .scIconButton { width: 40px !important; height: 40px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .loginHorseFrame img,.loginScan i { animation: none !important; }
}
.accountProfile{display:flex;align-items:center;gap:8px;height:44px;padding:5px 10px 5px 6px;border:1px solid #e2e3e6;border-radius:14px;background:#f7f7f8;cursor:pointer;transition:border-color .16s ease,background .16s ease}.accountProfile:hover{border-color:rgba(232,23,23,.35);background:#fff}.accountProfile>i{display:grid;place-items:center;width:31px;height:31px;overflow:hidden;border-radius:10px;background:#e81717;color:#fff;font:900 12px/1 Inter,sans-serif;font-style:normal}.accountProfile>i.profilePhoto img{width:100%;height:100%;object-fit:cover}.accountProfile>i.wolf img{width:23px;height:23px;object-fit:contain;filter:brightness(0) invert(1)}.accountProfile>span{display:flex;flex-direction:column;min-width:52px}.accountProfile b{font-size:11px}.accountProfile small{color:#858a93;font-size:9px}.victorLoginButton{margin-top:9px;border-color:#dadce0;background:#fff;color:#15171b}.victorLoginButton:hover{border-color:#e81717;color:#e81717}@media(max-width:767px){.accountProfile{display:none}}
.profileEditor{position:fixed;z-index:70000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(14,15,18,.48);backdrop-filter:blur(13px)}.profileEditorCard{width:min(390px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.7);border-radius:24px;background:#fff;box-shadow:0 34px 100px rgba(10,11,14,.28)}.profileEditorCard>header{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 17px;border-bottom:1px solid #e5e6e9}.profileEditorCard>header>span{color:#e81717;font-size:8px;font-weight:900;letter-spacing:.18em}.profileEditorCard>header button{display:grid;place-items:center;width:35px;height:35px;border:0;border-radius:11px;color:#666b74;background:#f1f2f4;font-size:20px}.profileEditorBody{display:grid;justify-items:center;padding:26px 24px 24px;text-align:center}.profileEditorPhoto{position:relative;width:112px;height:112px;overflow:hidden;border:4px solid #fff;border-radius:35px;background:#eeeef1;box-shadow:0 13px 36px rgba(16,17,20,.18)}.profileEditorPhoto>img{width:100%;height:100%;object-fit:cover}.profileEditorPhoto>i{position:absolute;right:5px;bottom:5px;display:grid;place-items:center;width:29px;height:29px;border:3px solid #fff;border-radius:10px;color:#fff;background:#e81717;font-size:10px;font-style:normal}.profileEditorBody h2{margin:16px 0 5px;color:#141519;font-size:26px;letter-spacing:-.045em}.profileEditorBody>p{max-width:290px;margin:0;color:#737982;font-size:11px;line-height:1.5}.profileChangeButton{display:grid;justify-items:center;width:100%;margin-top:20px;padding:13px;border:1px solid #e81717;border-radius:14px;color:#fff;background:linear-gradient(135deg,#ef2028,#b80f2c);box-shadow:0 10px 23px rgba(232,23,23,.18);cursor:pointer}.profileChangeButton span{font-size:11px;font-weight:900}.profileChangeButton small{margin-top:3px;color:rgba(255,255,255,.72);font-size:8px}.profileChangeButton.saving{opacity:.6;pointer-events:none}.profileSaveState{min-height:16px;margin-top:9px;color:#747a83;font-size:9px}.scSheetProfilePhoto{width:28px;height:28px;overflow:hidden;border-radius:9px;object-fit:cover;background:#e81717}
@media(max-width:767px){.profileEditor{align-items:end;padding:0}.profileEditorCard{width:100%;border:0;border-radius:24px 24px 0 0}.profileEditorBody{padding-bottom:calc(24px + env(safe-area-inset-bottom))}.profileEditorPhoto{width:104px;height:104px;border-radius:32px}}
.accountProfile>i[data-profile-id="forrest"] img{transform:scale(1.25);transform-origin:50% 33%}.accountProfile>i[data-profile-id="jackson"] img{transform:scale(1.78);transform-origin:50% 27%}.accountProfile>i[data-profile-id="kaden"] img{transform:scale(1.42);transform-origin:50% 29%}.accountProfile>i[data-profile-id="maks"] img{transform:scale(1.32);transform-origin:50% 31%}.accountProfile>i[data-profile-id="will"] img{transform:scale(1.3);transform-origin:50% 35%}
.loginAccountLink{display:block!important;margin-top:14px!important;color:#6f747c!important;font-size:10px!important;font-weight:700!important;text-align:center!important;text-decoration:none!important}.loginAccountLink b{color:var(--official-red)!important}.loginAccountLink:hover b{text-decoration:underline!important}
