#oilAccountNav { bottom: calc(12px + env(safe-area-inset-bottom, 0px) + var(--visitech-local-banner-height, 0px)); }
#visitechAccountPanel {
    position: fixed; inset: 0 0 0 auto; margin: 0; padding: 0; border: 0;
    width: min(960px, 100vw); max-width: 100vw; height: 100vh; height: 100dvh; max-height: 100dvh;
    overflow: hidden; background: #f3f6fa; color: #263449;
    font: 15px/1.5 'Nunito', system-ui, sans-serif; box-shadow: -12px 0 48px rgb(20 36 60 / 18%);
}
#visitechAccountPanel[open] { display: flex; flex-direction: column; }
#visitechAccountPanel:not([open]) { display: none; }
#visitechAccountPanel::backdrop { background: rgb(20 36 60 / 45%); }
#visitechAccountPanel[data-view="subscription"] {
    inset: 0; margin: auto; width: min(1180px, calc(100vw - 48px));
    height: min(900px, calc(100dvh - 48px)); max-height: calc(100dvh - 48px);
    border: 1px solid #d5dce4; border-radius: 16px; background: #f1f3f5;
    box-shadow: 0 24px 90px rgb(20 36 60 / 28%);
}
#visitechAccountPanel[data-view="subscription"]::backdrop { background: rgb(37 42 49 / 58%); }
#oilAccessNotice {
    position: fixed; inset: 0; margin: auto; box-sizing: border-box;
    width: min(440px, calc(100vw - 32px)); height: fit-content;
    padding: 30px; border: 1px solid #dce4ec; border-radius: 14px;
    background: #f3f6fa; color: #334e67; text-align: center;
    font: 15px/1.6 'Nunito', system-ui, sans-serif;
}
#oilAccessNotice h2 { margin: 0 0 12px; font: 800 23px/1.3 'Nunito', system-ui, sans-serif; }
#oilAccessNotice a { display: inline-block; padding: 10px 20px; border-radius: 8px; background: #1769c2; color: #fff; text-decoration: none; }
#visitechAccountPanel .account-panel-header {
    position: static; display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between;
    gap: 20px; padding: 18px 26px; border-bottom: 1px solid #e2e8f0; background: #fff;
}
#visitechAccountPanel .account-panel-app { margin: 0 0 3px; color: #52657d; font-size: 12px; font-weight: 700; }
#visitechAccountPanel .account-panel-header > div { flex: 1; min-width: 0; }
#visitechAccountPanel .account-panel-logo { position: static; display: block; flex: 0 0 120px; width: 120px; height: auto; max-height: 40px; object-fit: contain; }
#visitechAccountPanel h2 { margin: 0; font: 800 22px/1.3 'Nunito', system-ui, sans-serif; color: #263449; }
#visitechAccountPanel #accountPanelClose {
    all: unset; display: flex; flex: 0 0 40px; align-items: center; justify-content: center;
    box-sizing: border-box; width: 40px; height: 40px; border: 1px solid #e2e8f0; border-radius: 8px;
    background: #fff; color: #52657d; font: 28px/1 system-ui, sans-serif; cursor: pointer;
}
#visitechAccountPanel #accountPanelClose:hover { background: #edf4fd; color: #1769d2; }
#visitechAccountPanel #accountPanelClose:focus-visible { outline: 3px solid #a9c5ea; outline-offset: 3px; }
#visitechAccountPanel #accountPanelFrame {
    position: static; display: block; flex: 1 1 auto; width: 100%; height: 100%; min-height: 0;
    margin: 0; padding: 0; border: 0; background: #f3f6fa;
}
@media (max-width: 700px) {
    #visitechAccountPanel[data-view="subscription"] { width: calc(100vw - 16px); height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); border-radius: 12px; }
    #visitechAccountPanel { width: 100vw; }
    #visitechAccountPanel .account-panel-header { gap: 10px; padding: 14px 16px; }
    #visitechAccountPanel .account-panel-logo { flex-basis: 88px; width: 88px; }
    #visitechAccountPanel h2 { font-size: 18px; }
}