/*
 * Header v2 — premium active-language control + responsive reference layout.
 * Reference: active language only; aligned with consultation button on desktop;
 * aligned beside hamburger on mobile.
 */

.tw-header {
    position: relative;
    z-index: 100;
    width: 100%;
    background: #04121e;
    color: #fff;
}

body.home .tw-header,
body.front-page .tw-header {
    position: absolute;
    inset: 0 0 auto;
    background: linear-gradient(180deg, rgba(3,14,23,.96) 0%, rgba(3,14,23,.68) 72%, rgba(3,14,23,0) 100%);
    border-bottom: 1px solid rgba(255,255,255,.035);
}

.tw-header > .tw-shell,
.tw-header__inner {
    inline-size: min(calc(100% - 5rem), 86rem);
    margin-inline: auto;
}

.tw-header__inner {
    min-height: 5.6rem;
    display: grid;
    grid-template-columns: minmax(16rem,1fr) auto minmax(16rem,1fr);
    grid-template-areas: "tools nav brand";
    align-items: center;
    gap: clamp(1.25rem, 2.5vw, 3rem);
    direction: ltr;
}

.tw-brand {
    grid-area: brand;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    direction: rtl;
}

.tw-brand__logo-wrap {
    display: block;
    width: clamp(11rem,14.2vw,14.4rem);
    line-height: 0;
}

.tw-brand__logo-wrap img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.tw-nav--desktop {
    grid-area: nav;
    justify-self: center;
    min-width: 0;
    direction: rtl;
}

.tw-nav__list,
.tw-nav__list ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tw-nav__list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(1.55rem,2.25vw,2.65rem);
}

.tw-nav__list > li {
    position: relative;
    margin: 0;
}

.tw-nav__list > li > a {
    position: relative;
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.92);
    font-size: clamp(.82rem,.82vw,.95rem);
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s ease;
}

.tw-nav__list > li > a:hover,
.tw-nav__list > .current-menu-item > a,
.tw-nav__list > .current_page_item > a,
.tw-nav__list > .current-menu-ancestor > a {
    color: #e4ae35;
}

.tw-nav__list > .current-menu-item > a::after,
.tw-nav__list > .current_page_item > a::after {
    content: "";
    position: absolute;
    right: 8%;
    left: 8%;
    bottom: -.55rem;
    height: 2px;
    border-radius: 999px;
    background: #dca630;
    box-shadow: 0 0 .75rem rgba(220,166,48,.22);
}

.tw-header__tools {
    grid-area: tools;
    justify-self: start;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .72rem;
    direction: ltr;
}

.tw-header-consultation {
    order: 1;
    min-height: 3.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding-inline: 1.35rem;
    border: 1px solid #dca630;
    border-radius: .62rem;
    color: #f2bf49;
    background: rgba(5,18,29,.42);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.018), 0 0 1.4rem rgba(220,166,48,.035);
    font-size: .9rem;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    direction: rtl;
    transition: background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.tw-header-consultation:hover {
    color: #08121a;
    background: #e6ad32;
    transform: translateY(-1px);
    box-shadow: 0 .55rem 1.5rem rgba(228,170,49,.16);
}

.tw-header-consultation__arrow {
    font-size: 1.05rem;
    line-height: 1;
}

/* Exclusive language control: only the active language is visible at rest. */
.tw-language-compact {
    order: 2;
    position: relative;
    flex: 0 0 auto;
    min-width: 5.15rem;
    direction: ltr;
}

.tw-language-compact__trigger {
    box-sizing: border-box;
    min-width: 5.15rem;
    min-height: 3.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .62rem;
    padding: .38rem .68rem;
    border: 1px solid rgba(18,199,231,.88);
    border-radius: .62rem;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(220,166,48,.09), transparent 42%),
        rgba(4,18,29,.72);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.025),
        0 0 1rem rgba(18,199,231,.08),
        -1px 0 .8rem rgba(220,166,48,.06);
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.tw-language-compact__trigger::-webkit-details-marker { display: none; }
.tw-language-compact__trigger::marker { content: ""; }

.tw-language-compact__trigger:hover,
.tw-language-compact[open] > .tw-language-compact__trigger {
    border-color: #25d6ef;
    background:
        linear-gradient(135deg, rgba(227,171,51,.16), transparent 46%),
        rgba(5,25,39,.90);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.035),
        0 0 1.3rem rgba(18,199,231,.14);
    transform: translateY(-1px);
}

.tw-language-compact__globe {
    width: 1.45rem;
    height: 1.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #e4ad35;
    filter: drop-shadow(0 0 .38rem rgba(228,173,53,.18));
}

.tw-language-compact__globe svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tw-language-compact__divider {
    width: 1px;
    height: 1.45rem;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,.45), transparent);
}

.tw-language-compact__current {
    min-width: 1.55rem;
    color: #efbd48;
    font-size: .84rem;
    font-weight: 950;
    letter-spacing: .035em;
    text-align: center;
    text-shadow: 0 0 .8rem rgba(239,189,72,.16);
}

.tw-language-compact__menu {
    position: absolute;
    z-index: 160;
    top: calc(100% + .55rem);
    left: 0;
    width: max-content;
    min-width: 6.2rem;
    padding: .4rem;
    border: 1px solid rgba(18,199,231,.28);
    border-radius: .7rem;
    background: rgba(3,17,28,.97);
    box-shadow: 0 1.1rem 2.8rem rgba(0,0,0,.38), 0 0 1.5rem rgba(18,199,231,.07);
    backdrop-filter: blur(16px);
}

.tw-language-compact__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tw-language-compact__option {
    min-width: 5.35rem;
    min-height: 2.45rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    padding: .45rem .7rem;
    border-radius: .48rem;
    color: rgba(255,255,255,.88);
    text-decoration: none;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .035em;
    transition: color .15s ease, background .15s ease;
}

.tw-language-compact__option:hover {
    color: #fff;
    background: rgba(18,199,231,.10);
}

.tw-language-compact__option-dot {
    width: .38rem;
    height: .38rem;
    border-radius: 50%;
    background: #16c9e8;
    box-shadow: 0 0 .55rem rgba(22,201,232,.55);
}

.tw-mobile-menu {
    order: 3;
    display: none;
    position: relative;
}

.tw-mobile-menu__trigger {
    width: 2.9rem;
    height: 2.9rem;
    border: 1px solid rgba(18,199,231,.62);
    border-radius: .62rem;
    background: rgba(5,18,29,.82);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 0 .8rem rgba(18,199,231,.06);
    list-style: none;
    cursor: pointer;
}

.tw-mobile-menu__trigger::-webkit-details-marker { display: none; }
.tw-mobile-menu__trigger::marker { content: ""; }
.tw-mobile-menu__trigger span {
    display: block;
    width: 1.2rem;
    height: 2px;
    margin: .24rem auto;
    border-radius: 999px;
    background: #fff;
}

.tw-mobile-menu__panel {
    position: absolute;
    z-index: 150;
    top: calc(100% + .65rem);
    left: 0;
    width: min(20rem, calc(100vw - 2rem));
    padding: 1.25rem;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 1rem;
    background: rgba(4,16,26,.98);
    box-shadow: 0 1.5rem 4rem rgba(0,0,0,.38);
    direction: rtl;
}

.tw-mobile-menu__brand-logo { display:block; width:10rem; margin:0 0 1rem auto; }
.tw-mobile-menu__brand-logo img { width:100%; height:auto; }
.tw-mobile-menu__list { list-style:none; margin:0; padding:0; }
.tw-mobile-menu__list a {
    display:block;
    padding:.8rem 0;
    color:#fff;
    border-bottom:1px solid rgba(255,255,255,.08);
    text-decoration:none;
}

@media (max-width: 1160px) {
    .tw-header > .tw-shell,
    .tw-header__inner { inline-size: min(calc(100% - 2rem),86rem); }
    .tw-header__inner { grid-template-columns:minmax(14rem,1fr) auto minmax(14rem,1fr); gap:1rem; }
    .tw-nav__list { gap:1.15rem; }
    .tw-brand__logo-wrap { width:10.8rem; }
    .tw-header-consultation { padding-inline:1.05rem; }
}

@media (max-width: 980px) {
    .tw-header__inner { grid-template-columns:minmax(12.5rem,1fr) auto minmax(12.5rem,1fr); }
    .tw-nav__list { gap:.85rem; }
    .tw-nav__list > li > a { font-size:.79rem; }
    .tw-header-consultation { font-size:.82rem; min-height:3.15rem; }
    .tw-language-compact__trigger { min-height:3.15rem; }
}

@media (max-width: 900px) {
    .tw-header__inner {
        min-height:4.8rem;
        grid-template-columns:1fr 1fr;
        grid-template-areas:"tools brand";
        gap:.75rem;
    }

    .tw-nav--desktop,
    .tw-header-consultation { display:none; }

    .tw-brand { justify-self:end; }
    .tw-brand__logo-wrap { width:clamp(8.5rem,34vw,10.5rem); }

    .tw-header__tools {
        justify-self:start;
        gap:.55rem;
    }

    /* Mobile exact order: hamburger at the far left, active language beside it. */
    .tw-mobile-menu { order:1; display:block; }
    .tw-language-compact { order:2; }

    .tw-mobile-menu__trigger {
        display:block;
        width:2.78rem;
        height:2.78rem;
    }

    .tw-language-compact,
    .tw-language-compact__trigger { min-width:4.78rem; }

    .tw-language-compact__trigger {
        min-height:2.78rem;
        padding:.3rem .55rem;
        gap:.48rem;
    }

    .tw-language-compact__globe { width:1.25rem; height:1.25rem; }
    .tw-language-compact__divider { height:1.2rem; }
    .tw-language-compact__current { font-size:.76rem; }
    .tw-language-compact__menu { top:calc(100% + .45rem); left:0; }
}

@media (max-width: 520px) {
    .tw-header > .tw-shell,
    .tw-header__inner { inline-size:min(calc(100% - 1rem),86rem); }
    .tw-header__inner { min-height:4.2rem; }
    .tw-brand__logo-wrap { width:clamp(7.7rem,36vw,9rem); }
    .tw-header__tools { gap:.42rem; }
    .tw-mobile-menu__trigger { width:2.6rem; height:2.6rem; }
    .tw-language-compact,
    .tw-language-compact__trigger { min-width:4.45rem; }
    .tw-language-compact__trigger { min-height:2.6rem; padding-inline:.48rem; }
    .tw-language-compact__globe { width:1.15rem; height:1.15rem; }
    .tw-language-compact__current { min-width:1.35rem; font-size:.72rem; }
}

/* ==========================================================
   Header account control + animated login/register modal
   Adds only the account UI; existing header geometry remains.
   ========================================================== */
.tw-account-control {
    order: 3;
    min-height: 3.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .62rem;
    padding: .36rem .9rem;
    border: 1px solid rgba(18, 199, 231, .86);
    border-radius: .62rem;
    color: rgba(255,255,255,.96);
    background:
        linear-gradient(135deg, rgba(10, 200, 231, .08), transparent 46%),
        rgba(4,18,29,.76);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.025),
        0 0 1rem rgba(18,199,231,.07);
    font: inherit;
    font-size: .86rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    direction: rtl;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

.tw-account-control:hover,
.tw-account-control:focus-visible {
    color: #fff;
    border-color: #27d8ef;
    background:
        linear-gradient(135deg, rgba(232, 174, 53, .10), transparent 46%),
        rgba(5,27,40,.94);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.035),
        0 0 1.35rem rgba(18,199,231,.12),
        0 0 1.8rem rgba(225,171,51,.035);
    transform: translateY(-1px);
    text-decoration: none;
}

.tw-account-control--logged-in {
    border-color: rgba(226, 171, 50, .82);
    background:
        linear-gradient(135deg, rgba(226,171,50,.12), transparent 55%),
        rgba(4,18,29,.78);
}

.tw-account-control__icon {
    width: 1.52rem;
    height: 1.52rem;
    display: inline-grid;
    place-items: center;
    flex: 0 0 1.52rem;
    color: #19cdec;
}

.tw-account-control--logged-in .tw-account-control__icon { color:#e3ad36; }

.tw-account-control__icon svg {
    width: 100%;
    height: 100%;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}

html.tw-account-modal-open,
html.tw-account-modal-open body { overflow: hidden; }

.tw-account-dialog {
    width: min(31rem, calc(100vw - 1.5rem));
    max-width: 31rem;
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 1.25rem;
    color: #f7fbfd;
    background: transparent;
    direction: rtl;
}

.tw-account-dialog::backdrop {
    background: rgba(0, 7, 13, .76);
    backdrop-filter: blur(12px) saturate(.82);
    -webkit-backdrop-filter: blur(12px) saturate(.82);
    animation: tw-account-backdrop-in .28s ease both;
}

.tw-account-dialog[open] {
    animation: tw-account-dialog-in .42s cubic-bezier(.16,1,.3,1) both;
}

.tw-account-dialog__shell {
    position: relative;
    overflow: hidden;
    padding: 1.6rem;
    border: 1px solid rgba(24, 204, 236, .46);
    border-radius: 1.25rem;
    background:
        radial-gradient(24rem 13rem at 100% 0%, rgba(16,193,227,.12), transparent 68%),
        radial-gradient(22rem 11rem at 0% 100%, rgba(226,171,50,.08), transparent 70%),
        linear-gradient(180deg, rgba(5,25,37,.985) 0%, rgba(2,15,24,.995) 100%);
    box-shadow:
        0 2.2rem 7rem rgba(0,0,0,.52),
        0 0 0 1px rgba(255,255,255,.025) inset,
        0 0 2.6rem rgba(13,198,231,.08);
}

.tw-account-dialog__shell::before {
    content: "";
    position: absolute;
    inset: -45% -25%;
    pointer-events: none;
    background: conic-gradient(from 0deg, transparent, rgba(23,210,240,.12), transparent 28%, transparent 66%, rgba(227,171,51,.10), transparent 83%);
    animation: tw-account-aurora 12s linear infinite;
}

.tw-account-dialog__shell > * { position: relative; z-index: 1; }

.tw-account-dialog__close {
    position: absolute;
    top: .75rem;
    left: .75rem;
    z-index: 3;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    padding: 0;
    border-radius: .55rem;
    border: 1px solid rgba(255,255,255,.09);
    color: rgba(255,255,255,.72);
    background: rgba(3,17,25,.72);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
}

.tw-account-dialog__close:hover { color:#fff; border-color:rgba(28,207,239,.48); }

.tw-account-dialog__brandline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    margin-bottom: 1rem;
}

.tw-account-dialog__brandline span {
    width: 3.2rem;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(228,173,53,.78));
}
.tw-account-dialog__brandline span:last-child { transform: scaleX(-1); }
.tw-account-dialog__brandline i {
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    background: #18cde9;
    box-shadow: 0 0 .8rem rgba(24,205,233,.55);
}

.tw-account-dialog__header {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding-inline: .15rem 2rem;
}

.tw-account-dialog__badge {
    width: 3rem;
    height: 3rem;
    flex: 0 0 3rem;
    display: grid;
    place-items: center;
    border: 1px solid rgba(225,171,51,.62);
    border-radius: .8rem;
    color: #e8b23d;
    background: rgba(226,171,50,.06);
    box-shadow: 0 0 1.2rem rgba(226,171,50,.07);
}

.tw-account-dialog__badge svg {
    width: 1.65rem;
    height: 1.65rem;
    fill:none;
    stroke:currentColor;
    stroke-width:1.55;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.tw-account-dialog__header p {
    margin: 0 0 .28rem;
    color: #1ed2ee;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .11em;
    direction: ltr;
    text-align: right;
}

.tw-account-dialog__header h2 {
    margin: 0;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 900;
    line-height: 1.45;
}

.tw-account-dialog__tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: .5rem;
    margin-top: 1.35rem;
    padding: .3rem;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: .75rem;
    background: rgba(1,13,21,.58);
}

.tw-account-dialog__tab {
    min-height: 2.75rem;
    border: 0;
    border-radius: .58rem;
    color: rgba(238,246,249,.68);
    background: transparent;
    font: inherit;
    font-size: .88rem;
    font-weight: 800;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, box-shadow .18s ease;
}

.tw-account-dialog__tab.is-active {
    color: #07131a;
    background: linear-gradient(180deg, #f7c957, #e7ab31);
    box-shadow: 0 .45rem 1.1rem rgba(229,171,48,.16);
}

.tw-account-dialog__panel { margin-top: 1rem; }
.tw-account-dialog__panel[hidden] { display:none !important; }

.tw-account-form { display:grid; gap:.85rem; }
.tw-account-form > label { display:grid; gap:.38rem; }
.tw-account-form > label > span {
    color: rgba(239,246,249,.78);
    font-size: .78rem;
    font-weight: 700;
}

.tw-account-form input[type="text"],
.tw-account-form input[type="email"],
.tw-account-form input[type="password"] {
    width: 100%;
    min-height: 3rem;
    box-sizing: border-box;
    padding: .65rem .85rem;
    border: 1px solid rgba(23,145,174,.34);
    border-radius: .65rem;
    outline: 0;
    color: #fff;
    background: rgba(2,17,26,.82);
    font: inherit;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.tw-account-form input:focus {
    border-color: rgba(24,207,238,.84);
    box-shadow: 0 0 0 3px rgba(24,207,238,.08);
    background: rgba(4,25,36,.96);
}

.tw-account-form__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    color: rgba(235,243,247,.64);
    font-size: .74rem;
}

.tw-account-form__meta a { color:#25cde9; text-decoration:none; }
.tw-account-form__remember { display:inline-flex; align-items:center; gap:.4rem; cursor:pointer; }
.tw-account-form__remember input { accent-color:#e4ad35; }

.tw-account-form__submit {
    min-height: 3rem;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.7rem;
    border:1px solid rgba(255,216,105,.9);
    border-radius:.68rem;
    color:#09141a;
    background:linear-gradient(180deg,#ffd65c,#e9ab31);
    box-shadow:0 .85rem 2rem rgba(226,170,49,.18);
    font:inherit;
    font-size:.88rem;
    font-weight:900;
    cursor:pointer;
    transition:transform .18s ease, box-shadow .18s ease;
}
.tw-account-form__submit:hover { transform:translateY(-1px); box-shadow:0 1rem 2.3rem rgba(226,170,49,.24); }

.tw-account-form__hint,
.tw-account-dialog__notice p {
    margin:0;
    color:rgba(232,241,245,.66);
    font-size:.76rem;
    line-height:1.9;
}

.tw-account-dialog__notice {
    padding:1rem;
    border:1px solid rgba(226,171,50,.22);
    border-radius:.72rem;
    background:rgba(226,171,50,.045);
}
.tw-account-dialog__notice strong { display:block; margin-bottom:.35rem; color:#efbd48; font-size:.86rem; }

.tw-account-dialog__footer {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    margin-top:1rem;
    padding-top:.9rem;
    border-top:1px solid rgba(255,255,255,.07);
    color:rgba(224,235,240,.5);
    font-size:.68rem;
}

.tw-account-dialog__secure-dot {
    width:.38rem;
    height:.38rem;
    border-radius:50%;
    background:#1ad2ed;
    box-shadow:0 0 .6rem rgba(26,210,237,.45);
}

@keyframes tw-account-dialog-in {
    from { opacity:0; transform:translateY(18px) scale(.955); filter:blur(5px); }
    to { opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
}
@keyframes tw-account-backdrop-in { from { opacity:0; } to { opacity:1; } }
@keyframes tw-account-aurora { to { transform:rotate(360deg); } }

@media (max-width: 1160px) {
    .tw-account-control { padding-inline:.72rem; }
    .tw-account-control__label { font-size:.8rem; }
}

@media (max-width: 980px) {
    .tw-account-control { min-height:3.15rem; }
}

@media (max-width: 900px) {
    .tw-account-control {
        order:3;
        width:2.78rem;
        height:2.78rem;
        min-width:2.78rem;
        min-height:2.78rem;
        padding:0;
        border-radius:.62rem;
    }
    .tw-account-control__label {
        position:absolute;
        width:1px;
        height:1px;
        padding:0;
        margin:-1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
        border:0;
    }
    .tw-account-control__icon { width:1.35rem; height:1.35rem; flex-basis:1.35rem; }
}

@media (max-width: 520px) {
    .tw-header__tools { gap:.4rem; }
    .tw-account-control,
    .tw-mobile-menu__trigger { width:2.55rem; height:2.55rem; min-width:2.55rem; min-height:2.55rem; }
    .tw-language-compact,
    .tw-language-compact__trigger { min-width:4.35rem; }
    .tw-account-dialog__shell { padding:1.25rem 1rem 1rem; }
    .tw-account-dialog__header { padding-inline:.05rem 1.7rem; }
    .tw-account-dialog__header h2 { font-size:1.12rem; }
    .tw-account-form__meta { align-items:flex-start; flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
    .tw-account-dialog[open],
    .tw-account-dialog::backdrop,
    .tw-account-dialog__shell::before { animation:none !important; }
    .tw-account-control,
    .tw-account-dialog__tab,
    .tw-account-form__submit { transition:none !important; }
}

/* Account System v2 — independent customer account integration */
.tw-account-message {
    margin-top: 1rem;
    padding: .72rem .85rem;
    border-radius: .65rem;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.8;
}
.tw-account-message.is-success {
    color: #baf7d7;
    border: 1px solid rgba(71, 220, 145, .30);
    background: rgba(35, 159, 101, .10);
}
.tw-account-message.is-error {
    color: #ffd0d0;
    border: 1px solid rgba(246, 104, 104, .30);
    background: rgba(175, 48, 48, .10);
}
.tw-account-form__submit:disabled,
.tw-account-profile .tw-account-form__submit:disabled {
    opacity: .62;
    cursor: wait;
    transform: none;
}
.tw-account-dialog__notice--error {
    margin-top: 1.15rem;
    border-color: rgba(240, 94, 94, .25);
    background: rgba(160, 38, 38, .08);
}
.tw-account-dialog__notice--error strong { color: #ffb8b8; }
.tw-account-profile {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    margin-top: 1.25rem;
    padding: 1rem;
    border: 1px solid rgba(23, 174, 204, .24);
    border-radius: .9rem;
    background: rgba(2, 17, 26, .62);
}
.tw-account-profile__avatar {
    width: 3.6rem;
    height: 3.6rem;
    display: grid;
    place-items: center;
    border-radius: 1rem;
    color: #efbd48;
    border: 1px solid rgba(228, 173, 53, .42);
    background: rgba(228, 173, 53, .06);
}
.tw-account-profile__avatar svg {
    width: 2rem;
    height: 2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.tw-account-profile__identity {
    min-width: 0;
    display: grid;
    gap: .25rem;
}
.tw-account-profile__identity strong {
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
}
.tw-account-profile__identity span,
.tw-account-profile__identity small {
    color: rgba(232, 241, 245, .68);
    font-size: .78rem;
    overflow-wrap: anywhere;
}
.tw-account-profile .tw-account-form__submit {
    grid-column: 1 / -1;
    margin-top: .25rem;
}
.tw-account-form input[type="tel"],
.tw-account-form input[inputmode="tel"] {
    width: 100%;
    min-height: 3rem;
    box-sizing: border-box;
    padding: .65rem .85rem;
    border: 1px solid rgba(23,145,174,.34);
    border-radius: .65rem;
    outline: 0;
    color: #fff;
    background: rgba(2,17,26,.82);
    font: inherit;
}
@media (max-width: 520px) {
    .tw-account-profile { grid-template-columns: 3.2rem minmax(0,1fr); padding:.85rem; }
    .tw-account-profile__avatar { width:3.2rem; height:3.2rem; }
}

/* v4 — independent site-user OTP / WSMS authentication */
.tw-account-auth-methods {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
    margin-top: 1rem;
    padding: .3rem;
    border: 1px solid rgba(24, 172, 207, .18);
    border-radius: .78rem;
    background: rgba(3, 22, 31, .72);
}
.tw-account-auth-method {
    min-height: 2.7rem;
    border: 0;
    border-radius: .6rem;
    background: transparent;
    color: rgba(229, 238, 242, .72);
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.tw-account-auth-method.is-active {
    color: #06141b;
    background: linear-gradient(180deg, #f7cc57, #dfa52f);
    box-shadow: 0 .55rem 1.4rem rgba(223, 165, 47, .18);
}
.tw-account-auth-method-panel[hidden] { display:none !important; }
.tw-account-auth-method-panel.is-active { animation: tw-account-method-in .28s ease both; }
.tw-account-otp-step[hidden] { display:none !important; }
.tw-account-otp-meta {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.8rem;
    padding:.75rem .85rem;
    border-radius:.7rem;
    border:1px solid rgba(25, 190, 226, .18);
    background:rgba(6, 37, 49, .64);
    color:rgba(225, 237, 242, .72);
    font-size:.78rem;
}
.tw-account-otp-meta strong { color:#27cfee; direction:ltr; font-size:.82rem; }
.tw-account-otp-code {
    direction:ltr;
    text-align:center;
    letter-spacing:.48em;
    font-size:1.25rem !important;
    font-weight:900 !important;
    font-variant-numeric:tabular-nums;
}
.tw-account-otp-actions {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.7rem;
    min-height:1.8rem;
}
.tw-account-otp-actions small { color:rgba(220, 232, 237, .58); font-size:.72rem; }
.tw-account-form__link,
.tw-account-form__secondary {
    border:0;
    background:transparent;
    color:#25cde9;
    font:inherit;
    font-size:.76rem;
    font-weight:800;
    cursor:pointer;
    padding:.2rem 0;
}
.tw-account-form__secondary {
    width:100%;
    min-height:2.55rem;
    border:1px solid rgba(29, 180, 216, .24);
    border-radius:.65rem;
    background:rgba(5, 31, 43, .48);
    color:rgba(239, 246, 249, .82);
}
.tw-account-form__link:hover { color:#fff; }
.tw-account-form__secondary:hover { border-color:rgba(29, 203, 238, .55); color:#fff; }
@keyframes tw-account-method-in { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media (max-width:560px) {
    .tw-account-auth-methods { gap:.4rem; }
    .tw-account-auth-method { font-size:.76rem; min-height:2.55rem; }
    .tw-account-otp-actions { align-items:flex-start; flex-direction:column; }
}

/* Account System v5 — TehranWeb approved full registration modal */
.tw-account-dialog {
    width: min(46rem, calc(100vw - 2rem));
    max-width: 46rem;
    max-height: min(94dvh, 58rem);
    padding: 0;
    border: 0;
    background: transparent;
    overflow: visible;
}

.tw-account-dialog__shell {
    position: relative;
    max-height: min(94dvh, 58rem);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1.35rem 1.65rem 1.15rem;
    border-radius: 1.35rem;
    border: 1px solid rgba(19, 207, 240, .76);
    background:
        radial-gradient(31rem 16rem at 88% 7%, rgba(8, 123, 156, .20), transparent 70%),
        radial-gradient(22rem 17rem at 52% 58%, rgba(13, 107, 136, .14), transparent 70%),
        linear-gradient(155deg, rgba(4, 35, 48, .98), rgba(2, 22, 32, .99));
    box-shadow:
        0 2rem 6rem rgba(0, 0, 0, .54),
        0 0 0 1px rgba(255,255,255,.018) inset,
        0 0 38px rgba(15, 203, 237, .08);
    scrollbar-width: thin;
    scrollbar-color: rgba(25, 201, 234, .42) transparent;
}

.tw-account-dialog__shell::-webkit-scrollbar { width: .42rem; }
.tw-account-dialog__shell::-webkit-scrollbar-track { background: transparent; }
.tw-account-dialog__shell::-webkit-scrollbar-thumb { background: rgba(25,201,234,.34); border-radius: 999px; }

.tw-account-dialog__header {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    margin-bottom: .9rem;
}

.tw-account-dialog__badge {
    width: 4.2rem;
    height: 4.2rem;
    border-radius: 1rem;
    color: #f1ba3f;
    border-color: rgba(244, 189, 63, .72);
    background: linear-gradient(180deg, rgba(14, 54, 66, .95), rgba(6, 33, 44, .96));
    box-shadow: 0 0 28px rgba(240, 180, 52, .11), inset 0 1px 0 rgba(255,255,255,.04);
}

.tw-account-dialog__heading-copy { min-width: 0; }
.tw-account-dialog__heading-copy p {
    color: #24d4f2;
    letter-spacing: .16em;
    font-size: .72rem;
    font-weight: 850;
    margin: 0 0 .24rem;
}

.tw-account-dialog__heading-copy h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.45rem, 2.6vw, 2rem);
    line-height: 1.25;
    font-weight: 950;
}

.tw-account-dialog__heading-copy h2 span { color: #f3bd49; }
.tw-account-dialog__heading-copy small {
    display: block;
    margin-top: .36rem;
    color: rgba(223, 234, 239, .72);
    font-size: .82rem;
    line-height: 1.75;
}

.tw-account-dialog__tabs {
    min-height: 3.7rem;
    padding: .3rem;
    border-radius: .9rem;
    background: rgba(1, 19, 28, .74);
    border: 1px solid rgba(24, 179, 213, .28);
}
.tw-account-dialog__tab { min-height: 3.02rem; border-radius: .72rem; }
.tw-account-dialog__tab.is-active {
    color: #111a1e;
    background: linear-gradient(180deg, #ffd25a 0%, #e9ac32 100%);
    box-shadow: 0 .75rem 1.8rem rgba(230, 170, 47, .2), inset 0 1px 0 rgba(255,255,255,.48);
}

.tw-account-dialog__panel { margin-top: .95rem; }
.tw-account-register-form { gap: .72rem; }
.tw-account-register-form > .tw-account-field,
.tw-account-register-form__passwords .tw-account-field {
    position: relative;
    display: grid;
    gap: .33rem;
}

.tw-account-register-form .tw-account-field > span {
    color: rgba(246, 250, 252, .94);
    font-size: .82rem;
    font-weight: 760;
}

.tw-account-register-form .tw-account-field input {
    width: 100%;
    min-height: 3.3rem;
    padding-inline: 3.1rem 1rem !important;
    border-radius: .82rem !important;
    border: 1px solid rgba(17, 183, 218, .50) !important;
    background: rgba(1, 21, 31, .82) !important;
    color: #fff !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
}

.tw-account-register-form .tw-account-field input::placeholder { color: rgba(199, 214, 221, .52); }
.tw-account-register-form .tw-account-field input:focus {
    border-color: rgba(34, 212, 243, .88) !important;
    box-shadow: 0 0 0 3px rgba(21, 199, 234, .09), inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.tw-account-register-form .tw-account-field > i {
    position: absolute;
    inset-inline-start: .7rem;
    bottom: .55rem;
    width: 2.05rem;
    height: 2.05rem;
    border-radius: .56rem;
    display: grid;
    place-items: center;
    pointer-events: none;
    border: 1px solid rgba(30, 145, 176, .22);
    background: rgba(8, 42, 55, .78);
    color: rgba(217, 230, 236, .78);
}
.tw-account-register-form .tw-account-field > i::before {
    content: "";
    width: 1rem;
    height: 1rem;
    display: block;
    background: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}
.tw-account-field--name > i::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 8a7 7 0 0 1 14 0H5Z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 8a7 7 0 0 1 14 0H5Z'/%3E%3C/svg%3E");
}
.tw-account-field--email > i::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 5h18v14H3V5Zm2 2v.2l7 5.2 7-5.2V7l-7 5-7-5Zm14 10V9.7l-7 5.1-7-5.1V17h14Z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 5h18v14H3V5Zm2 2v.2l7 5.2 7-5.2V7l-7 5-7-5Zm14 10V9.7l-7 5.1-7-5.1V17h14Z'/%3E%3C/svg%3E");
}
.tw-account-field--phone > i::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m7 3 3 4-2 2c1.6 3.1 3.9 5.4 7 7l2-2 4 3-2 4c-.4.8-1.3 1.2-2.2 1C8.7 20.3 3.7 15.3 2 7.2 1.8 6.3 2.2 5.4 3 5l4-2Z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m7 3 3 4-2 2c1.6 3.1 3.9 5.4 7 7l2-2 4 3-2 4c-.4.8-1.3 1.2-2.2 1C8.7 20.3 3.7 15.3 2 7.2 1.8 6.3 2.2 5.4 3 5l4-2Z'/%3E%3C/svg%3E");
}
.tw-account-field--password > i::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 10V8a5 5 0 0 1 10 0v2h2v11H5V10h2Zm2 0h6V8a3 3 0 0 0-6 0v2Zm3 4a2 2 0 0 0-1 3.7V19h2v-1.3A2 2 0 0 0 12 14Z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 10V8a5 5 0 0 1 10 0v2h2v11H5V10h2Zm2 0h6V8a3 3 0 0 0-6 0v2Zm3 4a2 2 0 0 0-1 3.7V19h2v-1.3A2 2 0 0 0 12 14Z'/%3E%3C/svg%3E");
}

.tw-account-register-form__passwords {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.tw-account-form__hint--secure {
    position: relative;
    margin: .05rem 0 0;
    padding: .64rem 2.65rem .64rem .85rem;
    border-radius: .72rem;
    border: 1px solid rgba(24, 161, 194, .34);
    background: rgba(2, 29, 41, .60);
    color: rgba(219, 231, 236, .76);
    line-height: 1.75;
}
.tw-account-form__hint--secure::before {
    content: "i";
    position: absolute;
    inset-inline-start: .72rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #20d1ef;
    border: 1px solid rgba(32,209,239,.72);
    font-size: .72rem;
    font-weight: 900;
}

.tw-account-form__submit--register {
    min-height: 3.35rem;
    margin-top: .05rem;
    font-size: .94rem;
}

.tw-account-register-form__or {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: .65rem;
    color: rgba(208, 222, 228, .48);
    font-size: .76rem;
}
.tw-account-register-form__or span { height: 1px; background: linear-gradient(90deg, transparent, rgba(96,145,162,.34), transparent); }
.tw-account-register-form__or b { font-weight: 500; }

.tw-account-form__secondary--password-login {
    min-height: 3rem;
    border-radius: .78rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    color: #23d1ef;
    border-color: rgba(24, 190, 224, .66);
    background: rgba(1, 26, 37, .58);
}

.tw-account-dialog__footer { margin-top: .7rem; }

@media (max-width: 680px) {
    .tw-account-dialog {
        width: min(100% - 1rem, 35rem);
        max-height: 96dvh;
    }
    .tw-account-dialog__shell {
        max-height: 96dvh;
        padding: 1rem .9rem .85rem;
        border-radius: 1rem;
    }
    .tw-account-dialog__header {
        grid-template-columns: 3.4rem minmax(0,1fr);
        gap: .7rem;
    }
    .tw-account-dialog__badge { width: 3.2rem; height: 3.2rem; border-radius: .8rem; }
    .tw-account-dialog__heading-copy p { font-size: .62rem; }
    .tw-account-dialog__heading-copy h2 { font-size: 1.22rem; }
    .tw-account-dialog__heading-copy small { font-size: .74rem; line-height: 1.6; }
    .tw-account-register-form__passwords { grid-template-columns: 1fr; gap: .72rem; }
    .tw-account-register-form .tw-account-field input { min-height: 3.1rem; }
    .tw-account-form__hint--secure { padding-inline-end: .7rem; font-size: .72rem; }
}

@media (max-height: 760px) and (min-width: 681px) {
    .tw-account-dialog { max-height: 96dvh; }
    .tw-account-dialog__shell { max-height: 96dvh; padding-block: .9rem .8rem; }
    .tw-account-dialog__header { margin-bottom: .55rem; }
    .tw-account-dialog__brandline { margin-bottom: .4rem; }
    .tw-account-dialog__panel { margin-top: .65rem; }
    .tw-account-register-form { gap: .55rem; }
    .tw-account-register-form .tw-account-field input { min-height: 2.95rem; }
    .tw-account-form__hint--secure { padding-block: .45rem; }
    .tw-account-form__submit--register { min-height: 3rem; }
}

/* ==========================================================
   v6 — compact two-step registration, fully visible, no scroll
   ========================================================== */
.tw-account-dialog {
    width: min(30rem, calc(100vw - 1rem));
    max-width: 30rem;
    max-height: none !important;
    overflow: visible !important;
}

.tw-account-dialog__shell {
    overflow: hidden !important;
    max-height: none !important;
    padding: 1.15rem 1.25rem 1.2rem;
}

.tw-account-dialog__brandline { margin-bottom: .55rem; }
.tw-account-dialog__header { gap: .7rem; margin-bottom: .65rem; }
.tw-account-dialog__badge { width: 2.7rem; height: 2.7rem; flex-basis: 2.7rem; }
.tw-account-dialog__heading-copy h2 { font-size: clamp(1.28rem, 2.2vw, 1.68rem); }
.tw-account-dialog__heading-copy small { display: none !important; }
.tw-account-dialog__tabs { min-height: 3.05rem; padding: .22rem; border-radius: .75rem; }
.tw-account-dialog__tab { min-height: 2.55rem; border-radius: .62rem; }
.tw-account-dialog__panel { margin-top: .65rem; }
.tw-account-dialog__footer { display: none !important; }

.tw-register-progress {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .6rem;
    margin: 0 0 .68rem;
    padding: 0 .35rem;
}
.tw-register-progress > i {
    height: 1px;
    background: linear-gradient(90deg, rgba(34,207,239,.25), rgba(230,174,54,.5), rgba(34,207,239,.25));
}
.tw-register-progress > span {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: rgba(214,228,234,.52);
    font-style: normal;
    white-space: nowrap;
}
.tw-register-progress b {
    width: 1.65rem;
    height: 1.65rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid rgba(65,132,151,.45);
    color: rgba(220,232,237,.72);
    background: rgba(4,27,38,.72);
    font-size: .72rem;
}
.tw-register-progress em { font-style: normal; font-size: .72rem; font-weight: 750; }
.tw-register-progress > span.is-active { color: #fff; }
.tw-register-progress > span.is-active b {
    border-color: rgba(244,191,70,.92);
    color: #09151b;
    background: linear-gradient(180deg,#ffd45a,#e8aa31);
    box-shadow: 0 0 1rem rgba(232,170,49,.14);
}
.tw-register-progress > span.is-complete { color: #21cfea; }
.tw-register-progress > span.is-complete b { border-color: rgba(33,207,234,.68); color: #21cfea; }

.tw-account-register-form { gap: 0 !important; }
.tw-register-step {
    display: grid;
    gap: .55rem;
    animation: tw-account-method-in .24s ease both;
}
.tw-register-step[hidden] { display: none !important; }
.tw-account-register-form .tw-account-field { gap: .24rem !important; }
.tw-account-register-form .tw-account-field > span { font-size: .76rem !important; }
.tw-account-register-form .tw-account-field input {
    min-height: 2.85rem !important;
    padding-inline: 2.75rem .8rem !important;
    border-radius: .68rem !important;
}
.tw-account-register-form .tw-account-field > i {
    bottom: .4rem !important;
    width: 1.9rem !important;
    height: 1.9rem !important;
    border-radius: .5rem !important;
}

.tw-account-register-form__passwords {
    display: grid;
    grid-template-columns: 1fr;
    gap: .55rem;
}

.tw-register-step__actions {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    gap: .55rem;
    margin-top: .12rem;
}
.tw-register-step__actions .tw-account-form__submit,
.tw-register-step__actions .tw-account-form__secondary,
.tw-account-form__submit--register {
    min-height: 2.9rem !important;
}

.tw-account-form__hint,
.tw-account-form__hint--secure,
.tw-account-register-form__or,
.tw-account-form__secondary--password-login { display: none !important; }

.tw-register-verify {
    gap: .6rem !important;
}
.tw-register-verify .tw-account-otp-code {
    min-height: 3.15rem;
    font-size: 1.15rem;
    letter-spacing: .24em;
    text-align: center;
}

@media (max-width: 680px) {
    .tw-account-dialog {
        width: min(calc(100vw - .75rem), 28rem) !important;
        max-height: none !important;
    }
    .tw-account-dialog__shell {
        max-height: none !important;
        padding: .85rem .8rem .9rem !important;
        border-radius: .95rem !important;
    }
    .tw-account-dialog__close {
        top: .55rem;
        left: .55rem;
        width: 1.85rem;
        height: 1.85rem;
    }
    .tw-account-dialog__brandline { margin-bottom: .35rem !important; }
    .tw-account-dialog__header { gap: .55rem !important; margin-bottom: .5rem !important; padding-inline-end: 1.75rem !important; }
    .tw-account-dialog__badge { width: 2.35rem !important; height: 2.35rem !important; flex-basis: 2.35rem !important; }
    .tw-account-dialog__heading-copy p { font-size: .56rem !important; margin-bottom: .1rem !important; }
    .tw-account-dialog__heading-copy h2 { font-size: 1.05rem !important; }
    .tw-account-dialog__tabs { min-height: 2.75rem !important; }
    .tw-account-dialog__tab { min-height: 2.3rem !important; font-size: .78rem !important; }
    .tw-account-dialog__panel { margin-top: .5rem !important; }
    .tw-register-progress { margin-bottom: .5rem; gap: .4rem; }
    .tw-register-progress b { width: 1.45rem; height: 1.45rem; }
    .tw-register-progress em { font-size: .66rem; }
    .tw-register-step { gap: .42rem; }
    .tw-account-register-form .tw-account-field > span { font-size: .7rem !important; }
    .tw-account-register-form .tw-account-field input { min-height: 2.55rem !important; font-size: .78rem !important; }
    .tw-account-register-form .tw-account-field > i { width: 1.7rem !important; height: 1.7rem !important; bottom: .34rem !important; }
    .tw-register-step__actions { grid-template-columns: .8fr 1.2fr; }
    .tw-register-step__actions .tw-account-form__submit,
    .tw-register-step__actions .tw-account-form__secondary,
    .tw-account-form__submit--register { min-height: 2.6rem !important; font-size: .78rem !important; }
}

@media (max-height: 660px) {
    .tw-account-dialog__shell { padding-block: .65rem .7rem !important; }
    .tw-account-dialog__brandline { margin-bottom: .22rem !important; }
    .tw-account-dialog__header { margin-bottom: .35rem !important; }
    .tw-account-dialog__badge { width: 2.15rem !important; height: 2.15rem !important; flex-basis: 2.15rem !important; }
    .tw-account-dialog__heading-copy p { display: none !important; }
    .tw-account-dialog__heading-copy h2 { font-size: 1rem !important; }
    .tw-account-dialog__tabs { min-height: 2.45rem !important; }
    .tw-account-dialog__tab { min-height: 2.05rem !important; }
    .tw-register-progress { margin-bottom: .35rem; }
    .tw-register-step { gap: .32rem; }
    .tw-account-register-form .tw-account-field > span { font-size: .65rem !important; }
    .tw-account-register-form .tw-account-field input { min-height: 2.35rem !important; }
    .tw-account-register-form .tw-account-field > i { width: 1.55rem !important; height: 1.55rem !important; bottom: .3rem !important; }
    .tw-register-step__actions .tw-account-form__submit,
    .tw-register-step__actions .tw-account-form__secondary,
    .tw-account-form__submit--register { min-height: 2.4rem !important; }
}

/* v7 — compact three-step registration with dedicated OTP step */
.tw-register-progress--three {
    grid-template-columns: auto 1fr auto 1fr auto !important;
}

.tw-register-verify--compact {
    display: grid;
    gap: .65rem !important;
    animation: tw-account-method-in .24s ease both;
}

.tw-register-verify--compact[hidden] {
    display: none !important;
}

.tw-register-otp-summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 2.7rem;
    padding: .55rem .8rem;
    border: 1px solid rgba(33,207,234,.28);
    border-radius: .72rem;
    background: linear-gradient(180deg, rgba(8,48,61,.72), rgba(4,31,42,.82));
    color: rgba(231,242,246,.82);
    font-size: .8rem;
    text-align: center;
}

.tw-register-otp-summary strong {
    color: #23d1ee;
    direction: ltr;
    unicode-bidi: isolate;
    font-size: .84rem;
    font-weight: 850;
}

.tw-register-otp-field {
    display: grid;
    gap: .32rem;
}

.tw-register-otp-field > span {
    color: rgba(240,247,249,.92);
    font-size: .78rem;
    font-weight: 800;
}

.tw-register-verify--compact .tw-account-otp-code {
    min-height: 3.15rem !important;
    padding: .65rem 1rem !important;
    border-radius: .72rem !important;
    text-align: center !important;
    direction: ltr;
    font-size: 1.28rem !important;
    font-weight: 900;
    letter-spacing: .34em !important;
}

.tw-register-otp-actions--compact {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .8rem !important;
    min-height: 1.7rem;
}

.tw-register-step__actions--verify {
    margin-top: 0 !important;
}

@media (max-width: 680px) {
    .tw-register-progress--three {
        gap: .3rem !important;
        padding-inline: .1rem !important;
    }

    .tw-register-progress--three em {
        font-size: .61rem !important;
    }

    .tw-register-progress--three b {
        width: 1.38rem !important;
        height: 1.38rem !important;
        font-size: .64rem !important;
    }

    .tw-register-otp-summary {
        min-height: 2.45rem;
        padding: .45rem .55rem;
        font-size: .72rem;
        flex-wrap: wrap;
    }

    .tw-register-verify--compact .tw-account-otp-code {
        min-height: 2.9rem !important;
        font-size: 1.05rem !important;
        letter-spacing: .28em !important;
    }

    .tw-register-otp-actions--compact {
        font-size: .7rem;
    }

    .tw-register-step__actions--verify {
        grid-template-columns: .78fr 1.22fr !important;
    }
}

/* v9 — two-step login OTP flow */
.tw-login-otp-progress {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .6rem;
    margin: .7rem 0 .8rem;
    padding: 0 .35rem;
}
.tw-login-otp-progress > i {
    height: 1px;
    background: linear-gradient(90deg, rgba(34,207,239,.25), rgba(230,174,54,.5), rgba(34,207,239,.25));
}
.tw-login-otp-progress > span {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    color: rgba(214,228,234,.54);
    white-space: nowrap;
}
.tw-login-otp-progress b {
    width: 1.65rem;
    height: 1.65rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid rgba(65,132,151,.45);
    color: rgba(220,232,237,.72);
    background: rgba(4,27,38,.72);
    font-size: .72rem;
}
.tw-login-otp-progress em {
    font-style: normal;
    font-size: .72rem;
    font-weight: 800;
}
.tw-login-otp-progress > span.is-active { color: #fff; }
.tw-login-otp-progress > span.is-active b {
    border-color: rgba(244,191,70,.92);
    color: #09151b;
    background: linear-gradient(180deg,#ffd45a,#e8aa31);
    box-shadow: 0 0 1rem rgba(232,170,49,.14);
}
.tw-login-otp-progress > span.is-complete { color: #21cfea; }
.tw-login-otp-progress > span.is-complete b {
    border-color: rgba(33,207,234,.68);
    color: #21cfea;
}

.tw-login-otp-step {
    display: grid;
    gap: .65rem;
    animation: tw-account-method-in .24s ease both;
}
.tw-login-otp-step[hidden] { display: none !important; }
.tw-login-otp-step--phone .tw-account-field {
    gap: .28rem !important;
}
.tw-login-otp-step--phone .tw-account-field input {
    min-height: 3rem !important;
    padding-inline: 2.75rem .85rem !important;
    border-radius: .7rem !important;
}
.tw-login-otp-step--phone .tw-account-field > i {
    bottom: .45rem !important;
    width: 1.9rem !important;
    height: 1.9rem !important;
    border-radius: .5rem !important;
}
.tw-login-otp-summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 2.7rem;
    padding: .55rem .8rem;
    border: 1px solid rgba(33,207,234,.28);
    border-radius: .72rem;
    background: linear-gradient(180deg, rgba(8,48,61,.72), rgba(4,31,42,.82));
    color: rgba(231,242,246,.82);
    font-size: .8rem;
    text-align: center;
}
.tw-login-otp-summary strong {
    color: #23d1ee;
    direction: ltr;
    unicode-bidi: isolate;
    font-size: .84rem;
    font-weight: 850;
}
.tw-login-otp-field {
    display: grid;
    gap: .32rem;
}
.tw-login-otp-field > span {
    color: rgba(240,247,249,.92);
    font-size: .78rem;
    font-weight: 800;
}
.tw-login-otp-step--code .tw-account-otp-code {
    min-height: 3.15rem !important;
    padding: .65rem 1rem !important;
    border-radius: .72rem !important;
    text-align: center !important;
    direction: ltr;
    font-size: 1.28rem !important;
    font-weight: 900;
    letter-spacing: .34em !important;
}
.tw-login-otp-actions--compact {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .8rem !important;
    min-height: 1.7rem;
}
.tw-login-otp-step__actions {
    display: grid;
    grid-template-columns: .78fr 1.22fr;
    gap: .55rem;
}
.tw-login-otp-step__actions .tw-account-form__submit,
.tw-login-otp-step__actions .tw-account-form__secondary {
    min-height: 2.9rem !important;
}

@media (max-width: 680px) {
    .tw-login-otp-progress {
        margin: .5rem 0 .6rem;
        gap: .38rem;
        padding-inline: .1rem;
    }
    .tw-login-otp-progress b {
        width: 1.42rem;
        height: 1.42rem;
        font-size: .65rem;
    }
    .tw-login-otp-progress em { font-size: .64rem; }
    .tw-login-otp-step { gap: .5rem; }
    .tw-login-otp-summary {
        min-height: 2.45rem;
        padding: .45rem .55rem;
        font-size: .72rem;
        flex-wrap: wrap;
    }
    .tw-login-otp-step--code .tw-account-otp-code {
        min-height: 2.9rem !important;
        font-size: 1.05rem !important;
        letter-spacing: .28em !important;
    }
    .tw-login-otp-step__actions {
        grid-template-columns: .8fr 1.2fr;
    }
    .tw-login-otp-step__actions .tw-account-form__submit,
    .tw-login-otp-step__actions .tw-account-form__secondary {
        min-height: 2.6rem !important;
        font-size: .78rem !important;
    }
}

/* ==========================================================
   v10 — exact hamburger glyph centering
   Keeps button geometry unchanged; centers only the 3 bars.
   ========================================================== */
.tw-mobile-menu__trigger {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .24rem !important;
    padding: 0 !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
}

.tw-mobile-menu__trigger span {
    display: block !important;
    flex: 0 0 auto !important;
    width: 1.2rem !important;
    height: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}