/* 登入註冊頁變數 */
:root{--auth-bg:#fbfdff;--auth-card:rgba(255,255,255,.9);--auth-text:#111827;--auth-muted:#6b7280;--auth-line:rgba(125,166,205,.28);--auth-primary:#111827;--auth-primary-soft:#eef5fb;--auth-danger:#dc2626;--auth-shadow:0 24px 70px rgba(53,91,132,.16);}
html.dark{--auth-bg:#09090b;--auth-card:rgba(24,24,29,.94);--auth-text:#f7f7f8;--auth-muted:#a1a1aa;--auth-line:#30303a;--auth-primary:#f7f7f8;--auth-primary-soft:#24242b;--auth-shadow:0 24px 70px rgba(0,0,0,.46);}
*{box-sizing:border-box;}
body{margin:0;min-height:100vh;background:var(--auth-bg);color:var(--auth-text);font-family:Arial,"Microsoft JhengHei",sans-serif;overflow-x:hidden;}
.auth-page{position:relative;isolation:isolate;min-height:100vh;display:grid;place-items:center;padding:28px 16px;overflow:hidden;background:radial-gradient(circle at 16% 16%,rgba(45,164,255,.36),transparent 32%),radial-gradient(circle at 84% 18%,rgba(10,132,206,.28),transparent 30%),radial-gradient(circle at 50% 92%,rgba(79,163,217,.24),transparent 38%),linear-gradient(135deg,#fff,#eaf6ff);}
html.dark .auth-page{background:radial-gradient(circle at 16% 16%,rgba(76,73,156,.34),transparent 32%),radial-gradient(circle at 84% 18%,rgba(57,103,167,.26),transparent 30%),radial-gradient(circle at 50% 92%,rgba(104,52,108,.2),transparent 38%),linear-gradient(135deg,#09090b,#15111c);}
.auth-page:before{content:"";position:absolute;inset:-20%;z-index:-3;background:linear-gradient(90deg,rgba(34,128,198,.17) 1px,transparent 1px),linear-gradient(0deg,rgba(34,128,198,.17) 1px,transparent 1px),linear-gradient(90deg,rgba(22,91,143,.08) 2px,transparent 2px),linear-gradient(0deg,rgba(22,91,143,.08) 2px,transparent 2px);background-size:46px 46px,46px 46px,184px 184px,184px 184px;transform:perspective(800px) rotateX(58deg) translateY(-8%);transform-origin:center;animation:authGridMove 16s linear infinite;}
.auth-page:after{content:"";position:absolute;inset:-30%;z-index:-2;background:conic-gradient(from 115deg at 50% 50%,transparent 0deg,rgba(18,147,229,.34) 40deg,transparent 86deg,transparent 174deg,rgba(26,109,178,.26) 224deg,transparent 292deg),linear-gradient(115deg,transparent 18%,rgba(31,142,213,.18) 32%,transparent 43%,transparent 58%,rgba(70,186,255,.2) 70%,transparent 82%);filter:blur(10px);animation:authLightSweep 10s ease-in-out infinite alternate;}
.auth-stars{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle,#fff 0 1px,transparent 1.8px),radial-gradient(circle,rgba(65,158,224,.95) 0 1.2px,transparent 2px),radial-gradient(circle,rgba(16,74,122,.8) 0 1px,transparent 1.7px),radial-gradient(circle,rgba(255,255,255,.95) 0 1.4px,transparent 2.4px);background-size:115px 115px,172px 172px,241px 241px,310px 310px;background-position:18px 24px,72px 54px,130px 18px,210px 112px;opacity:.8;mix-blend-mode:screen;animation:authStarTwinkle 3.8s ease-in-out infinite alternate,authStarDrift 24s linear infinite;}
.auth-card{position:relative;width:min(100%,420px);background:var(--auth-card);border:1px solid var(--auth-line);border-radius:10px;box-shadow:var(--auth-shadow);padding:34px 28px 24px;backdrop-filter:blur(18px);overflow:hidden;}
html.dark .auth-card:before{background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 34%,rgba(127,111,231,.12) 72%,transparent);}
.auth-theme-toggle{position:fixed;z-index:2;top:18px;right:18px;width:42px;height:42px;border:1px solid var(--auth-line);border-radius:999px;background:var(--auth-card);color:var(--auth-text);box-shadow:0 8px 24px rgba(0,0,0,.15);font-size:19px;cursor:pointer;}
.auth-theme-toggle:hover{background:var(--auth-primary-soft);}
.auth-card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.9),transparent 34%,rgba(111,184,231,.14) 72%,transparent);}
.auth-brand{text-align:center;margin-bottom:24px;}
.auth-logo{display:block;width:min(250px,76%);height:auto;margin:0 auto 16px;filter:drop-shadow(0 12px 22px rgba(65,104,143,.18));}
.auth-brand h1{margin:0 0 8px;font-size:34px;line-height:1;font-weight:900;letter-spacing:0;text-transform:lowercase;}
.auth-brand p{margin:0;color:var(--auth-muted);font-size:15px;}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px;}
.auth-tab{height:42px;border-radius:8px;background:var(--auth-primary-soft);color:var(--auth-text);display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:700;border:1px solid rgba(125,166,205,.22);}
.auth-tab.is-active{background:linear-gradient(135deg,#132238,#24465e);color:#fff;}
.auth-gender-row{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.auth-gender-btn{height:46px;border:1px solid rgba(125,166,205,.26);border-radius:999px;background:#f4f7fb;color:var(--auth-text);font-size:15px;font-weight:800;cursor:pointer;transition:background .15s,color .15s,border-color .15s,box-shadow .15s;}
.auth-gender-btn:hover{border-color:#77b7df;background:#eef7ff;}
.auth-gender-btn.is-active{border-color:#24465e;background:linear-gradient(135deg,#132238,#25516e);color:#fff;box-shadow:0 10px 24px rgba(37,81,110,.2);}
.auth-gender-btn[data-gender="2"]:hover{border-color:#f472b6;background:#fff1f7;}
.auth-gender-btn.is-active[data-gender="2"]{border-color:#ec4899;background:linear-gradient(135deg,#ec4899,#f43f5e);color:#fff;box-shadow:0 10px 24px rgba(236,72,153,.28);}
.auth-flow-head{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;margin-bottom:14px;}
.auth-back{width:40px;height:40px;border-radius:8px;border:1px solid var(--auth-line);background:#fff;color:var(--auth-text);display:grid;place-items:center;text-decoration:none;}
.auth-flow-head strong{display:block;font-size:18px;font-weight:900;line-height:1.2;}
.auth-flow-head span{display:block;margin-top:2px;font-size:12px;color:var(--auth-muted);font-weight:800;}
.auth-progress{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;margin:0 0 22px;}
.auth-progress span,.auth-progress i{display:block;height:4px;border-radius:999px;background:#132238;}
.auth-progress i{background:#d9e4ef;}
.auth-terms-panel{border-top:1px solid var(--auth-line);margin:20px -4px 18px;padding-top:16px;display:grid;gap:12px;}
.auth-check{border:0;background:transparent;color:var(--auth-text);display:flex;align-items:center;gap:12px;padding:0;text-align:left;font-size:14px;font-weight:700;line-height:1.45;cursor:pointer;}
.auth-check i{width:24px;height:24px;border-radius:50%;background:#d5dbe6;color:#fff;display:grid;place-items:center;flex:0 0 auto;font-size:12px;}
.auth-check.checked i{background:#ff4058;}
.auth-check-master{font-weight:900;}
.auth-check a{color:#132238;text-decoration:underline;text-underline-offset:3px;}
.auth-form{margin:0;}
.auth-alert{display:none;border-radius:8px;padding:10px 12px;margin-bottom:14px;font-size:13px;font-weight:700;}
.auth-alert.is-error{display:block;background:#fee2e2;color:var(--auth-danger);}
.auth-alert.is-success{display:block;background:#dcfce7;color:#166534;}
.form-label{font-size:14px;font-weight:700;color:var(--auth-text);}
.form-control{height:48px;border-radius:8px;border-color:#d1d5db;}
html.dark .form-control{border-color:#3a3a45;background:#24242b;color:var(--auth-text);}
html.dark .form-control::placeholder{color:#8f909b;}
.form-control:focus{border-color:#4fa3d9;box-shadow:0 0 0 .2rem rgba(79,163,217,.16);}
.auth-password-field{position:relative;}
.auth-password-field .form-control{padding-right:52px;}
.auth-password-toggle{position:absolute;top:50%;right:2px;z-index:1;width:44px;height:44px;transform:translateY(-50%);border:0;border-radius:7px;background:transparent;color:var(--auth-muted);display:grid;place-items:center;cursor:pointer;transition:color .18s ease,background-color .18s ease;}
.auth-password-toggle:hover{background:var(--auth-primary-soft);color:var(--auth-text);}
.auth-password-toggle:focus-visible{outline:2px solid #4fa3d9;outline-offset:1px;}
.auth-password-toggle[aria-pressed="true"]{color:#25516e;}
html.dark .auth-password-toggle[aria-pressed="true"]{color:#8bc9ff;}
.auth-submit{width:100%;height:48px;border:0;border-radius:8px;background:linear-gradient(135deg,#132238,#25516e);color:#fff;font-size:16px;font-weight:800;cursor:pointer;margin-top:6px;box-shadow:0 12px 28px rgba(37,81,110,.22);transition:transform .1s,box-shadow .1s,filter .1s;}
.auth-submit:hover{filter:brightness(1.15);box-shadow:0 14px 32px rgba(37,81,110,.28);transform:translateY(-1px);}
.auth-submit:active{transform:translateY(0);filter:brightness(0.95);}
.auth-submit:disabled{opacity:.65;cursor:not-allowed;transform:none;filter:none;}
.auth-footer{border-top:1px solid var(--auth-line);margin-top:24px;padding-top:18px;text-align:center;}
.auth-copyright{font-size:12px;color:var(--auth-muted);margin-bottom:10px;}
.auth-links{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;}
.auth-links a{font-size:13px;color:var(--auth-text);text-decoration:none;font-weight:700;}
html.dark .auth-back{background:#24242b;color:var(--auth-text);}
html.dark .auth-gender-btn{background:#24242b;border-color:#3a3a45;color:var(--auth-text);}
html.dark .auth-gender-btn[data-gender="2"]:hover{border-color:#f472b6;background:#3d172d;}
html.dark .auth-check a{color:#d8d4ff;}
.auth-links a:hover{text-decoration:underline;text-underline-offset:3px;}
@keyframes authGridMove{from{background-position:0 0,0 0;}to{background-position:96px 96px,96px 96px;}}
@keyframes authLightSweep{from{transform:translate3d(-3%,0,0) rotate(0deg);opacity:.75;}to{transform:translate3d(3%,2%,0) rotate(18deg);opacity:1;}}
@keyframes authStarTwinkle{0%{opacity:.42;filter:drop-shadow(0 0 0 rgba(255,255,255,0));}45%{opacity:.95;filter:drop-shadow(0 0 6px rgba(104,191,255,.55));}100%{opacity:.62;filter:drop-shadow(0 0 10px rgba(255,255,255,.78));}}
@keyframes authStarDrift{from{background-position:18px 24px,72px 54px,130px 18px,210px 112px;}to{background-position:133px 139px,244px 226px,371px 259px,520px 422px;}}
@media (prefers-reduced-motion:reduce){.auth-page:before,.auth-page:after,.auth-stars{animation:none;}}
@media (max-width:575.98px){.auth-page{padding:0;}.auth-card{min-height:100vh;border:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;justify-content:flex-start;padding-top:32px;padding-bottom:24px;}.auth-logo{width:min(220px,76%);}.auth-footer{margin-top:32px;}}