@charset "utf-8";

/* ===== ACCOUNT ===== */
.account { position:relative; z-index:100; display:inline-block; vertical-align:top; margin:0; padding:0; }
/* ===== LOGIN MODAL ===== */
.account>fieldset { position:fixed; z-index:9999; top:50%; left:50%; right:auto; display:none; width:380px; max-width:calc(100vw - 40px); margin:0; padding:28px 26px 24px; transform:translate(-50%,-50%); border:1px solid #292c2f; border-radius:14px; background:#101214; box-shadow:0 0 0 100vmax rgba(0,0,0,.6),0 24px 70px rgba(0,0,0,.7); color:#f2f2f2; }
/* ===== TITLE ===== */
.account h2 { margin:0 0 24px; color:#f5f5f5; font-size:22px; font-weight:700; line-height:1.2; }
/* ===== CLOSE ===== */
.account .close { position:absolute; top:20px; right:20px; display:flex; align-items:center; justify-content:center; width:32px; height:32px; margin:0; padding:0; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#8d9297 !important; font-size:24px!important; font-weight:300!important; line-height:1; cursor:pointer; transition:color .15s ease !important; }
.account .close:hover,.account .close:focus { border:0 !important; background:transparent !important; box-shadow:none !important; color:#f2f2f2 !important; outline:none; }
/* ===== LABEL ===== */
.account label { display:block; margin:0 0 8px; color:#b9bdc1; font-size:13px; font-weight:500; }
/* ===== INPUT ===== */
.account input[type="text"],.account input[type="email"],.account input[type="password"] { box-sizing:border-box; width:100%; height:48px; margin:0 0 16px; padding:0 14px; border:1px solid #292d31; border-radius:10px; background:#111315; box-shadow:none; color:#f2f2f2; font-size:14px; line-height:48px; outline:none; transition:border-color .15s ease,background .15s ease; }
.account input[type="text"]:hover,.account input[type="email"]:hover,.account input[type="password"]:hover { border-color:#383d42; }
.account input[type="text"]:focus,.account input[type="email"]:focus,.account input[type="password"]:focus { border-color:#555b60; background:#141719; box-shadow:none; }
/* ===== KEEP LOGIN ===== */
.account .keep { display:flex; align-items:center; gap:8px; margin:2px 0 20px; }
.account input[type="checkbox"] { width:17px; height:17px; margin:0; padding:0; accent-color:var(--color-point); cursor:pointer; }
.account input[type="checkbox"]+label { display:inline; margin:0; color:#b9bdc1; font-size:14px; cursor:pointer; }
.account .warning { display:none; }
/* ===== LOGIN BUTTON ===== */
.account input[type="submit"] { width:100% !important; height:52px !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:10px !important; background:var(--color-point) !important; box-shadow:none !important; color:#111 !important; font-size:14px !important; font-weight:700 !important; line-height:52px !important; cursor:pointer; transition:background .15s ease,filter .15s ease !important; }
.account input[type="submit"]:hover,.account input[type="submit"]:focus { background:var(--color-point) !important; color:#111 !important; box-shadow:none !important; filter:brightness(.94); outline:none; }
/* ===== SIGN UP / FIND ACCOUNT ===== */
.account .help { display:flex; align-items:center; justify-content:center; gap:0; margin:20px 0 0; padding:0; border:0; list-style:none; }
.account .help li { display:flex; align-items:center; margin:0; padding:0; }
.account .help li+li::before { content:"|"; display:inline-block; margin:0 14px; color:#4a4e52; font-size:12px; font-weight:400; }
.account .help a { display:inline !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#9b9fa3 !important; font-size:13px !important; font-weight:500 !important; line-height:1.4 !important; text-decoration:none !important; transition:color .15s ease !important; }
.account .help a::after { display:none !important; content:none !important; }
.account .help a:hover,.account .help a:focus { border:0 !important; background:transparent !important; box-shadow:none !important; color:#f2f2f2 !important; text-decoration:none !important; outline:none; }
/* ===== MESSAGE ===== */
.account .message { margin:0 0 16px; padding:10px 12px; border:1px solid rgba(var(--color-point-rgb),.18); border-radius:8px; background:rgba(var(--color-point-rgb),.08); color:var(--color-point); font-size:13px; }
.account .message p { margin:0; }
/* ===== LOGIN INFO ===== */
.account .info { display:flex; margin:0; padding:0; list-style:none; }
.account .info>li { display:inline-block; }
.account .info .user,.account .info .admin { display:flex; margin:0 10px 0 0; color:#d0d0d0; font-size:13px; font-weight:700; text-decoration:none; }


/* ===== LIGHT MODE ===== */
html[data-theme="light"] .account>fieldset { border-color:#e3e5e7; background:#fff; box-shadow:0 0 0 100vmax rgba(0,0,0,.25),0 24px 70px rgba(0,0,0,.14); color:#222; }
html[data-theme="light"] .account h2 { color:#111; }
html[data-theme="light"] .account .close { background:transparent !important; color:#999 !important; }
html[data-theme="light"] .account .close:hover,html[data-theme="light"] .account .close:focus { background:transparent !important; color:#222 !important; }
html[data-theme="light"] .account label { color:#555; }
html[data-theme="light"] .account input[type="text"],html[data-theme="light"] .account input[type="email"],html[data-theme="light"] .account input[type="password"] { border-color:#dedfe1; background:#f7f7f7; color:#222; }
html[data-theme="light"] .account input[type="text"]:hover,html[data-theme="light"] .account input[type="email"]:hover,html[data-theme="light"] .account input[type="password"]:hover { border-color:#c7c9cc; }
html[data-theme="light"] .account input[type="text"]:focus,html[data-theme="light"] .account input[type="email"]:focus,html[data-theme="light"] .account input[type="password"]:focus { border-color:#aeb2b6; background:#fff; box-shadow:none; }
html[data-theme="light"] .account input[type="checkbox"]+label { color:#555; }
html[data-theme="light"] .account input[type="submit"] { background:var(--color-point) !important; color:#111 !important; }
html[data-theme="light"] .account input[type="submit"]:hover,html[data-theme="light"] .account input[type="submit"]:focus { background:var(--color-point) !important; color:#111 !important; filter:brightness(.94); }
html[data-theme="light"] .account .help li+li::before { color:#d1d3d5; }
html[data-theme="light"] .account .help a { color:#777 !important; }
html[data-theme="light"] .account .help a:hover,html[data-theme="light"] .account .help a:focus { color:#222 !important; }
html[data-theme="light"] .account .message { border-color:rgba(var(--color-point-rgb),.16); background:rgba(var(--color-point-rgb),.07); color:var(--color-point); }
html[data-theme="light"] .account .info .user,html[data-theme="light"] .account .info .admin { color:#333; }
/* ===== MOBILE ===== */
@media (max-width:600px){
.account>fieldset { width:calc(100vw - 32px); padding:24px 20px 20px; }
.account h2 { font-size:20px; }
.account .help li+li::before { margin:0 10px; }
}