.account-slot { position:relative; flex-shrink:0; }
.account-avatar { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; border:2px solid #fb7185; background:#3b2031; color:#fff; font-weight:800; overflow:hidden; padding:0; cursor:pointer; }
.account-avatar img { width:100%; height:100%; object-fit:cover; }
.account-menu { position:absolute; right:0; top:calc(100% + 12px); min-width:225px; padding:8px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:0 14px 40px #0004; z-index:100; }
.account-menu[hidden] { display:none; }
.account-menu a,.account-menu button { display:block; width:100%; padding:11px 12px; text-align:left; border-radius:9px; font-size:13px; color:inherit; text-decoration:none; background:transparent; border:0; }
.account-menu a:hover,.account-menu button:hover { background:#fb71851a; }
.account-menu .menu-name { padding:8px 12px 12px; font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
header .site-header-layout { grid-template-columns:auto minmax(200px,1fr) auto auto; gap:18px; }
.account-mobile { display:none; }
@media(min-width:768px) and (max-width:1099px) {
 header .site-header-layout { grid-template-columns:auto 1fr auto; }
 .site-header-layout > nav { grid-row:2; grid-column:1 / -1; }
 .account-desktop { grid-column:3; grid-row:1; }
}
@media(max-width:767px) {
 .account-mobile { display:block; }
 .account-desktop { display:none; }
 .account-avatar { width:34px; height:34px; }
 .watch-header .account-avatar { width:34px; height:34px; }
}
.account-page { background:#0d0b11; color:#f8fafc; font-family:'Plus Jakarta Sans',system-ui,sans-serif; min-height:100vh; margin:0; }
html.light .account-page { background:#f7f4f7; color:#18181b; }
.account-header { display:flex; align-items:center; justify-content:space-between; max-width:1160px; margin:auto; padding:18px 24px; gap:16px; }
.account-brand { color:#f43f5e; font-weight:900; letter-spacing:.08em; text-decoration:none; font-size:24px; }
.account-header-actions { display:flex; gap:14px; align-items:center; }
.account-main { width:min(1100px,100%); margin:24px auto 80px; padding:0 24px; }
.account-main.narrow { max-width:520px; margin-top:60px; }
.account-panel { background:var(--surface); border:1px solid var(--line); border-radius:22px; padding:28px; margin-bottom:22px; }
.account-panel h1 { font-size:26px; font-weight:800; margin:0 0 12px; line-height:1.2; }
.account-panel h2 { font-size:18px; margin:0 0 18px; font-weight:750; }
.account-panel p { font-size:14px; line-height:1.7; color:var(--muted); margin:10px 0 20px; }
.account-panel a { color:var(--accent); }
.account-form { display:grid; gap:16px; }
.account-form label { display:grid; gap:8px; font-size:13px; font-weight:600; }
.account-form input,.account-form textarea,.account-form select,.account-table select { background:transparent; color:inherit; width:100%; border:1px solid var(--line); border-radius:10px; padding:11px 12px; font:inherit; }
.account-form textarea { min-height:100px; resize:vertical; }
.account-form input[readonly] { color:var(--muted); }
.account-action { background:#e11d48; color:white; border:0; padding:12px 18px; font-size:13px; font-weight:750; border-radius:11px; cursor:pointer; text-decoration:none; display:inline-block; }
.account-action.secondary { background:transparent; border:1px solid var(--line); color:inherit; }
.account-action:disabled { opacity:.5; cursor:wait; }
.account-message { color:var(--accent); font-size:13px; line-height:1.6; white-space:pre-line; }
.account-muted { color:var(--muted); font-size:12px; }
.account-badge { background:#fb71851a; border-radius:20px; padding:5px 10px; display:inline-block; font-size:11px; color:var(--accent); }
.account-table-wrap { overflow:auto; }
.account-table { border-collapse:collapse; width:100%; font-size:13px; text-align:left; }
.account-table th,.account-table td { padding:14px 10px; border-bottom:1px solid var(--line); vertical-align:middle; }
.account-table th { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.account-table select { min-width:150px; }
.account-table option { background:var(--surface); }
.account-stat { font-size:42px; font-weight:850; color:var(--accent); }
.admin-toolbar { display:flex; align-items:end; gap:14px; flex-wrap:wrap; }
.admin-toolbar label { flex:1; min-width:140px; }
.invite-result { margin:18px 0; padding:16px; background:#fb718510; border-radius:14px; overflow-wrap:anywhere; }
.invite-result code { display:block; margin:10px 0; font-size:16px; user-select:all; }
.account-pagination { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:20px; }
.profile-heading { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.profile-heading .account-avatar { width:64px; height:64px; }
@media(max-width:600px) { .account-header { padding:16px; } .account-main { padding:0 16px; } .account-panel { padding:22px 18px; } .account-main.narrow { margin-top:28px; } .account-brand { font-size:20px; } }

.account-page { background:#09070c; background-image:radial-gradient(ellipse at 0 0,#e11d481c,transparent 55%); }
html.light .account-page { background:#f7f5f8; background-image:radial-gradient(ellipse at 0 0,#f43f5e0b,transparent 55%); }
.account-brand { font-family:'M PLUS Rounded 1c','Plus Jakarta Sans',sans-serif; background:linear-gradient(100deg,#fb7185,#ec4899,#e11d48); background-clip:text; -webkit-background-clip:text; color:transparent; }
.profile-main { max-width:1100px; }
.profile-page-heading { margin:28px 0; }
.profile-eyebrow { text-transform:uppercase; font-size:10px; font-weight:800; letter-spacing:.16em; color:var(--accent); }
.profile-page-heading h1,.collection-heading h1 { font-size:32px; font-weight:850; letter-spacing:-.03em; margin:8px 0; }
.profile-page-heading p,.collection-heading p { color:var(--muted); font-size:13px; margin:0; }
.profile-layout { display:grid; grid-template-columns:300px minmax(0,1fr); gap:24px; align-items:start; }
.profile-summary { padding:0 24px 26px; text-align:center; overflow:hidden; }
.profile-cover { height:105px; margin:0 -24px; background:radial-gradient(at 15% 10%,#fb718559,transparent 70%),linear-gradient(135deg,#3c1227,#211625); }
html.light .profile-cover { background:linear-gradient(135deg,#fecdd3,#fce7f3); }
.profile-summary #profile-avatar { width:96px; height:96px; border:5px solid var(--surface); margin:-48px auto 18px; position:relative; font-size:32px; cursor:default; }
.profile-summary h2 { margin-bottom:12px; overflow-wrap:anywhere; }
.profile-summary .profile-telegram { font-size:12px; }
.profile-collection-link { display:flex; justify-content:space-between; align-items:center; padding:16px; margin:22px 0; border:1px solid var(--line); border-radius:14px; text-decoration:none; font-size:12px; }
.profile-collection-link strong { font-size:20px; }
.profile-identity { display:grid; grid-template-columns:1fr auto; gap:7px; padding:15px; border:1px solid var(--line); border-radius:12px; color:var(--muted); font-size:12px; }
.profile-identity small { grid-column:1/-1; font-size:11px; }
.avatar-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.avatar-upload-label { cursor:pointer; }
.account-panel .account-form button { justify-self:start; }
.favorite-toggle { position:absolute; top:10px; left:10px; z-index:3; width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; padding:8px; border:1px solid #ffffff36; border-radius:50%; background:#121017d9; color:#fff; cursor:pointer; }
.favorite-toggle svg { width:20px; height:20px; flex-shrink:0; fill:transparent; stroke:currentColor; stroke-width:1.8; }
.favorite-toggle.is-saved { color:#fb7185; }
.favorite-toggle.is-saved svg { fill:currentColor; }
.favorite-toggle:disabled { opacity:.5; cursor:wait; }
.favorite-detail { position:static; width:auto; border-radius:12px; padding:10px 16px; gap:9px; font-size:12px; background:#fb718512; color:var(--accent); border-color:var(--line); height:auto; margin-bottom:18px; }
.anime-card { position:relative; }
.anime-card > .card-content { display:flex; flex-direction:column; justify-content:space-between; flex:1; min-width:0; color:inherit; text-decoration:none; }
.favorites-notice { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); padding:13px 18px; border:1px solid var(--line); border-radius:13px; background:var(--surface); color:var(--accent); box-shadow:0 8px 24px #0003; z-index:120; font-size:13px; }
.collection-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; margin:30px 0; }
.collection-count { font-size:16px; vertical-align:middle; color:var(--accent); background:#fb718518; padding:6px 11px; border-radius:20px; }
.favorite-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; }
.favorite-card { position:relative; min-width:0; border-radius:20px; background:var(--surface); border:1px solid var(--line); overflow:hidden; }
.favorite-card > a { text-decoration:none; color:inherit; }
.favorite-poster { aspect-ratio:2/3; background:#71717a22; }
.favorite-poster img { width:100%; height:100%; object-fit:cover; }
.favorite-card-copy { padding:14px; }
.favorite-card-copy > span { font-size:10px; color:var(--accent); }
.favorite-card-copy h2 { font-size:13px; margin:6px 0 0; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.empty-collection { text-align:center; padding:50px 24px; }
.empty-collection > span { font-size:48px; color:var(--accent); }
@media(max-width:900px) { .favorite-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .profile-layout { grid-template-columns:260px minmax(0,1fr); gap:18px; } }
@media(max-width:700px) { .profile-layout { grid-template-columns:minmax(0,1fr); } .favorite-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .profile-page-heading h1,.collection-heading h1 { font-size:28px; } }
@media(max-width:480px) { .favorite-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .favorite-toggle { width:34px; height:34px; } .favorite-detail { width:auto; } }
@media(max-width:600px) {
 .account-header-actions { gap:8px; }
 .account-header-actions > a { font-size:0; width:36px; height:36px; padding:0; display:grid; place-items:center; }
 .account-header-actions > a::before { content:'←'; font-size:18px; }
 .account-header-actions #account-theme { padding:9px 12px; }
 .profile-summary .profile-cover { height:80px; }
 .profile-summary #profile-avatar { width:80px; height:80px; margin-top:-40px; margin-bottom:12px; }
 .profile-summary { padding-bottom:20px; }
 .profile-collection-link { margin:16px 0; }
}

/* Shared site shell: catalogue, watch, login, profile, favorites and admin. */
body.site-shell { display:flex; flex-direction:column; min-height:100vh; background:#000; color:#f8fafc; background-image:radial-gradient(circle at 10% 20%,#e11d4826 0%,transparent 40%),radial-gradient(circle at 90% 80%,#9f12391a 0%,transparent 40%); font-family:'Plus Jakarta Sans',sans-serif; }
html.light body.site-shell { background:#f4f4f6; color:#0f172a; background-image:radial-gradient(circle at 10% 20%,#ef44440f 0%,transparent 40%),radial-gradient(circle at 90% 80%,#f43f5e0a 0%,transparent 40%); }
.site-shell > main { flex-grow:1; }
.site-shell > header { background:rgba(20,20,24,.9); border-bottom:1px solid var(--line); }
html.light .site-shell > header { background:rgba(255,255,255,.94); }
body .site-brand { font-family:'M PLUS Rounded 1c',sans-serif; font-size:30px; line-height:1.2; font-weight:900; letter-spacing:.05em; background:linear-gradient(90deg,#f43f5e,#f472b6,#dc2626); background-clip:text; -webkit-background-clip:text; color:transparent; text-decoration:none; filter:drop-shadow(0 0 12px #f43f5e33); white-space:nowrap; }
.site-shell .account-header { position:sticky; top:0; z-index:50; width:100%; max-width:none; padding:0; border-bottom:1px solid var(--line); background:rgba(20,20,24,.9); }
html.light .site-shell .account-header { background:rgba(255,255,255,.94); }
.account-header-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; max-width:1280px; margin:0 auto; padding:14px 24px; }
.site-shell .account-header-actions { gap:10px; }
body button.theme-toggle { width:40px; height:40px; flex-shrink:0; padding:0; border-radius:14px; border:1px solid var(--line); background:rgba(20,20,24,.9); color:#f43f5e; align-items:center; justify-content:center; font-size:16px; line-height:1; cursor:pointer; box-shadow:0 4px 12px #0001; }
.account-header .theme-toggle { display:inline-flex; }
html.light body button.theme-toggle { background:rgba(255,255,255,.94); color:#e11d48; }
body button.theme-toggle i { font-size:16px; }
.site-footer { width:100%; margin-top:auto; padding:24px 16px; border-top:1px solid var(--line); text-align:center; color:var(--muted); font-size:12px; background:rgba(20,20,24,.9); }
html.light .site-footer { background:rgba(255,255,255,.94); }
.site-footer p { margin:0; }
.site-shell .account-panel { background:#18171d; border-radius:24px; border-color:var(--line); box-shadow:0 8px 24px #0002; }
html.light .site-shell .account-panel { background:#fff; box-shadow:0 4px 18px #18181b08; }
.site-shell .account-action:not(.secondary) { background:linear-gradient(90deg,#e11d48,#dc2626); color:#fff; }
.site-shell .account-action { transition:background-color .15s,border-color .15s; }
.site-shell .account-action.secondary:hover { border-color:#f43f5e88; color:var(--accent); }
.site-shell .account-form input,.site-shell .account-form textarea,.site-shell .account-form select { background:#0003; border-color:var(--line); }
html.light .site-shell .account-form input,html.light .site-shell .account-form textarea,html.light .site-shell .account-form select { background:#00000008; color:#0f172a; border-color:#00000014; }
.site-shell .account-header-actions > .account-action.secondary { font-size:12px; padding:10px 14px; border-radius:12px; }
@media(max-width:767px) {
 body .site-brand { font-size:24px; }
 .account-header-inner { padding:14px 16px; gap:10px; }
 body button.theme-toggle { width:36px; height:36px; border-radius:12px; box-shadow:none; }
 .site-shell .account-panel { box-shadow:none; }
}
@media(max-width:600px) {
 .site-shell .account-header-actions > a.account-action.secondary { font-size:0; width:36px; height:36px; padding:0; }
}
@media(max-width:360px) { body .site-brand { font-size:21px; } }
