@import url('theme-bright.css');

*{box-sizing:border-box}
body{
  --parallax-y:0px;
  margin:0;
  min-height:100vh;
  font-family:var(--font-ui);
  color:var(--text);
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(255, 200, 80, 0.28), transparent 55%),
    radial-gradient(ellipse 50% 40% at 15% 30%, rgba(135, 206, 250, 0.22), transparent 50%),
    linear-gradient(180deg, #fffdf5 0%, #fff8e7 40%, #faf3e0 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  position:relative;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:-50px;
  pointer-events:none;
  z-index:0;
  opacity:.4;
  transform:translate3d(0, calc(var(--parallax-y) * -0.2), 0);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280' viewBox='0 0 280 280'%3E%3Cg fill='none' stroke='%23d4af37' stroke-opacity='0.22' stroke-width='0.9'%3E%3Cpath d='M10 40c40 8 68-6 98-16 34-10 68-6 104 8 24 9 50 16 78 8'/%3E%3Cpath d='M0 110c42 7 72-7 108-16 32-8 64-3 98 8 26 9 54 15 90 4'/%3E%3Cpath d='M8 180c48 6 80-7 115-16 32-8 62-2 92 8 28 10 56 14 88 3'/%3E%3Cpath d='M0 248c42 7 70-6 102-15 36-11 68-6 104 7 26 10 54 14 90 4'/%3E%3C/g%3E%3C/svg%3E");
  background-size:380px 380px;
}
.auth-card{
  width:100%;
  max-width:430px;
  background:var(--surface);
  border:1.5px solid var(--gold);
  border-radius:14px;
  padding:24px;
  position:relative;
  z-index:1;
  box-shadow:var(--shadow-lift);
}
.auth-card::before,.auth-card::after{
  content:"";
  position:absolute;width:18px;height:18px;pointer-events:none
}
.auth-card::before{left:8px;top:8px;border-top:2px solid var(--gold);border-left:2px solid var(--gold)}
.auth-card::after{right:8px;bottom:8px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold)}
h2{
  margin:0 0 14px;
  font-family:var(--font-display);
  font-size:32px;
  color:var(--red-deep);
  font-weight:600;
  text-shadow:0 1px 0 #fff, 0 2px 8px rgba(255,193,7,.35);
}
.row{margin-bottom:12px}
input{
  width:100%;
  padding:11px 12px;
  border-radius:8px;
  border:1.5px solid rgba(212,175,55,.55);
  background:#fffef8;
  color:var(--text);
  outline:none;
}
input:focus{
  border-color:var(--gold-bright);
  box-shadow:0 0 0 3px rgba(255,193,7,.25);
}
button{
  width:100%;
  padding:12px;
  border-radius:10px;
  border:1px solid #e68a00;
  background:var(--grad-cta);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  letter-spacing:.06em;
  box-shadow:0 8px 20px rgba(255,152,0,.35), inset 0 1px 0 rgba(255,255,255,.4);
}
button:hover{filter:brightness(1.06)}
#result{margin:12px 0 0;color:var(--red);min-height:20px;font-weight:700}
#result:not(:empty){
  position:fixed;
  left:50%;
  top:55%;
  transform:translate(-50%,-50%);
  z-index:3000;
  margin:0;
  padding:14px 18px;
  max-width:min(520px,92vw);
  border-radius:12px;
  background:var(--surface);
  border:1.5px solid var(--gold);
  box-shadow:var(--shadow-lift);
  text-align:center;
  font-weight:800;
  letter-spacing:.2px;
  color:var(--red-deep);
}
.back-link{display:inline-block;margin-top:14px;color:var(--red);font-weight:600}
.back-link:hover{color:var(--red-hot);text-decoration:underline}
body.page-auth{
  align-items:center;
  justify-content:center;
  padding-top:96px;
}

.page-register .auth-card { max-width: 480px; }
.page-register .row { margin-bottom: 10px; }
.page-register button { margin-top: 4px; }