:root {
  --auth-deep: #16231c;
  --auth-deep-2: #22352a;
  --auth-paper: #f3ecdc;
  --auth-ink: #20261f;
  --auth-muted: #6d6c61;
  --auth-line: #a79c82;
  --auth-gold: #bd9653;
  --auth-danger: #8c3f37;
}

body.site-auth-open { overflow: hidden; }

.site-auth-dialog {
  box-sizing: border-box;
  width: min(460px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 32px));
  margin: auto;
  padding: 0;
  overflow: clip;
  scrollbar-gutter: auto !important;
  border: 1px solid #b89960;
  border-radius: 8px;
  color: var(--auth-ink);
  background: var(--auth-paper);
  box-shadow: 0 30px 110px rgba(0, 0, 0, .66), 0 0 0 1px rgba(239, 212, 155, .11) inset;
  opacity: 0;
  transform: translateY(14px) scale(.975);
}

.site-auth-dialog[open] { animation: site-auth-enter .22s cubic-bezier(.2, .8, .2, 1) forwards; }
.site-auth-dialog.is-closing { animation: site-auth-leave .14s ease forwards; }
.site-auth-dialog::backdrop {
  background: rgba(7, 12, 9, .76);
  backdrop-filter: blur(7px) saturate(.72);
  -webkit-backdrop-filter: blur(7px) saturate(.72);
  animation: site-auth-backdrop .2s ease both;
}

.site-auth-shell { box-sizing: border-box; inline-size: 100%; max-inline-size: 100%; max-height: min(760px, calc(100vh - 32px)); overflow-x: clip; overflow-y: auto; scrollbar-width: none; scrollbar-gutter: auto !important; -ms-overflow-style: none; }
.site-auth-shell::-webkit-scrollbar { width: 0; height: 0; display: none; }

.site-auth-header {
  position: relative;
  padding: 27px 30px 22px;
  color: #f5efe2;
  background:
    radial-gradient(circle at 86% 10%, rgba(190, 151, 82, .19), transparent 34%),
    linear-gradient(150deg, #263b2f, var(--auth-deep));
  border-bottom: 1px solid #8d754c;
}
.site-auth-eyebrow { margin: 0 0 7px; color: #d5b875; font-family: Georgia, "Songti SC", serif; font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.site-auth-header h2 { margin: 0; font-family: Georgia, "Songti SC", "Noto Serif SC", serif; font-size: 27px; font-weight: 600; line-height: 1.25; }
.site-auth-header p:last-of-type { margin: 8px 34px 0 0; color: #c4cec3; font-size: 12px; line-height: 1.7; }
.site-auth-close { width: 34px; height: 34px; position: absolute; top: 16px; right: 16px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(223, 205, 163, .34); border-radius: 50%; color: #eee5d3; background: rgba(8, 16, 11, .28); font-size: 20px; line-height: 1; }
.site-auth-close:hover, .site-auth-close:focus-visible { border-color: #d5b875; background: rgba(189, 150, 83, .2); }

.site-auth-form { display: grid; gap: 15px; padding: 25px 30px 27px; }
.site-auth-field { display: grid; gap: 7px; color: #3e433c; font-size: 12px; font-weight: 750; }
.site-auth-field small { color: var(--auth-muted); font-size: 10px; font-weight: 500; line-height: 1.55; }
.site-auth-field input {
  width: 100%; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--auth-line); border-radius: 4px;
  color: var(--auth-ink); background: rgba(255, 253, 246, .76);
  font: inherit; font-size: 14px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.site-auth-field input:hover { border-color: #817760; }
.site-auth-field input:focus { border-color: var(--auth-gold); outline: 0; background: #fffdf7; box-shadow: 0 0 0 3px rgba(189, 150, 83, .2), 0 5px 18px rgba(59, 49, 31, .08); }
.site-auth-check { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 9px; align-items: start; color: #55594f; font-size: 11px; line-height: 1.55; }
.site-auth-check input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: #49664e; }
.site-auth-check a { color: #315c4c; font-weight: 750; }
.site-auth-submit { width: 100%; min-height: 46px; margin-top: 3px; border: 1px solid #34513e; border-radius: 4px; color: #fff9ec; background: linear-gradient(#496653, #334a3b); font: inherit; font-size: 13px; font-weight: 850; letter-spacing: .04em; box-shadow: 0 7px 18px rgba(28, 47, 35, .2); }
.site-auth-submit:hover:not(:disabled), .site-auth-submit:focus-visible { border-color: #c29d5b; background: linear-gradient(#57775f, #3b5644); }
.site-auth-submit:disabled { cursor: wait; opacity: .64; }
.site-auth-error { min-height: 0; margin: -2px 0 0; padding: 0; color: var(--auth-danger); font-size: 11px; line-height: 1.55; }
.site-auth-error:not(:empty) { padding: 9px 10px; border: 1px solid #c88b82; background: #f2dfda; }
.site-auth-switch { margin: 0; padding-top: 14px; border-top: 1px solid rgba(123, 116, 96, .34); color: var(--auth-muted); font-size: 11px; text-align: center; }
.site-auth-switch button { padding: 2px 4px; border: 0; color: #315c4c; background: transparent; font: inherit; font-weight: 850; text-decoration: underline; text-underline-offset: 3px; }

@keyframes site-auth-enter { to { opacity: 1; transform: none; } }
@keyframes site-auth-leave { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(8px) scale(.985); } }
@keyframes site-auth-backdrop { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 520px) {
  .site-auth-dialog { width: calc(100vw - 18px); max-height: calc(100vh - 18px); }
  .site-auth-shell { max-height: calc(100vh - 18px); }
  .site-auth-header { padding: 23px 21px 19px; }
  .site-auth-header h2 { font-size: 24px; }
  .site-auth-form { padding: 21px; }
}

@media (prefers-reduced-motion: reduce) {
  .site-auth-dialog, .site-auth-dialog[open], .site-auth-dialog.is-closing, .site-auth-dialog::backdrop { animation: none; transition: none; }
  .site-auth-dialog[open] { opacity: 1; transform: none; }
}