/* Activation page frame (owner-chosen design «ب، کارت شیشه‌ای»).
   Only the page backdrop and placement are local. Fields, buttons, tables and notes stay the
   Design System components in their canonical dark theme (html[data-theme="dark"]).
   The backdrop is one static painted layer. Motion stays on small elements. */
html:has(.dt-glass-page),.dt-glass-page{background-image:none;background-color:#071d3c}
.dt-glass-page{position:relative;min-height:100vh;margin:0;color:#fff;overflow-x:hidden}
.dt-glass-bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(560px 560px at 6% -4%,rgba(41,215,192,.30),transparent 66%),
  radial-gradient(520px 520px at 96% 104%,rgba(44,132,255,.26),transparent 66%),
  linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px,
  linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px,#071d3c}
.dt-topbar{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1080px;margin-inline:auto;padding:22px 24px;box-sizing:border-box}
.dt-brand img{display:block;height:40px;width:auto}
.dt-toplink{font-size:13px;font-weight:700;color:#bff3ec;text-decoration:none;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);transition:background .2s ease}
.dt-toplink:hover{background:rgba(255,255,255,.14);color:#fff}
.dt-glass{position:relative;z-index:1;max-width:560px;transition:max-width .4s cubic-bezier(.2,.8,.2,1)}
.dt-glass:has(#dt-account:not([hidden])){max-width:1000px}
.dt-glass-hero{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;margin-block:8px 30px}
.dt-glass-pill{font-size:13px;font-weight:700;color:#bff3ec;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:6px 14px;border-radius:999px}
.dt-glass-title{margin:0;font-size:clamp(30px,5vw,44px);font-weight:900;line-height:1.3;background:linear-gradient(90deg,#fff 0%,#fff 35%,#61e0d0 50%,#fff 65%,#fff 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:dtTitle 6s ease-in-out infinite}
.dt-glass-sub{margin:0;font-size:15px;line-height:1.9;color:#c5d2e3}
/* One glass layer: the outer frame is only a wrapper; each DS card carries the translucent surface. */
.dt-glass-card{--bg:#071d3c;--surface:rgba(18,46,88,.62);--surface-2:rgba(24,58,104,.78);--border:rgba(255,255,255,.16);animation:dtCardIn .7s cubic-bezier(.2,.8,.2,1) both}
/* The DS card hover shine (.card::after) waits at left:-100%; the card must clip it or it shows as a light stripe beside the form. */
.dt-glass-card .card{overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.28)}
.dt-glass-card>.ds-section:first-child,.dt-glass-card>.ds-section[hidden]+.ds-section{margin-block-start:0}
.dt-glass-card .ds-section:not([hidden]){animation:dtStepIn .45s cubic-bezier(.2,.8,.2,1) both}
.dt-glass-card .ds-section__head{border-bottom-color:rgba(255,255,255,.12)}
.dt-glass-card .ds-section__sub{color:#c5d2e3}
/* Status note: readable mint-on-navy instead of dark text on a muted teal (approved theme exception). */
.dt-glass-card>.ds-pattern-detail-note{margin-block-start:18px;background:rgba(65,216,198,.10);border-color:rgba(65,216,198,.32);color:#dff7f3}
.dt-glass-card>.ds-pattern-detail-note strong{color:#61e0d0}
/* Narrow login steps: one column and a full-width main action. */
.dt-glass:not(:has(#dt-account:not([hidden]))) .ds-smart-form__grid{grid-template-columns:minmax(0,1fr)}
.dt-glass:not(:has(#dt-account:not([hidden]))) form>.ds-inline-row{margin-block-start:16px}
.dt-glass:not(:has(#dt-account:not([hidden]))) form>.ds-inline-row>.btn.primary{flex:1 1 100%}
.dt-glass-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 22px;list-style:none;margin:24px 0 0;padding:0;font-size:13px;color:#c5d2e3}
.dt-glass-trust li::before{content:"";display:inline-block;width:7px;height:7px;margin-inline-end:8px;border-radius:50%;background:#41d8c6;vertical-align:middle}
.dt-glass footer{color:#9fb0c6;text-align:center}
@keyframes dtTitle{0%,100%{background-position:100% 0}50%{background-position:0 0}}
@keyframes dtCardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes dtStepIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:620px){.dt-topbar{padding:16px}.dt-brand img{height:32px}}
@media(prefers-reduced-motion:reduce){.dt-glass-title,.dt-glass-card,.dt-glass-card .ds-section{animation:none}.dt-glass-title{color:#fff;background:none}.dt-glass{transition:none}}