.ink-account { display: flex; align-items: center; gap: 8px; margin-left: 4px; }
.ink-account .ink-plan { font-size: 12px; font-weight: 600; border-radius: 999px; padding: 4px 10px;
  background: var(--chip); color: var(--accent); text-decoration: none; white-space: nowrap; }
.ink-account .ink-plan.pro { background: var(--accent); color: #fff; }
.ink-account .ink-login { font-size: 13px; color: var(--muted); text-decoration: none;
  white-space: nowrap; }
.ink-quota { font-size: 12px; color: var(--muted); white-space: nowrap; align-self: center;
  margin-left: 2px; }
.ink-quota.hot { color: var(--danger); font-weight: 600; }

.ink-modal { position: fixed; inset: 0; z-index: 400; display: none; align-items: center;
  justify-content: center; background: rgba(10, 14, 24, .55); padding: 20px; }
.ink-modal.on { display: flex; }
.ink-modal .box { background: var(--paper); color: var(--ink); border: 1px solid var(--line);
  border-radius: 18px; box-shadow: var(--shadow); max-width: 460px; width: 100%; padding: 24px; }
.ink-modal h3 { margin: 0 0 8px; font-size: 19px; }
.ink-modal p { margin: 0 0 16px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.ink-modal .ways { display: flex; flex-direction: column; gap: 8px; }
.ink-modal .ways button, .ink-modal .ways a { display: block; width: 100%; text-align: center;
  height: 44px; line-height: 42px; border: 1px solid var(--line); background: var(--paper);
  color: inherit; border-radius: 12px; cursor: pointer; text-decoration: none; font: inherit; }
.ink-modal .ways .primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.ink-modal .calm { margin: 16px 0 0; font-size: 13px; color: var(--muted); text-align: center; }
.ink-modal .close { margin-top: 12px; width: 100%; height: 38px; border: 0; background: transparent;
  color: var(--muted); cursor: pointer; font: inherit; }

@media (max-width: 640px) {
  .ink-account .ink-plan { padding: 3px 8px; }
  .ink-quota { display: none; }
}