/* 登录页用编辑式双栏建立品牌；窄屏优先展示可操作的表单，而非装饰。 */
.access-page { display: flex; min-height: 100vh; min-height: 100svh; flex-direction: column; }
/* 管理员入口保持低调：默认无框，悬停时才浮现边界。 */
.admin-entry {
    display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px;
    border: 1px solid transparent; border-radius: var(--radius-md);
    color: var(--text-muted); background: transparent; font: 600 13px/1 var(--font-sans);
    cursor: pointer; transition: color var(--ease), border-color var(--ease), background var(--ease);
}
.admin-entry:hover { color: var(--primary); border-color: var(--border); background: var(--surface); }
.admin-entry:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.admin-entry .icon { width: 18px; height: 18px; }
.admin-login-dialog .dialog-card > .eyebrow { margin-bottom: 10px; }
.admin-login-dialog h2 { margin: 0 0 24px; padding-right: 44px; font-size: 24px; }
.admin-login-dialog form { margin: 0; }
.header-actions { display: flex; align-items: center; gap: 24px; }
.login-shell {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 456px);
    align-items: center; gap: clamp(48px, 7vw, 112px);
    width: min(1240px, calc(100% - 48px)); margin: auto; padding: 64px 0;
}
.intro-panel { min-width: 0; animation: access-in 480ms ease-out both; }
.intro-panel .eyebrow { margin-bottom: 24px; }
#page-title { margin: 0; font-size: clamp(48px, 5vw, 68px); font-weight: 750; letter-spacing: -0.065em; line-height: 1.15; }
#page-title span { display: block; }
.hero-accent { color: var(--primary); }
.intro-copy { margin: 28px 0 0; color: var(--text-muted); font-size: 16px; line-height: 1.9; }
.delivery-illustration { display: block; width: min(100%, 460px); height: auto; margin: 32px 0 16px; }
.intro-footnote { display: flex; align-items: center; gap: 12px; margin: 0; color: var(--text-muted); font-size: 12px; }
.quiet-line { width: 28px; height: 1px; background: var(--border-strong); }
.login-card { min-width: 0; padding: 36px; border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--surface); }
.card-heading { margin-bottom: 28px; }
.card-heading h2 { margin: 0; font-size: 28px; font-weight: 700; line-height: 1.25; }
.card-copy { margin: 10px 0 0; color: var(--text-muted); font-size: 14px; }
.field-group { margin-bottom: 16px; }
.field-group label { display: inline-block; margin-bottom: 10px; font-size: 14px; font-weight: 650; }
.input-shell { gap: 10px; }
.input-shell input { font-family: var(--font-sans); }
.password-toggle { display: grid; width: 44px; min-height: 44px; flex: 0 0 auto; margin-right: -10px; padding: 0; place-items: center; border: 0; border-radius: var(--radius-md); color: var(--text-muted); background: transparent; }
.password-toggle:hover { color: var(--primary); background: var(--surface-muted); }
.password-toggle:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.field-error { min-height: 18px; margin: 6px 0 0; color: var(--danger); font-size: 12px; line-height: 1.5; }
.primary-button { justify-content: space-between; width: 100%; min-height: 52px; padding: 12px 18px; margin-top: 4px; font-size: 16px; }
.primary-button .icon { transition: transform var(--ease); }
.primary-button:hover .icon { transform: translateX(3px); }
.privacy-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.privacy-note > .icon { width: 18px; height: 18px; margin-top: 2px; color: var(--primary); }
.privacy-note p { margin: 0; color: var(--text-muted); font-size: 12px; line-height: 1.7; }
.privacy-note strong, .privacy-note span { display: block; }
.privacy-note strong { color: var(--text); font-weight: 600; }
.keyboard-tip { margin: 20px 0 0; color: var(--text-muted); font-size: 12px; text-align: center; }
kbd { padding: 2px 5px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface-muted); font-size: 11px; }
.access-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: min(1240px, calc(100% - 48px)); min-height: 64px; margin: 0 auto; border-top: 1px solid var(--border); color: var(--text-muted); font-size: 12px; }
.access-footer a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--text-muted); text-decoration: none; }
.access-footer a:hover { color: var(--primary); }
.toast-region { top: auto; right: 24px; bottom: 24px; align-content: end; width: min(320px, calc(100vw - 32px)); }
@keyframes access-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 900px) {
    .login-shell { grid-template-columns: 1fr; width: min(540px, calc(100% - 48px)); gap: 32px; margin: 0 auto; padding: 40px 0; }
    .intro-panel .eyebrow { margin-bottom: 12px; }
    #page-title { font-size: 44px; }
    #page-title span { display: inline; }
    .intro-copy { margin-top: 16px; }
    .delivery-illustration, .intro-footnote { display: none; }
}
@media (max-width: 520px) {
    .login-shell { width: calc(100% - 32px); gap: 24px; padding: 28px 0; }
    #page-title { font-size: clamp(32px, 9.3vw, 38px); letter-spacing: -0.06em; }
    .intro-panel .eyebrow { font-size: 11px; }
    .intro-copy { margin-top: 12px; font-size: 14px; line-height: 1.7; }
    .login-card { padding: 24px; }
    .card-heading { margin-bottom: 24px; }
    .card-heading h2 { font-size: 24px; }
    .card-copy { font-size: 13px; }
    .privacy-note { margin-top: 20px; padding-top: 16px; }
    .keyboard-tip { display: none; }
    .access-footer { width: calc(100% - 32px); min-height: 56px; }
    .toast-region { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }