/* Profile, compact destinations and one editor with two modes. */
[hidden] { display: none !important; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.brand img { border-radius:0; box-shadow:none; }
.brand { margin-bottom:14px; }
.topbar { justify-content:flex-end; }
html[data-theme=light] .main { background:linear-gradient(130deg,rgba(255,236,252,.15),rgba(255,246,251,.27)); }
html[data-theme=light] .page-head>.muted { color:#fff4ff; }
.avatar { overflow:hidden; flex-shrink:0; }
.avatar img,.profile-photo img { width:100%; height:100%; display:block; object-fit:cover; }
.platform-icon.vk_video { background:#0676ff; font-size:10px; white-space:nowrap; }
.platform-icon.max { background:linear-gradient(145deg,#1979f7,#6737f3 58%,#8d24df); font-size:9px; }
.platform-icon .social-symbol { width:72%; height:72%; color:#fff; flex-shrink:0; }
.platforms.destinations-by-account { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; }
.destination-platform { min-width:0; }
.destination-group-heading { display:flex; align-items:center; gap:9px; padding-bottom:9px; }
.destination-group-heading .platform-icon { width:25px; height:25px; flex-shrink:0; }
.destination-group-heading h3 { margin:0; font-size:13px; font-weight:600; color:var(--text); }
.destination-group-count { margin-left:auto; font-size:11px; color:var(--muted); white-space:nowrap; }
.destination-group-heading .subtle { min-height:28px; padding:3px 7px; }
.destination-account { display:grid; grid-template-columns:19px minmax(0,1fr) 8px; align-items:center; gap:10px; border:1px solid var(--stroke); border-radius:13px; background:var(--row); padding:12px; margin-bottom:8px; cursor:pointer; }
.destination-account:last-child { margin-bottom:0; }
.destination-account input { width:18px; height:18px; margin:0; accent-color:#a300ed; }
.destination-account:has(input:checked) { border-color:var(--accent); background:var(--soft); }
.destination-account:has(input:focus-visible) { outline:2px solid var(--accent); outline-offset:2px; }
.destination-account-content { min-width:0; }
.destination-account-content strong { display:block; font-size:13px; line-height:1.4; overflow-wrap:anywhere; font-weight:600; }
.destination-account-content small { display:block; margin-top:3px; color:var(--muted); font-size:10px; line-height:1.5; }
.destination-address { display:block; color:var(--muted); font-size:10px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.5; }
.destination-address a { color:var(--muted); text-decoration:none; }
.destination-address a:hover { text-decoration:underline; }
.destination-summary { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:8px; color:var(--muted); font-size:11px; }
.destination-summary .subtle { display:flex; align-items:center; gap:5px; font-size:11px; }
.destination-summary svg { width:13px; height:13px; }
.destination-empty { color:var(--muted); border:1px dashed var(--stroke); border-radius:16px; padding:24px 18px; text-align:center; font-size:13px; line-height:1.6; }
.destination-empty svg { width:30px; height:30px; color:var(--accent); }
.destination-empty p { margin:12px 0 0; }
.review-targets span { max-width:100%; overflow-wrap:anywhere; }
@media(min-width:881px) {
  .platforms.destinations-by-account { max-height:540px; overflow-y:auto; overscroll-behavior:contain; padding:3px; }
}
.editor-window { min-width:0; }
.description { min-height:155px; }
.editor-footnote { display:block; color:var(--muted); font-size:11px; line-height:1.5; margin-top:8px; }
.ai[aria-pressed=true] { background:var(--soft); box-shadow:0 0 0 2px rgba(219,103,233,.14); }
.assistant-pane { padding:16px; border:1px solid var(--stroke); border-radius:16px; background:var(--field); }
.assistant-intro { display:flex; gap:10px; align-items:flex-start; }
.assistant-intro strong { font-size:14px; }
.assistant-intro p { margin:5px 0 0; font-size:12px; color:var(--muted); line-height:1.6; }
.assistant-emblem { display:grid; place-items:center; width:32px; height:32px; border-radius:11px; flex-shrink:0; background:var(--soft); color:var(--accent); }
.caption-context { border-left:2px solid var(--stroke); padding-left:10px; margin:14px 0; font-size:12px; color:var(--muted); line-height:1.6; overflow-wrap:anywhere; white-space:pre-wrap; }
.assistant-pane textarea { width:100%; border:1px solid var(--stroke); border-radius:12px; color:var(--text); background:var(--row); padding:12px; font:inherit; resize:vertical; min-height:88px; }
.assistant-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.assistant-actions button { font-size:12px; }
.upload-progress { margin:0; color:var(--muted); font-size:13px; }
.account-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:10px; }
.account-compact { min-width:0; padding:13px 15px; display:flex; align-items:center; gap:12px; background:var(--panel); border:1px solid var(--stroke); border-radius:16px; backdrop-filter:blur(10px); }
.account-compact>.platform-icon { flex-shrink:0; width:33px; height:33px; }
.account-compact-text { min-width:0; flex:1; }
.account-compact-text>button { padding:0; border:0; background:none; color:var(--text); text-align:left; font-size:14px; font-weight:600; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-link { margin-top:5px; font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-link a { color:var(--muted); text-decoration:none; }
.account-link a:hover { text-decoration:underline; }
.account-open { flex-shrink:0; display:flex; gap:8px; align-items:center; border:0; background:transparent; padding:8px 0 8px 4px; color:var(--muted); }
.account-open svg { width:16px; height:16px; transform:rotate(-90deg); }
.connection-dot { display:inline-block; width:8px; height:8px; flex-shrink:0; border-radius:50%; background:#96809c; }
.connection-dot.verified { background:#19ad74; box-shadow:0 0 0 3px #19ad741c; }
.connection-dot.manual,.connection-dot.pending { background:#d09b22; }
.connection-dot.failed { background:#e34f65; }
.connection-state { display:flex; align-items:center; gap:7px; font-size:11px; color:var(--muted); line-height:1.45; }
.connection-legend { display:flex; flex-wrap:wrap; gap:10px 20px; color:#fff1fb; font-size:11px; margin:0 0 20px; text-shadow:0 1px 5px #351148; }
.connection-legend>span { display:flex; align-items:center; gap:7px; }
.platform-catalog { display:grid; gap:8px; }
.platform-row { display:flex; align-items:center; gap:15px; padding:13px 16px; background:var(--panel); border:1px solid var(--stroke); border-radius:16px; backdrop-filter:blur(12px); min-width:0; }
.platform-row>.platform-icon { flex-shrink:0; width:36px; height:36px; }
.platform-row-text { flex:1; min-width:0; }
.platform-row-text strong { display:block; font-size:14px; font-weight:600; }
.platform-row-text small { display:block; font-size:11px; line-height:1.45; color:var(--muted); margin-top:4px; }
.platform-row-status { width:150px; padding:0 10px; }
.platform-row>.secondary { font-size:12px; flex-shrink:0; min-height:37px; padding:8px 13px; }
.guide-heading { display:flex; align-items:center; gap:14px; }
.guide-heading .platform-icon { width:44px; height:44px; font-size:18px; flex-shrink:0; }
.guide-heading .platform-icon.vk_video { font-size:12px; }
.guide-heading strong { display:block; font-size:15px; line-height:1.5; }
.guide-heading .connection-state { margin-top:6px; }
.guide-steps { list-style:none; counter-reset:steps; margin:20px 0; padding:0; display:grid; gap:16px; }
.guide-steps li { counter-increment:steps; position:relative; padding-left:38px; font-size:14px; line-height:1.6; }
.guide-steps li::before { content:counter(steps); position:absolute; left:0; top:0; width:26px; height:26px; display:grid; place-items:center; background:var(--soft); color:var(--accent); border:1px solid var(--stroke); border-radius:9px; font-size:12px; font-weight:600; }
.guide-links { margin:16px 0; font-size:14px; }
.platform-picker { display:grid; gap:8px; }
.platform-picker>button { display:flex; align-items:center; gap:12px; min-width:0; padding:10px 13px; border:1px solid var(--stroke); border-radius:12px; background:var(--field); color:var(--text); text-align:left; font:inherit; font-size:14px; }
.platform-picker>button>svg { margin-left:auto; width:17px; height:17px; transform:rotate(-90deg); }
.profile-photo-row { display:flex; gap:20px; align-items:center; margin:0 0 24px; }
.profile-photo { width:84px; height:84px; flex-shrink:0; overflow:hidden; display:grid; place-items:center; border-radius:50%; font-size:32px; color:#673877; background:linear-gradient(140deg,#ffd9ed,#e1c5ff,#7adae1); border:2px solid var(--stroke); }
.profile-photo-row>div { display:grid; gap:5px; }
.profile-photo-row .subtle { text-align:left; }
.profile-photo-row small { font-size:11px; }
@font-face { font-family:'Marck Script'; src:url('/assets/fonts/MarckScript-Regular.ttf') format('truetype'); font-style:normal; font-weight:400; font-display:swap; }
#page-studio>h1.khami-motto,.auth-brand p.khami-motto { font-family:'Marck Script','Segoe Script',cursive; font-weight:400; font-style:normal; letter-spacing:0; word-spacing:.06em; line-height:1.35; text-transform:none; }
#page-studio>h1.khami-motto { font-size:clamp(39px,4.6vw,76px); margin-top:18px; margin-bottom:27px; padding:.06em 0; }
.auth-brand p.khami-motto { font-size:clamp(30px,3.2vw,52px); text-align:center; margin:16px 0 0; }
.khami-motto { position:relative; isolation:isolate; }
.motto-initial { position:relative; display:inline-block; font-size:1.38em; line-height:.85; margin-right:-.055em; padding-left:.1em; transform:rotate(-5deg); }
.motto-initial svg { position:absolute; inset:-.2em -.25em -.16em -.25em; width:calc(100% + .5em); height:calc(100% + .36em); color:inherit; opacity:.86; overflow:visible; pointer-events:none; }
.motto-underline { display:block; width:clamp(130px,38%,360px); height:24px; margin:-.1em auto 0; color:inherit; opacity:.7; overflow:visible; pointer-events:none; }
#page-studio .motto-underline { margin-left:10%; }
.public-intro { max-width:1040px; margin:16px auto 56px; padding:30px clamp(20px,4vw,48px); color:var(--text); background:var(--panel); border:1px solid var(--stroke); border-radius:24px; line-height:1.7; }
.public-intro h2 { font-size:clamp(22px,3vw,34px); line-height:1.3; letter-spacing:0; }
.public-intro p { max-width:75ch; }
.public-intro details { border-top:1px solid var(--stroke); padding:16px 0; }
.public-intro summary { cursor:pointer; font-weight:600; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; touch-action:pan-x pan-y; }
body { touch-action:pan-x pan-y; }
@media (max-width:900px), (pointer:coarse) {
  body input,body select,body textarea { font-size:16px !important; }
  .auth-layout,.auth-panel,.auth-brand,.main,.workspace,.panel { min-width:0; }
  .auth-layout,.public-intro { max-width:100%; box-sizing:border-box; }
  .public-intro { margin-inline:12px; max-width:calc(100% - 24px); }
  .khami-motto { overflow-wrap:normal; }
}
.login-password { margin-bottom:17px; }
.login-password>label { margin-bottom:8px; }
.password-field { position:relative; }
.password-field #login-password { padding-right:122px; }
.password-field button { position:absolute; top:50%; right:4px; transform:translateY(-50%); display:flex; align-items:center; gap:6px; min-height:40px; padding:8px 10px; border:0; border-radius:9px; background:transparent; color:var(--text); font:inherit; font-size:12px; cursor:pointer; }
.password-field button:hover { background:var(--soft); }
.password-field button:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.password-field button svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.registration-preview>label { display:grid; gap:8px; margin:18px 0; font-size:14px; }
.registration-preview fieldset { border:1px solid var(--stroke); border-radius:12px; padding:15px; display:flex; flex-wrap:wrap; gap:20px; font-size:14px; }
.registration-preview legend { padding:0 6px; font-size:12px; color:var(--muted); }
@media(max-width:1100px) {
  .platform-row { flex-wrap:wrap; gap:10px; }
  .platform-row-text { flex-basis:calc(100% - 60px); }
  .platform-row-status { width:auto; flex:1; padding-left:46px; }
}
@media(max-width:570px) {
  .brand { margin-bottom:0; }
  .account-list { grid-template-columns:1fr; }
  .account-compact { padding:12px; gap:10px; }
  .platform-row { padding:13px; }
  .platform-row-status { padding-left:0; }
  .platform-row>.secondary { padding:8px 10px; font-size:11px; }
  .connection-legend { gap:10px 12px; line-height:1.6; }
  .desc-header { flex-wrap:wrap; gap:10px; margin-bottom:12px; }
  .desc-header label { flex:1; min-width:100px; }
  .assistant-pane { padding:12px; }
  .assistant-pane textarea { font-size:16px; }
  .profile-photo-row { gap:14px; }
  .profile-photo { width:72px; height:72px; }
}
