/* Irivi · static/app/auth.css（REFACTOR_PLAN 3.7 登录 / 注册 / 找回密码）
   对照 design/ui-2026-10-21/auth/auth.html：7:3 左作品墙 + 右白色表单；竖屏时作品墙缩成顶部一条，表单卡片盖上来。
   令牌来自 static/app/base.css；取代 auth_portal_v2_03_93.css / email_registration.css / registration_agreement.css 在认证页上的作用。 */
html body.irivi-auth{padding:0!important;margin:0;min-height:100%;background:#16121C;color:var(--ink)}
html body.irivi-auth .irivi-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
html body.irivi-auth .irivi-auth-shell{display:grid!important;grid-template-columns:minmax(0,7fr) minmax(440px,3fr);width:100%!important;max-width:none!important;min-height:100vh;min-height:100dvh;margin:0!important;padding:0!important;box-sizing:border-box;place-items:stretch}

/* 左：作品墙 */
html body .irivi-auth-wall{position:relative;overflow:hidden;background:#16121C;min-height:100%}
html body .irivi-auth-cols{position:absolute;inset:-60px -40px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;transform:rotate(-6deg)}
html body .irivi-auth-col{display:flex;flex-direction:column;gap:14px}
html body .irivi-auth-col:nth-child(2){margin-top:-140px}html body .irivi-auth-col:nth-child(3){margin-top:-60px}html body .irivi-auth-col:nth-child(4){margin-top:-200px}
html body .irivi-auth-col i{display:block;flex:none;aspect-ratio:3/4;border-radius:var(--r-md);background:#2A2333 center/cover no-repeat;opacity:.55;transition:opacity var(--t-slow) ease}
html body .irivi-auth-col i.is-in{opacity:1}
html body .irivi-auth-wall::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,18,28,.82) 0%,rgba(22,18,28,.45) 45%,rgba(22,18,28,.15) 100%)}
html body .irivi-auth-brand{position:absolute;z-index:2;left:56px;top:44px}
html body .irivi-auth-brand img{display:block;height:40px;width:auto}
html body .irivi-auth-pitch{position:absolute;z-index:2;left:56px;bottom:64px;right:56px;max-width:520px;color:#fff}
html body .irivi-auth-pitch .brand-title{margin:0;font-size:52px;line-height:1.12;color:#fff}
html body .irivi-auth-pitch .brand-title em{color:var(--candy)}
html body .irivi-auth-who{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
html body .irivi-auth-who span{padding:4px 12px;border-radius:var(--r-pill);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);font-size:13px;font-weight:700}

/* 右：表单 */
html body .irivi-auth-side{display:flex;flex-direction:column;min-width:0;padding:36px 48px 20px;background:#fff;overflow:auto;box-sizing:border-box}
html body .irivi-auth-top{display:flex;align-items:center;min-height:28px}
html body .irivi-auth-back{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:var(--ink-2);text-decoration:none}
html body .irivi-auth-back svg,html body .irivi-auth-back2 svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* 右上语言入口（§2.2 / §11）：胶囊样式在 static/app/pickers.css 的 .irivi-lang，这里只负责靠右 */
html body .irivi-auth-lang{margin-left:auto}
html body .irivi-auth-card{width:100%!important;max-width:360px!important;margin:auto!important;padding:32px 0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;align-self:center}
html body .irivi-auth-tabs{display:flex!important;gap:24px;margin:0 0 26px!important;padding:0!important;border:0!important;background:none!important}
html body .irivi-auth-tabs[hidden]{display:none!important}
html body .irivi-auth-tabs .auth-mode-tab{padding:0!important;border:0!important;background:none!important;box-shadow:none!important;font:inherit;font-size:26px!important;font-weight:900!important;color:#C9C3D3!important;cursor:pointer;min-height:0!important}
html body .irivi-auth-tabs .auth-mode-tab[aria-selected="true"]{color:var(--ink)!important}
html body .irivi-auth-admin{font-size:20px;font-weight:900;margin:0 0 20px}
html body.irivi-auth .auth-panel{margin:0;padding:0;border:0;background:none}
html body.irivi-auth .auth-panel[hidden],html body .irivi-auth-forgot[hidden]{display:none!important}
html body .irivi-auth-h{margin:0;font-size:26px;font-weight:900;line-height:1.3;color:var(--ink)}
html body .irivi-auth-sub{margin:6px 0 0;color:var(--ink-2);font-size:14px;overflow-wrap:anywhere}
html body .irivi-auth-sub b{color:var(--ink)}
/* 2026-10-28 §2.1：标题下副标题已删除，标题直接接表单时留出间距 */
html body .irivi-auth-h+.irivi-auth-form:not(.irivi-auth-way-form){margin-top:14px!important}
/* 验证码 / 设置密码步骤标题下的一行状态（发送至 / 已验证的打码号码或邮箱） */
html body .irivi-auth-status{margin:8px 0 0;font-size:13px;color:var(--ink-2);overflow-wrap:anywhere}
html body .irivi-auth-status b{color:var(--ink);font-weight:800}
html body .irivi-auth-status+.irivi-auth-form{margin-top:10px!important}
html body .irivi-auth-form{display:flex!important;flex-direction:column;gap:0!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
html body .irivi-auth-label{display:block;margin:18px 0 6px;font-size:13px;font-weight:800;color:var(--ink)}
html body .irivi-auth-label small{margin-left:6px;font-weight:400;color:var(--ink-3)}
html body .irivi-auth-form>.irivi-auth-label:first-of-type{margin-top:4px}
html body .irivi-auth-input{display:flex;align-items:center;gap:8px;height:48px;padding:0 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:#fff;box-sizing:border-box;transition:border-color var(--t-base),box-shadow var(--t-base)}
html body .irivi-auth-input:focus-within{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
html body .irivi-auth-input input,html body .irivi-auth-input select{flex:1;min-width:0;width:100%;height:100%;margin:0;padding:0;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;font-size:15px;color:var(--ink)}
html body .irivi-auth-input input::placeholder{color:#B6AFC0}
html body .irivi-auth-eye{display:grid;place-items:center;margin-left:auto;color:var(--ink-3);cursor:pointer;border-radius:var(--r-xs)}
html body .irivi-auth-eye.is-on{color:var(--brand)}
html body .irivi-auth-eye svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75}
html body .irivi-auth-eye:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
html body .irivi-auth-row{display:flex;justify-content:space-between;margin-top:12px;font-size:13px}
html body .irivi-auth-row a{color:var(--brand);font-weight:700;text-decoration:none}
html body .irivi-auth-go{display:flex!important;align-items:center;justify-content:center;width:100%;height:50px;margin:24px 0 0!important;padding:0!important;border:0!important;border-radius:var(--r-pill)!important;background:var(--brand)!important;color:#fff!important;font-size:16px!important;font-weight:900!important;box-shadow:0 8px 20px rgba(36,33,42,.28)!important;cursor:pointer}
html body .irivi-auth-go[aria-disabled="true"]{opacity:.8}
html body .irivi-auth-alt{margin:16px 0 0;text-align:center;font-size:13px;color:var(--ink-2)}
html body .irivi-auth-alt a{color:var(--brand);font-weight:800;text-decoration:none}
html body.irivi-auth .auth-error{margin:0 0 6px;padding:10px 12px;border-radius:var(--r-sm);background:#FDECEF;color:var(--danger);font-size:13px;font-weight:700}
html body.irivi-auth .registration-notice{margin:0 0 6px;padding:10px 12px;border-radius:var(--r-sm);background:var(--soft);color:var(--ink-2);font-size:13px}
html body .irivi-auth-help{margin-top:6px;font-size:12px;color:var(--ink-3)}
html body .irivi-auth-pending{display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:var(--r-xs);background:#ECEAF0;color:var(--ink-3);font-size:11px;font-weight:900;font-style:normal;white-space:nowrap}
/* 协议勾选（_registration_consent.html） */
html body.irivi-auth .registration-consent{display:flex;align-items:flex-start;gap:8px;margin:14px 0 0;padding:0;font-size:13px;color:var(--ink-2);border:0;background:none}
html body.irivi-auth .registration-consent input{width:18px;height:18px;margin:1px 0 0;flex:none;accent-color:var(--brand)}
html body.irivi-auth .registration-consent a{color:var(--brand);font-weight:700}
/* 四段进度 */
html body .irivi-auth-steps{display:flex;gap:6px;margin:0 0 22px;padding:0;list-style:none}
html body .irivi-auth-steps>*{flex:1;height:4px;border-radius:2px;background:var(--line);overflow:hidden;font-size:0;color:transparent;margin:0;padding:0}
html body .irivi-auth-steps>.is-on{background:var(--brand)}
/* 六格验证码 */
html body .irivi-auth-code{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:22px;order:1}
html body .irivi-auth-code input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;font-size:16px;color:transparent;caret-color:transparent;z-index:2;cursor:text}
html body .irivi-auth-code span{display:grid;place-items:center;height:56px;border:1.5px solid var(--line);border-radius:var(--r-sm);font-family:var(--f-num);font-size:24px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--ink)}
html body .irivi-auth-code span.is-caret{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
html body .irivi-auth-code span.is-caret:empty::after{content:"";width:2px;height:24px;background:var(--brand);animation:iriviCaret 1s steps(2) infinite}
@keyframes iriviCaret{50%{opacity:0}}
html body .irivi-auth-form:has(.irivi-auth-code) .irivi-auth-resend{order:2}
html body .irivi-auth-form:has(.irivi-auth-code) .irivi-auth-go{order:3}
html body .irivi-auth-form:has(.irivi-auth-code) .irivi-auth-swap{order:4}
html body .irivi-auth-resend{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;font-size:13px;color:var(--ink-3)}
html body .irivi-auth-link{padding:0;border:0;background:none;font:inherit;font-size:13px;font-weight:700;color:var(--brand);cursor:pointer;white-space:nowrap}
html body .irivi-auth-link:disabled{color:var(--ink-3);cursor:default}
html body .irivi-auth-swap{align-self:center;margin-top:14px;color:var(--ink-2)}
html body .irivi-auth-note{margin:16px 0 0;padding:10px 12px;border-radius:var(--r-sm);background:var(--soft);font-size:12px;color:var(--ink-2)}
/* 密码强度 */
html body .irivi-auth-meter{display:flex;gap:4px;margin-top:8px}
html body .irivi-auth-meter i{flex:1;height:4px;border-radius:2px;background:var(--line);transition:background-color var(--t-base)}
html body .irivi-auth-meter[data-level="1"] i.is-on{background:var(--danger)}
html body .irivi-auth-meter[data-level="2"] i.is-on{background:#E8A317}
html body .irivi-auth-meter i.is-on{background:#3FA796}
/* 认识一下你 */
html body .irivi-auth-avatar{display:flex;align-items:center;gap:14px;margin-top:20px;color:var(--ink-2)}
html body .irivi-auth-avatar i{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--soft);font-style:normal;font-size:24px;font-weight:900;color:var(--ink-3)}
html body .irivi-auth-avatar b{display:block;font-size:14px;color:var(--ink)}
html body .irivi-auth-avatar small{font-size:12px;color:var(--ink-3)}
html body .irivi-auth-select{position:relative}
html body .irivi-auth-select select{appearance:none;cursor:pointer}
html body .irivi-auth-roles{display:block;margin:0;padding:0;border:0;min-width:0}
html body .irivi-auth-roles legend{padding:0}
html body .irivi-auth-role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
html body .irivi-auth-role{position:relative;display:flex;align-items:center;min-height:42px;padding:8px 10px;border:1.5px solid var(--line);border-radius:var(--r-sm);font-size:13px;font-weight:800;color:var(--ink-2);cursor:pointer;transition:border-color var(--t-base),background-color var(--t-base),color var(--t-base)}
html body .irivi-auth-role input{position:absolute;opacity:0;pointer-events:none}
html body .irivi-auth-role:has(input:checked){border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
html body .irivi-auth-role:has(input:focus-visible){outline:2px solid var(--brand);outline-offset:2px}
/* 找回密码 */
html body .irivi-auth-back2{display:inline-flex;align-items:center;gap:4px;margin-bottom:14px;font-size:13px;font-weight:700;color:var(--ink-2);text-decoration:none}
html body .irivi-auth-ways{display:flex;flex-direction:column;gap:10px;margin-top:22px}
html body .irivi-auth-way{display:flex;align-items:center;gap:12px;padding:14px;border:1.5px solid var(--line);border-radius:var(--r-md);color:var(--ink);text-decoration:none}
html body .irivi-auth-way.is-pending{opacity:.75;cursor:default}
html body .irivi-auth-way .ic{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:var(--r-sm);background:color-mix(in srgb,var(--c) 12%,#fff);color:var(--c)}
html body .irivi-auth-way .ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
html body .irivi-auth-way b{display:block;font-size:15px;font-weight:900}
html body .irivi-auth-way small{font-size:12px;color:var(--ink-3)}
html body .irivi-auth-way .irivi-auth-pending{margin-left:auto}
/* 页脚（含备案号）在右栏底部 */
html body.irivi-auth .irivi-site-footer{margin:16px 0 0;padding:12px 0 0;border-top:0;justify-content:center;font-size:12px;gap:4px 14px}

/* 竖屏 = 手机版：作品墙缩成顶部一条，表单卡片盖上来 */
@media (max-aspect-ratio:1/1){
  html body.irivi-auth .irivi-auth-shell{grid-template-columns:minmax(0,1fr);min-height:0}
  html body .irivi-auth-wall{height:230px;min-height:0}
  html body .irivi-auth-cols{inset:-40px -30px;gap:8px}
  html body .irivi-auth-col{gap:8px}
  html body .irivi-auth-brand{left:20px;top:20px}html body .irivi-auth-brand img{height:30px}
  html body .irivi-auth-pitch{left:20px;right:20px;bottom:38px}
  html body .irivi-auth-pitch .brand-title{font-size:28px}
  html body .irivi-auth-who{display:none}
  html body .irivi-auth-side{position:relative;z-index:3;margin-top:-20px;padding:20px 22px 24px;border-radius:var(--r-lg) var(--r-lg) 0 0;min-height:calc(100vh - 210px);min-height:calc(100dvh - 210px);overflow:visible}
  html body .irivi-auth-card{max-width:none!important;padding:16px 0 24px!important;margin:0!important}
  html body .irivi-auth-tabs .auth-mode-tab{font-size:22px!important}
  html body .irivi-auth-h{font-size:22px}
}
@media (prefers-reduced-motion:reduce){html body .irivi-auth-code span.is-caret:empty::after{animation:none}}

/* 手机号（4.3 / #77）：区号选择 + 号码；"或用手机号注册"分隔；人工找回的多行说明；找回页每种方式一张卡 */
html body .irivi-auth-tel{padding-left:6px}
html body .irivi-auth-tel select{flex:0 0 auto!important;width:auto!important;max-width:42%;height:34px!important;margin:0 4px 0 0!important;padding:0 6px!important;border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;background:none!important;box-shadow:none!important;font:inherit;font-size:14px;font-weight:800;color:var(--ink);cursor:pointer}
html body .irivi-auth-or{display:flex;align-items:center;gap:12px;margin:26px 0 0;font-size:13px;font-weight:700;color:var(--ink-3)}
html body .irivi-auth-or::before,html body .irivi-auth-or::after{content:"";flex:1;height:1px;background:var(--line)}
html body .irivi-auth-area{height:auto;padding:10px 14px}
html body .irivi-auth-area textarea{flex:1;min-width:0;min-height:88px;border:0!important;outline:0;background:none!important;box-shadow:none!important;resize:vertical;font:inherit;font-size:14px;color:var(--ink)}
html body .irivi-auth-way-form{margin-top:18px!important;padding:4px 16px 16px!important;border:1.5px solid var(--line)!important;border-radius:var(--r-md)!important}
html body .irivi-auth-way-form .irivi-auth-go{margin-top:14px!important;height:44px}
html body .irivi-auth-way-form .irivi-auth-label{display:flex;align-items:center;gap:8px}
html body .irivi-auth-way-ic{display:grid;place-items:center;width:28px;height:28px;border-radius:var(--r-xs);background:color-mix(in srgb,var(--c) 12%,#fff);color:var(--c)}
html body .irivi-auth-way-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
html body .irivi-auth-card>.irivi-auth-way{margin-top:18px}
html body .irivi-auth-card>a.irivi-auth-go{text-decoration:none}
html body.irivi-auth .registration-consent>span,html body.irivi-auth .registration-consent label{display:inline;margin:0;padding:0;font-size:13px;font-weight:400;color:var(--ink-2)}

/* 绑定手机号：号码行右侧发送按钮 + 倒计时；未发送时验证码区置灰（templates/phone_binding.html） */
html body .irivi-bind-row{display:flex;gap:10px;align-items:stretch}
html body .irivi-bind-row .irivi-auth-input{flex:1;min-width:0}
html body .irivi-bind-send{flex:none;min-width:112px;height:48px;padding:0 16px!important;border:1.5px solid var(--brand)!important;border-radius:var(--r-sm)!important;background:#fff!important;color:var(--brand)!important;font-size:14px;font-weight:800;box-shadow:none!important;cursor:pointer;white-space:nowrap}
html body .irivi-bind-send:hover:not(:disabled){background:var(--brand-soft)!important}
html body .irivi-bind-send:disabled{border-color:var(--line)!important;color:var(--ink-3)!important;cursor:default}
html body .irivi-bind-timer{min-height:18px;margin:6px 0 0;text-align:right;font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
html body .irivi-bind-form .irivi-auth-code{margin-top:0}
html body .irivi-auth-code.is-disabled span{background:var(--soft);border-color:var(--line)}
html body .irivi-auth-code.is-disabled input{cursor:not-allowed}
html body .irivi-bind-form .irivi-auth-go:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important}
@media (max-width:420px){html body .irivi-bind-send{min-width:96px;padding:0 10px!important}}