/* Экраны аккаунта и досок (client/account-ui.js). Токены — из app-ui.css (--a-*), обе темы. */
.acc-screen{position:fixed;inset:0;z-index:5;overflow-y:auto;overscroll-behavior:contain;background:var(--a-bg);color:var(--a-text);
  padding:calc(12px + var(--sa-top,0px)) 16px calc(16px + var(--sa-bottom,0px));font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
.acc-top{display:flex;align-items:center;gap:12px;height:44px}
.acc-back{flex:none;width:44px;height:44px;border-radius:14px;border:1.5px solid var(--a-border);background:var(--a-card);color:var(--a-text);display:flex;align-items:center;justify-content:center;cursor:pointer}
.acc-title-bar{margin:0;font-size:22px;font-weight:800}
.acc-body{display:flex;flex-direction:column;gap:12px;max-width:440px;margin:0 auto}
.acc-logo{display:block;width:180px;height:auto;margin:6px auto 0}
.acc-h1{margin:6px 0 0;text-align:center;font-size:30px;font-weight:800}
.acc-lead{margin:0 0 6px;text-align:center;font-size:14.5px;line-height:1.45;color:var(--a-sub);font-weight:600}
.acc-field{display:flex;flex-direction:column;gap:6px}
.acc-label{font-size:13px;font-weight:700;color:var(--a-text)}
.acc-input{display:flex;align-items:center;height:54px;border-radius:14px;background:var(--a-card);border:1.5px solid var(--a-border);padding:0 6px 0 16px;transition:border-color .2s}
.acc-input:focus-within{border-color:#FFC21A}
.acc-input.bad{border-color:var(--a-danger,#ff5a4a)}
.acc-input input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--a-text);font:inherit;font-size:16px;font-weight:600}
.acc-input input::placeholder{color:var(--a-sub);opacity:.75}
.acc-eye{flex:none;width:44px;height:44px;border:0;background:transparent;color:var(--a-sub);display:flex;align-items:center;justify-content:center;cursor:pointer}
.acc-err{font-size:12.5px;font-weight:700;color:var(--a-danger,#ff5a4a);min-height:0}
.acc-err:empty{display:none}
.acc-hint{font-size:12.5px;font-weight:600;color:var(--a-sub);transition:color .2s}
.acc-hint.ok{color:var(--a-green,#3DDC84)}
.acc-link{border:0;background:transparent;padding:0;font:inherit;font-weight:800;color:var(--a-amber-text,#FFC21A);cursor:pointer}
.acc-forgot{align-self:flex-end;font-size:14px;margin-top:-2px}
.acc-primary{height:54px;border:0;border-radius:16px;background:linear-gradient(180deg,#FFD34D,#FFB800);color:#1B1300;font:inherit;font-size:16.5px;font-weight:800;cursor:pointer;box-shadow:0 6px 16px -6px rgba(255,184,0,.6)}
.acc-primary:disabled{opacity:.45;box-shadow:none;cursor:default}
.acc-secondary{height:54px;border-radius:16px;border:1.5px solid var(--a-border);background:var(--a-card);color:var(--a-text);font:inherit;font-size:16px;font-weight:800;cursor:pointer}
.acc-dim{color:var(--a-sub);font-weight:700}
.acc-alt{margin:6px 0 0;text-align:center;font-size:14.5px;color:var(--a-sub);font-weight:600}
.acc-check{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-size:14px;font-weight:600;line-height:1.4}
.acc-check input{position:absolute;opacity:0;width:0;height:0}
.acc-box{flex:none;width:26px;height:26px;border-radius:8px;border:1.5px solid var(--a-border);background:var(--a-card);display:flex;align-items:center;justify-content:center;color:transparent;transition:background .15s}
.acc-check input:checked + .acc-box{background:#FFC21A;border-color:#FFC21A;color:#1B1300}
.acc-check input:focus-visible + .acc-box{outline:2px solid #FFC21A;outline-offset:2px}
.acc-check-text b{color:var(--a-amber-text,#FFC21A);font-weight:800}

/* Доски */
.acc-section{margin-top:6px;font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--a-sub)}
.acc-big{position:relative;display:block;padding:0;border-radius:18px;overflow:hidden;border:2px solid #FFC21A;background:var(--a-card);color:var(--a-text);text-align:left;cursor:pointer;font:inherit}
.acc-big-img{display:block;width:100%;height:190px;object-fit:cover;object-position:center 20%}
.acc-big-info{display:flex;flex-direction:column;gap:2px;padding:12px 56px 14px 16px}
.acc-big-name{font-size:18px;font-weight:800}
.acc-big-sub{font-size:13px;font-weight:600;color:var(--a-sub)}
.acc-big-check{position:absolute;right:14px;bottom:16px;width:28px;height:28px;border-radius:50%;background:#FFC21A;color:#1B1300;display:flex;align-items:center;justify-content:center}
.acc-plus{display:flex;align-items:center;gap:10px;padding:12px 10px;border-radius:18px;background:linear-gradient(135deg,#4A1E9E,#2E1270);border:1.5px solid #6a3fd0;color:#fff}
.acc-plus-icon{flex:none;width:40px;height:40px;border-radius:12px;background:#FFC21A;color:#1B1300;display:flex;align-items:center;justify-content:center}
.acc-plus-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:12.5px;font-weight:600;color:#d9cdfa}
.acc-plus-text span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:370px){.acc-plus-text span{white-space:normal}}
.acc-plus-text b{font-size:16px;color:#fff}
.acc-plus-btn{flex:none;height:40px;padding:0 10px;border:0;border-radius:12px;background:#FFC21A;color:#1B1300;font:inherit;font-weight:800;font-size:14.5px;cursor:pointer}
.acc-card{display:flex;align-items:center;gap:12px;padding:10px;border-radius:18px;border:1.5px solid var(--a-border);background:var(--a-card);color:var(--a-text);text-align:left;cursor:pointer;font:inherit}
.acc-card-img{flex:none;width:92px;height:88px;border-radius:10px;object-fit:cover}
.acc-card-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.acc-card-name{font-size:15.5px;font-weight:800}
.acc-card-desc{font-size:12.5px;font-weight:600;line-height:1.35;color:var(--a-sub);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.acc-card-chev{flex:none;color:var(--a-sub)}
.acc-chips{display:flex;gap:6px;flex-wrap:wrap}
.acc-chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:800;white-space:nowrap}
.acc-chip-price{border:1.5px solid #FFC21A;color:var(--a-amber-text,#FFC21A);background:rgba(255,194,26,.1)}
.acc-chip-plus{border:1.5px solid #6a3fd0;color:#c9b6ff;background:rgba(74,30,158,.35)}
.acc-chip-free{border:1.5px solid var(--a-green,#3DDC84);color:var(--a-green,#3DDC84)}

/* Экран доски */
.acc-detail{padding-bottom:150px}
.acc-gal{position:relative;border-radius:18px;overflow:hidden;background:#000}
.acc-gal-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.acc-gal-track::-webkit-scrollbar{display:none}
.acc-slide{flex:none;width:100%;height:272px;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.acc-slide img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.acc-gal-count{position:absolute;top:10px;right:10px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-size:13px;font-weight:800}
.acc-gal-expand{position:absolute;right:10px;bottom:10px;width:44px;height:44px;border-radius:12px;border:0;background:rgba(0,0,0,.6);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.acc-thumbs{display:flex;gap:8px}
.acc-thumb{width:64px;height:52px;padding:0;border-radius:10px;overflow:hidden;border:2px solid transparent;background:#000;cursor:pointer}
.acc-thumb.on{border-color:#FFC21A}
.acc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.acc-dhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
.acc-dname{margin:0;font-size:26px;font-weight:800}
.acc-tags{display:flex;gap:8px;flex-wrap:wrap}
.acc-tag{padding:7px 12px;border-radius:12px;background:var(--a-card);border:1.5px solid var(--a-border);font-size:13.5px;font-weight:700}
.acc-desc{margin:0;font-size:14px;font-weight:600;line-height:1.55;color:var(--a-text)}
.acc-foot{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;flex-direction:column;gap:10px;padding:12px 16px calc(14px + var(--sa-bottom,0px));background:linear-gradient(180deg,transparent,var(--a-bg) 28%)}
.acc-foot > *{width:100%;max-width:440px;margin:0 auto}
.acc-foot-row{display:flex;gap:8px}
.acc-foot-row .acc-secondary{flex:1 1 0;min-width:0;height:48px;font-size:13.5px;padding:0 8px;line-height:1.2}
.acc-foot-row .acc-dim{display:block;font-size:12.5px}
.acc-detail{padding-bottom:170px}
body[data-theme="light"] .acc-chip-plus{color:#4A1E9E;background:rgba(74,30,158,.1);border-color:#7a52d6}

/* Полноэкранный просмотр */
.acc-full{position:fixed;inset:0;z-index:40;background:#000;color:#fff;display:flex;flex-direction:column;padding:calc(12px + var(--sa-top,0px)) 0 calc(16px + var(--sa-bottom,0px))}
.acc-full-top{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:48px}
.acc-full-label{font-size:16px;font-weight:800}
.acc-full-close{width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.acc-full-track{flex:1;min-height:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x}
.acc-full-track::-webkit-scrollbar{display:none}
.acc-full-slide{flex:none;width:100%;height:100%;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:8px 16px}
.acc-full-slide img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .15s;transform-origin:center}
.acc-full-cap{margin:10px 24px 0;text-align:center;font-size:14px;font-weight:600;color:#cfd6e4}
.acc-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}
.acc-dots span{width:8px;height:8px;border-radius:4px;background:rgba(255,255,255,.35);transition:width .2s}
.acc-dots span.on{width:22px;background:#FFC21A}

/* Главное меню (макет 10): кнопки входа, логотип нард, плашка, 4 вкладки */
.am-auth{display:flex;gap:8px;align-items:center}
.am-hbtn{height:40px;padding:0 14px;border-radius:12px;border:1.5px solid var(--a-border);background:var(--a-card);color:var(--a-text);font:inherit;font-weight:800;font-size:14.5px;cursor:pointer;white-space:nowrap}
.am-hbtn-pri{border:0;background:linear-gradient(180deg,#FFD34D,#FFB800);color:#1B1300}
.am-brand{display:flex;flex-direction:column;align-items:center;gap:0;margin:-4px 0 2px}
.am-brand-logo{display:block;width:236px;height:auto}
.am-brand-plate{display:flex;align-items:center;gap:8px;height:30px;margin-top:4px;padding:0 12px;border-radius:999px;background:linear-gradient(90deg,#4A1E9E,#2E1270);border:1.5px solid #E7A93A;
  color:#fff;font-size:12px;font-weight:800;letter-spacing:.06em;white-space:nowrap;box-shadow:0 6px 18px -8px rgba(74,30,158,.9)}
.am-brand-plate i{display:block;width:14px;height:2px;border-radius:1px;background:#E7A93A}

/* шапка без логотипа и шестерёнки: кнопки входа прижаты вправо; четыре вкладки по 62 px */
body.in-app .am-header{justify-content:flex-end}
body.in-app .am-secondary{grid-template-columns:repeat(4,minmax(0,1fr))}
body.in-app .am-sec-btn{min-height:62px;font-size:12px;font-weight:800;gap:4px;padding:8px 2px}
/* имя рядом с аватаром (макет 10) — шапка теперь свободна: логотип и шестерёнка ушли */
@media (max-width: 400px) { body.in-app .am-pill #amNick { display: inline; max-width: 150px; } body.in-app .am-pill { padding: 3px 12px 3px 3px; } }
/* режимы в одну строку, как на макете: длинные подписи — с многоточием */
body.in-app .am-mode-title { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.in-app .am-mode-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* поля как на макете: 16 px от края экрана (12 у #app + 4 здесь) — длинные режимы влезают в строку */
body.in-app .am-body { padding-left: 4px; padding-right: 4px; }
body.in-app .am-header { padding-left: 4px; padding-right: 4px; }
body.in-app .am-mode { gap: 12px; padding: 10px 12px; }
/* макет 10: все режимы одного вида (тёмные карточки, золотые иконки), выбранный вид нард — жёлтая рамка */
body.in-app .am-mode.am-mode-primary { background: var(--a-card); color: var(--a-text); border: 1.5px solid var(--a-border); box-shadow: none; }
body.in-app .am-mode.am-mode-primary .am-mode-sub { color: var(--a-sub); }
body.in-app .am-mode .am-mode-icon { color: var(--a-amber); background: var(--a-icon-bg, rgba(255,194,26,.1)); }
body.in-app .am-seg-btn[aria-pressed="true"] { box-shadow: inset 0 0 0 1.5px #FFC21A; }